scan2form 1.1.1 → 1.2.0

package/README.md

@@ -19,10 +19,27 @@ import { Scan2Form } from 'scan2form';
 
 const scanner = new Scan2Form();
 
-// Triggers the scan and puts the file into <input type="file" id="my-input" style="display: none;"/>
+// Triggers the scan and puts the file into <input type="file" id="my-input" />
 await scanner.scanToInput('my-input');
+
+// OR use the new advanced options (Images & Preview)
+await scanner.scan({
+    targetInputId: 'my-input',
+    format: 'jpeg', // 'pdf' | 'jpeg' | 'png' | 'jpg'
+    previewElementId: 'scan-preview' // ID of an <img>, <iframe>, <object>, or <embed> tag
+});
 ```
 
+## 🖼️ Supported Formats & Preview
+**Scan2Form** now supports multiple formats:
+*   **PDF** (Default)
+*   **JPEG / JPG**
+*   **PNG**
+
+To preview a scan immediately, simply provide the ID of an HTML element in `previewElementId`.
+*   For images, use an `<img>` tag.
+*   For PDFs, use `<iframe>`, `<embed>`, or `<object>`.
+
 That's it! The file input is now populated with a PDF, just as if the user uploaded it manually.
 
 ---
@@ -58,6 +75,11 @@ npx scan2form-server
 *   Keep this running while scanning.
 *   It runs locally at `http://127.0.0.1:3000`.
 
+**Alternative:**
+We've included shortcut scripts in the package. If you have the files locally:
+*   **Windows:** Double-click `start-server.bat`
+*   **Mac/Linux:** Run `./start-server.sh`
+
 ---
 
 ## 🛠️ System Requirements

package/dist/bridge-server.js

