Ku6epXBOCTuK/twitch-panels
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: resolve crop errors

Browse Source
This commit is contained in:
Ku6epXBOCTuK
2026-02-04 00:04:51 +05:00
parent 539b836d39
commit 2ca8c55127
2 changed files with 54 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
+33 -33
View File
@@ -1,33 +1,33 @@
{ {
"name": "twitch-panels", "name": "twitch-panels",
"private": true, "private": true,
"version": "0.0.1", "version": "0.0.1",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite dev", "dev": "vite dev",
"build": "vite build", "build": "vite build",
"preview": "vite preview", "preview": "vite preview",
"prepare": "svelte-kit sync || echo ''", "prepare": "svelte-kit sync || echo ''",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch" "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
}, },
"devDependencies": { "devDependencies": {
"@sveltejs/adapter-auto": "^7.0.0", "@sveltejs/adapter-auto": "^7.0.0",
"@sveltejs/adapter-static": "^3.0.10", "@sveltejs/adapter-static": "^3.0.10",
"@sveltejs/kit": "^2.50.1", "@sveltejs/kit": "^2.50.1",
"@sveltejs/vite-plugin-svelte": "^6.2.4", "@sveltejs/vite-plugin-svelte": "^6.2.4",
"@types/node": "^25.1.0", "@types/node": "^25.1.0",
"svelte": "^5.48.2", "svelte": "^5.48.2",
"svelte-check": "^4.3.5", "svelte-check": "^4.3.5",
"typescript": "^5.9.3", "typescript": "^5.9.3",
"vite": "^7.3.1" "vite": "^7.3.1"
}, },
"dependencies": { "dependencies": {
"@types/cropperjs": "^1.1.5", "@types/cropperjs": "^1.1.5",
"@types/uuid": "^10.0.0", "@types/uuid": "^10.0.0",
"cropperjs": "^2.1.0", "cropperjs": "^2.1.0",
"file-saver": "^2.0.5", "file-saver": "^2.0.5",
"svelte-konva": "^1.0.1", "svelte-konva": "^1.0.1",
"uuid": "^13.0.0" "uuid": "^13.0.0"
} }
} }
src/components/ImageCropper.svelte
+21 -10
View File
@@ -88,22 +88,33 @@
errorMessage = null; errorMessage = null;
setLoading(true); setLoading(true);
console.log("Calling getCropperImage"); console.log("Calling getCropperCanvas");
const image = cropper.getCropperImage(); const cropperCanvasElement = cropper.getCropperCanvas();
console.log("Image result:", image); console.log("CropperCanvas result:", cropperCanvasElement);
console.log("Image type:", typeof image); console.log("CropperCanvas type:", typeof cropperCanvasElement);
if (!image) { if (!cropperCanvasElement) {
throw new Error("Не удалось получить обрезанное изображение"); throw new Error("Не удалось получить обрезанное изображение");
} }
// Проверяем, есть ли у image метод toDataURL // Используем метод $toCanvas для получения HTMLCanvasElement
if (typeof image.toDataURL === "function") { const canvas = await cropperCanvasElement.$toCanvas({
const croppedImage = image.toDataURL("image/png"); width: 320,
} else { imageSmoothingEnabled: true,
throw new Error("Изображение не имеет метода toDataURL"); imageSmoothingQuality: "high",
});
console.log("Canvas result:", canvas);
console.log("Canvas type:", typeof canvas);
console.log("Canvas.toDataURL:", typeof canvas?.toDataURL);
if (!canvas) {
throw new Error("Не удалось получить canvas");
} }
// Теперь canvas - это обычный HTMLCanvasElement
const croppedImage = canvas.toDataURL("image/png");
console.log("Cropped image:", croppedImage);
// Validate cropped image // Validate cropped image
const cropResult: ImageCropResult = { const cropResult: ImageCropResult = {
success: true, success: true,