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:

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

diff --git a/WebKitTools/ChangeLog b/WebKitTools/ChangeLog
index b3251759c8a77ea4777396bdd3fd0fd765cabc1b..be8f7ccbfbea759449d393cd4d75d319ae7a8e76 100644 (file)
--- a/WebKitTools/ChangeLog
+++ b/WebKitTools/ChangeLog
@@ -1,3 +1,15 @@
+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.

diff --git a/WebKitTools/Drosera/debugger.js b/WebKitTools/Drosera/debugger.js
index e486981643887aad0a791082f6265fa690707455..01aa097e2299f9a696f12a360ba1d0f35a6290c5 100644 (file)
--- a/WebKitTools/Drosera/debugger.js
+++ b/WebKitTools/Drosera/debugger.js
@@ -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");

diff --git a/WebKitTools/Drosera/viewer.css b/WebKitTools/Drosera/viewer.css
index 9fea1a8eb2d79ca678c39030096aeac99893022f..26e34358bdd98b77a8c9abc493954cfcb08c8e82 100644 (file)
--- a/WebKitTools/Drosera/viewer.css
+++ b/WebKitTools/Drosera/viewer.css
@@ -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;
+}