basic scroll on drag near edges, needs work #129

meemoo · Sep 12, 2013 · 2057457 · 2057457
1 parent 005b88b
commit 2057457
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 10 deletions.
diff --git a/src/graph-view.js b/src/graph-view.js
@@ -335,7 +335,28 @@ $(function(){
       this.dragStartPan = this.model.get("pan");
     },
     drag: function(event, ui){
-      if (!this.dragStartPan) {return;}
+      if (!this.dragStartPan) {
+        // Drag didn't originate here
+        // Pan graph if near edge
+        var panMargin = 50;
+        var panSpeed = 3;
+        if (event.clientX < panMargin) {
+          this.tempPan[0] += panSpeed;
+        } else if (event.clientX > this.$(".dragpan").width() - panMargin) {
+          this.tempPan[0] -= panSpeed;
+        }
+        if (event.clientY < panMargin) {
+          this.tempPan[1] += panSpeed;
+        } else if (event.clientY > this.$(".dragpan").height() - panMargin) {
+          this.tempPan[1] -= panSpeed;
+        }
+        this.$(".dragpan").css({
+          transform: "translate3d("+this.tempPan[0]+"px, "+this.tempPan[1]+"px, 0)"
+        });
+        this.setPanDebounce();
+        return;
+      }
+      // Pan graph
       var x = ui.offset.left;
       var y = ui.offset.top;
       this.$(".dragpan")

diff --git a/src/node-box-view.js b/src/node-box-view.js
@@ -146,9 +146,6 @@ $(function(){
       });
     },
     drag: function(event, ui){
-      // Don't drag graph
-      event.stopPropagation();
-
       if (event.target !== this.$(".module")[0]) { return; }
 
       // Drag other helpers

diff --git a/src/port-in-view.js b/src/port-in-view.js
@@ -112,7 +112,7 @@ $(function(){
         Iframework.edgePreview.redraw();
       }
       // Don't drag module
-      event.stopPropagation();
+      // event.stopPropagation();
     },
     dragstop: function (event, ui) {
       // Remove iframe masks
@@ -220,7 +220,7 @@ $(function(){
         Iframework.edgePreview.redraw();
       }
       // Don't drag module
-      event.stopPropagation();
+      // event.stopPropagation();
     },
     unplugstop: function (event, ui) {
       if (this.armDelete && this.unpluggingEdge) {

diff --git a/src/port-out-view.js b/src/port-out-view.js
@@ -125,7 +125,7 @@ $(function(){
         Iframework.edgePreview.redraw();
       }
       // Don't drag module
-      event.stopPropagation();
+      // event.stopPropagation();
     },
     dragstop: function (event, ui) {
       // Remove iframe masks
@@ -233,7 +233,7 @@ $(function(){
         Iframework.edgePreview.redraw();
       }
       // Don't drag module
-      event.stopPropagation();
+      // event.stopPropagation();
     },
     unplugstop: function (event, ui) {
       if (this.armDelete && this.unpluggingEdge) {

diff --git a/src/port-view.js b/src/port-view.js
@@ -76,7 +76,7 @@ $(function(){
         Iframework.edgePreview.redraw();
       }
       // Don't drag module
-      event.stopPropagation();
+      // event.stopPropagation();
     },
     dragstop: function (event, ui) {
       // Remove iframe masks
@@ -184,7 +184,7 @@ $(function(){
         Iframework.edgePreview.redraw();
       }
       // Don't drag module
-      event.stopPropagation();
+      // event.stopPropagation();
     },
     unplugstop: function (event, ui) {
       if (this.armDelete && this.unpluggingEdge) {