[Openautomation-svn] SF.net SVN: openautomation:[262] PyWireGate/trunk/logic_editor

[<ma...@us...>]

Revision: 262
          http://openautomation.svn.sourceforge.net/openautomation/?rev=262&view=rev
Author:   mayerch
Date:     2011-01-22 13:30:12 +0000 (Sat, 22 Jan 2011)

Log Message:
-----------
* make handles work in zoomed mode
* fix bug that didn't show labels once a port was connected
* removed unnecessary stub lines on connected block ports
* optimized connection redrawing (change instead of delete and paint)

Modified Paths:
--------------
    PyWireGate/trunk/logic_editor/gle/gle.block.js
    PyWireGate/trunk/logic_editor/gle/gle.connection.js
    PyWireGate/trunk/logic_editor/logicEditor.css
    PyWireGate/trunk/logic_editor/logicEditor.js

Modified: PyWireGate/trunk/logic_editor/gle/gle.block.js
===================================================================
--- PyWireGate/trunk/logic_editor/gle/gle.block.js	2011-01-20 21:01:22 UTC (rev 261)
+++ PyWireGate/trunk/logic_editor/gle/gle.block.js	2011-01-22 13:30:12 UTC (rev 262)
@@ -126,7 +126,7 @@
       p[0].x -= x; p[0].y -= y; // translate back as we are in a transform
       p[1].x -= x; p[1].y -= y; // translate back as we are in a transform
       if( 'connection' in this )
-        canvas.line( g, p[0].x, p[0].y, p[1].x, p[1].y, style );
+        ;//canvas.line( g, p[0].x, p[0].y, p[1].x, p[1].y, style );
       else {
         editorConnectionPointCreate(
           canvas.line( g, p[1].x, p[1].y, p[0].x, p[0].y, {'marker-end': 'url(#EmptyInPort)'} )
@@ -144,7 +144,7 @@
       p[0].x -= x; p[0].y -= y; // translate back as we are in a transform
       p[1].x -= x; p[1].y -= y; // translate back as we are in a transform
       if( 'connection' in this )
-        canvas.line( g, p[0].x, p[0].y, p[1].x, p[1].y, style );
+        ;//canvas.line( g, p[0].x, p[0].y, p[1].x, p[1].y, style );
       else {
         canvas.line( g, p[0].x, p[0].y, p[1].x, p[1].y, {'marker-start': 'url(#EmptyOutPort)'})
         editorConnectionPointCreate(
@@ -153,10 +153,10 @@
             {'class':'hiddenHandle'} ),
             'outPort', i 
         );
-        if( maskOptions.showLabel )
-          canvas.text( g, 2*p[0].x-p[1].x, 2*p[0].y-p[1].y, this.name, 
-                      {'dominant-baseline':'middle','text-anchor':'end'} );
       }
+      if( maskOptions.showLabel )
+        canvas.text( g, 2*p[0].x-p[1].x, 2*p[0].y-p[1].y, this.name, 
+                    {'dominant-baseline':'middle','text-anchor':'end'} );
     });
     
     // shotcut

Modified: PyWireGate/trunk/logic_editor/gle/gle.connection.js
===================================================================
--- PyWireGate/trunk/logic_editor/gle/gle.connection.js	2011-01-20 21:01:22 UTC (rev 261)
+++ PyWireGate/trunk/logic_editor/gle/gle.connection.js	2011-01-22 13:30:12 UTC (rev 262)
@@ -49,13 +49,10 @@
   function draw()
   {
     var classList = 'connection';
-    if( g ) 
+    if( !g ) // no lines yet? Create it...
     {
-      classList = g.getAttribute('class');
-      g.parentNode.removeChild( g ); // delete the old representation
+      g = canvas.group( { 'class':classList } );
     }
-    g = canvas.group( { 'class':classList } );
-
     var parameter = {
       class: classList,
       stroke: colorByArray( origin.getColor() ),
@@ -63,14 +60,21 @@
       'marker-end'  : 'url(#ArrowEnd)',
       fill:  'none'
     };
+    
+    var lines = $(g).find( 'polyline' );
     for( var i in paths )
     {
+      if( lines[i] === undefined )
+        lines[i] = canvas.polyline( g, [], parameter );
+      
+      lines[i].setAttribute('points', paths[i].path.join(',') );
       if( paths[i].target == undefined || origin == undefined )
-        parameter['stroke-dasharray'] = '1,3';
+        lines[i].setAttribute('stroke-dasharray', '1,3'  );
       else
-        parameter['stroke-dasharray'] = 'none';
-      var x = canvas.polyline( g, paths[i].path, parameter );
+        lines[i].setAttribute('stroke-dasharray', 'none' );
     }
+    for( var i = lines.length-1; i > paths.length; i-- )
+      lines.remove( i );
     
     // shotcut
     function connectionDrag( obj, handle )
@@ -78,6 +82,8 @@
       $(handle).bind( 'mousedown', {obj:obj}, connectionDragMouseDown );
     }
     
