Esc/Pos Support

erikn69 · Dec 13, 2023 · bbb0943 · bbb0943
1 parent 43699f3
commit bbb0943
Show file tree

Hide file tree

Showing 17 changed files with 569 additions and 438 deletions.
diff --git a/README.md b/README.md
@@ -1,33 +1,44 @@
-# ZplPrinter
+# Zpl - Esc/Pos Printer
 
-Printer emulator for zpl rendering engine. The emulator is based on the [labelary](http://labelary.com/service.html) web service. You can configure print density, label size and the tcp server to listen for any incoming labels.
+Printer emulator for Zpl, Esc/Pos rendering engine. The emulator is based on the [labelary](http://labelary.com/service.html) web service.
+You can configure print density, label size and the tcp server to listen for any incoming labels.
 
-[Releases](https://github.com/erikn69/ZplPrinter/releases/latest)
+[Releases](https://github.com/erikn69/ZplEscPrinter/releases/latest)
 
-## New in Version 2.0
+## New in Version 3.0
 
-The app now runs standalone via Electron and can be installed via the binaries/zips on the GitHub Releases page. It currently supports:
+The app now emulates Epson ESC/POS. The emulator is based on the [receipt-print-hq/escpos-tools](https://github.com/receipt-print-hq/escpos-tools/blob/master/esc2html.php) repo by @mike42, and can be installed via the binaries/zips on the GitHub Releases page. It currently supports
 
 * Windows:
-  * Squarrel installer (zpl-printer-**version**-win32-**arch**-setup.exe)
-  * Portable runner (zpl-printer-portable-**version**.exe)
-  * NuGet package (zpl-printer-**version**-full.nupkg)
+  * Squarrel installer (zpl-escpos-printer-**version**-win32-**arch**-setup.exe)
+  * Portable runner (zpl-escpos-printer-portable-**version**.exe)
+  * NuGet package (zpl-escpos-printer-**version**-full.nupkg)
   * msi installer (TODO)
 * Linux:
-  * Rpm (zpl-printer-**version**.**arch**.rpm)
-  * Deb (zpl-printer\_**version**\_**arch**.deb)
-  * Zip (Zpl.Printer-linux-**arch**-**version**.zip)
+  * Rpm (zpl-escpos-printer-**version**.**arch**.rpm)
+  * Deb (zpl-escpos-printer\_**version**\_**arch**.deb)
+  * Zip (Zpl-EscPos.Printer-linux-**arch**-**version**.zip)
 * Mac:
-  * Zip (Zpl.Printer-darwin-**arch**-**version**.zip)
+  * Zip (Zpl-EscPos.Printer-darwin-**arch**-**version**.zip)
+
+## New in Version 2.0
+
+The app now runs standalone via Electron.
 
 ## References
 * [ZPL Command Support](http://labelary.com/docs.html)
 * [ZPL Web Service](http://labelary.com/service.html)
 * [Electron](https://www.electronjs.org)
 * [Electron Forge](https://www.electronforge.io)
+* [Esc/Pos receipt print tools](https://github.com/receipt-print-hq/escpos-tools)
 
 ## Release notes
 
+### Version 3.0
+* **Refactor** Reworked code
+* **New** Esc/Pos Support
+* **Fix** Bug fixes
+
 ### Version 2.2
 * **Refactor** Reworked code
 * **Upgrade** Bump dependencies

diff --git a/ZplPrinter/css/style.css → ZplEscPrinter/css/style.css b/ZplPrinter/css/style.css → ZplEscPrinter/css/style.css
@@ -5,7 +5,16 @@
     display: none;
 }
 
-img.thumbnail {
+.panel-heading-blur {
+    background-color: #445da5 !important;
+    border-color: #215480 !important;
+}
+
+.label-container {
+    height: 82vh;
+}
+
+.label-zpl {
     margin: 5px 0px 20px 5px;
 }
 

diff --git a/ZplPrinter/icons/Icon-128.png → ZplEscPrinter/icons/Icon-128.png b/ZplPrinter/icons/Icon-128.png → ZplEscPrinter/icons/Icon-128.png
diff --git a/ZplPrinter/icons/Icon-16-white.png → ZplEscPrinter/icons/Icon-16-white.png b/ZplPrinter/icons/Icon-16-white.png → ZplEscPrinter/icons/Icon-16-white.png
diff --git a/ZplPrinter/icons/Icon-16.png → ZplEscPrinter/icons/Icon-16.png b/ZplPrinter/icons/Icon-16.png → ZplEscPrinter/icons/Icon-16.png
diff --git a/ZplPrinter/icons/Icon-24.png → ZplEscPrinter/icons/Icon-24.png b/ZplPrinter/icons/Icon-24.png → ZplEscPrinter/icons/Icon-24.png
diff --git a/ZplPrinter/icons/Icon-32.png → ZplEscPrinter/icons/Icon-32.png b/ZplPrinter/icons/Icon-32.png → ZplEscPrinter/icons/Icon-32.png
diff --git a/ZplPrinter/icons/Icon-64.png → ZplEscPrinter/icons/Icon-64.png b/ZplPrinter/icons/Icon-64.png → ZplEscPrinter/icons/Icon-64.png
diff --git a/ZplPrinter/icons/icon-1024.png → ZplEscPrinter/icons/icon-1024.png b/ZplPrinter/icons/icon-1024.png → ZplEscPrinter/icons/icon-1024.png
diff --git a/ZplPrinter/icons/icon.svg → ZplEscPrinter/icons/icon.svg b/ZplPrinter/icons/icon.svg → ZplEscPrinter/icons/icon.svg
diff --git a/ZplEscPrinter/js/main.js b/ZplEscPrinter/js/main.js
diff --git a/ZplPrinter/main.html → ZplEscPrinter/main.html b/ZplPrinter/main.html → ZplEscPrinter/main.html
@@ -8,15 +8,15 @@
 
 <body class="p-0 m-0">
     <div class="card border-0 rounded-0 h-100 w-100 mb-0">
-        <div class="card-header text-bg-primary rounded-0">
+        <div id="panel-head" class="card-header text-bg-primary rounded-0" style="-webkit-app-region: drag;">
             <img src="icons/Icon-16-white.png" class="me-2">
             <b><span class='panel-printer-title'>Zpl</span> Printer</b> - EN Systems</span>
-            <button id="btn-close" type="button" class="btn-close float-end" aria-label="Close"></button>
+            <button id="btn-close" type="button" class="btn-close float-end" aria-label="Close" style="-webkit-app-region: no-drag;"></button>
         </div>
         <div class="card-body pb-0 mb-0">
-            <nav class="navbar navbar-light bg-light border rounded pb-1 pt-1 ps-2 pe-2 mb-3">
-                <div class="d-flex float-start mb-0">
-                    <div id='printer-type' class="btn-group invisible" role="group" aria-label="Printer Type" style="width:1px !important;">
+            <nav class="navbar navbar-light bg-light border rounded pb-0 pt-1 ps-2 pe-2 mb-3">
+                <div class="d-flex float-start mb-1">
+                    <div id='printer-type' class="btn-group" role="group" aria-label="Printer Type">
                         <input id="isZpl" name="printer-type" type="radio" class="btn-check" autocomplete="off">
                         <label class="btn btn-outline-primary" for="isZpl" title="Zpl Printer">ZPL</label>
 
@@ -27,7 +27,7 @@
                         <i class="glyphicon glyphicon-send"></i>
                     </button>
                 </div>
-                <div class="d-flex float-end mb-0">
+                <div class="d-flex float-end mb-1">
                     <div id='on_off' class="btn-group" role="group" aria-label="TCP Socket">
                         <input id="isOn" name="tcp-socket" type="radio" class="btn-check" autocomplete="off">
                         <label class="btn btn-outline-primary" for="isOn" title="Start TCP Socket">ON</label>
@@ -43,23 +43,26 @@
                     </button>
                 </div>
             </nav>
-            <div class="label-container bg-light border rounded overflow-auto" style="height: 82vh;">
-                <div id="label" class="position-relative"></div>
+            <div id="escpos-container" class="label-container bg-light border rounded overflow-auto is-esc">
+                <div id="label-esc" class="position-relative"></div>
+            </div>
+            <div id="zpl-container" class="label-container bg-light border rounded overflow-auto is-zpl">
+                <div id="label-zpl" class="position-relative"></div>
             </div>
         </div>
     </div>
     <!-- Notification -->
     <div class='notifications bottom-left position-fixed w-100' style="z-index: 9999; left: 1px; bottom: 1px;"></div>
     <!-- Modals -->
-    <div class="modal fade" id="printer-test" tabindex="-1" aria-labelledby="mdlPrinterTest" aria-hidden="true">
+    <div class="modal fade" id="printer-test" tabindex="-1" aria-labelledby="mdlPrinterTest" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
         <div class="modal-dialog">
             <div class="modal-content">
                 <div class="modal-header pb-1 pt-1 pe-3 ps-3">
                     <h5 id="mdlPrinterTest" class="modal-title modal-title">
                         <i class="glyphicon glyphicon-send pe-2"></i>
                         <span class='panel-printer-title'>Zpl</span> Printer Test
                     </h5>
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                    <button type="button" class="btn-close btn-close-test-md" data-bs-dismiss="modal" aria-label="Close"></button>
                 </div>
                 <form id="testsForm" class="mb-0">
                     <div class="modal-body">
@@ -69,29 +72,30 @@ <h5 id="mdlPrinterTest" class="modal-title modal-title">
                         </div>
                     </div>
                     <div class="modal-footer p-1">
-                        <button id="btn-close-test-md" type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                        <button id="btn-run-test-hw" type="button" class="btn btn-success">Hello Word</button>
-                        <button id="btn-run-test" type="submit" class="btn btn-primary">Print</button>
+                        <button id="btn-close-test-md" type="button" class="btn btn-secondary btn-close-test-md" data-bs-dismiss="modal"><i class="glyphicon glyphicon-remove"></i> Close</button>
+                        <button id="btn-run-test-hw" type="button" class="btn btn-success"><i class="glyphicon glyphicon-star"></i> Hello Word</button>
+                        <button id="btn-raw-file" type="button" class="btn btn-info"><i class="glyphicon glyphicon-file"></i> Raw File</button>
+                        <button id="btn-run-test" type="submit" class="btn btn-primary"><i class="glyphicon glyphicon-print"></i> Print</button>
                     </div>
                 </form>
             </div>
         </div>
     </div>
-    <div class="modal fade" id="settings-window" tabindex="-1" aria-labelledby="mdlLabelSettings" aria-hidden="true">
+    <div class="modal fade" id="settings-window" tabindex="-1" aria-labelledby="mdlLabelSettings" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
         <div class="modal-dialog">
             <div class="modal-content">
                 <div class="modal-header pb-1 pt-1 pe-3 ps-3">
                     <h5 id="mdlPrinterTest" class="modal-title modal-title">
                         <i class="glyphicon glyphicon-cog pe-2"></i>
                         <span class='panel-printer-title'>Zpl</span> Printer Settings
                     </h5>
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                    <button type="button" class="btn-close btn-close-save-settings" data-bs-dismiss="modal" aria-label="Close"></button>
                 </div>
                 <form id="configsForm" class="mb-0">
                     <div class="modal-body ps-2 pe-2">
                         <fieldset class="border rounded p-2 mb-1">
                             <legend class="float-none w-auto px-2 mb-0 fs-6 fw-semibold">Printer Properties</legend>
-                            <div class="row mb-2">
+                            <div class="row mb-2 is-zpl">
                                 <div class="col-7">
                                     <div class="form-floating">
                                         <select id="density" class="form-select" aria-label="Print Density">
@@ -166,14 +170,20 @@ <h5 id="mdlPrinterTest" class="modal-title modal-title">
                                                 <label class="form-check-label" for="saveLabels">Save labels</label>
                                             </div>
                                         </span>
-                                        <div class="form-floating">
+                                        <div class="form-floating is-zpl">
                                             <select id="filetype" class="form-select" aria-label="File Type">
                                                 <option value="1">PNG</option>
                                                 <option value="2">PDF</option>
                                                 <option value="3">RAW</option>
                                             </select>
                                             <label for="filetype">File Type</label>
                                         </div>
+                                        <div class="form-floating is-esc">
+                                            <select id="filetype-dump" class="form-select" aria-label="File Type" disabled>
+                                                <option value="3">RAW</option>
+                                            </select>
+                                            <label for="filetype-dump">File Type</label>
+                                        </div>
                                     </div>
                                 </div>
                             </div>
@@ -187,8 +197,8 @@ <h5 id="mdlPrinterTest" class="modal-title modal-title">
                         </fieldset>
                     </div>
                     <div class="modal-footer p-1">
-                        <button id="btn-close-save-settings" type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                        <button id="btn-save" type="submit" class="btn btn-primary">Save changes</button>
+                        <button id="btn-close-save-settings" type="button" class="btn btn-secondary btn-close-save-settings" data-bs-dismiss="modal"><i class="glyphicon glyphicon-remove"></i> Close</button>
+                        <button id="btn-save" type="submit" class="btn btn-primary"><i class="glyphicon glyphicon-floppy-disk"></i>  Save changes</button>
                     </div>
                 </form>
             </div>

diff --git a/ZplPrinter/manifest.json → ZplEscPrinter/manifest.json b/ZplPrinter/manifest.json → ZplEscPrinter/manifest.json