first semi-working version of test-div-coord.html page
authorMatteo Nastasi (mop) <nastasi@alternativeoutput.com>
Mon, 5 Dec 2011 07:40:26 +0000 (08:40 +0100)
committerMatteo Nastasi (mop) <nastasi@alternativeoutput.com>
Mon, 5 Dec 2011 07:40:52 +0000 (08:40 +0100)
commons.js
test-div-coord.html [new file with mode: 0644]
xynt-console.js

index f3ea07c..cb8076f 100644 (file)
@@ -1,4 +1,14 @@
-  function $(id) { return document.getElementById(id); }
+function $(id) { return document.getElementById(id); }
+
+function getStyle(x,IEstyleProp, MozStyleProp) 
+{
+    if (x.currentStyle) {
+        var y = x.currentStyle[IEstyleProp];
+    } else if (window.getComputedStyle) {
+        var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(MozStyleProp);
+    }
+    return y;
+}
 
   /* replacement of setInterval on IE */
 (function(){
diff --git a/test-div-coord.html b/test-div-coord.html
new file mode 100644 (file)
index 0000000..09af921
--- /dev/null
@@ -0,0 +1,91 @@
+<html>
+<head>
+<script type="text/javascript" src="commons.js"></script>
+<script type="text/javascript" src="xynt-console.js"></script>
+<script type="text/javascript" src="xynt-dd.js"></script>
+<script type="text/javascript" src="xynt-link.js"></script>
+<script type="text/javascript">
+
+function resize()
+{
+    //var w = getStyle(window.document.body, "width", "width");
+    //var h = getStyle(window.document.body, "height", "height");
+    var w = window.innerWidth;
+    var h = window.innerHeight;
+
+    console.log("W: "+w+" H: "+h);
+
+    $('board').style.left    =  (parseInt(w) / 2 - 2 + 2)+"px";
+    $('board').style.top     =  "0px";
+    $('board').style.width   =  (parseInt(w) / 2 - 2)+"px";
+    $('board').style.height  =  (parseInt(h) - 2)+"px";
+    $('board2').style.top    =  "0px";
+    $('board2').style.left   =  "0px";
+    $('board2').style.width  =  (parseInt(w) / 2 - 2)+"px";
+    $('board2').style.height =  (parseInt(h) - 2)+"px";
+
+    var h1 = $('board').clientHeight;
+    var h2 = $('board2').clientHeight;
+    if (h1 > h2) {
+        $('board').style.height = h2+"px";
+    }
+    else if (h2 > h1) {
+        $('board2').style.height = h1+"px"; 
+    }
+
+    console.log($('board').scrollTop);
+    $('board2-sub').scrollTop = $('board').scrollTop;
+}
+
+function scroll() {
+    console.log("scroll");
+    $('board2-sub').style.top = -parseInt($('board').scrollTop)+"px";
+}
+
+function scroll2() {
+    console.log("scroll2:");
+}
+
+window.onload = function () {
+    resize();
+    return;
+
+    // window.setTimeout(exchange, 2000);
+
+    Drag.call($('t1'), dropr1, -1600, 1600, 10,10);
+    Drag.call($('t2'), dropr2, -1600, 1600, 10,10);
+    Drag.call($('t3'), dropr1, -1600, 1600, 10,10);
+    Drag.call($('t4'), dropr2, -1600, 1600, 10,10);
+    Drag.call($('r1'), dropr1, 0,0, -900,900);
+    Drag.call($('r2'), dropr2, 0,0, -900,900);
+    Drag.call($('r3'), dropr3, 0,0, -900,900);
+    Drag.call($('r4'), dropr4, 0,0, -900,900);
+
+    l = new tasks_link($('board'), $('t1'), $('t2'), "ss");
+    l = new tasks_link($('board'), $('t3'), $('t4'), "ss");
+
+}
+</script>
+
+</head>
+<body style="margin: 0px; padding: 0px;">
+<!-- task:begin -->
+
+<div  id="board2" style="width: 10%; height: 10%; background-color: #f0f0f0; border: 1px solid black; position: absolute; overflow-y: hidden; overflow-x: scroll;" onclick="resize();" onscroll="scroll2('scroll');">
+<div id="board2-sub" style="width: 10%; height: 10%; background-color: #f0f0f0; border: 0px solid black; position: absolute;" onclick="resize();" onscroll="scroll2('scroll');">
+aa1<br>aa2<br>aa3<br>aa4<br>aa5<br>aa6<br>aa7<br>aa8<br>aa9<br>aaA<br>aaB<br>aaC<br>aaD<br>aaE<br>aaF<br>aa0<br>
+aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
+bb1<br>bb2<br>bb3<br>bb4<br>bb5<br>bb6<br>bb7<br>bb8<br>bb9<br>bbA<br>bbB<br>bbC<br>bbD<br>bbE<br>bbF<br>bb0<br>
+</div>
+</div>
+
+<div id="board" style="width: 10%; height: 10%; background-color: #f0f0f0; border: 1px solid black; overflow-y: scroll; position: absolute;" onclick="resize();" onscroll="scroll('scroll');">
+aa1<br>aa2<br>aa3<br>aa4<br>aa5<br>aa6<br>aa7<br>aa8<br>aa9<br>aaA<br>aaB<br>aaC<br>aaD<br>aaE<br>aaF<br>aa0<br>
+aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
+bb1<br>bb2<br>bb3<br>bb4<br>bb5<br>bb6<br>bb7<br>bb8<br>bb9<br>bbA<br>bbB<br>bbC<br>bbD<br>bbE<br>bbF<br>bb0<br>
+</div>
+  
+</body>
+</html>
index b0cb0ff..573e1f3 100644 (file)
@@ -50,7 +50,6 @@ xynt_console.prototype = {
     dump_obj: function(s, ind) {
         var sind = "";
 
-        alert(ind);
         sind = "<span style=\"background-color:#f0f0f0;\">";
         for (i = 0 ; i < ind ; i++) {
             sind += "&nbsp;";