Reviewed by Geoff.
authorthatcher <thatcher@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 26 Jun 2006 05:09:12 +0000 (05:09 +0000)
committerthatcher <thatcher@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 26 Jun 2006 05:09:12 +0000 (05:09 +0000)
        Bug 9591: [Drosera] breakpoints should be dragable and deletable by dragging off the gutter
        http://bugzilla.opendarwin.org/show_bug.cgi?id=9591

        Makes breakpoints dragable. If dragged off the gutter they are deleted.

        * Drosera/debugger.js:
        * Drosera/viewer.css:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@15045 268f45cc-cd09-0410-ab3c-d52691b4dbfc

WebKitTools/ChangeLog
WebKitTools/Drosera/debugger.js
WebKitTools/Drosera/viewer.css

index b325175..be8f7cc 100644 (file)
@@ -1,5 +1,17 @@
 2006-06-25  Timothy Hatcher  <timothy@apple.com>
 
+        Reviewed by Geoff.
+
+        Bug 9591: [Drosera] breakpoints should be dragable and deletable by dragging off the gutter
+        http://bugzilla.opendarwin.org/show_bug.cgi?id=9591
+        
+        Makes breakpoints dragable. If dragged off the gutter they are deleted.
+
+        * Drosera/debugger.js:
+        * Drosera/viewer.css:
+
+2006-06-25  Timothy Hatcher  <timothy@apple.com>
+
         Reviewed by Darin.
         
         Bug 9568: assertion failure in Safari after quitting Drosera
index e486981..01aa097 100644 (file)
@@ -35,6 +35,7 @@ var currentStack = null;
 var previousFiles = new Array();
 var nextFiles = new Array();
 var isResizingColumn = false;
+var draggingBreakpoint = null;
 
 function sleep(numberMillis) {
     var now = new Date();
@@ -244,6 +245,109 @@ function addBreakPoint(event)
     }
 }
 
