Dateien nach "/" hochladen
This commit is contained in:
70
index.html
Normal file
70
index.html
Normal file
@@ -0,0 +1,70 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>ZIR - Live Preview</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||
margin: 0; padding: 0;
|
||||
background-color: #f4f4f7; color: #333;
|
||||
display: flex; flex-direction: column; align-items: center; min-height: 100vh;
|
||||
}
|
||||
header {
|
||||
background-color: #0078d7; color: white; width: 100%;
|
||||
padding: 16px 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
text-align: center; font-size: 1.2rem; font-weight: 600;
|
||||
}
|
||||
main { flex: 1; display:flex; align-items:center; justify-content:center; width:100%; padding:20px; box-sizing:border-box; }
|
||||
.preview-container {
|
||||
background-color: white; padding: 16px; border-radius: 12px;
|
||||
box-shadow: 0 6px 18px rgba(0,0,0,0.08); max-width: 1000px; width: 100%; text-align: center; position: relative;
|
||||
}
|
||||
.preview-container img { border: 1px solid #e0e0e0; max-width: 100%; height: auto; border-radius: 8px; display: none; }
|
||||
.info { margin-top: 12px; font-size: 0.95rem; color: #555; }
|
||||
footer { padding: 12px 24px; text-align:center; font-size:0.8rem; color:#888; }
|
||||
.spinner { border:6px solid #f3f3f3; border-top:6px solid #0078d7; border-radius:50%; width:48px; height:48px; animation:spin 1s linear infinite; margin: 26px auto; }
|
||||
@keyframes spin { 0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)} }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>ZIR – Live Preview</header>
|
||||
<main>
|
||||
<div class="preview-container">
|
||||
<div class="spinner" id="spinner"></div>
|
||||
<img id="labelImage" src="" alt="Label preview" />
|
||||
<div class="info"><code id="inputPath"></code> Neue Labels werden automatisch angezeigt.</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer>© 2025 ZIR Viewer</footer>
|
||||
|
||||
<script>
|
||||
const { ipcRenderer, remote } = require('electron');
|
||||
const img = document.getElementById('labelImage');
|
||||
const spinner = document.getElementById('spinner');
|
||||
const inputPath = document.getElementById('inputPath');
|
||||
|
||||
// Zeige Input-Pfad (wird per ipc vom Main ggf. gesetzt)
|
||||
ipcRenderer.on('show-input-path', (ev, p) => {
|
||||
inputPath.textContent = p;
|
||||
});
|
||||
|
||||
ipcRenderer.on('show-png', (ev, filePath) => {
|
||||
spinner.style.display = 'block';
|
||||
img.style.display = 'none';
|
||||
img.src = filePath + "?t=" + Date.now();
|
||||
img.onload = () => {
|
||||
spinner.style.display = 'none';
|
||||
img.style.display = 'block';
|
||||
};
|
||||
img.onerror = () => {
|
||||
spinner.style.display = 'none';
|
||||
img.style.display = 'none';
|
||||
};
|
||||
});
|
||||
|
||||
// Request main to send input path (in case main wants to show it)
|
||||
ipcRenderer.send('request-input-path');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
244
main.js
Normal file
244
main.js
Normal file
@@ -0,0 +1,244 @@
|
||||
// main.js
|
||||
const { app, BrowserWindow } = require('electron');
|
||||
const fs = require("fs");
|
||||
const path = require("path");
|
||||
const chokidar = require("chokidar");
|
||||
const axios = require("axios");
|
||||
|
||||
let OUT_DIR; // endgültiger Eingangsordner (wird in app.whenReady gesetzt)
|
||||
let IMG_DIR; // Ausgabeordner für latest.png
|
||||
|
||||
let win;
|
||||
function createWindow() {
|
||||
win = new BrowserWindow({
|
||||
width: 1000,
|
||||
height: 800,
|
||||
webPreferences: { nodeIntegration: true, contextIsolation: false }
|
||||
});
|
||||
win.loadFile(path.join(__dirname, "index.html"));
|
||||
}
|
||||
|
||||
app.whenReady().then(() => {
|
||||
// Versuche zuerst C:\ZIR_Output (praktisch für Windows Local Port)
|
||||
const preferedRoot = "C:\\ZIR_Output";
|
||||
let dataDir = app.getPath("userData"); // fallback
|
||||
|
||||
try {
|
||||
// Versuch: C:\ZIR_Output anlegen (falls möglich)
|
||||
if (!fs.existsSync(preferedRoot)) {
|
||||
fs.mkdirSync(preferedRoot, { recursive: true });
|
||||
}
|
||||
OUT_DIR = preferedRoot;
|
||||
} catch (e) {
|
||||
// Falls es schiefgeht (Rechte), fallback in userData
|
||||
OUT_DIR = path.join(dataDir, "ZIR_Input");
|
||||
}
|
||||
|
||||
// IMG_DIR im userData (schützt vor Schreibrechten)
|
||||
IMG_DIR = path.join(dataDir, "zpl_out");
|
||||
|
||||
// Ordner anlegen, falls nicht existierend
|
||||
try { if (!fs.existsSync(OUT_DIR)) fs.mkdirSync(OUT_DIR, { recursive: true }); } catch(e) {}
|
||||
try { if (!fs.existsSync(IMG_DIR)) fs.mkdirSync(IMG_DIR, { recursive: true }); } catch(e) {}
|
||||
|
||||
console.log("ZIR Input (Eingangsordner):", OUT_DIR);
|
||||
console.log("ZIR Output (PNG-Ordner):", IMG_DIR);
|
||||
|
||||
createWindow();
|
||||
|
||||
const watcher = chokidar.watch(OUT_DIR, { ignoreInitial: true, awaitWriteFinish: {stabilityThreshold: 500, pollInterval: 100} });
|
||||
watcher.on("add", file => {
|
||||
if (!file.toLowerCase().endsWith(".zpl")) return;
|
||||
processFile(file);
|
||||
});
|
||||
watcher.on("change", file => {
|
||||
if (!file.toLowerCase().endsWith(".zpl")) return;
|
||||
processFile(file);
|
||||
});
|
||||
|
||||
app.on('activate', () => { if (BrowserWindow.getAllWindows().length === 0) createWindow(); });
|
||||
});
|
||||
|
||||
app.on('window-all-closed', () => { if (process.platform !== 'darwin') app.quit(); });
|
||||
|
||||
/* --- Helferfunktionen --- */
|
||||
|
||||
function extractZPL(raw) {
|
||||
const start = raw.indexOf("^XA");
|
||||
const end = raw.lastIndexOf("^XZ");
|
||||
if (start >= 0 && end >= 0 && end > start) return raw.slice(start, end + 3);
|
||||
if (start >= 0) return raw.slice(start) + (raw.includes("^XZ") ? "" : "^XZ");
|
||||
return "^XA\n" + raw + "\n^XZ";
|
||||
}
|
||||
|
||||
function cleanControlChars(s) {
|
||||
return s.replace(/[\x00-\x1F]/g, '');
|
||||
}
|
||||
|
||||
function parsePWLL(zpl) {
|
||||
const pwMatch = zpl.match(/\^PW\s*?(\d+)/i) || zpl.match(/\^PW(\d+)/i);
|
||||
const llMatch = zpl.match(/\^LL\s*?(\d+)/i) || zpl.match(/\^LL(\d+)/i);
|
||||
const pw = pwMatch ? parseInt(pwMatch[1], 10) : null;
|
||||
const ll = llMatch ? parseInt(llMatch[1], 10) : null;
|
||||
return { pw, ll };
|
||||
}
|
||||
|
||||
function parseMaxFO(zpl) {
|
||||
let maxX = 0, maxY = 0;
|
||||
const re = /\^FO\s*?(\d+)\s*,\s*(\d+)/g;
|
||||
let m;
|
||||
while ((m = re.exec(zpl)) !== null) {
|
||||
const x = parseInt(m[1], 10);
|
||||
const y = parseInt(m[2], 10);
|
||||
if (!isNaN(x) && x > maxX) maxX = x;
|
||||
if (!isNaN(y) && y > maxY) maxY = y;
|
||||
}
|
||||
return { maxX, maxY };
|
||||
}
|
||||
|
||||
function dotsToInches(dots, dpi) {
|
||||
if (!dots || !dpi) return null;
|
||||
return dots / dpi;
|
||||
}
|
||||
|
||||
function fmtInches(v) {
|
||||
return (Math.round(v * 100) / 100).toString();
|
||||
}
|
||||
|
||||
async function tryLabelaryRender(zpl, printerKey, widthInches, heightInches) {
|
||||
const url = `http://api.labelary.com/v1/printers/${printerKey}/labels/${widthInches}x${heightInches}/0/`;
|
||||
try {
|
||||
const resp = await axios.post(url, zpl, {
|
||||
headers: { "Accept": "image/png" },
|
||||
responseType: "arraybuffer",
|
||||
timeout: 15000
|
||||
});
|
||||
return { ok: true, buffer: resp.data };
|
||||
} catch (err) {
|
||||
const status = err.response ? err.response.status : null;
|
||||
return { ok: false, status, error: err.message };
|
||||
}
|
||||
}
|
||||
|
||||
/* --- Größen & Druckeroptionen --- */
|
||||
|
||||
const STANDARD_SIZES = [
|
||||
{ w: 8.27, h: 11.69, name: "A4" },
|
||||
{ w: 8.5, h: 11, name: "Letter" },
|
||||
{ w: 4, h: 6, name: "4x6" },
|
||||
{ w: 3, h: 2, name: "3x2" },
|
||||
{ w: 4, h: 3, name: "4x3" },
|
||||
{ w: 2, h: 6, name: "2x6" },
|
||||
{ w: 1, h: 1, name: "1x1" }
|
||||
];
|
||||
|
||||
const PRINTER_OPTIONS = [
|
||||
{ key: "8dpmm", dpi: 203 },
|
||||
{ key: "12dpmm", dpi: 305 }
|
||||
];
|
||||
|
||||
/* --- Hauptverarbeitung --- */
|
||||
let busy = false;
|
||||
async function processFile(filePath) {
|
||||
if (busy) {
|
||||
setTimeout(() => processFile(filePath), 400);
|
||||
return;
|
||||
}
|
||||
busy = true;
|
||||
|
||||
try {
|
||||
console.log("Verarbeite:", filePath);
|
||||
let raw = fs.readFileSync(filePath, "utf-8");
|
||||
raw = cleanControlChars(raw);
|
||||
let zpl = extractZPL(raw);
|
||||
|
||||
const { pw, ll } = parsePWLL(zpl);
|
||||
const { maxX, maxY } = parseMaxFO(zpl);
|
||||
console.log("Parsed PW/LL:", pw, ll, "maxFO:", maxX, maxY);
|
||||
|
||||
// sizesToTry aufbauen (Priorität: PW/LL -> geschätzte große Formate -> Standardgrößen)
|
||||
const sizesToTry = [];
|
||||
|
||||
if (pw && ll) {
|
||||
for (const p of PRINTER_OPTIONS) {
|
||||
const wIn = dotsToInches(pw, p.dpi);
|
||||
const hIn = dotsToInches(ll, p.dpi);
|
||||
if (wIn && hIn) {
|
||||
sizesToTry.push({ w: wIn, h: hIn, printer: p });
|
||||
sizesToTry.push({ w: hIn, h: wIn, printer: p, rotated: true });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const estDefaultDPI = 203;
|
||||
const estWIn = maxX ? dotsToInches(maxX + 100, estDefaultDPI) : null; // margin
|
||||
const estHIn = maxY ? dotsToInches(maxY + 100, estDefaultDPI) : null;
|
||||
|
||||
if (estWIn && estHIn) {
|
||||
if (estWIn > 6 || estHIn > 8 || estWIn > 8 || estHIn > 6) {
|
||||
for (const p of PRINTER_OPTIONS) {
|
||||
sizesToTry.push({ w: 8.27, h: 11.69, printer: p, name: "A4" });
|
||||
sizesToTry.push({ w: 11.69, h: 8.27, printer: p, name: "A4_rot" });
|
||||
sizesToTry.push({ w: 8.5, h: 11, printer: p, name: "Letter" });
|
||||
sizesToTry.push({ w: 11, h: 8.5, printer: p, name: "Letter_rot" });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (const p of PRINTER_OPTIONS) {
|
||||
for (const s of STANDARD_SIZES) {
|
||||
const exists = sizesToTry.some(x => Math.abs(x.w - s.w) < 0.01 && Math.abs(x.h - s.h) < 0.01 && x.printer.key === p.key);
|
||||
if (!exists) sizesToTry.push({ w: s.w, h: s.h, printer: p, name: s.name || `${s.w}x${s.h}` });
|
||||
}
|
||||
}
|
||||
|
||||
// Duplikate entfernen & Reihenfolge behalten
|
||||
const uniqSizes = [];
|
||||
const seen = new Set();
|
||||
for (const s of sizesToTry) {
|
||||
const key = `${s.printer.key}-${Math.round(s.w*100)}/${Math.round(s.h*100)}`;
|
||||
if (!seen.has(key)) { seen.add(key); uniqSizes.push(s); }
|
||||
}
|
||||
|
||||
// Versuche rendern
|
||||
let renderResult = null;
|
||||
for (const s of uniqSizes) {
|
||||
const wStr = fmtInches(s.w);
|
||||
const hStr = fmtInches(s.h);
|
||||
console.log(`Versuche rendern: printer=${s.printer.key} size=${wStr}x${hStr} (${s.name || ""})`);
|
||||
renderResult = await tryLabelaryRender(zpl, s.printer.key, wStr, hStr);
|
||||
if (renderResult.ok) { console.log(`Erfolg mit ${s.printer.key} ${wStr}x${hStr}`); break; }
|
||||
else { console.log(`Fehler (${renderResult.status}) mit ${s.printer.key} ${wStr}x${hStr}`); }
|
||||
}
|
||||
|
||||
if (!renderResult || !renderResult.ok) {
|
||||
console.error("Alle Render-Versuche fehlgeschlagen, Abbruch.");
|
||||
busy = false;
|
||||
return;
|
||||
}
|
||||
|
||||
// PNG speichern (latest.png) — alte PNGs löschen
|
||||
const pngBuffer = renderResult.buffer;
|
||||
try {
|
||||
fs.readdirSync(IMG_DIR).forEach(f => {
|
||||
const fileToDelete = path.join(IMG_DIR, f);
|
||||
try { if (fs.lstatSync(fileToDelete).isFile()) fs.unlinkSync(fileToDelete); } catch(e){}
|
||||
});
|
||||
} catch(e){}
|
||||
|
||||
const outFile = path.join(IMG_DIR, "latest.png");
|
||||
fs.writeFileSync(outFile, pngBuffer);
|
||||
console.log("PNG erstellt:", outFile);
|
||||
|
||||
// verarbeitete ZPL-Datei löschen (optional)
|
||||
try { fs.unlinkSync(filePath); } catch(e){ console.warn("Konnte ZPL nicht löschen:", e.message); }
|
||||
|
||||
// Fenster benachrichtigen
|
||||
win.webContents.send("show-png", outFile);
|
||||
|
||||
} catch (err) {
|
||||
console.error("Fehler beim Rendern:", err && err.message ? err.message : err);
|
||||
} finally {
|
||||
busy = false;
|
||||
}
|
||||
}
|
||||
4310
package-lock.json
generated
Normal file
4310
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
34
package.json
Normal file
34
package.json
Normal file
@@ -0,0 +1,34 @@
|
||||
{
|
||||
"name": "zir-viewer",
|
||||
"version": "1.0.0",
|
||||
"description": "ZIR - Virtueller ZPL Live-Preview",
|
||||
"author": "Viper",
|
||||
"main": "main.js",
|
||||
"scripts": {
|
||||
"start": "electron .",
|
||||
"dist": "electron-builder --win portable"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^1.6.0",
|
||||
"chokidar": "^3.5.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"electron": "^26.6.10",
|
||||
"electron-builder": "^24.13.3"
|
||||
},
|
||||
"build": {
|
||||
"appId": "com.viper.zirviewer",
|
||||
"productName": "ZIR Viewer",
|
||||
"directories": {
|
||||
"output": "dist"
|
||||
},
|
||||
"files": [
|
||||
"**/*"
|
||||
],
|
||||
"win": {
|
||||
"target": [
|
||||
"portable"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user