diff --git a/computerLabel.css b/computerLabel.css index ac5d433..ee83d6a 100644 --- a/computerLabel.css +++ b/computerLabel.css @@ -14,7 +14,7 @@ body { width: calc(146.64pt - 4.32pt); height: calc(69.12pt - 4.08pt); position: relative; - padding-top: 2mm; + padding-top: 1.9mm; overflow: hidden; } @@ -36,6 +36,18 @@ body { .text-content { margin-left: 1ex; + font-family: monospace; + line-height: 0.9; +} + +.name { + font-size: 30; + line-height: 0.8; + margin-bottom: .1em; +} + +.mac { + font-size: 10; } .barcode { diff --git a/computerLabel.html b/computerLabel.html index 5398e3a..6280a98 100644 --- a/computerLabel.html +++ b/computerLabel.html @@ -7,6 +7,9 @@
+
+
+
diff --git a/computerLabel.js b/computerLabel.js index 7e21f99..0b5f5e8 100644 --- a/computerLabel.js +++ b/computerLabel.js @@ -1,26 +1,39 @@ -import QRCode from "qrcode"; import JsBarcode from "jsbarcode"; +import { toWords as numberToWords } from "number-to-words"; +import QRCode from "qrcode"; + +import data from "./export-computers-assets-2020-01-30.json"; async function renderLabels() { const template = document.querySelector("#labelTemplate"); const URL_BASE = "https://inv.claremontmakerspace.org/"; - const assetTag = "TSMS00001"; - const assetName = "Laptop1"; - let clone = document.importNode(template.content, true); + for (const asset of data.data) { + const { + "Asset Tag": assetTag, + "Asset Name": assetName, + "MAC Address": mac + } = asset; + let clone = document.importNode(template.content, true); - let qrcode = await QRCode.toDataURL(URL_BASE + assetTag, { margin: 0 }); - clone.querySelector(".qrcode").src = qrcode; + let qrcode = await QRCode.toDataURL(URL_BASE + assetTag, { margin: 0 }); + clone.querySelector(".qrcode").src = qrcode; - JsBarcode(clone.querySelector(".barcode"), assetTag, { - displayValue: false, - margin: 0 - }); + JsBarcode(clone.querySelector(".barcode"), assetTag, { + displayValue: false, + margin: 0 + }); - clone.querySelector(".name").textContent = assetName; + let name = numberToWords(assetName.match(/[0-9]+$/)[0]).toUpperCase(); - document.body.appendChild(clone); + clone.querySelector(".name").textContent = name; + clone.querySelector(".hostname").textContent = assetName; + clone.querySelector(".mac").textContent = mac; + clone.querySelector(".tag").textContent = assetTag; + + document.body.appendChild(clone); + } } window.addEventListener("load", renderLabels); diff --git a/package.json b/package.json index d2c5eb4..fd0d085 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ ], "dependencies": { "jsbarcode": "^3.11.0", + "number-to-words": "^1.2.4", "qrcode": "^1.4.4" } }