@@ -80,49 +80,59 @@ app.get('/devices', (req, res) => {
 });
 app.post('/scan', async (req, res) => {
     const scanId = (0, uuid_1.v4)();
-    const finalPdfPath = path_1.default.join(TEMP_DIR, `scan_${scanId}.pdf`);
+    // Default to PDF if not specified
+    const format = (req.body.format || 'pdf').toLowerCase();
+    // Usage: format can be 'pdf', 'jpg', 'jpeg', 'png'
+    const allowedFormats = ['pdf', 'jpg', 'jpeg', 'png'];
+    if (!allowedFormats.includes(format)) {
+        return res.status(400).json({ error: "Invalid format. Supported: pdf, jpg, png" });
+    }
+    // Map format to file extension
+    const ext = format === 'jpeg' ? 'jpg' : format;
+    const finalFilePath = path_1.default.join(TEMP_DIR, `scan_${scanId}.${ext}`);
     getScannerEngine((engine) => {
         if (!engine) {
             return res.status(500).json({ error: "No scanner software installed (NAPS2 or SANE)." });
         }
         if (engine === 'naps2') {
-            const cmd = `naps2.console -o "${finalPdfPath}" -v`;
-            console.log(`Scanning with NAPS2: ${cmd}`);
+            // NAPS2 detects format by extension
+            const cmd = `naps2.console -o "${finalFilePath}" -v`;
+            console.log(`Scanning with NAPS2 (${format}): ${cmd}`);
             (0, child_process_1.exec)(cmd, (error, stdout, stderr) => {
                 if (error) {
                     console.error(`NAPS2 Error: ${error.message}`);
-                    // Return the actual error details to the client
                     const errorDetail = stderr || error.message;
                     return res.status(500).json({ error: "Scan failed", details: errorDetail });
                 }
-                if (fs_1.default.existsSync(finalPdfPath)) {
-                    res.sendFile(finalPdfPath, () => {
-                        fs_1.default.unlink(finalPdfPath, (err) => { if (err)
+                if (fs_1.default.existsSync(finalFilePath)) {
+                    res.sendFile(finalFilePath, () => {
+                        fs_1.default.unlink(finalFilePath, (err) => { if (err)
                             console.error("Cleanup error:", err); });
                     });
                 }
                 else {
-                    res.status(500).json({ error: "Scan completed but PDF not found.", details: "Output file missing." });
+                    res.status(500).json({ error: "Scan completed but file not found.", details: "Output file missing." });
                 }
             });
         }
         else if (engine === 'sane') {
-            // SANE flow: scanimage -> tiff -> sips -> pdf
+            // SANE flow: scanimage -> tiff -> sips -> target format
             const tempTiffPath = path_1.default.join(TEMP_DIR, `scan_${scanId}.tiff`);
-            // Default to batch access or single scan. `scanimage --format=tiff > output.tiff`
             const cmd = `scanimage --format=tiff --mode Color --resolution 300 > "${tempTiffPath}"`;
             console.log(`Scanning with SANE: ${cmd}`);
             (0, child_process_1.exec)(cmd, (error, stdout, stderr) => {
                 if (error) {
-                    // scanimage writes progress to stderr, so it might not be a real error unless exit code != 0.
-                    // But exec gives error on non-zero exit.
                     console.error(`SANE Error: ${error.message}`);
                     const errorDetail = stderr || error.message;
                     return res.status(500).json({ error: "Scan failed", details: errorDetail });
                 }
-                // Convert TIFF to PDF using Mac's 'sips' or ImageMagick 'convert'
-                // Since we are targeting Mac fallback, we use 'sips'
-                const convertCmd = `sips -s format pdf "${tempTiffPath}" --out "${finalPdfPath}"`;
+                // Convert TIFF to Target Format using 'sips'
+                // sips support: pdf, jpeg, png
+                let sipsFormat = format;
+                if (format === 'jpg')
+                    sipsFormat = 'jpeg';
+                const convertCmd = `sips -s format ${sipsFormat} "${tempTiffPath}" --out "${finalFilePath}"`;
+                console.log(`Converting: ${convertCmd}`);
                 (0, child_process_1.exec)(convertCmd, (cErr, cOut, cStderr) => {
                     // Cleanup TIFF immediately
                     if (fs_1.default.existsSync(tempTiffPath))
@@ -131,14 +141,14 @@ app.post('/scan', async (req, res) => {
                         console.error(`Conversion Error: ${cStderr}`);
                         return res.status(500).json({ error: "Image conversion failed" });
                     }
-                    if (fs_1.default.existsSync(finalPdfPath)) {
-                        res.sendFile(finalPdfPath, () => {
-                            fs_1.default.unlink(finalPdfPath, (err) => { if (err)
+                    if (fs_1.default.existsSync(finalFilePath)) {
+                        res.sendFile(finalFilePath, () => {
+                            fs_1.default.unlink(finalFilePath, (err) => { if (err)
                                 console.error("Cleanup error:", err); });
                         });
                     }
                     else {
-                        res.status(500).json({ error: "Conversion completed but PDF not found." });
+                        res.status(500).json({ error: "Conversion completed but file not found." });
                     }
                 });
             });

package/dist/esm/scanner-client.js

@@ -26,29 +26,77 @@ export class Scan2Form {
         }
     }
     // Rule 5.2 & 5.3: Trigger Scan & Receive Blob
-    async scanToInput(inputId) {
-        const inputElement = document.getElementById(inputId);
-        if (!inputElement)
-            throw new Error("Input element not found");
+    async scan(options) {
+        // Backward compatibility: if string, treat as inputId
+        let config = {};
+        if (typeof options === 'string') {
+            config = { targetInputId: options, format: 'pdf' };
+        }
+        else {
+            config = { format: 'pdf', ...options };
+        }
         try {
-            const response = await fetch(`${this.bridgeUrl}/scan`, { method: 'POST' });
-            if (!response.ok)
-                throw new Error("Scan failed or cancelled at device");
+            const response = await fetch(`${this.bridgeUrl}/scan`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ format: config.format })
+            });
+            if (!response.ok) {
+                const errData = await response.json();
+                throw new Error(errData.details || "Scan failed or cancelled");
+            }
             const blob = await response.blob();
+            // Determine mime type based on format or blob
+            const mimeType = blob.type || (config.format === 'pdf' ? 'application/pdf' : `image/${config.format}`);
             // Rule 5.4: Inject into DataTransfer
-            const file = new File([blob], `scanned_doc_${Date.now()}.pdf`, { type: 'application/pdf' });
-            const dataTransfer = new DataTransfer();
-            dataTransfer.items.add(file);
-            inputElement.files = dataTransfer.files;
-            // Trigger change event so frameworks (React/Vue) detect the update
-            inputElement.dispatchEvent(new Event('change', { bubbles: true }));
+            const ext = config.format === 'jpeg' ? 'jpg' : config.format;
+            const file = new File([blob], `scanned_doc_${Date.now()}.${ext}`, { type: mimeType });
+            // Handle Input Population
+            if (config.targetInputId) {
+                const inputElement = document.getElementById(config.targetInputId);
+                if (inputElement) {
+                    const dataTransfer = new DataTransfer();
+                    dataTransfer.items.add(file);
+                    inputElement.files = dataTransfer.files;
+                    inputElement.dispatchEvent(new Event('change', { bubbles: true }));
+                }
+            }
+            // Handle Preview
+            if (config.previewElementId) {
+                this.handlePreview(config.previewElementId, file);
+            }
             return { success: true, file: file };
         }
         catch (error) {
             console.error("Scan2Form Error:", error);
-            // Alerting might be annoying in a library, maybe optional? Leaving as is for now but usually libraries shouldn't alert.
-            // alert("Ensure Scan2Form Bridge is running!"); 
             return { success: false, error: error.message || "An unknown error occurred during scan." };
         }
     }
+    /**
+     * Alias for scan() to maintain backward compatibility, but now supports options.
+     */
+    async scanToInput(inputIdOrOptions) {
+        return this.scan(inputIdOrOptions);
+    }
+    handlePreview(elementId, file) {
+        const el = document.getElementById(elementId);
+        if (!el)
+            return;
+        const url = URL.createObjectURL(file);
+        const tagName = el.tagName.toLowerCase();
+        if (tagName === 'img') {
+            el.src = url;
+        }
+        else if (tagName === 'iframe') {
+            el.src = url;
+        }
+        else if (tagName === 'embed') {
+            el.src = url;
+            el.type = file.type;
+        }
+        else if (tagName === 'object') {
+            el.data = url;
+            el.type = file.type;
+        }
+    }
 }

package/dist/scanner-client.js

@@ -29,30 +29,78 @@ class Scan2Form {
         }
     }
     // Rule 5.2 & 5.3: Trigger Scan & Receive Blob
-    async scanToInput(inputId) {
-        const inputElement = document.getElementById(inputId);
-        if (!inputElement)
-            throw new Error("Input element not found");
+    async scan(options) {
+        // Backward compatibility: if string, treat as inputId
+        let config = {};
+        if (typeof options === 'string') {
+            config = { targetInputId: options, format: 'pdf' };
+        }
+        else {
+            config = { format: 'pdf', ...options };
+        }
         try {
-            const response = await fetch(`${this.bridgeUrl}/scan`, { method: 'POST' });
-            if (!response.ok)
-                throw new Error("Scan failed or cancelled at device");
+            const response = await fetch(`${this.bridgeUrl}/scan`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ format: config.format })
+            });
+            if (!response.ok) {
+                const errData = await response.json();
+                throw new Error(errData.details || "Scan failed or cancelled");
+            }
             const blob = await response.blob();
+            // Determine mime type based on format or blob
+            const mimeType = blob.type || (config.format === 'pdf' ? 'application/pdf' : `image/${config.format}`);
             // Rule 5.4: Inject into DataTransfer
-            const file = new File([blob], `scanned_doc_${Date.now()}.pdf`, { type: 'application/pdf' });
-            const dataTransfer = new DataTransfer();
-            dataTransfer.items.add(file);
-            inputElement.files = dataTransfer.files;
-            // Trigger change event so frameworks (React/Vue) detect the update
-            inputElement.dispatchEvent(new Event('change', { bubbles: true }));
+            const ext = config.format === 'jpeg' ? 'jpg' : config.format;
+            const file = new File([blob], `scanned_doc_${Date.now()}.${ext}`, { type: mimeType });
+            // Handle Input Population
+            if (config.targetInputId) {
+                const inputElement = document.getElementById(config.targetInputId);
+                if (inputElement) {
+                    const dataTransfer = new DataTransfer();
+                    dataTransfer.items.add(file);
+                    inputElement.files = dataTransfer.files;
+                    inputElement.dispatchEvent(new Event('change', { bubbles: true }));
+                }
+            }
+            // Handle Preview
+            if (config.previewElementId) {
+                this.handlePreview(config.previewElementId, file);
+            }
             return { success: true, file: file };
         }
         catch (error) {
             console.error("Scan2Form Error:", error);
-            // Alerting might be annoying in a library, maybe optional? Leaving as is for now but usually libraries shouldn't alert.
-            // alert("Ensure Scan2Form Bridge is running!"); 
             return { success: false, error: error.message || "An unknown error occurred during scan." };
         }
     }
+    /**
+     * Alias for scan() to maintain backward compatibility, but now supports options.
+     */
+    async scanToInput(inputIdOrOptions) {
+        return this.scan(inputIdOrOptions);
+    }
+    handlePreview(elementId, file) {
+        const el = document.getElementById(elementId);
+        if (!el)
+            return;
+        const url = URL.createObjectURL(file);
+        const tagName = el.tagName.toLowerCase();
+        if (tagName === 'img') {
+            el.src = url;
+        }
+        else if (tagName === 'iframe') {
+            el.src = url;
+        }
+        else if (tagName === 'embed') {
+            el.src = url;
+            el.type = file.type;
+        }
+        else if (tagName === 'object') {
+            el.data = url;
+            el.type = file.type;
+        }
+    }
 }
 exports.Scan2Form = Scan2Form;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "scan2form",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "Local offline bridge allowing web browsers to access physical scanners (WIA, TWAIN, SANE).",
   "main": "dist/scanner-client.js",
   "scripts": {
@@ -18,7 +18,9 @@
   "files": [
     "dist",
     "README.md",
-    "LICENSE"
+    "LICENSE",
+    "start-server.bat",
+    "start-server.sh"
   ],
   "keywords": [
     "scanner",

package/start-server.bat

@@ -0,0 +1,4 @@
+@echo off
+echo Starting Scan2Form Server...
+call npx scan2form-server
+pause

package/start-server.sh

@@ -0,0 +1,3 @@
+#!/bin/bash
+echo "Starting Scan2Form Server..."
+npx scan2form-server