v1.1.4
This commit is contained in:
Lyz Coote
@@ -6,6 +6,7 @@
|
||||
"name": "frontend",
|
||||
"dependencies": {
|
||||
"dompurify": "^3.3.1",
|
||||
"pdfjs-dist": "^5.4.624",
|
||||
"svelte-flags": "^3.0.1",
|
||||
"svelte-sonner": "^1.0.7",
|
||||
},
|
||||
@@ -118,6 +119,30 @@
|
||||
|
||||
"@lucide/svelte": ["@lucide/svelte@0.561.0", "", { "peerDependencies": { "svelte": "^5" } }, "sha512-vofKV2UFVrKE6I4ewKJ3dfCXSV6iP6nWVmiM83MLjsU91EeJcEg7LoWUABLp/aOTxj1HQNbJD1f3g3L0JQgH9A=="],
|
||||
|
||||
"@napi-rs/canvas": ["@napi-rs/canvas@0.1.89", "", { "optionalDependencies": { "@napi-rs/canvas-android-arm64": "0.1.89", "@napi-rs/canvas-darwin-arm64": "0.1.89", "@napi-rs/canvas-darwin-x64": "0.1.89", "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.89", "@napi-rs/canvas-linux-arm64-gnu": "0.1.89", "@napi-rs/canvas-linux-arm64-musl": "0.1.89", "@napi-rs/canvas-linux-riscv64-gnu": "0.1.89", "@napi-rs/canvas-linux-x64-gnu": "0.1.89", "@napi-rs/canvas-linux-x64-musl": "0.1.89", "@napi-rs/canvas-win32-arm64-msvc": "0.1.89", "@napi-rs/canvas-win32-x64-msvc": "0.1.89" } }, "sha512-7GjmkMirJHejeALCqUnZY3QwID7bbumOiLrqq2LKgxrdjdmxWQBTc6rcASa2u8wuWrH7qo4/4n/VNrOwCoKlKg=="],
|
||||
|
||||
"@napi-rs/canvas-android-arm64": ["@napi-rs/canvas-android-arm64@0.1.89", "", { "os": "android", "cpu": "arm64" }, "sha512-CXxQTXsjtQqKGENS8Ejv9pZOFJhOPIl2goenS+aU8dY4DygvkyagDhy/I07D1YLqrDtPvLEX5zZHt8qUdnuIpQ=="],
|
||||
|
||||
"@napi-rs/canvas-darwin-arm64": ["@napi-rs/canvas-darwin-arm64@0.1.89", "", { "os": "darwin", "cpu": "arm64" }, "sha512-k29cR/Zl20WLYM7M8YePevRu2VQRaKcRedYr1V/8FFHkyIQ8kShEV+MPoPGi+znvmd17Eqjy2Pk2F2kpM2umVg=="],
|
||||
|
||||
"@napi-rs/canvas-darwin-x64": ["@napi-rs/canvas-darwin-x64@0.1.89", "", { "os": "darwin", "cpu": "x64" }, "sha512-iUragqhBrA5FqU13pkhYBDbUD1WEAIlT8R2+fj6xHICY2nemzwMUI8OENDhRh7zuL06YDcRwENbjAVxOmaX9jg=="],
|
||||
|
||||
"@napi-rs/canvas-linux-arm-gnueabihf": ["@napi-rs/canvas-linux-arm-gnueabihf@0.1.89", "", { "os": "linux", "cpu": "arm" }, "sha512-y3SM9sfDWasY58ftoaI09YBFm35Ig8tosZqgahLJ2WGqawCusGNPV9P0/4PsrLOCZqGg629WxexQMY25n7zcvA=="],
|
||||
|
||||
"@napi-rs/canvas-linux-arm64-gnu": ["@napi-rs/canvas-linux-arm64-gnu@0.1.89", "", { "os": "linux", "cpu": "arm64" }, "sha512-NEoF9y8xq5fX8HG8aZunBom1ILdTwt7ayBzSBIwrmitk7snj4W6Fz/yN/ZOmlM1iyzHDNX5Xn0n+VgWCF8BEdA=="],
|
||||
|
||||
"@napi-rs/canvas-linux-arm64-musl": ["@napi-rs/canvas-linux-arm64-musl@0.1.89", "", { "os": "linux", "cpu": "arm64" }, "sha512-UQQkIEzV12/l60j1ziMjZ+mtodICNUbrd205uAhbyTw0t60CrC/EsKb5/aJWGq1wM0agvcgZV72JJCKfLS6+4w=="],
|
||||
|
||||
"@napi-rs/canvas-linux-riscv64-gnu": ["@napi-rs/canvas-linux-riscv64-gnu@0.1.89", "", { "os": "linux", "cpu": "none" }, "sha512-1/VmEoFaIO6ONeeEMGoWF17wOYZOl5hxDC1ios2Bkz/oQjbJJ8DY/X22vWTmvuUKWWhBVlo63pxLGZbjJU/heA=="],
|
||||
|
||||
"@napi-rs/canvas-linux-x64-gnu": ["@napi-rs/canvas-linux-x64-gnu@0.1.89", "", { "os": "linux", "cpu": "x64" }, "sha512-ebLuqkCuaPIkKgKH9q4+pqWi1tkPOfiTk5PM1LKR1tB9iO9sFNVSIgwEp+SJreTSbA2DK5rW8lQXiN78SjtcvA=="],
|
||||
|
||||
"@napi-rs/canvas-linux-x64-musl": ["@napi-rs/canvas-linux-x64-musl@0.1.89", "", { "os": "linux", "cpu": "x64" }, "sha512-w+5qxHzplvA4BkHhCaizNMLLXiI+CfP84YhpHm/PqMub4u8J0uOAv+aaGv40rYEYra5hHRWr9LUd6cfW32o9/A=="],
|
||||
|
||||
"@napi-rs/canvas-win32-arm64-msvc": ["@napi-rs/canvas-win32-arm64-msvc@0.1.89", "", { "os": "win32", "cpu": "arm64" }, "sha512-DmyXa5lJHcjOsDC78BM3bnEECqbK3xASVMrKfvtT/7S7Z8NGQOugvu+L7b41V6cexCd34mBWgMOsjoEBceeB1Q=="],
|
||||
|
||||
"@napi-rs/canvas-win32-x64-msvc": ["@napi-rs/canvas-win32-x64-msvc@0.1.89", "", { "os": "win32", "cpu": "x64" }, "sha512-WMej0LZrIqIncQcx0JHaMXlnAG7sncwJh7obs/GBgp0xF9qABjwoRwIooMWCZkSansapKGNUHhamY6qEnFN7gA=="],
|
||||
|
||||
"@polka/url": ["@polka/url@1.0.0-next.29", "", {}, "sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww=="],
|
||||
|
||||
"@rollup/rollup-android-arm-eabi": ["@rollup/rollup-android-arm-eabi@4.55.1", "", { "os": "android", "cpu": "arm" }, "sha512-9R0DM/ykwfGIlNu6+2U09ga0WXeZ9MRC2Ter8jnz8415VbuIykVuc6bhdrbORFZANDmTDvq26mJrEVTl8TdnDg=="],
|
||||
@@ -336,10 +361,14 @@
|
||||
|
||||
"nanoid": ["nanoid@3.3.11", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w=="],
|
||||
|
||||
"node-readable-to-web-readable-stream": ["node-readable-to-web-readable-stream@0.4.2", "", {}, "sha512-/cMZNI34v//jUTrI+UIo4ieHAB5EZRY/+7OmXZgBxaWBMcW2tGdceIw06RFxWxrKZ5Jp3sI2i5TsRo+CBhtVLQ=="],
|
||||
|
||||
"obug": ["obug@2.1.1", "", {}, "sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ=="],
|
||||
|
||||
"paneforge": ["paneforge@1.0.2", "", { "dependencies": { "runed": "^0.23.4", "svelte-toolbelt": "^0.9.2" }, "peerDependencies": { "svelte": "^5.29.0" } }, "sha512-KzmIXQH1wCfwZ4RsMohD/IUtEjVhteR+c+ulb/CHYJHX8SuDXoJmChtsc/Xs5Wl8NHS4L5Q7cxL8MG40gSU1bA=="],
|
||||
|
||||
"pdfjs-dist": ["pdfjs-dist@5.4.624", "", { "optionalDependencies": { "@napi-rs/canvas": "^0.1.88", "node-readable-to-web-readable-stream": "^0.4.2" } }, "sha512-sm6TxKTtWv1Oh6n3C6J6a8odejb5uO4A4zo/2dgkHuC0iu8ZMAXOezEODkVaoVp8nX1Xzr+0WxFJJmUr45hQzg=="],
|
||||
|
||||
"picocolors": ["picocolors@1.1.1", "", {}, "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="],
|
||||
|
||||
"picomatch": ["picomatch@4.0.3", "", {}, "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q=="],
|
||||
|
||||
@@ -26,6 +26,9 @@
|
||||
"settings_preview_builtin_label": "Use built-in preview for images",
|
||||
"settings_preview_builtin_hint": "Uses EMLy's built-in image previewer for supported image file types.",
|
||||
"settings_preview_builtin_info": "Info: If disabled, image files will be treated as downloads instead of being previewed within the app.",
|
||||
"settings_preview_pdf_builtin_label": "Use built-in viewer for PDFs",
|
||||
"settings_preview_pdf_builtin_hint": "Uses EMLy's built-in viewer for PDF files.",
|
||||
"settings_preview_pdf_builtin_info": "Info: If disabled, PDF files will be treated as downloads instead of being previewed within the app.",
|
||||
"settings_danger_zone_title": "Danger Zone",
|
||||
"settings_danger_zone_description": "Advanced actions. Proceed with caution.",
|
||||
"settings_danger_devtools_label": "Open DevTools",
|
||||
@@ -33,6 +36,9 @@
|
||||
"settings_danger_reset_label": "Reset App Data",
|
||||
"settings_danger_reset_hint": "This will clear all your settings and return the app to its default state.",
|
||||
"settings_danger_reset_button": "Reset data",
|
||||
"settings_danger_reload_label": "Reload App",
|
||||
"settings_danger_reload_hint": "Reloads the application interface. Useful if the UI becomes unresponsive.",
|
||||
"settings_danger_reload_button": "Reload",
|
||||
"settings_danger_reset_dialog_title": "Are you absolutely sure?",
|
||||
"settings_danger_reset_dialog_description": "This action cannot be undone. This will permanently delete your current settings and return the app to its default state.",
|
||||
"settings_danger_reset_dialog_cancel": "Cancel",
|
||||
@@ -63,6 +69,7 @@
|
||||
"mail_attachments": "Attachments:",
|
||||
"mail_no_attachments": "No attachments found",
|
||||
"mail_error_pdf": "Failed to open PDF file.",
|
||||
"mail_error_image": "Failed to open image file.",
|
||||
"settings_toast_language_changed": "Language changed successfully!",
|
||||
"settings_toast_language_change_failed": "Failed to change language.",
|
||||
"mail_open_btn_text": "Open EML File",
|
||||
|
||||
@@ -26,6 +26,9 @@
|
||||
"settings_preview_builtin_label": "Usa anteprima integrata per le immagini",
|
||||
"settings_preview_builtin_hint": "Usa il visualizzatore di immagini integrato di EMLy per i tipi di file immagini supportati.",
|
||||
"settings_preview_builtin_info": "Info: Se disabilitato, i file immagine verranno trattati come download anziché essere visualizzati all'interno dell'app.",
|
||||
"settings_preview_pdf_builtin_label": "Usa visualizzatore integrato per PDF",
|
||||
"settings_preview_pdf_builtin_hint": "Usa il visualizzatore integrato di EMLy per i file PDF.",
|
||||
"settings_preview_pdf_builtin_info": "Info: Se disabilitato, i file PDF verranno trattati come download invece di essere visualizzati nell'app.",
|
||||
"settings_danger_zone_title": "Zona Pericolo",
|
||||
"settings_danger_zone_description": "Azioni avanzate. Procedere con cautela.",
|
||||
"settings_danger_devtools_label": "Apri DevTools",
|
||||
@@ -33,6 +36,9 @@
|
||||
"settings_danger_reset_label": "Reimposta Dati App",
|
||||
"settings_danger_reset_hint": "Questo cancellerà tutte le tue impostazioni e riporterà l'app allo stato predefinito.",
|
||||
"settings_danger_reset_button": "Reimposta dati",
|
||||
"settings_danger_reload_label": "Ricarica App",
|
||||
"settings_danger_reload_hint": "Ricarica l'interfaccia dell'applicazione. Utile se l'UI non risponde.",
|
||||
"settings_danger_reload_button": "Ricarica",
|
||||
"settings_danger_reset_dialog_title": "Sei assolutamente sicuro?",
|
||||
"settings_danger_reset_dialog_description": "Questa azione non può essere annullata. Questo eliminerà permanentemente le tue impostazioni attuali e riporterà l'app allo stato predefinito.",
|
||||
"settings_danger_reset_dialog_cancel": "Annulla",
|
||||
@@ -63,6 +69,7 @@
|
||||
"mail_attachments": "Allegati:",
|
||||
"mail_no_attachments": "Nessun allegato presente",
|
||||
"mail_error_pdf": "Impossibile aprire il file PDF.",
|
||||
"mail_error_image": "Impossibile aprire il file immagine.",
|
||||
"settings_toast_language_changed": "Lingua cambiata con successo!",
|
||||
"settings_toast_language_change_failed": "Impossibile cambiare lingua.",
|
||||
"mail_open_btn_text": "Apri File EML",
|
||||
|
||||
2996
frontend/package-lock.json
generated
Normal file
2996
frontend/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@@ -37,6 +37,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"dompurify": "^3.3.1",
|
||||
"pdfjs-dist": "^5.4.624",
|
||||
"svelte-flags": "^3.0.1",
|
||||
"svelte-sonner": "^1.0.7"
|
||||
}
|
||||
|
||||
@@ -1 +1 @@
|
||||
ee50509b402436d9bd91e260b4886ddc
|
||||
80dcc9e81c52df44518195ddfd550d26
|
||||
@@ -49,10 +49,14 @@
|
||||
<Sidebar.Root style="opacity: 0.8;">
|
||||
<Sidebar.Header>
|
||||
<div
|
||||
class="sidebar-title"
|
||||
class="sidebar-title items-center justify-center p-3 border-b border-white/10"
|
||||
style="padding: 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); display: flex; justify-content: center;"
|
||||
>
|
||||
<img src="/logo.png" alt="Logo" />
|
||||
<img src="/appicon.png" alt="Logo" width="64" height="64" />
|
||||
<span
|
||||
class="font-bold text-lg mt-2 pl-3"
|
||||
style="font-family: system-ui, sans-serif;">EMLy by 3gIT</span
|
||||
>
|
||||
</div>
|
||||
</Sidebar.Header>
|
||||
<Sidebar.Content>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script lang="ts">
|
||||
import { X, MailOpen, Image, FileText, File } from "@lucide/svelte";
|
||||
import { ShowOpenFileDialog, ReadEML, OpenPDF, OpenImageWindow } from "$lib/wailsjs/go/main/App";
|
||||
import { ShowOpenFileDialog, ReadEML, OpenPDF, OpenImageWindow, OpenPDFWindow, OpenImage } from "$lib/wailsjs/go/main/App";
|
||||
import type { internal } from "$lib/wailsjs/go/models";
|
||||
import { sidebarOpen } from "$lib/stores/app";
|
||||
import { onDestroy, onMount } from "svelte";
|
||||
@@ -23,6 +23,7 @@
|
||||
if(mailState.currentEmail !== null) {
|
||||
sidebarOpen.set(false);
|
||||
}
|
||||
console.log(mailState.currentEmail?.attachments)
|
||||
})
|
||||
|
||||
onDestroy(() => {
|
||||
@@ -55,13 +56,30 @@
|
||||
|
||||
async function openPDFHandler(base64Data: string, filename: string) {
|
||||
try {
|
||||
await OpenPDF(base64Data, filename);
|
||||
if (settingsStore.settings.useBuiltinPDFViewer) {
|
||||
await OpenPDFWindow(base64Data, filename);
|
||||
} else {
|
||||
await OpenPDF(base64Data, filename);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Failed to open PDF:", error);
|
||||
toast.error(m.mail_error_pdf());
|
||||
}
|
||||
}
|
||||
|
||||
async function openImageHandler(base64Data: string, filename: string) {
|
||||
try {
|
||||
if (settingsStore.settings.useBuiltinPreview) {
|
||||
await OpenImageWindow(base64Data, filename);
|
||||
} else {
|
||||
await OpenImage(base64Data, filename);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Failed to open image:", error);
|
||||
toast.error(m.mail_error_image());
|
||||
}
|
||||
}
|
||||
|
||||
async function onOpenMail() {
|
||||
isLoading = true;
|
||||
const result = await ShowOpenFileDialog();
|
||||
@@ -177,10 +195,10 @@
|
||||
<div class="att-list">
|
||||
{#if mailState.currentEmail.attachments && mailState.currentEmail.attachments.length > 0}
|
||||
{#each mailState.currentEmail.attachments as att}
|
||||
{#if att.contentType.startsWith("image/") && shouldPreview(att.filename)}
|
||||
{#if att.contentType.startsWith("image/")}
|
||||
<button
|
||||
class="att-btn image"
|
||||
onclick={() => OpenImageWindow(arrayBufferToBase64(att.data), att.filename)}
|
||||
onclick={() => openImageHandler(arrayBufferToBase64(att.data), att.filename)}
|
||||
>
|
||||
<Image size="14" />
|
||||
<span class="att-name">{att.filename}</span>
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
import { writable } from "svelte/store";
|
||||
import { browser } from "$app/environment";
|
||||
|
||||
export const telemetryEnabled = writable<boolean>(false);
|
||||
|
||||
const storedDebug = browser ? sessionStorage.getItem("debugWindowInSettings") === "true" : false;
|
||||
export const dangerZoneEnabled = writable<boolean>(storedDebug);
|
||||
export const unsavedChanges = writable<boolean>(false);
|
||||
|
||||
1
frontend/src/lib/types.d.ts
vendored
1
frontend/src/lib/types.d.ts
vendored
@@ -5,6 +5,7 @@ type SupportedFileTypePreview = "jpg" | "jpeg" | "png";
|
||||
interface EMLy_GUI_Settings {
|
||||
selectedLanguage: SupportedLanguages = "en" | "it";
|
||||
useBuiltinPreview: boolean;
|
||||
useBuiltinPDFViewer?: boolean;
|
||||
previewFileSupportedTypes?: SupportedFileTypePreview[];
|
||||
}
|
||||
|
||||
|
||||
@@ -10,4 +10,4 @@ export type WithoutChild<T> = T extends { child?: any } ? Omit<T, "child"> : T;
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
export type WithoutChildren<T> = T extends { children?: any } ? Omit<T, "children"> : T;
|
||||
export type WithoutChildrenOrChild<T> = WithoutChildren<WithoutChild<T>>;
|
||||
export type WithElementRef<T, U extends HTMLElement = HTMLElement> = T & { ref?: U | null };
|
||||
export type WithElementRef<T, U extends HTMLElement = HTMLElement> = T & { ref?: U | null };
|
||||
8
frontend/src/lib/wailsjs/go/main/App.d.ts
vendored
8
frontend/src/lib/wailsjs/go/main/App.d.ts
vendored
@@ -12,14 +12,22 @@ export function GetImageViewerData():Promise<main.ImageViewerData>;
|
||||
|
||||
export function GetMachineData():Promise<utils.MachineInfo>;
|
||||
|
||||
export function GetPDFViewerData():Promise<main.PDFViewerData>;
|
||||
|
||||
export function GetStartupFile():Promise<string>;
|
||||
|
||||
export function GetViewerData():Promise<main.ViewerData>;
|
||||
|
||||
export function OpenDefaultAppsSettings():Promise<void>;
|
||||
|
||||
export function OpenImage(arg1:string,arg2:string):Promise<void>;
|
||||
|
||||
export function OpenImageWindow(arg1:string,arg2:string):Promise<void>;
|
||||
|
||||
export function OpenPDF(arg1:string,arg2:string):Promise<void>;
|
||||
|
||||
export function OpenPDFWindow(arg1:string,arg2:string):Promise<void>;
|
||||
|
||||
export function QuitApp():Promise<void>;
|
||||
|
||||
export function ReadEML(arg1:string):Promise<internal.EmailData>;
|
||||
|
||||
@@ -18,14 +18,26 @@ export function GetMachineData() {
|
||||
return window['go']['main']['App']['GetMachineData']();
|
||||
}
|
||||
|
||||
export function GetPDFViewerData() {
|
||||
return window['go']['main']['App']['GetPDFViewerData']();
|
||||
}
|
||||
|
||||
export function GetStartupFile() {
|
||||
return window['go']['main']['App']['GetStartupFile']();
|
||||
}
|
||||
|
||||
export function GetViewerData() {
|
||||
return window['go']['main']['App']['GetViewerData']();
|
||||
}
|
||||
|
||||
export function OpenDefaultAppsSettings() {
|
||||
return window['go']['main']['App']['OpenDefaultAppsSettings']();
|
||||
}
|
||||
|
||||
export function OpenImage(arg1, arg2) {
|
||||
return window['go']['main']['App']['OpenImage'](arg1, arg2);
|
||||
}
|
||||
|
||||
export function OpenImageWindow(arg1, arg2) {
|
||||
return window['go']['main']['App']['OpenImageWindow'](arg1, arg2);
|
||||
}
|
||||
@@ -34,6 +46,10 @@ export function OpenPDF(arg1, arg2) {
|
||||
return window['go']['main']['App']['OpenPDF'](arg1, arg2);
|
||||
}
|
||||
|
||||
export function OpenPDFWindow(arg1, arg2) {
|
||||
return window['go']['main']['App']['OpenPDFWindow'](arg1, arg2);
|
||||
}
|
||||
|
||||
export function QuitApp() {
|
||||
return window['go']['main']['App']['QuitApp']();
|
||||
}
|
||||
|
||||
@@ -252,6 +252,52 @@ export namespace main {
|
||||
this.filename = source["filename"];
|
||||
}
|
||||
}
|
||||
export class PDFViewerData {
|
||||
data: string;
|
||||
filename: string;
|
||||
|
||||
static createFrom(source: any = {}) {
|
||||
return new PDFViewerData(source);
|
||||
}
|
||||
|
||||
constructor(source: any = {}) {
|
||||
if ('string' === typeof source) source = JSON.parse(source);
|
||||
this.data = source["data"];
|
||||
this.filename = source["filename"];
|
||||
}
|
||||
}
|
||||
export class ViewerData {
|
||||
imageData?: ImageViewerData;
|
||||
pdfData?: PDFViewerData;
|
||||
|
||||
static createFrom(source: any = {}) {
|
||||
return new ViewerData(source);
|
||||
}
|
||||
|
||||
constructor(source: any = {}) {
|
||||
if ('string' === typeof source) source = JSON.parse(source);
|
||||
this.imageData = this.convertValues(source["imageData"], ImageViewerData);
|
||||
this.pdfData = this.convertValues(source["pdfData"], PDFViewerData);
|
||||
}
|
||||
|
||||
convertValues(a: any, classs: any, asMap: boolean = false): any {
|
||||
if (!a) {
|
||||
return a;
|
||||
}
|
||||
if (a.slice && a.map) {
|
||||
return (a as any[]).map(elem => this.convertValues(elem, classs));
|
||||
} else if ("object" === typeof a) {
|
||||
if (asMap) {
|
||||
for (const key of Object.keys(a)) {
|
||||
a[key] = new classs(a[key]);
|
||||
}
|
||||
return a;
|
||||
}
|
||||
return new classs(a);
|
||||
}
|
||||
return a;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -1,14 +1,18 @@
|
||||
import { redirect } from '@sveltejs/kit';
|
||||
import type { PageLoad } from './$types';
|
||||
import { GetImageViewerData, GetStartupFile, ReadEML } from '$lib/wailsjs/go/main/App';
|
||||
import { GetViewerData, GetStartupFile, ReadEML } from '$lib/wailsjs/go/main/App';
|
||||
import DOMPurify from 'dompurify';
|
||||
|
||||
export const load: PageLoad = async () => {
|
||||
try {
|
||||
// Check if we are in viewer mode
|
||||
const viewerData = await GetImageViewerData();
|
||||
if (viewerData && viewerData.data) {
|
||||
throw redirect(302, "/image-viewer");
|
||||
const viewerData = await GetViewerData();
|
||||
if (viewerData) {
|
||||
if (viewerData.imageData) {
|
||||
throw redirect(302, "/image");
|
||||
}
|
||||
if (viewerData.pdfData) {
|
||||
throw redirect(302, "/pdf");
|
||||
}
|
||||
}
|
||||
|
||||
// Check if opened with a file
|
||||
|
||||
@@ -21,26 +21,26 @@
|
||||
import { dangerZoneEnabled, unsavedChanges } from "$lib/stores/app";
|
||||
import { LogDebug } from "$lib/wailsjs/runtime/runtime";
|
||||
import { settingsStore } from "$lib/stores/settings.svelte";
|
||||
import { GetMachineData } from "$lib/wailsjs/go/main/App";
|
||||
import * as m from "$lib/paraglide/messages";
|
||||
import { setLocale } from "$lib/paraglide/runtime";
|
||||
import { mailState } from "$lib/stores/mail-state.svelte.js";
|
||||
|
||||
let { data } = $props();
|
||||
let machineData = $derived(data.machineData);
|
||||
let config = $derived(data.config);
|
||||
|
||||
const defaults: EMLy_GUI_Settings = {
|
||||
selectedLanguage: "it",
|
||||
useBuiltinPreview: true,
|
||||
useBuiltinPDFViewer: true,
|
||||
previewFileSupportedTypes: ["jpg", "jpeg", "png"],
|
||||
};
|
||||
|
||||
|
||||
async function setLanguage(lang: EMLy_GUI_Settings["selectedLanguage"] | null) {
|
||||
async function setLanguage(
|
||||
lang: EMLy_GUI_Settings["selectedLanguage"] | null,
|
||||
) {
|
||||
if (!browser) return;
|
||||
try {
|
||||
await setLocale(lang || "en", {reload: false});
|
||||
await setLocale(lang || "en", { reload: false });
|
||||
toast.success(m.settings_toast_language_changed());
|
||||
} catch {
|
||||
toast.error(m.settings_toast_language_change_failed());
|
||||
@@ -48,30 +48,27 @@
|
||||
}
|
||||
|
||||
// Clone store state for form editing
|
||||
let form = $state<EMLy_GUI_Settings>({ ...settingsStore.settings });
|
||||
let lastSaved = $state<EMLy_GUI_Settings>({
|
||||
...settingsStore.settings,
|
||||
});
|
||||
// Use normalizeSettings to ensure new fields (like useBuiltinPDFViewer) are populated with defaults
|
||||
let form = $state<EMLy_GUI_Settings>(normalizeSettings(settingsStore.settings));
|
||||
let lastSaved = $state<EMLy_GUI_Settings>(normalizeSettings(settingsStore.settings));
|
||||
let dangerWarningOpen = $state(false);
|
||||
|
||||
function normalizeSettings(
|
||||
s: EMLy_GUI_Settings,
|
||||
): EMLy_GUI_Settings {
|
||||
function normalizeSettings(s: EMLy_GUI_Settings): EMLy_GUI_Settings {
|
||||
return {
|
||||
selectedLanguage: s.selectedLanguage || defaults.selectedLanguage || "en",
|
||||
useBuiltinPreview: !!s.useBuiltinPreview,
|
||||
useBuiltinPDFViewer:
|
||||
s.useBuiltinPDFViewer ?? defaults.useBuiltinPDFViewer ?? true,
|
||||
previewFileSupportedTypes:
|
||||
s.previewFileSupportedTypes || defaults.previewFileSupportedTypes || [],
|
||||
};
|
||||
}
|
||||
|
||||
function isSameSettings(
|
||||
a: EMLy_GUI_Settings,
|
||||
b: EMLy_GUI_Settings,
|
||||
) {
|
||||
function isSameSettings(a: EMLy_GUI_Settings, b: EMLy_GUI_Settings) {
|
||||
return (
|
||||
(a.selectedLanguage ?? "") === (b.selectedLanguage ?? "") &&
|
||||
!!a.useBuiltinPreview === !!b.useBuiltinPreview &&
|
||||
!!a.useBuiltinPDFViewer === !!b.useBuiltinPDFViewer &&
|
||||
JSON.stringify(a.previewFileSupportedTypes?.sort()) ===
|
||||
JSON.stringify(b.previewFileSupportedTypes?.sort())
|
||||
);
|
||||
@@ -152,8 +149,9 @@
|
||||
isSameSettings(lastSaved, defaults) &&
|
||||
!isSameSettings(lastSaved, settingsStore.settings)
|
||||
) {
|
||||
form = { ...settingsStore.settings };
|
||||
lastSaved = { ...settingsStore.settings };
|
||||
// Ensure we normalize when syncing from store too
|
||||
form = normalizeSettings(settingsStore.settings);
|
||||
lastSaved = normalizeSettings(settingsStore.settings);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -162,9 +160,6 @@
|
||||
$effect(() => {
|
||||
(async () => {
|
||||
if ($dangerZoneEnabled && !previousDangerZoneEnabled) {
|
||||
if (!data.machineData || data.machineData === undefined) {
|
||||
data.machineData = await GetMachineData();
|
||||
}
|
||||
dangerWarningOpen = true;
|
||||
toast.info("Here be dragons!", { icon: Flame });
|
||||
}
|
||||
@@ -191,16 +186,15 @@
|
||||
<Button
|
||||
class="cursor-pointer hover:cursor-pointer"
|
||||
variant="ghost"
|
||||
onclick={() => goto("/")}><ChevronLeft class="size-4" /> {m.settings_back()}</Button
|
||||
onclick={() => goto("/")}
|
||||
><ChevronLeft class="size-4" /> {m.settings_back()}</Button
|
||||
>
|
||||
</header>
|
||||
|
||||
<Card.Root>
|
||||
<Card.Header class="space-y-1">
|
||||
<Card.Title>{m.settings_language_title()}</Card.Title>
|
||||
<Card.Description
|
||||
>{m.settings_language_description()}</Card.Description
|
||||
>
|
||||
<Card.Description>{m.settings_language_description()}</Card.Description>
|
||||
</Card.Header>
|
||||
<Card.Content>
|
||||
<RadioGroup.Root
|
||||
@@ -237,16 +231,17 @@
|
||||
</div>
|
||||
</RadioGroup.Root>
|
||||
<div class="text-xs text-muted-foreground mt-4">
|
||||
<strong>Info:</strong> {m.settings_language_info()}
|
||||
<strong>Info:</strong>
|
||||
{m.settings_language_info()}
|
||||
</div>
|
||||
</Card.Content>
|
||||
</Card.Root>
|
||||
|
||||
<Card.Root>
|
||||
<Card.Header class="space-y-1">
|
||||
<Card.Title>{m.settings_preview_files_title()}</Card.Title>
|
||||
<Card.Title>{m.settings_preview_page_title()}</Card.Title>
|
||||
<Card.Description
|
||||
>{m.settings_preview_files_description()}</Card.Description
|
||||
>{m.settings_preview_page_description()}</Card.Description
|
||||
>
|
||||
</Card.Header>
|
||||
<Card.Content class="space-y-4">
|
||||
@@ -315,28 +310,20 @@
|
||||
PNG (.png)
|
||||
</Label>
|
||||
</div>
|
||||
<p class="text-xs text-muted-foreground mt-2">
|
||||
{m.settings_preview_images_hint()}
|
||||
</p>
|
||||
<Separator />
|
||||
</div>
|
||||
<p class="text-xs text-muted-foreground mt-2">
|
||||
{m.settings_preview_images_hint()}
|
||||
</p>
|
||||
</div>
|
||||
</Card.Content>
|
||||
</Card.Root>
|
||||
|
||||
<Card.Root>
|
||||
<Card.Header class="space-y-1">
|
||||
<Card.Title>{m.settings_preview_page_title()}</Card.Title>
|
||||
<Card.Description
|
||||
>{m.settings_preview_page_description()}</Card.Description
|
||||
>
|
||||
</Card.Header>
|
||||
<Card.Content class="space-y-4">
|
||||
<div class="space-y-3">
|
||||
<div
|
||||
class="flex items-center justify-between gap-4 rounded-lg border bg-card p-4"
|
||||
>
|
||||
<div>
|
||||
<div class="font-medium">{m.settings_preview_builtin_label()}</div>
|
||||
<div class="font-medium">
|
||||
{m.settings_preview_builtin_label()}
|
||||
</div>
|
||||
<div class="text-sm text-muted-foreground">
|
||||
{m.settings_preview_builtin_hint()}
|
||||
</div>
|
||||
@@ -352,14 +339,36 @@
|
||||
</div>
|
||||
<Separator />
|
||||
|
||||
|
||||
<div class="space-y-3">
|
||||
<div
|
||||
class="flex items-center justify-between gap-4 rounded-lg border bg-card p-4"
|
||||
>
|
||||
<div>
|
||||
<div class="font-medium">
|
||||
{m.settings_preview_pdf_builtin_label()}
|
||||
</div>
|
||||
<div class="text-sm text-muted-foreground">
|
||||
{m.settings_preview_pdf_builtin_hint()}
|
||||
</div>
|
||||
</div>
|
||||
<Switch
|
||||
bind:checked={form.useBuiltinPDFViewer}
|
||||
class="cursor-pointer hover:cursor-pointer"
|
||||
/>
|
||||
</div>
|
||||
<p class="text-xs text-muted-foreground mt-2">
|
||||
{m.settings_preview_pdf_builtin_info()}
|
||||
</p>
|
||||
</div>
|
||||
</Card.Content>
|
||||
</Card.Root>
|
||||
|
||||
{#if $dangerZoneEnabled}
|
||||
<Card.Root class="border-destructive/50 bg-destructive/15">
|
||||
<Card.Header class="space-y-1">
|
||||
<Card.Title class="text-destructive">{m.settings_danger_zone_title()}</Card.Title>
|
||||
<Card.Title class="text-destructive"
|
||||
>{m.settings_danger_zone_title()}</Card.Title
|
||||
>
|
||||
<Card.Description
|
||||
>{m.settings_danger_zone_description()}</Card.Description
|
||||
>
|
||||
@@ -369,13 +378,35 @@
|
||||
class="flex items-center justify-between gap-4 rounded-lg border border-destructive/30 bg-card p-4"
|
||||
>
|
||||
<div class="space-y-1">
|
||||
<Label class="text-sm">{m.settings_danger_devtools_label()}</Label>
|
||||
<Label class="text-sm">{m.settings_danger_devtools_label()}</Label
|
||||
>
|
||||
<div class="text-sm text-muted-foreground">
|
||||
{m.settings_danger_devtools_hint()}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Separator />
|
||||
<div
|
||||
class="flex items-center justify-between gap-4 rounded-lg border border-destructive/30 bg-card p-4"
|
||||
>
|
||||
<div class="space-y-1">
|
||||
<Label class="text-sm">{m.settings_danger_reload_label()}</Label>
|
||||
<div class="text-sm text-muted-foreground">
|
||||
{m.settings_danger_reload_hint()}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a
|
||||
data-sveltekit-reload
|
||||
href="/"
|
||||
class={`${buttonVariants({ variant: "destructive" })} cursor-pointer hover:cursor-pointer`}
|
||||
style="text-decoration: none;"
|
||||
>
|
||||
{m.settings_danger_reload_button()}
|
||||
</a>
|
||||
</div>
|
||||
<Separator />
|
||||
|
||||
<div
|
||||
class="flex items-center justify-between gap-4 rounded-lg border border-destructive/30 bg-card p-4"
|
||||
>
|
||||
@@ -401,7 +432,7 @@
|
||||
</AlertDialog.Title>
|
||||
<AlertDialog.Description>
|
||||
{m.settings_danger_reset_dialog_description_part1()}
|
||||
<br/>
|
||||
<br />
|
||||
{m.settings_danger_reset_dialog_description_part2()}
|
||||
</AlertDialog.Description>
|
||||
</AlertDialog.Header>
|
||||
@@ -423,30 +454,11 @@
|
||||
</AlertDialog.Root>
|
||||
</div>
|
||||
<div class="text-xs text-muted-foreground">
|
||||
<strong>{m.settings_danger_warning() }</strong>
|
||||
<strong>{m.settings_danger_warning()}</strong>
|
||||
</div>
|
||||
<Separator />
|
||||
|
||||
<div class="text-xs text-muted-foreground">
|
||||
OS: {machineData?.Version} ({machineData?.OS})
|
||||
<br />
|
||||
Hostname: {machineData?.Hostname}
|
||||
<br />
|
||||
ID: {machineData?.HWID}
|
||||
<br />
|
||||
CPU: {machineData?.CPU.processors[0].model.trim()} ({machineData
|
||||
?.CPU.total_hardware_threads} cores)
|
||||
<br />
|
||||
RAM: {Math.round(
|
||||
(machineData?.RAM.total_physical_bytes ?? 0) /
|
||||
(1024 * 1024 * 1024),
|
||||
)} GB
|
||||
<br />
|
||||
GPU: {machineData?.GPU.cards?.find(
|
||||
(c) => !(c.pci?.product?.name ?? "").includes("Virtual"),
|
||||
)?.pci?.product?.name ?? "N/A"}
|
||||
<br />
|
||||
<br />
|
||||
GUI: {config
|
||||
? `${config.GUISemver} (${config.GUIReleaseChannel})`
|
||||
: "N/A"}
|
||||
@@ -462,7 +474,9 @@
|
||||
<AlertDialog.Root bind:open={dangerWarningOpen}>
|
||||
<AlertDialog.Content>
|
||||
<AlertDialog.Header>
|
||||
<AlertDialog.Title>{m.settings_danger_alert_title()}</AlertDialog.Title>
|
||||
<AlertDialog.Title
|
||||
>{m.settings_danger_alert_title()}</AlertDialog.Title
|
||||
>
|
||||
<AlertDialog.Description>
|
||||
{m.settings_danger_alert_description()}
|
||||
</AlertDialog.Description>
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
RotateCw,
|
||||
ZoomIn,
|
||||
ZoomOut,
|
||||
Square,
|
||||
AlignHorizontalSpaceAround,
|
||||
} from "@lucide/svelte";
|
||||
import { sidebarOpen } from "$lib/stores/app";
|
||||
import { toast } from "svelte-sonner";
|
||||
@@ -36,7 +36,7 @@
|
||||
imageData = result.data;
|
||||
filename = result.filename;
|
||||
// Adjust title
|
||||
document.title = filename + " - EMLy Viewer";
|
||||
document.title = filename + " - EMLy Image Viewer";
|
||||
sidebarOpen.set(false);
|
||||
} else {
|
||||
toast.error("No image data provided");
|
||||
@@ -131,7 +131,7 @@
|
||||
</button>
|
||||
<div class="separator"></div>
|
||||
<button class="btn" onclick={reset} title="Reset">
|
||||
<Square size="16" />
|
||||
<AlignHorizontalSpaceAround size="16" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
145
frontend/src/routes/pdf/+layout.svelte
Normal file
145
frontend/src/routes/pdf/+layout.svelte
Normal file
@@ -0,0 +1,145 @@
|
||||
<script lang="ts">
|
||||
import {
|
||||
WindowMinimise,
|
||||
WindowMaximise,
|
||||
WindowUnmaximise,
|
||||
WindowIsMaximised,
|
||||
Quit,
|
||||
} from "$lib/wailsjs/runtime/runtime";
|
||||
import type { LayoutProps } from "./$types";
|
||||
|
||||
let { data, children }: LayoutProps = $props();
|
||||
|
||||
let isMaximized = $state(false);
|
||||
|
||||
async function syncMaxState() {
|
||||
isMaximized = await WindowIsMaximised();
|
||||
}
|
||||
|
||||
async function toggleMaximize() {
|
||||
if (isMaximized) {
|
||||
WindowUnmaximise();
|
||||
} else {
|
||||
WindowMaximise();
|
||||
}
|
||||
isMaximized = !isMaximized;
|
||||
}
|
||||
|
||||
function minimize() {
|
||||
WindowMinimise();
|
||||
}
|
||||
|
||||
function closeWindow() {
|
||||
Quit();
|
||||
}
|
||||
|
||||
function onTitlebarDblClick() {
|
||||
toggleMaximize();
|
||||
}
|
||||
|
||||
syncMaxState();
|
||||
</script>
|
||||
|
||||
<div class="app-layout">
|
||||
<!-- Titlebar -->
|
||||
<!-- svelte-ignore a11y_no_static_element_interactions -->
|
||||
<div
|
||||
class="titlebar"
|
||||
ondblclick={onTitlebarDblClick}
|
||||
style="--wails-draggable:drag"
|
||||
>
|
||||
<div class="title">EMLy PDF Viewer</div>
|
||||
|
||||
<div class="controls">
|
||||
<button class="btn" onclick={minimize}>─</button>
|
||||
<button class="btn" onclick={toggleMaximize}>
|
||||
{#if isMaximized}
|
||||
❐
|
||||
{:else}
|
||||
☐
|
||||
{/if}
|
||||
</button>
|
||||
<button class="btn close" onclick={closeWindow}>✕</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<main class="content">
|
||||
{@render children()}
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
:global(body) {
|
||||
margin: 0;
|
||||
background: #000;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.app-layout {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.titlebar {
|
||||
height: 32px;
|
||||
background: #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-left: 12px;
|
||||
-webkit-app-region: drag;
|
||||
user-select: none;
|
||||
flex: 0 0 32px;
|
||||
z-index: 50;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 13px;
|
||||
opacity: 0.9;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.controls {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 46px;
|
||||
height: 100%;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
-webkit-app-region: no-drag;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.btn:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
}
|
||||
|
||||
.close:hover {
|
||||
background: #e81123;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
background: #111;
|
||||
}
|
||||
</style>
|
||||
375
frontend/src/routes/pdf/+page.svelte
Normal file
375
frontend/src/routes/pdf/+page.svelte
Normal file
@@ -0,0 +1,375 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from "svelte";
|
||||
import type { PageData } from './$types';
|
||||
import {
|
||||
RotateCcw,
|
||||
RotateCw,
|
||||
ZoomIn,
|
||||
ZoomOut,
|
||||
AlignHorizontalSpaceAround
|
||||
} from "@lucide/svelte";
|
||||
import { sidebarOpen } from "$lib/stores/app";
|
||||
import { toast } from "svelte-sonner";
|
||||
import * as pdfjsLib from "pdfjs-dist";
|
||||
import pdfWorker from "pdfjs-dist/build/pdf.worker.min.mjs?url";
|
||||
|
||||
if (typeof Promise.withResolvers === 'undefined') {
|
||||
// @ts-ignore
|
||||
Promise.withResolvers = function () {
|
||||
let resolve, reject;
|
||||
const promise = new Promise((res, rej) => {
|
||||
resolve = res;
|
||||
reject = rej;
|
||||
});
|
||||
return { promise, resolve, reject };
|
||||
};
|
||||
}
|
||||
|
||||
// Set worker source
|
||||
pdfjsLib.GlobalWorkerOptions.workerSrc = pdfWorker;
|
||||
|
||||
let { data }: { data: PageData } = $props();
|
||||
|
||||
let pdfData = $state<Uint8Array | null>(null);
|
||||
let filename = $state("");
|
||||
let rotation = $state(0);
|
||||
let scale = $state(1.5); // Default scale
|
||||
let error = $state("");
|
||||
let loading = $state(true);
|
||||
|
||||
let pdfDoc = $state<pdfjsLib.PDFDocumentProxy | null>(null);
|
||||
let pageNum = $state(1);
|
||||
let totalPages = $state(0);
|
||||
let canvasRef = $state<HTMLCanvasElement>();
|
||||
let canvasContainerRef = $state<HTMLDivElement>();
|
||||
let renderTask = $state<pdfjsLib.RenderTask | null>(null);
|
||||
|
||||
onMount(async () => {
|
||||
try {
|
||||
const result = data?.data;
|
||||
if (result) {
|
||||
// Decode Base64 to Uint8Array
|
||||
const binaryString = window.atob(result.data);
|
||||
const len = binaryString.length;
|
||||
const bytes = new Uint8Array(len);
|
||||
for (let i = 0; i < len; i++) {
|
||||
bytes[i] = binaryString.charCodeAt(i);
|
||||
}
|
||||
pdfData = bytes;
|
||||
filename = result.filename;
|
||||
// Adjust title
|
||||
document.title = filename + " - EMLy PDF Viewer";
|
||||
sidebarOpen.set(false);
|
||||
|
||||
await loadPDF();
|
||||
|
||||
} else {
|
||||
toast.error("No PDF data provided");
|
||||
error = "No PDF data provided. Please open this window from the main EMLy application.";
|
||||
loading = false;
|
||||
}
|
||||
} catch (e) {
|
||||
error = "Failed to load PDF: " + e;
|
||||
loading = false;
|
||||
}
|
||||
});
|
||||
|
||||
async function loadPDF() {
|
||||
if (!pdfData) return;
|
||||
|
||||
// Set a timeout to prevent infinite loading
|
||||
const timeout = setTimeout(() => {
|
||||
if (loading) {
|
||||
loading = false;
|
||||
error = "Timeout loading PDF. The worker might have failed to initialize.";
|
||||
toast.error(error);
|
||||
}
|
||||
}, 10000);
|
||||
|
||||
try {
|
||||
const loadingTask = pdfjsLib.getDocument({ data: pdfData });
|
||||
pdfDoc = await loadingTask.promise;
|
||||
totalPages = pdfDoc.numPages;
|
||||
pageNum = 1;
|
||||
await renderPage(pageNum);
|
||||
loading = false;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
error = "Error parsing PDF: " + e;
|
||||
loading = false;
|
||||
} finally {
|
||||
clearTimeout(timeout);
|
||||
}
|
||||
}
|
||||
|
||||
async function renderPage(num: number) {
|
||||
if (!pdfDoc || !canvasRef) return;
|
||||
|
||||
if (renderTask) {
|
||||
await renderTask.promise.catch(() => {}); // Cancel previous render if any (though we wait usually)
|
||||
}
|
||||
|
||||
try {
|
||||
const page = await pdfDoc.getPage(num);
|
||||
|
||||
// Calculate scale if needed or use current scale
|
||||
// We apply rotation to the viewport
|
||||
const viewport = page.getViewport({ scale: scale, rotation: rotation });
|
||||
|
||||
const canvas = canvasRef;
|
||||
const context = canvas.getContext('2d');
|
||||
|
||||
if (!context) return;
|
||||
|
||||
canvas.height = viewport.height;
|
||||
canvas.width = viewport.width;
|
||||
|
||||
const renderContext = {
|
||||
canvasContext: context,
|
||||
viewport: viewport
|
||||
};
|
||||
|
||||
// Cast to any to avoid type mismatch with PDF.js definitions
|
||||
await page.render(renderContext as any).promise;
|
||||
} catch (e: any) {
|
||||
if (e.name !== 'RenderingCancelledException') {
|
||||
console.error(e);
|
||||
toast.error("Error rendering page: " + e.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function fitToWidth() {
|
||||
if (!pdfDoc || !canvasContainerRef) return;
|
||||
// We need to fetch page to get dimensions
|
||||
loading = true;
|
||||
pdfDoc.getPage(pageNum).then(page => {
|
||||
const containerWidth = canvasContainerRef!.clientWidth - 40; // padding
|
||||
const viewport = page.getViewport({ scale: 1, rotation: rotation });
|
||||
scale = containerWidth / viewport.width;
|
||||
renderPage(pageNum).then(() => { loading = false; });
|
||||
});
|
||||
}
|
||||
|
||||
$effect(() => {
|
||||
// Re-render when scale or rotation changes
|
||||
// Access them here to ensure dependency tracking since renderPage is async
|
||||
const _deps = [scale, rotation];
|
||||
|
||||
if (pdfDoc) {
|
||||
renderPage(pageNum);
|
||||
}
|
||||
});
|
||||
|
||||
function rotate(deg: number) {
|
||||
rotation = (rotation + deg + 360) % 360;
|
||||
}
|
||||
|
||||
function zoom(factor: number) {
|
||||
scale = Math.max(0.1, Math.min(5.0, scale + factor));
|
||||
}
|
||||
|
||||
function nextPage() {
|
||||
if (pageNum >= totalPages) return;
|
||||
pageNum++;
|
||||
renderPage(pageNum);
|
||||
}
|
||||
|
||||
function prevPage() {
|
||||
if (pageNum <= 1) return;
|
||||
pageNum--;
|
||||
renderPage(pageNum);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<div class="viewer-container">
|
||||
{#if loading}
|
||||
<div class="loading-overlay">
|
||||
<div class="spinner"></div>
|
||||
<div>Loading PDF...</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if error}
|
||||
<div class="error-overlay">
|
||||
<div class="error-message">{error}</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="toolbar">
|
||||
<h1 class="title" title={filename}>{filename || "Image Viewer"}</h1>
|
||||
|
||||
<div class="controls">
|
||||
<button class="btn" onclick={() => zoom(0.1)} title="Zoom In">
|
||||
<ZoomIn size="16" />
|
||||
</button>
|
||||
<button class="btn" onclick={() => zoom(-0.1)} title="Zoom Out">
|
||||
<ZoomOut size="16" />
|
||||
</button>
|
||||
<div class="separator"></div>
|
||||
<button class="btn" onclick={() => rotate(-90)} title="Rotate Left">
|
||||
<RotateCcw size="16" />
|
||||
</button>
|
||||
<button class="btn" onclick={() => rotate(90)} title="Rotate Right">
|
||||
<RotateCw size="16" />
|
||||
</button>
|
||||
<div class="separator"></div>
|
||||
<button class="btn" onclick={fitToWidth} title="Reset">
|
||||
<AlignHorizontalSpaceAround size="16" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="canvas-container" bind:this={canvasContainerRef}>
|
||||
<canvas bind:this={canvasRef}></canvas>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.viewer-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
background: #1e1e1e;
|
||||
position: relative;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.loading-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 50;
|
||||
display: flex;
|
||||
flex-direction: column; /* Match the requested style */
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #111;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 2px solid rgba(255, 255, 255, 0.1);
|
||||
border-top-color: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 50%;
|
||||
animation: spin 0.6s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.error-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 40;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #111;
|
||||
color: #ef4444;
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
height: 50px;
|
||||
background: #000;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 16px;
|
||||
flex-shrink: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
opacity: 0.9;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
.controls {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.separator {
|
||||
width: 1px;
|
||||
height: 18px;
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 0;
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.separator {
|
||||
width: 1px;
|
||||
height: 24px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.canvas-container {
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-start; /* scroll from top */
|
||||
padding: 20px;
|
||||
background: #333; /* Dark background for contrast */
|
||||
}
|
||||
|
||||
canvas {
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
|
||||
max-width: none; /* Allow canvas to be larger than container */
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-corner {
|
||||
background: transparent;
|
||||
}
|
||||
</style>
|
||||
13
frontend/src/routes/pdf/+page.ts
Normal file
13
frontend/src/routes/pdf/+page.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
import type { PageLoad } from './$types';
|
||||
import { GetPDFViewerData } from "$lib/wailsjs/go/main/App";
|
||||
|
||||
export const load = (async () => {
|
||||
try {
|
||||
const data = await GetPDFViewerData();
|
||||
console.log("PDF Viewer Data:", data);
|
||||
return { data };
|
||||
} catch (error) {
|
||||
console.error("Error fetching pdf viewer data:", error);
|
||||
return { data: null };
|
||||
}
|
||||
}) satisfies PageLoad;
|
||||
BIN
frontend/static/appicon.png
Normal file
BIN
frontend/static/appicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 350 KiB |
@@ -10,5 +10,16 @@ export default defineConfig({
|
||||
sveltekit(),
|
||||
paraglideVitePlugin({ project: './project.inlang', outdir: './src/lib/paraglide'}),
|
||||
devtoolsJson()
|
||||
]
|
||||
],
|
||||
optimizeDeps: {
|
||||
esbuildOptions: {
|
||||
target: 'es2022',
|
||||
},
|
||||
},
|
||||
esbuild: {
|
||||
target: 'es2022',
|
||||
},
|
||||
build: {
|
||||
target: 'es2022',
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user