Index: /trunk/FACT++/www/smartfact/index.js
===================================================================
--- /trunk/FACT++/www/smartfact/index.js	(revision 13844)
+++ /trunk/FACT++/www/smartfact/index.js	(revision 13845)
@@ -232,5 +232,11 @@
 {
     var z = $("body").getAttribute("data-visible");
+
+    //$("table"+z).style.width="100%";
+    $("image"+z).style.width="1px";
+    $("canvas"+z).width=1;
+
     doresize(z);
+
 }
 
@@ -351,5 +357,5 @@
     /*table.width = "100%";*/
     //table.setAttribute("style", "overflow:hidden;position:fixed;top:0px;left:"+window.innerWidth+"px;");
-    table.setAttribute("style", "position:absolute;top:0px;left:"+window.innerWidth+"px;");
+    table.setAttribute("style", "position:absolute;top:0px;left:"+window.innerWidth+"px;width:100%;");
 
     // -----------------------------------------------------
@@ -589,4 +595,5 @@
         td2.setAttribute("class", "tcol2");
         td2.width = "18px";
+
         if (valid(cols[3]))
         {
@@ -609,5 +616,5 @@
 
         var cell2 = document.createElement("td");
-        cell2.setAttribute("class", "tcell2");
+        cell2.setAttribute("class", valid(cols[1]) ? "tcell2" : "tcell2l");
 
         if (check.length==0 || check[0]!="input")
@@ -700,7 +707,6 @@
 }
 
-function resizeimpl(z, cnt)
-{
-    // 393 / 482    488/482 / 200   200+482-488
+function doresize(z)
+{
     var img  = $("image"+z);
     var canv = $("canvas"+z);
@@ -718,29 +724,50 @@
     var H = fixedh>0 ? fixedh : window.innerHeight;
 
-    $("table"+z).style.width = W+"px";
-
-/*
-    if (W==0 || H==0)
-    {
-        var w = $("table"+z).offsetWidth;
-        img.style.width = w+"px";
-        img.style.height= w+"px";
-
-        canv.width  = w;
-        canv.height = w;
-        return;
-    }
-    */
+    //alert(window.innerWidth+"/"+$("body").scrollWidth+"/"+$("table"+z).scrollWidth);
+
+    // wIw   bSw   tSw
+    // 430 / 860 / 430
+    // 429 / 430 / 430
+    // 366 / 430 / 430
+
+    // 672 / 1344 /  672
+    // 672 / 1329 / 1329
+
+    // Chrome: needs scrollbar
+    // wiW  bsW  tsW  bcW  tcW  boW  toW
+    // 100  200  100   84  100   84  100
+    // 100   85   85   69   85   79   85
+
+    // Chrome: does not need scrollbar
+    //  100  200  100  84  100   84  100
+    //  100  100  100  84  100   84  100
+
+    // Firefox: does not need scrollbar
+    //  100   84  100  84  100   84  100
+    //  100   84  100  84  100   84  100
+
+    // Firefox: does need scrollbar
+    //  100   84  100  84  100   84  100
+    //  100   69   85  69   85   69   85
+
+    // opera no scrollbar:
+    //  100   84  100  84  100   84  100
+    //  100   84  100  84  100   84  100
 
     var max = $("body").getAttribute("data-max")=="yes";
 
-
     var ih = max ? W : H - h + parseInt(img.style.height, 10);
 
-    img.style.width = W +"px";
-    img.style.height= ih+"px";
-
-    canv.width  = W;
-    canv.height = ih;
+    // This might create the scroll bar
+    img.style.height = ih+"px";
+    canv.height      = ih;
+
+    // now we can evaluate the correct view-port
+    // (-2 is the border size of the parent element 'container')
+    //var sW = (fixedw ? fixedw : $("table"+z).scrollWidth)-2;
+    var sW = fixedw ? fixedw : canv.parentNode.clientWidth;
+
+    img.style.width = sW+"px";
+    canv.width      = sW;
 
     // ------ debug -----
@@ -752,14 +779,4 @@
         $('debug'+z).innerHTML += "|I="+img.style.height+"+"+H+"-"+h;
     }
-
-    if ($("table"+z).offsetHeight == H || cnt==2)
-        return;
-
-    resizeimpl(z, ++cnt);
-}
-
-function doresize(z)
-{
-    resizeimpl(z, 0);
 }
 
@@ -798,8 +815,11 @@
         $("table"+newz).style.left = (-W-1)+"px";
 
-    //window.clearTimeout(timeoutText);
-    //window.clearTimeout(timeoutGraphics);
-
     $("body").setAttribute("data-visible", newz);
+
+    // This is needed on my mobile to ensure that te browser
+    // doesn't try to zoom during shifting
+    //    $("table"+newz).style.position="fixed";
+    //    $("table"+oldz).style.position="fixed";
+
     intervalSlide = setInterval(function(){doShift(oldz,newz)}, 75);
 }
@@ -814,4 +834,9 @@
         clearInterval(intervalSlide);
         $("body").removeChild(t0);
+
+        // t1.style.position="absolute";
+
+        // Now the scroll bar might have to appear or disappear
+        doresize(newz);
         return;
     }
@@ -981,4 +1006,8 @@
         if (cols.length<=1)
             form = "&mdash;";
+
+        form = form.replace(/<#(.*?)>/g, "<font color='$1'>");
+        form = form.replace(/<([\+-])>/g, "<font size='$11'>");
+        form = form.replace(/<\/([#\+-])>/g, "</font>");
 
         var newe = document.createElement("div");
@@ -1258,5 +1287,5 @@
     {
         ctx.strokeStyle = "#"+color(16*i);
-        ctx.strokeText((v0+diff*i/10).toPrecision(3)+unit, cw-5, 120-i*12);
+        ctx.strokeText((v0+diff*i/10).toPrecision(3)+unit, cw-5, 125-i*12);
     }
 }