+    // delete old handles
+    $(g).find('rect').remove();
     // Draw the handles
     for( var i in paths )
     {
@@ -130,13 +136,30 @@
   function editorDragMouseMove( event )
   {
     var ed   = event.data;
+    var pos = getCoordinate(event);
     //console.log('cDMM', ed );
     if( ed.extend )
     {
-      that.lastMove( {x:ed.origx - ed.startx + event.pageX, y:ed.origy - ed.starty + event.pageY}, false );
+      that.lastMove( pos, false );
     } else {
-      paths[ed.obj[1]].path[ed.obj[2]][0] = ed.origx - ed.startx + event.pageX;
-      paths[ed.obj[1]].path[ed.obj[2]][1] = ed.origy - ed.starty + event.pageY;
+      var path = paths[ed.obj[1]].path;
+      var i = parseInt( ed.obj[2] );
+      if( path[i-1] !== undefined )
+      {
+        if( Math.abs( path[i-1][0] - path[i][0] ) < 1.0 )
+          path[i-1][0] = pos.x;
+        if( Math.abs( path[i-1][1] - path[i][1] ) < 1.0 )
+          path[i-1][1] = pos.y;
+      }
+      if( path[i+1] !== undefined )
+      {
+        if( Math.abs( path[i+1][0] - path[i][0] ) < 1.0 )
+          path[i+1][0] = pos.x;
+        if( Math.abs( path[i+1][1] - path[i][1] ) < 1.0 )
+          path[i+1][1] = pos.y;
+      }
+      path[i][0] = pos.x;
+      path[i][1] = pos.y;
       draw();
     }
   }
@@ -181,6 +204,7 @@
   
   this.lastMove = function( pos, force )
   {
+    if( lastFixed < 0 ) lastFixed = 0; // sanity check...
     while( paths[branch].path.length > lastFixed+1 )
       paths[branch].path.pop();
     var start = paths[branch].path[ paths[branch].path.length - 1 ];

Modified: PyWireGate/trunk/logic_editor/logicEditor.css
===================================================================
--- PyWireGate/trunk/logic_editor/logicEditor.css	2011-01-20 21:01:22 UTC (rev 261)
+++ PyWireGate/trunk/logic_editor/logicEditor.css	2011-01-22 13:30:12 UTC (rev 262)
@@ -68,6 +68,11 @@
   opacity: 0;
 }
 
+polyline.connection {
+  stroke-width: 1; 
+  fill        : none;
+}
+
 .ui-layout-pane { /* all 'panes' */ 
   border: 1px solid #BBB; 
   overflow: auto;

Modified: PyWireGate/trunk/logic_editor/logicEditor.js
===================================================================
--- PyWireGate/trunk/logic_editor/logicEditor.js	2011-01-20 21:01:22 UTC (rev 261)
+++ PyWireGate/trunk/logic_editor/logicEditor.js	2011-01-22 13:30:12 UTC (rev 262)
@@ -202,10 +202,7 @@
     if( y > maxY ) maxY = y;
   });
   maxX += extraSpace; maxY += extraSpace;
-  var editor = $('#editor');
-  var svg    = $('#editor svg')[0];
-  svg.width.baseVal.value = Math.max( maxX, editor.innerWidth() );
-  svg.height.baseVal.value = Math.max( maxY, editor.innerHeight() );
+  zoomEditor( 0 ); // resize with current zoom level
 }
 
 jQuery(document).ready(function(){
@@ -214,8 +211,9 @@
     var editor = $('#editor');  // quasi static variable
     return function( event ) {
       var o = editor.offset();
-      return {x: event.pageX - o.left + editor.scrollLeft(),
-              y: event.pageY - o.top  + editor.scrollTop () };
+      var factor = zoomFactor();
+      return {x: (event.pageX - o.left + editor.scrollLeft()) / factor,
+              y: (event.pageY - o.top  + editor.scrollTop ()) / factor};
     };
   })();
 });


This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.