DevTools: "Jump between editing locations" experiment

Source/devtools/front_end/CodeMirrorTextEditor.js

 /*
  * Copyright (C) 2012 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 130 matching lines @@
 
     this._tokenHighlighter = new WebInspector.CodeMirrorTextEditor.TokenHighlighter(this._codeMirror);
     this._blockIndentController = new WebInspector.CodeMirrorTextEditor.BlockIndentController(this._codeMirror);
     this._fixWordMovement = new WebInspector.CodeMirrorTextEditor.FixWordMovement(this._codeMirror);
     this._autocompleteController = new WebInspector.CodeMirrorTextEditor.AutocompleteController(this, this._codeMirror);
 
     this._codeMirror.on("change", this._change.bind(this));
     this._codeMirror.on("beforeChange", this._beforeChange.bind(this));
     this._codeMirror.on("gutterClick", this._gutterClick.bind(this));
     this._codeMirror.on("cursorActivity", this._cursorActivity.bind(this));
+    this._codeMirror.on("beforeSelectionChange", this._beforeSelectionChange.bind(this));
     this._codeMirror.on("scroll", this._scroll.bind(this));
     this._codeMirror.on("focus", this._focus.bind(this));
     this._codeMirror.on("blur", this._blur.bind(this));
     this.element.addEventListener("contextmenu", this._contextMenu.bind(this), false);
+    this.element.addEventListener("mousedown", function() {

[vsevik, 2013/09/04 09:46:22]

FWIW We agreed to allow anonymous function only when the whole function is on
one line.

[lushnikov, 2014/01/02 14:06:09]

Done.

+        this._anticipateJump = true;
+    }.bind(this), true);
+    this.element.addEventListener("mousedown", function() {

[vsevik, 2013/09/04 09:46:22]

ditto.

[lushnikov, 2014/01/02 14:06:09]

Done.

+        delete this._anticipateJump;
+    }.bind(this), false);
 
     this.element.addStyleClass("fill");
     this.element.style.overflow = "hidden";
     this.element.firstChild.addStyleClass("source-code");
     this.element.firstChild.addStyleClass("fill");
     this._elementToWidget = new Map();
     this._nestedUpdatesCounter = 0;
 
     this.element.addEventListener("focus", this._handleElementFocus.bind(this), false);
     this.element.addEventListener("keydown", this._handleKeyDown.bind(this), true);
@@ skipping 48 matching lines @@
     var scrollInfo = codemirror.getScrollInfo();
     codemirror.execCommand("redo");
     var cursor = codemirror.getCursor("start");
     codemirror._codeMirrorTextEditor._innerRevealLine(cursor.line, scrollInfo);
 }
 
 WebInspector.CodeMirrorTextEditor.LongLineModeLineLengthThreshold = 2000;
 WebInspector.CodeMirrorTextEditor.MaximumNumberOfWhitespacesPerSingleSpan = 16;
 
 WebInspector.CodeMirrorTextEditor.prototype = {
+    willHide: function()
+    {
+        this._reportJump(this._codeMirror.getCursor("head"), null);
+    },
+
     wasShown: function()
     {
         this._codeMirror.refresh();
+        this._reportJump(null, this._codeMirror.getCursor("head"));
     },
 
     _guessIndentationLevel: function()
     {
         var tabRegex = /^\t+/;
         var tabLines = 0;
         var indents = {};
         function processLine(lineHandle)
         {
             var text = lineHandle.text;
@@ skipping 537 matching lines @@
         if (typeof columnNumber !== "number" || columnNumber < 0 || columnNumber > this._codeMirror.getLine(lineNumber).length)
             columnNumber = 0;
 
         this.clearPositionHighlight();
         this._highlightedLine = this._codeMirror.getLineHandle(lineNumber);
         if (!this._highlightedLine)
           return;
         this.revealLine(lineNumber);
         this._codeMirror.addLineClass(this._highlightedLine, null, "cm-highlight");
         this._clearHighlightTimeout = setTimeout(this.clearPositionHighlight.bind(this), 2000);
-        if (!this.readOnly())
-            this._codeMirror.setSelection(new CodeMirror.Pos(lineNumber, columnNumber));
+        if (!this.readOnly()) {
+            this._anticipateJump = true;
+            this.setSelection(WebInspector.TextRange.createFromLocation(lineNumber, columnNumber));
+            delete this._anticipateJump;
+        }
     },
 
     clearPositionHighlight: function()
     {
         if (this._clearHighlightTimeout)
             clearTimeout(this._clearHighlightTimeout);
         delete this._clearHighlightTimeout;
 
          if (this._highlightedLine)
             this._codeMirror.removeLineClass(this._highlightedLine, null, "cm-highlight");
@@ skipping 168 matching lines @@
 
     _cursorActivity: function()
     {
         var start = this._codeMirror.getCursor("anchor");
         var end = this._codeMirror.getCursor("head");
         this._delegate.selectionChanged(this._toRange(start, end));
         if (!this._tokenHighlighter.highlightedRegex())
             this._codeMirror.operation(this._tokenHighlighter.highlightSelectedTokens.bind(this._tokenHighlighter));
     },
 
+    /**
+     * @param {CodeMirror} codeMirror
+     * @param {{head: CodeMirror.Pos, anchor: CodeMirror.Pos}} selection
+     */
+    _beforeSelectionChange: function(codeMirror, selection)
+    {
+        if (!this._anticipateJump)
+            return;
+        this._reportJump(codeMirror.getCursor("head"), selection.head)

[vsevik, 2013/09/04 09:46:22]

; is missing

[lushnikov, 2014/01/02 14:06:09]

Done.

+    },
+
+    /**
+     * @param {?CodeMirror.Pos} from
+     * @param {?CodeMirror.Pos} to
+     */
+    _reportJump: function(from, to)
+    {
+        if (from && to && from.line === to.line && from.ch === to.ch)
+            return;
+        var fromHandle = from ? new WebInspector.CodeMirrorPositionHandle(this._codeMirror, from) : null;
+        var toHandle = to ? new WebInspector.CodeMirrorPositionHandle(this._codeMirror, to) : null;
+        this._delegate.onJumpToPosition(fromHandle, toHandle);
+    },
+
     _scroll: function()
     {
         if (this._scrollTimer)
             clearTimeout(this._scrollTimer);
         var topmostLineNumber = this._codeMirror.lineAtHeight(this._codeMirror.getScrollInfo().top, "local");
         this._scrollTimer = setTimeout(this._delegate.scrollChanged.bind(this._delegate, topmostLineNumber), 100);
     },
 
     _focus: function()
     {
@@ skipping 175 matching lines @@
     _toRange: function(start, end)
     {
         return new WebInspector.TextRange(start.line, start.ch, end.line, end.ch);
     },
 
     __proto__: WebInspector.View.prototype
 }
 
 /**
  * @constructor
+ * @implements {WebInspector.TextEditorPositionHandle}
+ * @param {CodeMirror} codeMirror
+ * @param {CodeMirror.Pos} pos
+ */
+WebInspector.CodeMirrorPositionHandle = function(codeMirror, pos)
+{
+    this._codeMirror = codeMirror;
+    this._lineHandle = codeMirror.getLineHandle(pos.line);
+    this._columnNumber = pos.ch;
+}
+
+WebInspector.CodeMirrorPositionHandle.prototype = {
+    /**
+     * @return {?{lineNumber: number, columnNumber: number}}
+     */
+    resolve: function()
+    {
+        var lineNumber = this._codeMirror.getLineNumber(this._lineHandle);
+        if (typeof lineNumber !== "number")
+            return null;
+        return {
+            lineNumber: lineNumber,
+            columnNumber: this._columnNumber
+        };
+    },
+
+    /**
+     * @param {WebInspector.TextEditorPositionHandle} positionHandle
+     * @return {boolean}
+     */
+    equal: function(positionHandle)
+    {
+        return positionHandle._lineHandle === this._lineHandle && positionHandle._columnNumber == this._columnNumber &&

[vsevik, 2013/09/04 09:46:22]

No need to split this line, but I'd name the parameter "handle" for the sake of
brevity.

[lushnikov, 2014/01/02 14:06:09]

I love "_lineHandle" more - that's not too verbose.

+            positionHandle._codeMirror === this._codeMirror;
+    }
+}
+
+/**
+ * @constructor
  * @param {CodeMirror} codeMirror
  */
 WebInspector.CodeMirrorTextEditor.TokenHighlighter = function(codeMirror)
 {
     this._codeMirror = codeMirror;
 }
 
 WebInspector.CodeMirrorTextEditor.TokenHighlighter.prototype = {
     /**
      * @param {RegExp} regex
@@ skipping 380 matching lines @@
      * @param {number} line
      * @param {number} column
      * @return {AnchorBox}
      */
     _anchorBoxForPosition: function(line, column)
     {
         var metrics = this._textEditor.cursorPositionToCoordinates(line, column);
         return metrics ? new AnchorBox(metrics.x, metrics.y, 0, metrics.height) : null;
     },
 }