first commit
authorMatteo Nastasi <matteo.nastasi@lucinilucini.com>
Fri, 11 Nov 2011 08:15:15 +0000 (09:15 +0100)
committerMatteo Nastasi <matteo.nastasi@lucinilucini.com>
Fri, 11 Nov 2011 08:15:15 +0000 (09:15 +0100)
commons.js [new file with mode: 0644]
img/arrow_do.png [new file with mode: 0644]
img/arrow_le.png [new file with mode: 0644]
img/arrow_ri.png [new file with mode: 0644]
img/arrow_up.png [new file with mode: 0644]
mplanner.html [new file with mode: 0644]
xynt-dd.js [new file with mode: 0644]
xynt-link.js [new file with mode: 0644]

diff --git a/commons.js b/commons.js
new file mode 100644 (file)
index 0000000..f3ea07c
--- /dev/null
@@ -0,0 +1,89 @@
+  function $(id) { return document.getElementById(id); }
+
+  /* replacement of setInterval on IE */
+(function(){
+    /*if not IE, do nothing*/
+    if(!document.uniqueID){return;};
+
+    /*Copy the default setInterval behavior*/
+    var nativeSetInterval = window.setInterval;
+    window.setInterval = function(fn,ms) {              
+        var param = [];
+        if(arguments.length <= 2)       {
+            return nativeSetInterval(fn,ms);
+        }
+        else {
+            for(var i=2;i<arguments.length;i+=1) {
+                param[i-2] =  arguments[i];
+            }   
+        }
+        
+        if(typeof(fn)=='function') {
+            
+            return (function (fn,ms,param) {
+                var fo = function () {                                                          
+                    fn.apply(window,param);
+                };                      
+                return nativeSetInterval(fo,ms); 
+            })(fn,ms,param);
+        }
+        else if(typeof(fn)=='string')
+        {
+            return  nativeSetInterval(fn,ms);
+        }
+        else
+        {
+            throw Error('setInterval Error\nInvalid function type');
+        };
+    };
+
+    /*Copy the default setTimeout behavior*/
+    var nativeSetTimeout = window.setTimeout;
+    window.setTimeout = function(fn,ms) {               
+        var param = [];
+        if(arguments.length <= 2)       {
+            return nativeSetTimeout(fn,ms);
+        }
+        else {
+            for(var i=2;i<arguments.length;i+=1) {
+                param[i-2] =  arguments[i];
+            }   
+        }
+        
+        if(typeof(fn)=='function') {
+            
+            return (function (fn,ms,param) {
+                var fo = function () {                                                          
+                    fn.apply(window,param);
+                };                      
+                return nativeSetTimeout(fo,ms); 
+            })(fn,ms,param);
+        }
+        else if(typeof(fn)=='string')
+        {
+            return  nativeSetTimeout(fn,ms);
+        }
+        else
+        {
+            throw Error('setTimeout Error\nInvalid function type');
+        };
+    };
+
+})()
+
+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;
+}
+
+function doSomething(e) {
+       if (!e) var e = window.event
+       // handle event
+       e.cancelBubble = true;
+       if (e.stopPropagation) e.stopPropagation();
+}
\ No newline at end of file
diff --git a/img/arrow_do.png b/img/arrow_do.png
new file mode 100644 (file)
index 0000000..7815d6f
Binary files /dev/null and b/img/arrow_do.png differ
diff --git a/img/arrow_le.png b/img/arrow_le.png
new file mode 100644 (file)
index 0000000..c910177
Binary files /dev/null and b/img/arrow_le.png differ
diff --git a/img/arrow_ri.png b/img/arrow_ri.png
new file mode 100644 (file)
index 0000000..9506d7a
Binary files /dev/null and b/img/arrow_ri.png differ
diff --git a/img/arrow_up.png b/img/arrow_up.png
new file mode 100644 (file)
index 0000000..a3bb571
Binary files /dev/null and b/img/arrow_up.png differ
diff --git a/mplanner.html b/mplanner.html
new file mode 100644 (file)
index 0000000..2fc0ef3
--- /dev/null
@@ -0,0 +1,72 @@
+<html>
+<head>
+<script type="text/javascript" src="commons.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 exchange()
+{
+    r1 = $('r1');
+    r2 = $('r2');
+    pr1 = r1.parentNode;
+    pr2 = r2.parentNode;
+
+    pr1.removeChild(r1);
+    pr1.removeChild(r2);
+
+    pr1.appendChild(r2);
+    pr1.appendChild(r1);
+                                                 
+}
+
+function dropr1()
+{
+    ; // alert("r1");
+}
+
+function dropr2()
+{
+    ; // alert("r2");
+}
+
+window.onload = function () {
+    // window.setTimeout(exchange, 2000);
+
+
+    Drag.init($('t1'), dropr1, $('t1'), -1600, 1600, 10,10);
+    Drag.init($('t2'), dropr2, $('t2'), -1600, 1600, 10,10);
+    Drag.init($('r1'), dropr1, $('r1'), 0,0, -900,900);
+    Drag.init($('r2'), dropr2, $('r2'), 0,0, -900,900);
+
+   l = new tasks_link($('lnk1'), $('board'), $('t1'), $('t2'), "ss");
+
+}
+</script>
+
+</head>
+<body>
+<!-- task:begin -->
+<div id="board" style="width: 1600; height: 800px; background-color: #f0f0f0; border: 1px solid black; position: relative;">
+  <div id="r1" style="width: 1600; height: 40px; left: 0px; top: 0px; background-color: #e8e8e8; border: 0px solid red; position: absolute;">
+    <div id="t1" style="z-index: 1; left: 10px; top: 10px; width: 100px; height: 21px; border: 1px solid gray; background-color: #c0c0ff; position: absolute;"></div>
+  </div>
+  
+  <div id="r2" style="width: 1600;  left: 0px; top: 40px; height: 40px; background-color: #e8e8ff; border: 0px solid red; position: absolute;">
+    <div id="t2" style="z-index: 1; left: 123px; top: 10px; width: 100px; height: 21px; border: 1px solid gray; background-color: #c0ffc0; position: absolute;"></div>
+    <!-- <img style="position: absolute; left: 118; top: 17px;" src="arrow_ri.png"> -->
+  </div>
+
+  
+  <!-- task:end -->
+  
+  <!-- arrow:begin -->
+  
+  <div id="lnk1" style="z-index: 1; left: 0px; top: 0px; width: 5px; height: 5px; border: 0px solid gray; /* background-color: red; */ visibility: hidden; position: absolute;"></div>
+  
+  <!-- arrow:end -->
+  
+</div>
+</body>
+</html>
diff --git a/xynt-dd.js b/xynt-dd.js
new file mode 100644 (file)
index 0000000..b07fbe1
--- /dev/null
@@ -0,0 +1,200 @@
+/*\r
+ *  brisk - dom-drag.js\r
+ *\r
+ *  Copyright (C) 2006-2011 Matteo Nastasi\r
+ *                          mailto: nastasi@alternativeoutput.it \r
+ *                                  matteo.nastasi@milug.org\r
+ *                          web: http://www.alternativeoutput.it\r
+ *\r
+ * This program is free software; you can redistribute it and/or modify\r
+ * it under the terms of the GNU General Public License as published by\r
+ * the Free Software Foundation; either version 2 of the License, or\r
+ * (at your option) any later version.\r
+ *\r
+ * This program is distributed in the hope that it will be useful, but\r
+ * WITHOUT ANY WARRANTY; without even the implied warranty of\r
+ * MERCHANTABLILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU\r
+ * General Public License for more details. You should have received a\r
+ * copy of the GNU General Public License along with this program; if\r
+ * not, write to the Free Software Foundation, Inc, 59 Temple Place -\r
+ * Suite 330, Boston, MA 02111-1307, USA.\r
+ *\r
+ */\r
+\r
+/**************************************************\r
+ * dom-drag.js\r
+ * 09.25.2001\r
+ * www.youngpup.net\r
+ **************************************************\r
+ * 10.28.2001 - fixed minor bug where events\r
+ * sometimes fired off the handle, not the root.\r
+ **************************************************/\r
+\r
+var Drag = {\r
+\r
+       obj : null,\r
+\r
+       init : function(o, mouseup_cb, oRoot, minX, maxX, minY, maxY, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper)\r
+       {\r
+           o.onmousedown   = Drag.start;\r
+           o.mouseup_cb    = mouseup_cb;\r
+            o.connected     = new Array();\r
+               /*              alert("agnulla"+o.style.left); */\r
+\r
+               o.hmode                 = bSwapHorzRef ? false : true ;\r
+               o.vmode                 = bSwapVertRef ? false : true ;\r
+\r
+               o.root = oRoot && oRoot != null ? oRoot : o ;\r
+\r
+               if (o.hmode && isNaN(parseInt(o.root.style.left  ))) {\r
+                    var res = parseInt(getStyle(o, "left", "left"));\r
+                   if (isNaN(res)) {\r
+                       o.root.style.left   = "0px";\r
+                   }\r
+                   else {\r
+                       o.root.style.left   = res;\r
+                   }\r
+               }\r
+               if (o.vmode  && isNaN(parseInt(o.root.style.top   ))) {\r
+                    var res = parseInt(getStyle(o, "top", "top"));\r
+                   if (isNaN(res)) {\r
+                       o.root.style.top   = "0px";\r
+                   }\r
+                   else {\r
+                       o.root.style.top   = res;\r
+                   }\r
+               }\r
+               if (!o.hmode && isNaN(parseInt(o.root.style.right ))) o.root.style.right  = "0px";\r
+               if (!o.vmode && isNaN(parseInt(o.root.style.bottom))) o.root.style.bottom = "0px";\r
+\r
+               o.minX  = typeof minX != 'undefined' ? minX : null;\r
+               o.minY  = typeof minY != 'undefined' ? minY : null;\r
+               o.maxX  = typeof maxX != 'undefined' ? maxX : null;\r
+               o.maxY  = typeof maxY != 'undefined' ? maxY : null;\r
+\r
+               o.xMapper = fXMapper ? fXMapper : null;\r
+               o.yMapper = fYMapper ? fYMapper : null;\r
+\r
+               o.root.onDragStart      = new Function();\r
+               o.root.onDragEnd        = new Function();\r
+               o.root.onDrag           = new Function();\r
+       },\r
+\r
+       start : function(e)\r
+       {\r
+               var o = Drag.obj = this;\r
+               e = Drag.fixE(e);\r
+\r
+               if (!e) \r
+                   var e = window.event\r
+              // handle event\r
+              e.cancelBubble = true;\r
+              if (e.stopPropagation) \r
+                   e.stopPropagation();\r
+\r
+               o.oldzidx = o.style.zIndex;\r
+               o.style.zIndex = 10;\r
+\r
+               // alert("start");\r
+\r
+               var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);\r
+               var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );\r
+               o.root.onDragStart(x, y);\r
+\r
+               o.lastMouseX    = e.clientX;\r
+               o.lastMouseY    = e.clientY;\r
+\r
+               if (o.hmode) {\r
+                       if (o.minX != null)     o.minMouseX     = e.clientX - x + o.minX;\r
+                       if (o.maxX != null)     o.maxMouseX     = o.minMouseX + o.maxX - o.minX;\r
+               } else {\r
+                       if (o.minX != null) o.maxMouseX = -o.minX + e.clientX + x;\r
+                       if (o.maxX != null) o.minMouseX = -o.maxX + e.clientX + x;\r
+               }\r
+\r
+               if (o.vmode) {\r
+                       if (o.minY != null)     o.minMouseY     = e.clientY - y + o.minY;\r
+                       if (o.maxY != null)     o.maxMouseY     = o.minMouseY + o.maxY - o.minY;\r
+               } else {\r
+                       if (o.minY != null) o.maxMouseY = -o.minY + e.clientY + y;\r
+                       if (o.maxY != null) o.minMouseY = -o.maxY + e.clientY + y;\r
+               }\r
+\r
+               document.onmousemove    = Drag.drag;\r
+               document.onmouseup      = Drag.end;\r
+\r
+            for(var i = 0 ; i < o.connected.length ; i++) {\r
+                o.connected[i].update('start', o);\r
+            }\r
+\r
+               return false;\r
+       },\r
+\r
+       drag : function(e)\r
+       {\r
+               e = Drag.fixE(e);\r
+               var o = Drag.obj;\r
+\r
+               var ey  = e.clientY;\r
+               var ex  = e.clientX;\r
+               var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);\r
+               var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );\r
+               var nx, ny;\r
+\r
+               if (o.minX != null) ex = o.hmode ? Math.max(ex, o.minMouseX) : Math.min(ex, o.maxMouseX);\r
+               if (o.maxX != null) ex = o.hmode ? Math.min(ex, o.maxMouseX) : Math.max(ex, o.minMouseX);\r
+               if (o.minY != null) ey = o.vmode ? Math.max(ey, o.minMouseY) : Math.min(ey, o.maxMouseY);\r
+               if (o.maxY != null) ey = o.vmode ? Math.min(ey, o.maxMouseY) : Math.max(ey, o.minMouseY);\r
+\r
+               nx = x + ((ex - o.lastMouseX) * (o.hmode ? 1 : -1));\r
+               ny = y + ((ey - o.lastMouseY) * (o.vmode ? 1 : -1));\r
+\r
+               if (o.xMapper)          nx = o.xMapper(y)\r
+               else if (o.yMapper)     ny = o.yMapper(x)\r
+\r
+               Drag.obj.root.style[o.hmode ? "left" : "right"] = nx + "px";\r
+               Drag.obj.root.style[o.vmode ? "top" : "bottom"] = ny + "px";\r
+               Drag.obj.lastMouseX     = ex;\r
+               Drag.obj.lastMouseY     = ey;\r
+\r
+               Drag.obj.root.onDrag(nx, ny);\r
+\r
+            for(var i = 0 ; i < o.connected.length ; i++) {\r
+                o.connected[i].update('drag', o);\r
+            }\r
+\r
+               return false;\r
+       },\r
+\r
+       end : function(e)\r
+       {\r
+               e = Drag.fixE(e);\r
+               var o = Drag.obj;\r
+\r
+               o.style.zIndex = o.oldzidx;\r
+               // alert("END");\r
+               if (o.mouseup_cb != null) {\r
+                   if (o.mouseup_cb(o) == 1) {\r
+                       o.onmousedown = null;\r
+                   }\r
+               }\r
+\r
+               document.onmousemove = null;\r
+               document.onmouseup   = null;\r
+               Drag.obj.root.onDragEnd(        parseInt(Drag.obj.root.style[Drag.obj.hmode ? "left" : "right"]), \r
+                                                                       parseInt(Drag.obj.root.style[Drag.obj.vmode ? "top" : "bottom"]));\r
+            for(var i = 0 ; i < o.connected.length ; i++) {\r
+                o.connected[i].update('end', o);\r
+            }\r
+\r
+               Drag.obj = null;\r
+       },\r
+\r
+       fixE : function(e)\r
+       {\r
+               if (typeof e == 'undefined') e = window.event;\r
+               if (typeof e.layerX == 'undefined') e.layerX = e.offsetX;\r
+               if (typeof e.layerY == 'undefined') e.layerY = e.offsetY;\r
+               return e;\r
+       }\r
+};\r
diff --git a/xynt-link.js b/xynt-link.js
new file mode 100644 (file)
index 0000000..da15cbe
--- /dev/null
@@ -0,0 +1,90 @@
+function tasks_link(o, anc, a, b, type) {
+    var cur;
+    this.o = o;
+    this.anc = anc;
+    this.beg = document.createElement("div");
+    this.end = document.createElement("div");
+    this.arr = document.createElement("img");
+    this.arr.style.position = "absolute";
+    o.appendChild(this.arr);
+    for (var i = 0 ; i < 2 ; i++) {
+        cur = i == 0 ? this.beg : this.end;
+        cur.style.width = '5px';
+        cur.style.height = '5px';
+        cur.style.backgroundColor = 'gray';
+        cur.style.visibility = 'inherit';
+        cur.style.zIndex = 20;
+        cur.style.position = 'absolute';
+        o.appendChild(cur);
+        // alert("gugu");
+    }
+    
+    this.a = a;
+    this.b = b;
+    this.type = type;
+
+    if (typeof(a.connected) != 'object')
+        return null;
+
+    if (typeof(b.connected) != 'object')
+        return null;
+
+    for (var i = 0 ; i < 2 ; i++) {
+        cur = (i == 0 ? a : b);
+        cur.connected[cur.connected.length++] = this;
+        for( ; cur.parentNode != null && cur.parentNode != anc ; cur = cur.parentNode) {
+            cur.parentNode.connected[cur.parentNode.connected.length++] = this;
+        }
+    }
+    this.update()
+}
+
+tasks_link.prototype = {
+    a: null,
+    b: null,
+    type: null,
+
+    update: function(method, obj)
+    {
+        /*
+        if (method == 'end') {
+            if (this.o.style.visibility == 'visible')
+                this.o.style.visibility = 'hidden';
+            else
+                this.o.style.visibility = 'visible';
+        }
+        */
+        
+        // FIXME you need to user the width of the border instead of +2
+        this.beg.style.left = (parseInt(this.a.style.left) + parseInt(this.a.style.width) + 2 + parseInt(this.a.parentNode.style.left))+"px";
+        this.beg.style.top  = (parseInt(this.a.style.top)  + parseInt(((parseInt(this.a.style.height) + 2) / 2)) + parseInt(this.a.parentNode.style.top))+"px";
+        this.beg.style.width = (parseInt(this.b.style.left) - (parseInt(this.a.style.left) + 2 + parseInt(this.b.style.width) + 2)+ parseInt(this.b.parentNode.style.left) + 5)+"px";
+        this.beg.style.height = "1px";
+
+        this.end.style.left = (parseInt(this.beg.style.left) + parseInt(this.beg.style.width))+"px";
+        this.arr.style.left = (parseInt(this.end.style.left) - 3)+"px";
+        /* this.end.style.left = (parseInt(this.b.style.left) + parseInt(this.b.parentNode.style.left))+"px";
+           this.end.style.top  = (parseInt(this.b.style.top)  + parseInt(this.b.parentNode.style.top))+"px"; */
+        endpty = parseInt(this.b.style.top)  + parseInt(this.b.parentNode.style.top)+10;
+        this.end.style.width  = "1px";
+        
+        if (parseInt(this.beg.style.top) < endpty) {
+            this.end.style.top  = this.beg.style.top;
+            this.end.style.height = (parseInt(this.b.style.top)  + parseInt(this.b.parentNode.style.top) - ((parseInt(this.a.style.top)  + parseInt(this.a.parentNode.style.top))) ) - 11 +"px";
+            this.arr.style.top = (parseInt(this.end.style.top) + parseInt(this.end.style.height) - 5)+"px";
+            this.arr.src = "img/arrow_do.png";
+        }
+        else {
+            this.end.style.top  = (parseInt(this.b.style.top)  + parseInt(this.b.parentNode.style.top) + 23)+"px";
+            this.end.style.height = (parseInt(this.a.style.top)  + parseInt(this.a.parentNode.style.top) - ((parseInt(this.b.style.top)  + parseInt(this.b.parentNode.style.top))) ) - 11 +"px";
+
+            this.arr.style.top = this.end.style.top;
+            this.arr.src = "img/arrow_up.png";
+        }
+
+
+        this.o.style.visibility = "visible";
+        
+        console.log("met: " + method + " obj: " + (obj == this.a ? "Obj A" : (obj == this.b ? "Obj B" : "Other")) );
+    }
+}