Index: trunk/FACT++/www/smartfact/index.js
===================================================================
--- trunk/FACT++/www/smartfact/index.js	(revision 13885)
+++ trunk/FACT++/www/smartfact/index.js	(revision 13886)
@@ -160,8 +160,11 @@
 */
 function $(id) { return document.getElementById(id); }
+function $new(name) { return document.createElement(name); }
+function $txt(txt) { return document.createTextNode(txt); }
 function trim(str) { return str.replace("/^\s\s*/", '').replace("/\s\s*$/", ''); }
 function valid(str) { if (str==undefined) return false; if (str.length==0) return false; return true;}
 function isSliding() { var z = $("body").getAttribute("data-visible"); return $("table"+z).offsetLeft!=0; }
-function htmlDecode(input) { var e = document.createElement('div'); e.innerHTML = input; return e.childNodes[0].nodeValue; }
+function htmlDecode(input) { var e = $new('div'); e.innerHTML = input; return e.childNodes[0].nodeValue; }
+function setUTC(el, time) { var str = time.toUTCString(); var utc = str.substr(str.length-12, 8); el.innerHTML = "• "+utc+" UTC •"; }
 
 function cycleCol(el)
@@ -352,5 +355,5 @@
         $("body").removeChild(table);
 
-    table = document.createElement("table");
+    table = $new("table");
     table.setAttribute("class", "tborder");
     table.id = "table"+z;
@@ -364,13 +367,13 @@
     // -----------------------------------------------------
 
-    var th = document.createElement("thead");
+    var th = $new("thead");
     th.colSpan = 3;
     th.width = "100%";
     table.appendChild(th);
 
-    var htr = document.createElement("tr");
+    var htr = $new("tr");
     th.appendChild(htr);
 
-    var htd = document.createElement("td");
+    var htd = $new("td");
     htd.setAttribute("class", "thead");
     htd.colSpan = 3;
@@ -380,16 +383,16 @@
     // -------------
 
-    var htab = document.createElement("table");
+    var htab = $new("table");
     htab.width = "100%";
     htd.appendChild(htab);
 
-    var hhtr = document.createElement("tr");
+    var hhtr = $new("tr");
     htab.appendChild(hhtr);
 
-    var htd0 = document.createElement("td");
-    var htd1 = document.createElement("td");
-    var htd2 = document.createElement("td");
-    var htd3 = document.createElement("td");
-    var htd4 = document.createElement("td");
+    var htd0 = $new("td");
+    var htd1 = $new("td");
+    var htd2 = $new("td");
+    var htd3 = $new("td");
+    var htd4 = $new("td");
     htd0.setAttribute("class", "tcell1");
     htd1.setAttribute("class", "tcell2");
@@ -411,22 +414,31 @@
     htd4.style.verticalAlign = "middle";
 */
-    var div1 = document.createElement("div");
-    var div2 = document.createElement("div");
-    var div3 = document.createElement("div");
-    var div4 = document.createElement("div");
+    var div1 = $new("div");
+    var div2 = $new("div");
+    var div3 = $new("div");
+    var div4 = $new("div");
     div4.id = "warn"+z;
     div2.setAttribute("class", "icon_white");
-    div3.setAttribute("class", "icon_white");
     div4.setAttribute("class", "icon_color");
     div2.setAttribute("style", "background-position:-396px 50%;");
-    div3.setAttribute("style", "background-position:-575px 50%;");
     div4.setAttribute("style", "display:none;background-position:-12px -12px;");
-    div3.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage('fact',  z,  -1); }
     div2.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage(fname,   z, -dz); }
     div4.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage('error', z,  +1); }
 
-    var sp0 = document.createElement("span");
-    var sp1 = document.createElement("span");
-    var sp2 = document.createElement("span");
+    if (name=="fact")
+    {
+        div3.setAttribute("class", "icon_color");
+        div3.setAttribute("style", "background-position:-58px -146px;");
+    }
+    else
+    {
+        div3.setAttribute("class", "icon_white");
+        div3.setAttribute("style", "background-position:-575px 50%;");
+        div3.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage('fact',  z,  -1); }
+    }
+
+    var sp0 = $new("span");
+    var sp1 = $new("span");
+    var sp2 = $new("span");
     sp0.id = "ldot" +z;
     sp1.id = "title"+z;
@@ -435,7 +447,7 @@
     sp0.setAttribute("data-color", "3");
     sp2.setAttribute("data-color", "3");
