lukas/mimaki
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add webui

Browse Source
This commit is contained in:
Lukas Cremer
2026-02-03 22:41:29 +01:00
parent b421b199ca
commit cd846577a4
13 changed files with 1180 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
webui/templates/index.html Normal file
View File

@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HPGL Plotter</title>
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
<div class="app">
<header class="header">
<h1>HPGL Plotter</h1>
<div class="status" id="status">
<span class="status-file" id="statusFile">No file</span>
<span class="status-plotter" id="statusPlotter">Plotter: —</span>
</div>
</header>
<main class="main">
<aside class="sidebar">
<section class="upload-section">
<label class="upload-label" for="fileInput">Upload HPGL</label>
<input type="file" id="fileInput" accept=".hpgl,.plt" class="file-input">
<p class="hint">.hpgl or .plt files only</p>
</section>
<section class="scale-section">
<h2>Size (plotter units)</h2>
<p id="scaleDims" class="dims">— × — <span class="unit">(≈ — × — mm)</span></p>
</section>
<section class="transform-section">
<h2>Transform</h2>
<div class="btn-group">
<button type="button" class="btn" id="btnFlip" disabled>Flip</button>
<button type="button" class="btn" id="btnRotate90" disabled>Rotate 90°</button>
<button type="button" class="btn" id="btnRotate180" disabled>Rotate 180°</button>
<button type="button" class="btn" id="btnScaleUp" disabled>Scale +</button>
<button type="button" class="btn" id="btnScaleDown" disabled>Scale −</button>
<button type="button" class="btn" id="btnCentralize" disabled>Center</button>
<button type="button" class="btn" id="btnScaleToBounds" disabled>Scale to bounds</button>
</div>
</section>
<section class="print-section">
<button type="button" class="btn btn-print" id="btnPrint" disabled>Print to plotter</button>
<button type="button" class="btn btn-check-plotter" id="btnCheckPlotter">Check plotter</button>
<p id="printMessage" class="message"></p>
<div class="plotter-info" id="plotterInfo">
<p class="plotter-info-row"><strong>Port</strong> <span id="plotterPort">—</span></p>
<p class="plotter-info-row"><strong>Baudrate</strong> <span id="plotterBaud">—</span></p>
<p class="plotter-info-row"><strong>Media (units)</strong> <span id="plotterWinsizeUnits">— × —</span></p>
<p class="plotter-info-row"><strong>Media (mm)</strong> <span id="plotterWinsizeMm">— × —</span></p>
<p class="plotter-info-row"><strong>Bounds</strong> <span id="plotterBounds">—</span></p>
</div>
</section>
</aside>
<section class="preview-section">
<div class="preview-wrap">
<img id="preview" class="preview" alt="HPGL preview" src="" />
<div id="previewPlaceholder" class="preview-placeholder">
Upload an HPGL file to preview
</div>
</div>
</section>
</main>
</div>
<script src="/static/app.js"></script>
</body>
</html>