Resize text images for preferred on-screen size

30 files changed, 65 insertions, 21 deletions

diff --git a/app/index.js b/app/index.js
index 2edb901..ef5a7cf 100644
--- a/app/index.js
+++ b/app/index.js
@@ -32,6 +32,7 @@ let hr2 = document.getElementById("hr2");
 let hr3 = document.getElementById("hr3");
 
 // Activity
+let actContainer = document.getElementById("act-container");
 let actIcon = document.getElementById("act-icon");
 let act1 = document.getElementById("act1");
 let act2 = document.getElementById("act2");
@@ -135,7 +136,18 @@ function setDate(val) {
 }
 
 function setDay(val) {
-  day.image = getDayImg(val);
+  let days = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
+  let dayName = days[val];
+  day.image = `quantifier/${dayName}.png`;
+  if (dayName === "sun" || dayName === "tue" || dayName === "thu") {
+    day.width = 61;
+  } else if (dayName === "fri") {
+    day.width = 49;
+  } else if (dayName === "sat") {
+    day.width = 60;
+  } else {
+    day.width = 66;
+  }
 }
 
 function setHeartRate(val) {
@@ -149,24 +161,51 @@ function setHeartRate(val) {
 }
 
 function setActivity(activity, val) {
+  let position = 140;
   actIcon.image = `icons/stat_${activity}_solid_24px.png`;
 
-  drawDigit(val % 10, act6);
+  let digit = val % 10;
+  if (digit == 1) {
+    position += 7; // adjust for narrower 1
+  }
   val = Math.floor(val / 10);
+  drawDigit(digit, act6);
 
-  drawDigit(val % 10, act5);
+  digit = val % 10;
+  if (digit == 1) {
+    position += 7; // adjust for narrower 1
+  }
   val = Math.floor(val / 10);
+  drawDigit(digit, act5);
 
-  drawDigit(val % 10, act4);
+  digit = val % 10;
+  if (digit == 1) {
+    position += 7; // adjust for narrower 1
+  }
   val = Math.floor(val / 10);
+  drawDigit(digit, act4);
 
-  drawDigit(val % 10, act3);
+  digit = val % 10;
+  if (digit == 1) {
+    position += 7; // adjust for narrower 1
+  }
   val = Math.floor(val / 10);
+  drawDigit(digit, act3);
 
-  drawDigit(val % 10, act2);
+  digit = val % 10;
+  if (digit == 1) {
+    position += 7; // adjust for narrower 1
+  }
   val = Math.floor(val / 10);
+  drawDigit(digit, act2);
+
+  digit = val % 10;
+  if (digit == 1) {
+    position += 7; // adjust for narrower 1
+  }
+  drawDigit(digit, act1);
 
-  drawDigit(val % 10, act1);
+  actContainer.x = position;
 }
 
 function drawNumeral(val, place) {
@@ -175,6 +214,11 @@ function drawNumeral(val, place) {
 
 function drawDigit(val, place) {
   place.image = `quantifier/${val}.png`
+  if (val == 1) {
+    place.width = 11;
+  } else {
+    place.width = 18;
+  }
 }
 
 function getDayImg(index) {
diff --git a/resources/index.gui b/resources/index.gui
index 1c898eb..eb63cb2 100644
--- a/resources/index.gui
+++ b/resources/index.gui
@@ -1,11 +1,11 @@
 <svg class="background">
   <svg x="6" y="64">
-    <image id="day" href="quantifier/mon.png" x="$+3" width="69" height="21" fill="#FFFFFF" class="foreground" />
-    <image id="date1" href="quantifier/3.png" x="$+15" width="19" height="21" fill="#FFFFFF" class="foreground" />
-    <image id="date2" href="quantifier/0.png" x="$+3" width="19" height="21" fill="#FFFFFF" class="foreground" />
+    <image id="day" href="quantifier/mon.png" x="$+3" width="66" height="21" fill="#FFFFFF" class="foreground" />
+    <image id="date1" href="quantifier/3.png" x="$+15" width="18" height="21" fill="#FFFFFF" class="foreground" />
+    <image id="date2" href="quantifier/0.png" x="$+3" width="18" height="21" fill="#FFFFFF" class="foreground" />
   </svg>
   <svg> 
-    <image id="separator" href="numerals/separator.png" x="143" y="110" width="13" height="104" fill="#FFFFFF" class="foreground" />
+    <image id="separator" href="numerals/separator.png" x="143" y="100" width="13" height="122" fill="#FFFFFF" class="foreground" />
     <image id="hours1" href="numerals/8.png" x="6" y="100" width="60" height="122" fill="#FFFFFF" class="foreground" />
     <image id="hours2" href="numerals/8.png" x="75" y="100" width="60" height="122" fill="#FFFFFF" class="foreground" />
     <image id="mins1" href="numerals/8.png" x="167" y="100" width="60" height="122" fill="#FFFFFF" class="foreground" />
@@ -13,17 +13,17 @@
   </svg>
   <svg x="6" y="237">
     <image id="hr-icon" href="icons/stat_hr_solid_24px.png" width="24" height="24" fill="#ffffff" class="foreground" />
-    <image id="hr1" href="quantifier/0.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
-    <image id="hr2" href="quantifier/0.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
-    <image id="hr3" href="quantifier/0.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
+    <image id="hr1" href="quantifier/0.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <image id="hr2" href="quantifier/0.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <image id="hr3" href="quantifier/0.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
   </svg>
-  <svg x="140" y="237">
+  <svg id="act-container" x="140" y="237">
     <image id="act-icon" href="icons/stat_steps_solid_24px.png" width="24" height="24" fill="#ffffff" class="foreground" />
-    <image id="act1" href="quantifier/1.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
-    <image id="act2" href="quantifier/2.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
-    <image id="act3" href="quantifier/3.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
-    <image id="act4" href="quantifier/4.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
-    <image id="act5" href="quantifier/5.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
-    <image id="act6" href="quantifier/6.png" x="$+3" width="19" height="21" fill="#ffffff" class="foreground" />
+    <image id="act1" href="quantifier/1.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <image id="act2" href="quantifier/2.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <image id="act3" href="quantifier/3.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <image id="act4" href="quantifier/4.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <image id="act5" href="quantifier/5.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <image id="act6" href="quantifier/6.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
   </svg>
 </svg>
diff --git a/resources/numerals/0.png b/resources/numerals/0.png
index a7d3615..4d70fa0 100644
--- a/resources/numerals/0.png
+++ b/resources/numerals/0.png
diff --git a/resources/numerals/1.png b/resources/numerals/1.png
index ec61579..0c6b52c 100644
--- a/resources/numerals/1.png
+++ b/resources/numerals/1.png
diff --git a/resources/numerals/2.png b/resources/numerals/2.png
index 4e92e90..691b80d 100644
--- a/resources/numerals/2.png
+++ b/resources/numerals/2.png
diff --git a/resources/numerals/3.png b/resources/numerals/3.png
index c5a85cd..2b1c8a7 100644
--- a/resources/numerals/3.png
+++ b/resources/numerals/3.png
diff --git a/resources/numerals/4.png b/resources/numerals/4.png
index f92bfe6..49a9c6d 100644
--- a/resources/numerals/4.png
+++ b/resources/numerals/4.png
diff --git a/resources/numerals/5.png b/resources/numerals/5.png
index 393785c..ed327f1 100644
--- a/resources/numerals/5.png
+++ b/resources/numerals/5.png
diff --git a/resources/numerals/6.png b/resources/numerals/6.png
index a32a749..86c0006 100644
--- a/resources/numerals/6.png
+++ b/resources/numerals/6.png
diff --git a/resources/numerals/7.png b/resources/numerals/7.png
index f11b677..aae3052 100644
--- a/resources/numerals/7.png
+++ b/resources/numerals/7.png
diff --git a/resources/numerals/8.png b/resources/numerals/8.png
index 252963a..0d8dfec 100644
--- a/resources/numerals/8.png
+++ b/resources/numerals/8.png
diff --git a/resources/numerals/9.png b/resources/numerals/9.png
index ffd5c5a..1a1b0ac 100644
--- a/resources/numerals/9.png
+++ b/resources/numerals/9.png
diff --git a/resources/numerals/separator.png b/resources/numerals/separator.png
index a612ddf..be281d5 100644
--- a/resources/numerals/separator.png
+++ b/resources/numerals/separator.png
diff --git a/resources/quantifier/0.png b/resources/quantifier/0.png
index 519fa91..6baccc1 100644
--- a/resources/quantifier/0.png
+++ b/resources/quantifier/0.png
diff --git a/resources/quantifier/1.png b/resources/quantifier/1.png
index cd072cf..b5e5ffa 100644
--- a/resources/quantifier/1.png
+++ b/resources/quantifier/1.png
diff --git a/resources/quantifier/2.png b/resources/quantifier/2.png
index 0dac9e1..b89bc41 100644
--- a/resources/quantifier/2.png
+++ b/resources/quantifier/2.png
diff --git a/resources/quantifier/3.png b/resources/quantifier/3.png
index 8440537..71716bc 100644
--- a/resources/quantifier/3.png
+++ b/resources/quantifier/3.png
diff --git a/resources/quantifier/4.png b/resources/quantifier/4.png
index 0968921..e5f2580 100644
--- a/resources/quantifier/4.png
+++ b/resources/quantifier/4.png
diff --git a/resources/quantifier/5.png b/resources/quantifier/5.png
index d0bfe7d..93e066b 100644
--- a/resources/quantifier/5.png
+++ b/resources/quantifier/5.png
diff --git a/resources/quantifier/6.png b/resources/quantifier/6.png
index 413d6fe..7c359b5 100644
--- a/resources/quantifier/6.png
+++ b/resources/quantifier/6.png
diff --git a/resources/quantifier/7.png b/resources/quantifier/7.png
index 7d0ec4d..88ed442 100644
--- a/resources/quantifier/7.png
+++ b/resources/quantifier/7.png
diff --git a/resources/quantifier/8.png b/resources/quantifier/8.png
index afc1f42..18f5ab1 100644
--- a/resources/quantifier/8.png
+++ b/resources/quantifier/8.png
diff --git a/resources/quantifier/9.png b/resources/quantifier/9.png
index d4f1aa1..ada47a9 100644
--- a/resources/quantifier/9.png
+++ b/resources/quantifier/9.png
diff --git a/resources/quantifier/fri.png b/resources/quantifier/fri.png
index 72747ac..2fb32a3 100644
--- a/resources/quantifier/fri.png
+++ b/resources/quantifier/fri.png
diff --git a/resources/quantifier/mon.png b/resources/quantifier/mon.png
index c86e423..35efabc 100644
--- a/resources/quantifier/mon.png
+++ b/resources/quantifier/mon.png
diff --git a/resources/quantifier/sat.png b/resources/quantifier/sat.png
index 870d692..568bd84 100644
--- a/resources/quantifier/sat.png
+++ b/resources/quantifier/sat.png
diff --git a/resources/quantifier/sun.png b/resources/quantifier/sun.png
index 7981730..24f3b1c 100644
--- a/resources/quantifier/sun.png
+++ b/resources/quantifier/sun.png
diff --git a/resources/quantifier/thu.png b/resources/quantifier/thu.png
index 32bc6be..7816d07 100644
--- a/resources/quantifier/thu.png
+++ b/resources/quantifier/thu.png
diff --git a/resources/quantifier/tue.png b/resources/quantifier/tue.png
index f527d0f..bde6f7c 100644
--- a/resources/quantifier/tue.png
+++ b/resources/quantifier/tue.png
diff --git a/resources/quantifier/wed.png b/resources/quantifier/wed.png
index 2860182..4d89518 100644
--- a/resources/quantifier/wed.png
+++ b/resources/quantifier/wed.png