-    sp0.appendChild(document.createTextNode(" \u2022 "));
-    sp1.appendChild(document.createTextNode(title));
-    sp2.appendChild(document.createTextNode(" \u2022 "));
+    sp0.appendChild($txt(" \u2022 "));
+    sp1.appendChild($txt(title));
+    sp2.appendChild($txt(" \u2022 "));
     if (is_cmd)
     {
@@ -450,5 +462,5 @@
     div1.setAttribute("style", "font-size:small;");
     div1.id = "reporttime"+z;
-    div1.appendChild(document.createTextNode("---"));
+    div1.appendChild($txt("---"));
 
     div1.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; sendCommand('stop'); this.style.backgroundColor=''; }
@@ -461,22 +473,21 @@
     if (dz!=0/* && z+dz!=0*/)
         htd2.appendChild(div2); // back
-    if (lines[0]!="FACT")
-        htd3.appendChild(div3); // home
+    htd3.appendChild(div3); // home
     htd4.appendChild(div4);     // Warning
 
     // -----------------------------------------------------
 
-    var tbody = document.createElement("tbody");
+    var tbody = $new("tbody");
     table.appendChild(tbody);
 
     // -----------------------------------------------------
 
-    var tf = document.createElement("tfoot");
+    var tf = $new("tfoot");
     table.appendChild(tf);
 
-    var ftr = document.createElement("tr");
+    var ftr = $new("tr");
     tf.appendChild(ftr);
 
-    var ftd = document.createElement("td");
+    var ftd = $new("td");
     ftd.setAttribute("class",   "tfoot");
     ftd.width = "100%";
@@ -484,13 +495,13 @@
     ftr.appendChild(ftd);
 
-    var ftab = document.createElement("table");
+    var ftab = $new("table");
     ftab.width = "100%";
     ftd.appendChild(ftab);
 
-    var ftdH = document.createElement("td");
-    var ftd0 = document.createElement("td");
-    var ftd1 = document.createElement("td");
-    var ftd2 = document.createElement("td");
-    var ftd3 = document.createElement("td");
+    var ftdH = $new("td");
+    var ftd0 = $new("td");
+    var ftd1 = $new("td");
+    var ftd2 = $new("td");
+    var ftd3 = $new("td");
     ftdH.setAttribute("width", "1px");
     ftd2.setAttribute("width", "1px");
@@ -509,17 +520,15 @@
     ftab.appendChild(ftd3);
 
-    var fdivH = document.createElement("div");
-    var fdiv0 = document.createElement("span");
-    var fdiv1 = document.createElement("span");
-    var fdiv2 = document.createElement("div");
-    var fdiv3 = document.createElement("div");
+    var fdivH = $new("div");
+    var fdiv0 = $new("span");
+    var fdiv1 = $new("span");
+    var fdiv2 = $new("div");
+    var fdiv3 = $new("div");
     ftd0.style.paddingLeft = "5px";
-
-    fdivH.setAttribute("class", "icon_white");
+    fdiv2.id="cmd"+z;
+
     fdiv2.setAttribute("class", "icon_white");
     fdiv3.setAttribute("class", "icon_white");
-    fdivH.setAttribute("style", "background-position:-611px 50%;");
     fdiv2.setAttribute("style", "background-position:-72px 50%;");
-    fdivH.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage('help-'+name, z, +1); }
     fdiv2.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; sendCommand('stop'); this.style.backgroundColor=''; }
     if (is_cmd)
@@ -533,4 +542,17 @@
         fdiv3.setAttribute("style", "background-position:-288px 50%;");
     }
+
+    if (name.substr(0, 5)=="help-")
+    {
+        fdivH.setAttribute("class", "icon_color");
+        fdivH.setAttribute("style", "background-position:-408px -57px;");
+    }
+    else
+    {
+        fdivH.setAttribute("class", "icon_white");
+        fdivH.setAttribute("style", "background-position:-611px 50%;");
+        fdivH.onclick = function() { this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage('help-'+name, z, +1); }
+    }
+
 
     fdiv0.setAttribute("style", "font-size:large;");
@@ -538,6 +560,6 @@
     fdiv1.id = "localtime"+z;
 
-    fdiv0.appendChild(document.createTextNode("logbook"));
-    fdiv1.appendChild(document.createTextNode("loading..."));
+    fdiv0.appendChild($txt("logbook"));
+    fdiv1.appendChild($txt("loading..."));
 
     ftdH.appendChild(fdivH);
@@ -571,9 +593,9 @@
             var data = cols[1].substring(check[0].length+1).split("/");
 
-            var tr = document.createElement("tr");
+            var tr = $new("tr");
             tr.setAttribute("class", "row");
             //tr.setAttribute("style", "margin:0;padding:0;");
 
-            var td = document.createElement("td");
+            var td = $new("td");
             td.setAttribute("class", "container");
             td.id = "container";
@@ -581,5 +603,5 @@
             tr.appendChild(td);
 
