From 33617bad740ac19f794f50ef22e3898748b654a2 Mon Sep 17 00:00:00 2001 From: MultiMote Date: Thu, 31 Oct 2024 22:10:16 +0300 Subject: [PATCH 1/5] Show used space in saved labels menu, show error when quota exceeded --- src/lib/SavedLabelsMenu.svelte | 45 +++++++++++++++++++--------------- src/locale/en.ts | 1 + src/locale/ru.ts | 1 + src/utils/persistence.ts | 44 +++++++++++++++++++++------------ src/utils/toasts.ts | 3 ++- 5 files changed, 58 insertions(+), 36 deletions(-) diff --git a/src/lib/SavedLabelsMenu.svelte b/src/lib/SavedLabelsMenu.svelte index 888db69..06cdb02 100644 --- a/src/lib/SavedLabelsMenu.svelte +++ b/src/lib/SavedLabelsMenu.svelte @@ -16,6 +16,11 @@ let savedLabels: ExportedLabelTemplate[] = []; let selectedIndex: number = -1; let title: string = ""; + let usedSpace: number = 0; + + const calcUsedSpace = () => { + usedSpace = LocalStoragePersistence.usedSpace(); + } const onLabelSelected = (index: number) => { selectedIndex = index; @@ -38,8 +43,21 @@ savedLabels = result; title = ""; + calcUsedSpace(); }; + const saveLabels = (labels: ExportedLabelTemplate[]) => { + const {zodErrors, otherErrors} = LocalStoragePersistence.saveLabels(labels); + zodErrors.forEach((e) => Toasts.zodErrors(e, "Label save error")); + otherErrors.forEach((e) => Toasts.error(e)); + + if (zodErrors.length === 0 && otherErrors.length === 0) { + savedLabels = labels; + } + + calcUsedSpace(); + } + const onSaveReplaceClicked = () => { if (selectedIndex === -1) { return; @@ -55,26 +73,14 @@ const result = [...savedLabels]; result[selectedIndex] = label; - const errors = LocalStoragePersistence.saveLabels(result); - errors.forEach((e) => Toasts.zodErrors(e, "Label save error")); - - if (errors.length === 0) { - savedLabels = result; - } + saveLabels(result); }; const onSaveClicked = () => { const label = onRequestCurrentCanvas(); label.title = title; const result = [...savedLabels, label]; - console.log(result); - - const errors = LocalStoragePersistence.saveLabels(result); - errors.forEach((e) => Toasts.zodErrors(e, "Label save error")); - - if (errors.length === 0) { - savedLabels = result; - } + saveLabels(result); }; const onLoadClicked = () => { @@ -114,12 +120,9 @@ } }; - const reload = () => { - savedLabels = LocalStoragePersistence.loadLabels(); - }; - onMount(() => { - reload(); + savedLabels = LocalStoragePersistence.loadLabels(); + calcUsedSpace(); }); @@ -128,7 +131,9 @@
-
{$tr("params.saved_labels.menu_title")}
+
+ {$tr("params.saved_labels.menu_title")} - {usedSpace} {$tr("params.saved_labels.kb_used")} +
diff --git a/src/locale/en.ts b/src/locale/en.ts index bf4b611..7295411 100644 --- a/src/locale/en.ts +++ b/src/locale/en.ts @@ -94,6 +94,7 @@ export const translation_en = { "params.variables.insert": "Insert variable", "params.saved_labels.menu_title": "Save/load (browser storage)", + "params.saved_labels.kb_used": "kB used", "params.saved_labels.save.json": "Export", "params.saved_labels.save.browser": "Save", "params.saved_labels.save.browser.replace": "Save (replace)", diff --git a/src/locale/ru.ts b/src/locale/ru.ts index 7d0f15c..eb180ca 100644 --- a/src/locale/ru.ts +++ b/src/locale/ru.ts @@ -121,6 +121,7 @@ export const translation_ru: Record = { "params.barcode.enable_caption": "Показывать надпись", /* SavedLabelsMenu */ "params.saved_labels.menu_title": "Сохранить/загрузить (хранилище браузера)", + "params.saved_labels.kb_used": "кБ использовано", "params.saved_labels.save.json": "Экспорт", "params.saved_labels.save.browser": "Сохранить", "params.saved_labels.save.browser.replace": "Сохранить (заменить)", diff --git a/src/utils/persistence.ts b/src/utils/persistence.ts index cd712f9..8cd63cb 100644 --- a/src/utils/persistence.ts +++ b/src/utils/persistence.ts @@ -14,6 +14,15 @@ import { z } from "zod"; import { FileUtils } from "./file_utils"; export class LocalStoragePersistence { + /** Result in kilobytes */ + static usedSpace(): number { + let total = 0; + Object.keys(localStorage).forEach((key) => { + total += (localStorage[key].length + key.length) * 2; + }); + return Math.floor(total / 1024); + } + static saveObject(key: string, data: any) { if (data == null || data == undefined) { localStorage.removeItem(key); @@ -88,8 +97,10 @@ export class LocalStoragePersistence { this.validateAndSaveObject("last_label_props", labelData, LabelPropsSchema); } - static saveLabels(labels: ExportedLabelTemplate[]): z.ZodError[] { - const errors: z.ZodError[] = []; + static saveLabels(labels: ExportedLabelTemplate[]): {zodErrors: z.ZodError[], otherErrors: Error[]} { + const zodErrors: z.ZodError[] = []; + const otherErrors: Error[] = []; + Object.keys(localStorage).forEach((key) => { if (key.startsWith("saved_label")) { localStorage.removeItem(key); @@ -111,13 +122,14 @@ export class LocalStoragePersistence { this.validateAndSaveObject(`${basename}_${counter}`, label, ExportedLabelTemplateSchema); } catch (e) { - console.error(e); if (e instanceof z.ZodError) { - errors.push(e); + zodErrors.push(e); + } if (e instanceof Error) { + otherErrors.push(e); } } }); - return errors; + return {zodErrors, otherErrors}; } /** @@ -139,18 +151,20 @@ export class LocalStoragePersistence { this.validateAndSaveObject(`saved_label_${item.timestamp}`, item, ExportedLabelTemplateSchema); } - Object.keys(localStorage).sort().forEach((key) => { - if (key.startsWith("saved_label")) { - try { - const item = this.loadAndValidateObject(key, ExportedLabelTemplateSchema); - if (item != null) { - items.push(item); + Object.keys(localStorage) + .sort() + .forEach((key) => { + if (key.startsWith("saved_label")) { + try { + const item = this.loadAndValidateObject(key, ExportedLabelTemplateSchema); + if (item != null) { + items.push(item); + } + } catch (e) { + console.error(e); } - } catch (e) { - console.error(e); } - } - }); + }); return items; } diff --git a/src/utils/toasts.ts b/src/utils/toasts.ts index 447c32d..c1aa516 100644 --- a/src/utils/toasts.ts +++ b/src/utils/toasts.ts @@ -3,6 +3,8 @@ import { z } from "zod"; export class Toasts { static error(e: any) { + console.error(e); + Toastify({ text: `${e}`, gravity: "bottom", @@ -13,7 +15,6 @@ export class Toasts { static zodErrors(e: any, prefix: string) { if (e instanceof z.ZodError) { - console.error(e); e.issues.forEach((i) => { this.error(`${prefix} "${i.path.join("→")}" ${i.message}`); }); From 920dc8aa3d416455edb705cdf83303963e1b828f Mon Sep 17 00:00:00 2001 From: MultiMote Date: Mon, 4 Nov 2024 11:51:53 +0300 Subject: [PATCH 2/5] Update README.md Experimental Web features note --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 59aea8f..9c25a4c 100644 --- a/README.md +++ b/README.md @@ -25,6 +25,8 @@ Your browser must support Web Bluetooth API: [supported browsers](https://develo For serial communication: [supported browsers](https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API#browser_compatibility). +In some systems you need to enable Chrome Experimantal Web features (navigate to `chrome://flags`). + ## Feedback needed! I only have D110 and B1 printers. If you own other models, please write a comment [here](https://github.com/MultiMote/niimbluelib/issues/1) describing your model working or not. From a060d0dc2780b17ed45c42dbfccb860336b8ee5e Mon Sep 17 00:00:00 2001 From: MultiMote Date: Mon, 4 Nov 2024 12:07:36 +0300 Subject: [PATCH 3/5] Update README.md typo --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 9c25a4c..067bf6c 100644 --- a/README.md +++ b/README.md @@ -25,7 +25,7 @@ Your browser must support Web Bluetooth API: [supported browsers](https://develo For serial communication: [supported browsers](https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API#browser_compatibility). -In some systems you need to enable Chrome Experimantal Web features (navigate to `chrome://flags`). +In some systems you need to enable Chrome `Experimental Web Platform Features` (navigate to `chrome://flags`). ## Feedback needed! From 2e2dc99479141c005667ab25c5015827e0c21d90 Mon Sep 17 00:00:00 2001 From: MultiMote Date: Tue, 5 Nov 2024 21:07:15 +0300 Subject: [PATCH 4/5] Replace IText with Textbox (#44) --- src/utils/image_editor_object_helper.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/utils/image_editor_object_helper.ts b/src/utils/image_editor_object_helper.ts index 4094aa7..14f1ac9 100644 --- a/src/utils/image_editor_object_helper.ts +++ b/src/utils/image_editor_object_helper.ts @@ -1,5 +1,5 @@ import { fabric } from "fabric"; -import type { ITextOptions, TextOptions } from "fabric/fabric-impl"; +import type { ITextboxOptions, TextOptions } from "fabric/fabric-impl"; import { OBJECT_DEFAULTS, OBJECT_DEFAULTS_TEXT, OBJECT_DEFAULTS_VECTOR, OBJECT_SIZE_DEFAULTS } from "../defaults"; import Barcode from "../fabric-object/barcode.class"; import { QRCode } from "../fabric-object/qrcode.class"; @@ -116,8 +116,8 @@ export class ImageEditorObjectHelper { } } - static addText(canvas: fabric.Canvas, text?: string, options?: ITextOptions): fabric.IText { - const obj = new fabric.IText(text ?? "Text", { + static addText(canvas: fabric.Canvas, text?: string, options?: ITextboxOptions): fabric.Textbox { + const obj = new fabric.Textbox(text ?? "Text", { ...OBJECT_DEFAULTS_TEXT, ...options, }); From 6bf06ecd4b74b03f71360ef65ddd45612d47113a Mon Sep 17 00:00:00 2001 From: MultiMote Date: Tue, 5 Nov 2024 21:23:31 +0300 Subject: [PATCH 5/5] Update issue templates --- .github/ISSUE_TEMPLATE/feature_request.md | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 .github/ISSUE_TEMPLATE/feature_request.md diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md new file mode 100644 index 0000000..809b7b0 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -0,0 +1,10 @@ +--- +name: Feature request +about: Suggest an idea for this project +title: '' +labels: enhancement +assignees: '' + +--- + +