From f2d207e540cab70444beef6b6d6cf83877404376 Mon Sep 17 00:00:00 2001
From: Adam Goldsmith <adam@adamgoldsmith.name>
Date: Thu, 30 Jan 2020 22:46:12 -0500
Subject: [PATCH] Use data from snipeit export, also render name as word, add
 mac address

---
 computerLabel.css  | 14 +++++++++++++-
 computerLabel.html |  3 +++
 computerLabel.js   | 37 +++++++++++++++++++++++++------------
 package.json       |  1 +
 4 files changed, 42 insertions(+), 13 deletions(-)

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 @@
       <img class="qrcode" />
       <span class="text-content">
         <div class="name"></div>
+        <div class="hostname"></div>
+        <div class="mac"></div>
+        <div class="tag"></div>
       </span>
     </div>
     <img class="barcode" />
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"
   }
 }