-            var canv = document.createElement("canvas");
+            var canv = $new("canvas");
             canv.id = "canvas"+z;
             canv.width = "1";
@@ -592,5 +614,5 @@
             td.appendChild(canv);
 
-            var img = document.createElement("img");
+            var img = $new("img");
             img.src = "img/dummy.png";//needed in firefox
             img.id = "image"+z;
@@ -602,5 +624,5 @@
         }
 
-        var tr = document.createElement("tr");
+        var tr = $new("tr");
         tr.setAttribute("class", "row");
         if (valid(cols[0]))
@@ -609,5 +631,5 @@
             tr.setAttribute("onclick", "this.style.background='#ccb'; loadPage('"+cols[3]+"', "+z+", +1);");
 
-        var td0 = document.createElement("td");
+        var td0 = $new("td");
         td0.setAttribute("class", "tcol0");
         tr.appendChild(td0);
@@ -615,5 +637,5 @@
         if (check.length>0 && check[0]=="image")
         {
-            var img = document.createElement("img");
+            var img = $new("img");
             img.style.width="100%";
             img.src = check[1];
@@ -629,5 +651,5 @@
         if (valid(cols[0]))
         {
-            var sp = document.createElement("div");
+            var sp = $new("div");
             sp.setAttribute("class", "icon_black");
             sp.setAttribute("style", "background-position: -144px 50%;");
@@ -635,10 +657,10 @@
         }
 
-        var td1 = document.createElement("td");
+        var td1 = $new("td");
         td1.setAttribute("class", "tcol1");
         td1.width = "100%";
         tr.appendChild(td1);
 
-        var td2 = document.createElement("td");
+        var td2 = $new("td");
         td2.setAttribute("class", "tcol2");
         td2.width = "18px";
@@ -646,5 +668,5 @@
         if (valid(cols[3]))
         {
-            var sp = document.createElement("div");
+            var sp = $new("div");
             sp.setAttribute("class", "icon_black");
             sp.setAttribute("style", "background-position: -108px 50%;");
@@ -653,23 +675,23 @@
         tr.appendChild(td2);
 
-        var tab = document.createElement("table");
+        var tab = $new("table");
         tab.width = "100%";
         td1.appendChild(tab);
 
-        var innertr = document.createElement("tr");
+        var innertr = $new("tr");
         tab.appendChild(innertr);
 
-        var cell1 = document.createElement("td");
+        var cell1 = $new("td");
         cell1.setAttribute("class", "tcell1");
 
-        var cell2 = document.createElement("td");
+        var cell2 = $new("td");
         cell2.setAttribute("class", valid(cols[1]) ? "tcell2" : "tcell2l");
 
         if (check.length==0 || check[0]!="input")
         {
-            var div = document.createElement("div");
+            var div = $new("div");
             div.innerHTML = cols[1];
             cell1.appendChild(div);
-            //cell1.appendChild(document.createTextNode(cols[1]));
+            //cell1.appendChild($txt(cols[1]));
 
             if (cols.length>2 && cols[2].length>0)
@@ -677,5 +699,5 @@
                 cell2.id = "data"+z+"-"+counter;
                 cell2.setAttribute("data-form",  cols[2]);
-                cell2.appendChild(document.createTextNode("---"));
+                cell2.appendChild($txt("---"));
                 counter++;
             }
@@ -690,10 +712,10 @@
                 alert("Argument name missing for'"+check[1]+"'");
 
-            var div = document.createElement("div");
+            var div = $new("div");
             div.innerHTML = opt[0];
             cell1.appendChild(div);
-            //cell1.appendChild(document.createTextNode(opt[0]));
-
-            var input = document.createElement("input");
+            //cell1.appendChild($txt(opt[0]));
+
+            var input = $new("input");
             input.name = opt[1];
             input.type = "text";
@@ -713,17 +735,17 @@
     if (true)
     {
-        tr = document.createElement("tr");
+        tr = $new("tr");
         tr.setAttribute("class", "row");
 
-        td = document.createElement("td");
+        td = $new("td");
         td.colSpan = "3";
         tr.appendChild(td);
 
-        var sp = document.createElement("div");
+        var sp = $new("div");
         sp.setAttribute("class", "icon_color");
         sp.setAttribute("style", "background-position: -144px -14px;");
         td.appendChild(sp);
 
-        sp = document.createElement("div");
+        sp = $new("div");
         sp.setAttribute("class", "icon_color");
         sp.setAttribute("style", "background-position: -56px -14px;");
@@ -738,8 +760,8 @@
     if (debug == true)
     {
-        tr = document.createElement("tr");
+        tr = $new("tr");
         tr.setAttribute("class", "row");
 
-        td = document.createElement("td");
+        td = $new("td");
         td.id = "debug"+z;
         td.colSpan = 3;
@@ -923,10 +945,18 @@
 {
     var z=$("body").getAttribute("data-visible");
-    var table = $("table"+z);
-
-    // Is sliding or no file defined?
-    var fname = table.getAttribute("data-file");
-    if (isSliding() || !valid(fname))
-    {
+
+    var fname = $("table"+z).getAttribute("data-file");
+
+    var is_help = fname.substr(0,5)=="help-";
+
+    // Is sliding, no file defined or just help text?
+    if (isSliding() || !valid(fname) || is_help)
+    {
+        if (is_help)
+        {
+            setUTC($("localtime"+z), new Date());
+            $("reporttime"+z).innerHTML="";
+        }
+
         // invalidate?
         timeoutText = setTimeout(refresh_text, 1000);
@@ -998,14 +1028,13 @@
         rtime.style.color = "";
 
-    var str_file = stamp.toUTCString();
-    var str_now  = now.toUTCString();
-
-    var utc_file = str_file.substr(str_file.length-12, 8);
-    var utc_now  = str_now.substr(str_now.length-12, 8);
-
-    rtime.innerHTML = "• "+utc_file+" UTC •"
-    ltime.innerHTML = "• "+utc_now +" UTC •";
-
-    $("warn"+z).style.display = header.length<2 || header[1]=='0' ? "none" : "";
+    setUTC(rtime, stamp);
+    setUTC(ltime, now);
+
+    // ----------------------------------------------------
+
+    $("warn"+z).style.display = header.length>=2 && header[1]=='1' ? "" : "none";
+
+    if (header.length==3)
+        $("cmd"+z).style.backgroundColor = header[2]=='1' ? "darkgreen" : "darkred";
 
     // ----------------------------------------------------
@@ -1019,5 +1048,5 @@
             continue;
 
-        var e = document.getElementById("data"+z+"-"+line);
+        var e = $("data"+z+"-"+line);
         if (e == undefined)
             continue;
@@ -1041,5 +1070,5 @@
         form = form.replace(/--:--:--/g, "<pre>  </pre> <pre>  </pre> <pre>  </pre>");
 
-        var newe = document.createElement("div");
+        var newe = $new("div");
         newe.innerHTML = form;
         e.replaceChild(newe, e.lastChild);
@@ -1100,14 +1129,4 @@
     if (hue<4) return parseInt(255*(4-hue), 10);
 
-/*
-    if (hue<1*5/4) return parseInt(255*hue*4/5);
-    if (hue<2*5/4) return parseInt(255);
-    if (hue<3*5/4) return parseInt(255*(3*5/4-hue)*4/5);
-*/
-/*
-    if (hue<1.5) return parseInt(255*hue/1.5);
-    if (hue<3.0) return parseInt(255);
-    if (hue<4.5) return parseInt(255*(4.5-hue)/1.5);
-*/
     return 0.
 }
@@ -1129,5 +1148,4 @@
     return sr+sg+sb;
 }
-
 
 function color(col)
@@ -1296,16 +1314,12 @@
 function drawCamLegend(canv, data)
 {
+    var unit = htmlDecode(canv.getAttribute("data-data"));
+
     var umin = data[1];
     var umax = data[2];
 
-    var unit = htmlDecode(canv.getAttribute("data-data"));
-    //unit = unit.replace("&deg;",   "\u00B0");
-    //unit = unit.replace("&micro;", "\u00B5");
-    //unit = unit.replace("&sup2;",  "\u00B2");
-    //unit = unit.replace("&sup3;",  "\u00B3");
-
-    var min = data[3]+unit
-    var med = data[4]+unit;
-    var max = data[5]+unit;
+    var min  = data[3]+unit
+    var med  = data[4]+unit;
+    var max  = data[5]+unit;
 
     var v0 = parseFloat(umin);
@@ -1345,9 +1359,4 @@
     var unit = htmlDecode(canv.getAttribute("data-data"));//.split("/");
 
-    //unit = unit.replace("&deg;",   "\u00B0");
-    //unit = unit.replace("&micro;", "\u00B5");
-    //unit = unit.replace("&sup2;",  "\u00B2");
-    //unit = unit.replace("&sup3;",  "\u00B3");
-
     var umin = vals[1]+unit;
     var umax = vals[2]+unit;
@@ -1361,5 +1370,4 @@
 
     var dw = 3;  // tick width
-
     var fs = 8;  // font size
 
@@ -1493,5 +1501,5 @@
     if (tm.getTime()+60000<now.getTime())
     {
-        ctx.fillStyle = "rgba(255, 255, 255, 0.85)";
+        ctx.fillStyle = "rgba(255, 255, 255, 0.75)";
         ctx.fillRect(0, 0, canv.width, canv.height);
     }