UI fixes

* 'unknown paddle' now uses vh/vw for size/positioning
* fixing UI to be 640x480, 4:3 ((4) DMT RBG full 60hz)
* fixing rows of `ui_main` status messages to match
* fiddling with the `ui_main` bottom status
* bumbed ui version and date

busunit/DIUv2/html/css/diustyles.css

@@ -49,13 +49,13 @@ p:focus {
 .textwindow {
   float: left;
   color: #444444;
-  font-size: 5vh;
-  letter-spacing: 0.125vh;
+  font-size: 3vw;
+  letter-spacing: 0.125vw;
   font-weight:bold;
   font-family: monospace;
   outline: thin solid #999999;
   background: #f7f7f7;
-  width:80vw;
+  width:90vw;
   height:60vh;
   overflow:hidden;
 }
@@ -63,14 +63,14 @@ p:focus {
 .textwindowmain {
   float: left;
   color: #444444;
-  font-size: 5vh;
-  letter-spacing: 0.125vh;
+  font-size: 3vw;
+  letter-spacing: 0.125vw;
   font-weight:bold;
   font-family: monospace;
   outline: thin solid #999999;
   background: #f7f7f7;
-  width:65vw;
-  height:51vh;
+  width:63vw;
+  height:50vh;
   overflow:hidden;
 }
 
@@ -104,74 +104,33 @@ p:focus {
   height:96vh;
 }
 
-/* small size */
-
-/*
-@media only screen and (max-width: 640px) {
-  body { letter-spacing: 0.125em; }
-  .row { height: 80px; }
-  .col { width: 80px; }
-  .bdisp { font-size: 20px; margin-top: 15px; margin-right: 15px; } 
-  .bstatus { font-size: 20px; border: solid 2px #888888; box-shadow: 3px 3px 0px #aaaaaa; }
-  .bstatus { font-size: 20px; border: solid 2px #888888; box-shadow: 3px 3px 0px #aaaaaa; }
-  .bdrop { font-size: 19px; border: solid 2px #888888; box-shadow: 3px 3px 0px #aaaaaa; }
-  .bdropinp { font-size: 22px; border: solid 2px #888888; box-shadow: 3px 3px 0px #aaaaaa; }
-  .bkey { width: 75px; height:75px; }
-  .bkeyNarrow { width: 75px; height:75px; }
-  .bkeyw { width: 150px; height:58px; }
-  .bkeym { width: 100px; height:58px; }
-  .bkeyHuge { width: 300px; height:300px; }
-  .bfieldinp { width: 150px; height: 58px; }
-}
-*/
-
-/* LARGE SIZE */
-
 .row4 { height: 20vh; }
 .row5 { height: 15vh; }
 
 
-/* @media only screen and (min-width: 640px) { */
-  body { letter-spacing: 0.25em; }
-
-  .row { height: 160px; }
-  .col { width: 160px; }
-
-
-  /*
-  .row { height: 20vh; }
-  .col { width: 20vw; }
-  */
+body { letter-spacing: 0.25em; }
 
-  .bdisp {
-    font-size: 7vh;
-    margin-top: 5vh;
-    margin-right: 1vw;
-  }
+.row { height: 160px; }
+.col { width: 160px; }
 
-  /*
-  .bstatus { font-size: 40px; border: solid 4px #888888; box-shadow: 6px 6px 0px #aaaaaa; }
-  .bstatus { font-size: 40px; border: solid 4px #888888; box-shadow: 6px 6px 0px #aaaaaa; }
-  .bdrop { font-size: 7vh; border: solid 4px #888888; box-shadow: 6px 6px 0px #aaaaaa; }
-  .bdropinp { font-size: 7vh; border: solid 4px #888888; box-shadow: 6px 6px 0px #aaaaaa; }
-  */
+.bdisp {
+  font-size: 6vh;
+  margin-top: 4vh;
+  margin-right: 1vw;
+}
 
-  .bstatus  { font-size: 7vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
-  .bstatus  { font-size: 7vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
-  .bdrop    { font-size: 7vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
-  .bdropinp { font-size: 7vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
+.bstatus  { font-size: 6vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
+.bstatus  { font-size: 6vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
+.bdrop    { font-size: 6vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
+.bdropinp { font-size: 6vh; border: solid .3vw #888888; box-shadow: .5vw .5vw 0px #aaaaaa; }
 
-  .bkey       { width: 20vh; height: 20vh; }
-  .bkeyFull   { width: 96vw; height: 96vh; }
-  .bkeyNarrow { width: 10vw; height: 40vh; }
-  .bkeyw      { width: 25vw; height: 17vh; }
-  .bkeym      { width: 20vw; height: 17vh; }
-  .bkeyHuge   { width: 80vw; height: 80vh; }
-  .bfieldinp  { width: 20vw; height: 20vh; }
-
-/*
-}
-*/
+.bkey       { width: 20vh; height: 20vh; }
+.bkeyFull   { width: 96vw; height: 96vh; }
+.bkeyNarrow { width: 12vw; height: 40vh; }
+.bkeyw      { width: 25vw; height: 17vh; }
+.bkeym      { width: 20vw; height: 17vh; }
+.bkeyHuge   { width: 80vw; height: 80vh; }
+.bfieldinp  { width: 20vw; height: 20vh; }
 
 .bdisp {
   font-weight: bold;
@@ -247,28 +206,31 @@ p:focus {
 
 .btnprv {
   position: absolute;
-  left: 85vw;
+  left: 83vw;
   top: 5vh;
 }
 
 .btnnxt {
   position: absolute;
-  left: 85vw;
+  left: 83vw;
   top: 30vh;
 }
 
 #mainstatus {
   font-family: "Courier New";
   font-weight:bold;
-  font-size: 5vh;
+  font-family: monospace;
+
+  font-size: 3.85vh;
+  letter-spacing: 0.125vw;
   color: #d7d644;
 
   position:absolute;
   bottom:0;
   width:110%;
-  height: 8vh;
+  height: 6vh;
   background:#555555;
-  margin-left: -5vw;
+  margin-left: -7vw;
 }
 
 .rowmain0 {

busunit/DIUv2/html/index-ORG.html

@@ -50,10 +50,6 @@
 
       </div>
 
-      <br>
-      <br>
-      <br>
-
       <div class='pure-g'>
 
         <button class='invisiblock' id='ui_login_blockwindow'> </button>
@@ -327,7 +323,8 @@ Diagnostic window...
       <div style='width:100%; height:100%;'>
 
         <div class='pure-g row' style='width:100%; height:100%;' >
-          <div class='pure-u-1-6 col' style=' position:absolute; top:20%; margin-left:25%; '>
+
+          <div class='pure-u-1-6 col' style=' position:absolute; top:10vh; margin-left:10vw; '>
             <button onmousedown='_beep();' class='bdropinp bkeyHuge' id='ui_paddleunknown_btn'>Unknown Paddle </button>
           </div>
         </div>

busunit/DIUv2/html/js/diu_ui-ORG.js

@@ -27,8 +27,8 @@ var _fqADDRESS = _ADDRESS + ":" + _PORT;
 var BG_COLOR = "#f7f7f7";
 var TEXT_COLOR = "#444444";
 
-var DIU_UI_VERSION = "0.1.4";
-var DIU_UI_VERSION_DATE = "2019-11-24 11:29:00";
+var DIU_UI_VERSION = "0.1.5";
+var DIU_UI_VERSION_DATE = "2019-11-27 13:09:00";
 
 var g_snd = {
   "reject_fare" : "",
@@ -74,7 +74,7 @@ var g_ctx = {
 
   "status_text": "",
   "status_text_w": 32,
-  "status_text_h": 9,
+  "status_text_h": 11,
 
   "status_html_text":"",