Netsyms/MachineManagerApp
2
0
Fork 0
Code Issues 1 Pull Requests Releases Wiki Activity

Add label printing support, use more URLs instead of functions for nav

Browse Source
This commit is contained in:
Skylar Ittner 2020-09-25 18:11:40 -06:00
parent da23bdcb23
commit 3fcf2b3bc8
17 changed files with 325 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
www/assets/css/app.css
View File

@ -65,6 +65,26 @@ Framework7 and FontAwesome both have a .fab class
--f7-safe-area-right: 0px;
}
#pdf-canvas {
margin-left: auto;
margin-top: 2em;
margin-right: auto;
padding-left: 0;
padding-right: 0;
display: block;
box-shadow: var(--f7-elevation-5);
}
#pdf-loading-message {
margin-left: auto;
margin-top: 2em;
margin-right: auto;
padding-left: 0;
padding-right: 0;
display: block;
text-align: center;
}
/*
Allow easily changing help text to reflect finger/mouse usage.
*/

2
www/assets/js/addevent.js
View File

@ -110,7 +110,7 @@ function addEvent(machineid) {
text: 'Event added!',
closeTimeout: 2000,
}).open();
openMachineInfo(machineid);
router.back();
}
},
function (xhr) {

2
www/assets/js/home.js
View File

@ -8,7 +8,7 @@
$("#machinesearchbar").submit(function (evt) {
evt.preventDefault();
openMachineInfo($("#machinesearchbar input[type=search]").val());
router.navigate("/machine/" + $("#machinesearchbar input[type=search]").val());
});
$("#clientsearchbar").submit(function (evt) {

113
www/assets/js/labels.js Normal file
View File

@ -0,0 +1,113 @@
/*
* Copyright 2020 Netsyms Technologies.
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
var pdfobject = null;
function labelListAsync(routeTo, routeFrom, resolve, reject) {
app.dialog.preloader("Loading...");
apirequest(
"listlabels",
{},
function (resp) {
app.dialog.close();
if (resp.status == "ERROR") {
app.dialog.alert(resp.msg, "Error");
reject();
} else {
var context = {
labels: resp.labels,
machineid: routeTo.params.machineid
};
resolve({
templateUrl: "pages/labels.html",
}, {
context: context
});
}
},
function (xhr) {
app.dialog.close();
var error = $.parseJSON(xhr.responseText);
if (error && typeof error.msg != 'undefined') {
app.dialog.alert(error.msg, "Error");
} else {
app.dialog.alert("A server or network error occurred.", "Error");
}
reject();
});
}
function getPDFLabelAndDisplay(machineid, labeltype) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
//this.response is what you're looking for
pdfobject = this.response;
$("#print-fab").removeClass("display-none");
$("#pdf-canvas").removeClass("display-none");
$("#pdf-loading-message").addClass("display-none");
pdfjsLib.getDocument({data: pdfobject}).promise.then(function (pdf) {
pdf.getPage(1).then(function (page) {
var scale = 1.5;
var viewport = page.getViewport({scale: scale});
var canvas = document.getElementById('pdf-canvas');
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
});
}
}
xhr.open('POST', SETTINGS.apiserver + "getlabel", true, getStorage("username"), getStorage("password"));
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.responseType = 'arraybuffer';
xhr.send("id=" + machineid + "&type=" + labeltype);
}
function sendPDFToPrintServer() {
var bytesArray = new Uint8Array(pdfobject);
var printurl = getStorage("printserverurl");
$.getJSON(printurl, {action: "list"}, function (resp) {
var printers = resp.printers;
var buttons = [];
for (var i = 0; i < printers.length; i++) {
buttons.push({
text: printers[i]
});
}
app.dialog.create({
title: 'Print',
text: 'Select a printer',
buttons: buttons,
verticalButtons: true,
onClick: function (dialog, index) {
var printer = printers[index];
$.ajax({
url: printurl + '?action=print&printer=' + printer,
type: 'POST',
contentType: 'application/octet-stream',
data: bytesArray,
processData: false
});
}
}).open();
});
}

23
www/assets/js/machine.js
View File

@ -31,18 +31,19 @@ function addMachineToSearchHistory(machineid) {
setStorage("machinehistory", JSON.stringify(history));
}
function openMachineEditor(machineid) {
function machineEditorOpenAsync(routeTo, routeFrom, resolve, reject) {
app.dialog.preloader("Loading editor...");
apirequest(
"lookup",
{
id: machineid
id: routeTo.params.id
},
function (resp) {
app.dialog.close();
if (resp.status == "ERROR") {
app.dialog.alert(resp.msg, "Error");
reject();
} else {
var context = {
machineid: resp.id,
@ -76,7 +77,10 @@ function openMachineEditor(machineid) {
tabindex++;
}
}
router.navigate("/machineeditor", {
resolve({
templateUrl: "pages/machineeditor.html",
}, {
context: context
});
}
@ -89,21 +93,23 @@ function openMachineEditor(machineid) {
} else {
app.dialog.alert("A server or network error occurred.", "Error");
}
reject();
});
}
function openMachineInfo(machineid) {
function machineInfoOpenAsync(routeTo, routeFrom, resolve, reject) {
app.dialog.preloader("Loading...");
apirequest(
"lookup",
{
id: machineid
id: routeTo.params.id
},
function (resp) {
app.dialog.close();
if (resp.status == "ERROR") {
app.dialog.alert(resp.msg, "Error");
reject();
} else {
var events = [];
@ -175,7 +181,9 @@ function openMachineInfo(machineid) {
}
}
addMachineToSearchHistory(resp.id);
router.navigate("/machine", {
resolve({
templateUrl: "pages/machine.html",
}, {
context: context
});
}
@ -188,6 +196,7 @@ function openMachineInfo(machineid) {
} else {
app.dialog.alert("A server or network error occurred.", "Error");
}
reject();
});
}
@ -217,7 +226,7 @@ function saveMachineEdits(machineid) {
text: 'Machine saved!',
closeTimeout: 2000,
}).open();
openMachineInfo(machineid);
router.back();
}
},
function (xhr) {

36
www/assets/js/settings.js
View File

@ -30,6 +30,42 @@ function resyncAndRestart() {
});
}
function openPrintServerDialog() {
app.dialog.create({
title: 'Print Server Setup',
buttons: [
{
text: 'Manual Input',
},
{
text: 'Scan Barcode',
},
{
text: 'Cancel',
},
],
verticalButtons: true,
onClick: function (dialog, index) {
switch (index) {
case 0:
app.dialog.prompt('Print Server URL:', function (url) {
setStorage("printserverurl", url);
});
break;
case 1:
scanBarcode(function (code) {
setStorage("printserverurl", code);
}, function (error) {
app.dialog.alert(error, "Error");
});
break;
default:
return;
}
}
}).open();
}
function clearCaches() {
app.toast.show({
text: "Clearing caches. You may need to restart the app to see a difference.",

3
www/index.html
View File

@ -28,6 +28,8 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
<script src="node_modules/framework7/js/framework7.bundle.min.js"></script>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/pdfjs-dist/build/pdf.min.js"></script>
<script src="node_modules/pdfjs-dist/build/pdf.worker.min.js"></script>
<script src="settings.js"></script>
@ -35,6 +37,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
<script src="assets/js/platform.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/labels.js"></script>
<script src="assets/js/machine.js"></script>
<script src="assets/js/clients.js"></script>
<script src="assets/js/addevent.js"></script>

5
www/package-lock.json generated
View File

@ -63,6 +63,11 @@
"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.1.0.tgz",
"integrity": "sha512-h9DqehX3zZZDCEm+xbfU0ZmwCGFCAAraPJWMXJ4+v32NjZJilVg3k1TcKsRgIb8IQ/izZSaydDc1OhJCZvs2Dw=="
},
"pdfjs-dist": {
"version": "2.5.207",
"resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.5.207.tgz",
"integrity": "sha512-xGDUhnCYPfHy+unMXCLCJtlpZaaZ17Ew3WIL0tnSgKFUZXHAPD49GO9xScyszSsQMoutNDgRb+rfBXIaX/lJbw=="
},
"ssr-window": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-2.0.0.tgz",

3
www/package.json
View File

@ -9,7 +9,8 @@
"framework7": "^5.5.1",
"framework7-icons": "^3.0.0",
"jquery": "^3.4.1",
"material-design-icons": "^3.0.1"
"material-design-icons": "^3.0.1",
"pdfjs-dist": "^2.5.207"
},
"devDependencies": {}
}

2
www/pages/addevent.html
View File

@ -11,7 +11,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
<div class="navbar-bg"></div>
<div class="navbar-inner">
<div class="left">
<a href="#" class="link icon-only" onclick="router.navigate('/')">
<a href="#" class="link icon-only back">
<i class="icon icon-back"></i>
</a>
</div>

2
www/pages/client.html
View File

@ -120,7 +120,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
</div>
</div>
<div class="accordion-item-content">
<a href="" onclick="openMachineInfo('{{id}}')" class="button">Open</a>
<a href="/machine/{{id}}" class="button">Open</a>
<div class="list">
<ul>
{{#each props}}

4
www/pages/home.html
View File

@ -55,11 +55,11 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
</li>
{{#each machinehistory}}
<li>
<div class="item-link item-content" onclick="openMachineInfo('{{this}}')">
<a class="item-link item-content" href="/machine/{{this}}">
<div class="item-inner">
<div class="item-title">{{this}}</div>
</div>
</div>
</a>
</li>
{{/each}}
</ul>

36
www/pages/labels.html Normal file
View File

@ -0,0 +1,36 @@
<!--
Copyright 2020 Netsyms Technologies.
This Source Code Form is subject to the terms of the Mozilla Public
License, v. 2.0. If a copy of the MPL was not distributed with this
file, You can obtain one at http://mozilla.org/MPL/2.0/.
-->
<div class="page" data-name="labels">
<div class="navbar">
<div class="navbar-bg"></div>
<div class="navbar-inner">
<div class="left">
<a href="#" class="link icon-only back">
<i class="icon icon-back"></i>
</a>
</div>
<div class="title">Labels for #{{machineid}}</div>
</div>
</div>
<div class="page-content">
<div class="list links-list no-margin-top">
<ul>
{{#each labels}}
<li>
<a href="/labels/{{../machineid}}/{{@key}}/{{this}}">
{{this}}
</a>
</li>
{{/each}}
</ul>
</div>
</div>
</div>

30
www/pages/machine.html
View File

@ -16,6 +16,11 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
</a>
</div>
<div class="title"><i class="{{icon}}"></i> {{type.label}} #{{machineid}}</div>
<div class="right">
<a href="#" class="link icon-only" onclick="router.refreshPage()">
<i class="icon material-icons">refresh</i>
</a>
</div>
</div>
</div>
@ -30,9 +35,30 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
</a>
</div>
<div class="fab fab-left-bottom" id="edit-fab">
<a href="#" onclick="openMachineEditor('{{machineid}}');">
<div class="fab fab-left-bottom">
<a href="#">
<!-- Icons For iOS Theme -->
<i class="icon f7-icons if-not-md">plus</i>
<i class="icon f7-icons if-not-md">xmark</i>
<!-- Icons For MD Theme -->
<i class="icon material-icons md-only">add</i>
<i class="icon material-icons md-only">close</i>
</a>
<div class="fab-buttons fab-buttons-top">
<a href="/machineeditor/{{machineid}}" class="fab-label-button">
<span class="material-icons">edit</span>
<span class="fab-label">Edit</span>
</a>
<a href="/labels/{{machineid}}" class="fab-label-button">
<span class="material-icons">print</span>
<span class="fab-label">Labels</span>
</a>
</div>
</div>
{{else}}
<div class="fab fab-left-bottom" id="label-fab">
<a href="#">
<span class="material-icons">print</span>
</a>
</div>
{{/if}}

2
www/pages/machineeditor.html
View File

@ -11,7 +11,7 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
<div class="navbar-bg"></div>
<div class="navbar-inner">
<div class="left">
<a href="#" class="link icon-only" onclick="openMachineInfo('{{machineid}}')">
<a href="#" class="link icon-only back">
<i class="icon icon-back"></i>
</a>
</div>

37
www/pages/viewlabel.html Normal file
View File

@ -0,0 +1,37 @@
<!--
Copyright 2020 Netsyms Technologies.
This Source Code Form is subject to the terms of the Mozilla Public
License, v. 2.0. If a copy of the MPL was not distributed with this
file, You can obtain one at http://mozilla.org/MPL/2.0/.
-->
<div class="page" data-name="viewlabel">
<div class="navbar">
<div class="navbar-bg"></div>
<div class="navbar-inner">
<div class="left">
<a href="#" class="link icon-only back">
<i class="icon icon-back"></i>
</a>
</div>
<div class="title">{{$route.params.labelname}} #{{$route.params.machineid}}</div>
</div>
</div>
<div class="fab fab-right-bottom display-none" id="print-fab">
<a href="#" onclick="sendPDFToPrintServer()">
<span class="material-icons">print</span>
</a>
</div>
<div class="page-content" id="pdfcanvas-container">
<canvas id="pdf-canvas" class="display-none"></canvas>
<p id="pdf-loading-message">Loading...</p>
</div>
<script>
getPDFLabelAndDisplay("{{$route.params.machineid}}", "{{$route.params.labeltype}}");
</script>
</div>

25
www/routes.js
View File

@ -21,14 +21,14 @@ var routes = [
}
},
{
path: "/machine",
path: "/machine/:id",
name: "machine",
templateUrl: "pages/machine.html"
async: machineInfoOpenAsync
},
{
path: "/machineeditor",
path: "/machineeditor/:id",
name: "machineeditor",
templateUrl: "pages/machineeditor.html"
async: machineEditorOpenAsync
},
{
path: "/clients/:q",
@ -40,6 +40,16 @@ var routes = [
name: "client",
async: clientGetAsync
},
{
path: "/labels/:machineid",
name: "labels",
async: labelListAsync
},
{
path: "/labels/:machineid/:labeltype/:labelname",
name: "viewlabel",
templateUrl: "pages/viewlabel.html"
},
{
path: "/addevent",
name: "addevent",
@ -98,6 +108,13 @@ var routes = [
text: "Change the app theme.",
onclick: "router.navigate('/settings/display')",
link: true
},
{
setting: "printserverurl",
title: "Print Server",
text: getStorage("printserverurl"),
onclick: "openPrintServerDialog()",
link: true
}
);