diff --git a/src/components/panel/Preview.svelte b/src/components/panel/Preview.svelte
index fe9d55b..538f0b8 100644
--- a/src/components/panel/Preview.svelte
+++ b/src/components/panel/Preview.svelte
@@ -1,60 +1,39 @@
-
-
-
-
- {$inspect(paddingX)}
-
-
-
-
-
-
+
+
+
+
+
+
diff --git a/src/components/panel/PreviewAll.svelte b/src/components/panel/PreviewAll.svelte
new file mode 100644
index 0000000..dc3d1ad
--- /dev/null
+++ b/src/components/panel/PreviewAll.svelte
@@ -0,0 +1,22 @@
+
+
+
+ {#each textsState.texts as { text, id }, idx (id)}
+
+ {:else}
+
No texts to preview
+ {/each}
+
@@ -49,11 +77,12 @@
-
-
+
+
+
diff --git a/src/lib/error.types.ts b/src/lib/error.types.ts
new file mode 100644
index 0000000..09be9b1
--- /dev/null
+++ b/src/lib/error.types.ts
@@ -0,0 +1,36 @@
+export class AppError extends Error {
+ constructor(
+ message: string,
+ public code: string,
+ public details?: unknown,
+ ) {
+ super(message);
+ this.name = "AppError";
+ }
+}
+
+export class ImageError extends AppError {
+ constructor(message: string) {
+ super(message, "IMAGE_ERROR");
+ }
+}
+
+export class TextError extends AppError {
+ constructor(message: string) {
+ super(message, "TEXT_ERROR");
+ }
+}
+
+export class CanvasError extends AppError {
+ constructor(message: string) {
+ super(message, "CANVAS_ERROR");
+ }
+}
+
+export class StorageError extends AppError {
+ constructor(message: string) {
+ super(message, "STORAGE_ERROR");
+ }
+}
+
+export type ErrorType = AppError | ImageError | TextError | CanvasError | StorageError;
diff --git a/src/lib/utils/errorUtils.ts b/src/lib/utils/errorUtils.ts
new file mode 100644
index 0000000..ee180a1
--- /dev/null
+++ b/src/lib/utils/errorUtils.ts
@@ -0,0 +1,26 @@
+import { AppError } from "$lib/error.types";
+
+export function formatError(error: unknown, defaultMessage: string = "Произошла ошибка"): string {
+ if (error instanceof AppError || error instanceof Error) {
+ return `${defaultMessage}: ${error.message}`;
+ }
+
+ if (typeof error === "string") {
+ return `${defaultMessage}: ${error}`;
+ }
+
+ return `${defaultMessage}: Произошла неизвестная ошибка`;
+}
+
+export function createError(message: string, code: string, recoverable: boolean = true, details?: unknown): AppError {
+ return new AppError(message, code, recoverable);
+}
+
+export function logError(error: unknown, context?: string): void {
+ console.error("Error occurred:", {
+ error,
+ context,
+ timestamp: new Date().toISOString(),
+ stack: error instanceof Error ? error.stack : undefined,
+ });
+}
diff --git a/src/services/downloadService.ts b/src/services/downloadService.ts
new file mode 100644
index 0000000..c3f2bd0
--- /dev/null
+++ b/src/services/downloadService.ts
@@ -0,0 +1,83 @@
+import { ImageError } from "$lib/error.types";
+import { formatError, logError } from "$lib/utils/errorUtils";
+import { saveAs } from "file-saver";
+import JSZip from "jszip";
+import { Stage } from "konva/lib/Stage";
+
+export type DownloadResult =
+ | {
+ success: true;
+ }
+ | {
+ success: false;
+ error: string;
+ };
+
+export interface DownloadItem {
+ filename: string;
+ stage: Stage;
+}
+
+export class DownloadService {
+ async downloadPanel(konvaStage: Stage, label: string): Promise {
+ try {
+ const blob = await this.stageToBlob(konvaStage);
+
+ const filename = `${label}.png`;
+ saveAs(blob, filename);
+
+ return {
+ success: true,
+ };
+ } catch (error) {
+ logError(error, "Ошибка сохранения панели");
+ return {
+ success: false,
+ error: formatError(error, "Ошибка сохранения панели"),
+ };
+ }
+ }
+
+ async downloadAll(panels: Array): Promise {
+ try {
+ const zip = new JSZip();
+ for (let panel of panels) {
+ const blob = await this.stageToBlob(panel.stage);
+ zip.file(`${panel.filename}.png`, blob);
+ }
+
+ const zipBlob = await zip.generateAsync({ type: "blob" });
+ saveAs(zipBlob, "panels.zip");
+
+ return {
+ success: true,
+ };
+ } catch (error) {
+ logError(error, "Ошибка сохранения архива");
+ return {
+ success: false,
+ error: formatError(error, "Ошибка сохранения архива"),
+ };
+ }
+ }
+
+ private async stageToBlob(konvaStage: Stage): Promise {
+ if (!konvaStage || typeof konvaStage.toBlob !== "function") {
+ throw new ImageError("Konva Stage не найден или не поддерживает toBlob");
+ }
+
+ return new Promise((resolve, reject) => {
+ konvaStage.toBlob({
+ callback: (blob: Blob | null) => {
+ if (blob) {
+ resolve(blob);
+ } else {
+ reject(new ImageError("Не удалось создать изображение из Konva Stage"));
+ }
+ },
+ });
+ });
+ }
+}
+
+export const downloadService = new DownloadService();
diff --git a/src/states/konvaAllStages.svelte.ts b/src/states/konvaAllStages.svelte.ts
new file mode 100644
index 0000000..915f31d
--- /dev/null
+++ b/src/states/konvaAllStages.svelte.ts
@@ -0,0 +1,3 @@
+import type { Stage } from "svelte-konva";
+
+export const konvaAllStagesState: Array = $state([]);
diff --git a/src/states/konvaStage.svelte.ts b/src/states/konvaStage.svelte.ts
new file mode 100644
index 0000000..9ef2781
--- /dev/null
+++ b/src/states/konvaStage.svelte.ts
@@ -0,0 +1,16 @@
+import type { Stage } from "svelte-konva";
+
+function createState() {
+ let stage: Stage | undefined = $state(undefined);
+
+ return {
+ get stage(): Stage | undefined {
+ return stage;
+ },
+ set stage(newStage: Stage) {
+ stage = newStage;
+ },
+ };
+}
+
+export const konvaStageState = createState();