+function moveBreakPoint(event)
+{
+    if (hasStyleClass(event.target.parentNode, "breakpoint")) {
+        files[currentFile].breakpoints[parseInt(event.target.title)] = 0;
+        draggingBreakpoint = event.target;
+        draggingBreakpoint.started = false;
+        draggingBreakpoint.dragLastY = event.clientY + window.scrollY;
+        draggingBreakpoint.dragLastX = event.clientX + window.scrollX;
+        var sourcesDocument = document.getElementById("sources").contentDocument;
+        sourcesDocument.addEventListener("mousemove", breakpointDrag, true);
+        sourcesDocument.addEventListener("mouseup", breakpointDragEnd, true);
+    }
+}
+
+function breakpointDrag(event)
+{
+    if (!draggingBreakpoint) {
+        sourcesDocument.removeEventListener("mousemove", breakpointDrag, true);
+        sourcesDocument.removeEventListener("mouseup", breakpointDragEnd, true);
+        return;
+    }
+
+    var x = event.clientX + window.scrollX;
+    var y = event.clientY + window.scrollY;
+    var deltaX = draggingBreakpoint.dragLastX - x;
+    var deltaY = draggingBreakpoint.dragLastY - y;
+    if (draggingBreakpoint.started || deltaX > 4 || deltaY > 4 || deltaX < -4 || deltaY < -4) {
+        if (!draggingBreakpoint.started) {
+            draggingBreakpoint.isDisabled = hasStyleClass(draggingBreakpoint.parentNode, "disabled");
+            removeStyleClass(draggingBreakpoint.parentNode, "breakpoint");
+            removeStyleClass(draggingBreakpoint.parentNode, "disabled");
+            draggingBreakpoint.started = true;
+
+            var sourcesDocument = document.getElementById("sources").contentDocument;
+            var dragImage = sourcesDocument.createElement("img");
+            if (draggingBreakpoint.isDisabled)
+                dragImage.src = "breakPointDisabled.tif";
+            else
+                dragImage.src = "breakPoint.tif";
+            dragImage.id = "breakpointDrag";
+            dragImage.style.top = y - 8 + "px";
+            dragImage.style.left = x - 12 + "px";
+            sourcesDocument.body.appendChild(dragImage);
+        } else {
+            var sourcesDocument = document.getElementById("sources").contentDocument;
+            var dragImage = sourcesDocument.getElementById("breakpointDrag");
+            if (!dragImage) {
+                sourcesDocument.removeEventListener("mousemove", breakpointDrag, true);
+                sourcesDocument.removeEventListener("mouseup", breakpointDragEnd, true);
+                return;
+            }
+
+            dragImage.style.top = y - 8 + "px";
+            dragImage.style.left = x - 12 + "px";
+            if (x > 40)
+                dragImage.style.opacity = "0";
+            else
+                dragImage.style.opacity = null;
+        }
+
+        draggingBreakpoint.dragLastX = x;
+        draggingBreakpoint.dragLastY = y;
+    }
+}
+
+function breakpointDragEnd(event)
+{
+    var y = event.clientY + window.scrollY;
+    var x = event.clientX + window.scrollX;
+    var sourcesDocument = document.getElementById("sources").contentDocument;
+    sourcesDocument.removeEventListener("mousemove", breakpointDrag, true);
+    sourcesDocument.removeEventListener("mouseup", breakpointDragEnd, true);
+
+    var sourcesDocument = document.getElementById("sources").contentDocument;
+    var dragImage = sourcesDocument.getElementById("breakpointDrag");
+    if (!dragImage)
+        return;
+
+    dragImage.parentNode.removeChild(dragImage);
+
+    if (x > 40 || !draggingBreakpoint)
+        return;
+
+    var rowHeight = draggingBreakpoint.parentNode.offsetHeight;
+    var row = Math.ceil(y / rowHeight);
+    if (!row)
+        row = 1;
+
+    var file = files[currentFile];
+    var table = file.element.firstChild;
+    if (row > table.childNodes.length)
+        return;
+
+    var tr = table.childNodes.item(row - 1);
+
+    if (draggingBreakpoint.isDisabled)
+        addStyleClass(tr, "disabled");
+    addStyleClass(tr, "breakpoint");
+    file.breakpoints[row] = (draggingBreakpoint.isDisabled ? -1 : 1);
+
+    draggingBreakpoint = null;
+}
+
 function totalOffsetTop(element, stop)
 {
     var currentTop = 0;
@@ -486,6 +590,7 @@ function loadFile(fileIndex, manageNavLists)
             td.className = "gutter";
             td.title = (i + 1);
             td.addEventListener("click", addBreakPoint, true);
+            td.addEventListener("mousedown", moveBreakPoint, true);
             tr.appendChild(td);
 
             td = sourcesDocument.createElement("td");
index 9fea1a8..26e3435 100644 (file)
@@ -38,7 +38,7 @@ table { border-spacing: 0; padding: 0; margin: 0; }
 .number { color: #2900ff }
 .comment { color: #007215 }
 
-td.gutter:after { content: attr(title) }
+td.gutter:after { content: attr(title); -webkit-user-select: none; }
 
 .breakpoint td.gutter, .current td.gutter { padding-right: 1px; vertical-align: middle; }
 .breakpoint td.gutter:after { content: url(breakPoint.tif); -webkit-user-select: none; vertical-align: middle; }
@@ -48,3 +48,12 @@ td.gutter:after { content: attr(title) }
 .current.breakpoint td.gutter:after { content: url(programCounterBreakPoint.tif); }
 .current.breakpoint.disabled td.gutter:after { content: url(programCounterBreakPointDisabled.tif); }
 .current td.source { background-color: #abbffe; outline: 1px solid #406ffd; }
+
+#breakpointDrag {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 100;
+    -webkit-user-select: none;
+    cursor: default;
+}