Updates

2026-03-04 17:35:14 +01:00
parent f73b56cdc4
commit db26e26495
113 changed files with 12433 additions and 169 deletions
@@ -0,0 +1,59 @@
+export type FileInputToBase64FunctionReturn = {
+    fileBase64?: string;
+    fileBase64Full?: string;
+    fileName?: string;
+    fileSize?: number;
+    fileType?: string;
+    file?: File;
+};
+
+export type FileInputToBase64FunctioParam = {
+    inputFile: File;
+    allowedRegex?: RegExp;
+};
+
+export default async function fileInputToBase64({
+    inputFile,
+    allowedRegex,
+}: FileInputToBase64FunctioParam): Promise<FileInputToBase64FunctionReturn> {
+    const allowedTypesRegex = allowedRegex ? allowedRegex : undefined;
+
+    if (allowedTypesRegex && !inputFile?.type?.match(allowedTypesRegex)) {
+        window.alert(`We currently don't support ${inputFile.type} file type.`);
+        return { fileName: inputFile.name };
+    }
+
+    let fileName = inputFile.name?.replace(/\..*/, "");
+    const file = inputFile;
+
+    try {
+        const fileData: string | undefined = await new Promise(
+            (resolve, reject) => {
+                var reader = new FileReader();
+                reader.readAsDataURL(inputFile);
+                reader.onload = function () {
+                    resolve(reader.result?.toString());
+                };
+                reader.onerror = function (/** @type {*} */ error: any) {
+                    console.log("File Input to Base64 Error: ", error.message);
+                };
+            }
+        );
+
+        return {
+            fileBase64: fileData?.replace(/.*?base64,/, ""),
+            fileBase64Full: fileData,
+            fileName: fileName,
+            fileSize: inputFile.size,
+            fileType: inputFile.type,
+            file,
+        };
+    } catch (error: any) {
+        console.log("File Processing Error! =>", error.message);
+
+        return {
+            fileName: inputFile.name,
+            file,
+        };
+    }
+}
@@ -0,0 +1,92 @@
+export type ImageInputToBase64FunctionReturn = {
+    imageBase64?: string;
+    imageBase64Full?: string;
+    imageName?: string;
+    imageType?: string;
+};
+
+export type ImageInputToBase64FunctioParam = {
+    imageInput?: HTMLInputElement;
+    maxWidth?: number;
+    mimeType?: string;
+    file?: File;
+};
+
+export default async function imageInputToBase64({
+    imageInput,
+    maxWidth,
+    mimeType,
+    file,
+}: ImageInputToBase64FunctioParam): Promise<ImageInputToBase64FunctionReturn> {
+    try {
+        const finalFile = file || imageInput?.files?.[0];
+
+        if (!finalFile) {
+            throw new Error("No Files found");
+        }
+
+        let imageName = finalFile.name.replace(/\..*/, "");
+
+        let imageDataBase64: string | undefined;
+
+        const MIME_TYPE = mimeType ? mimeType : finalFile.type;
+        const QUALITY = 0.95;
+        const MAX_WIDTH = maxWidth ? maxWidth : null;
+
+        const blobURL = URL.createObjectURL(finalFile);
+        const img = new Image();
+
+        img.src = blobURL;
+
+        imageDataBase64 = await new Promise((res, rej) => {
+            img.onerror = function () {
+                URL.revokeObjectURL(this.src);
+                window.alert("Cannot load image!");
+            };
+
+            img.onload = function () {
+                URL.revokeObjectURL(img.src);
+
+                const canvas = document.createElement("canvas");
+
+                if (MAX_WIDTH) {
+                    const scaleSize = MAX_WIDTH / img.naturalWidth;
+
+                    canvas.width =
+                        img.naturalWidth < MAX_WIDTH
+                            ? img.naturalWidth
+                            : MAX_WIDTH;
+                    canvas.height =
+                        img.naturalWidth < MAX_WIDTH
+                            ? img.naturalHeight
+                            : img.naturalHeight * scaleSize;
+                } else {
+                    canvas.width = img.naturalWidth;
+                    canvas.height = img.naturalHeight;
+                }
+
+                const ctx = canvas.getContext("2d");
+                ctx?.drawImage(img, 0, 0, canvas.width, canvas.height);
+
+                const srcEncoded = canvas.toDataURL(MIME_TYPE, QUALITY);
+
+                res(srcEncoded);
+            };
+        });
+
+        return {
+            imageBase64: imageDataBase64?.replace(/.*?base64,/, ""),
+            imageBase64Full: imageDataBase64,
+            imageName: imageName,
+            imageType: MIME_TYPE,
+        };
+    } catch (error: any) {
+        console.log("Image Processing Error! =>", error.message);
+
+        return {
+            imageBase64: undefined,
+            imageBase64Full: undefined,
+            imageName: undefined,
+        };
+    }
+}