Changeset 160552 in webkit


Ignore:
Timestamp:
Dec 13, 2013 11:32:49 AM (10 years ago)
Author:
Antoine Quint
Message:

Web Inspector: provide an abstraction for CodeMirror's TextMarker
https://bugs.webkit.org/show_bug.cgi?id=125695

Reviewed by Timothy Hatcher.

Introduce a new WebInspector.TextMarker class which is used by code with CodeMirror knowledge
to return information related to text markers to objects that should have no direct knowledge
of CodeMirror. Start using this class in TextEditor and SourceCodeTextEditor to remove the
last remaining pieces of CodeMirror knowledge added to SourceCodeTextEditor to fix
https://webkit.org/b/124364.

  • UserInterface/CodeMirrorAdditions.js:

Stop using markedColor to identify a color marker and instead use the type on the matching
WebInspector.TextMarker. Additionally, create a WebInspector.TextMarker with type
WebInspector.TextMarker.Type.Color in createColorMarkers().

  • UserInterface/CodeMirrorColorEditingController.js:

(WebInspector.CodeMirrorColorEditingController):
Use a WebInspector.TextRange to track the edited range and obtain it directly from the
WebInspector.TextMaker used to instantiate the object. We also use the new "text" public
property to create the color.

(WebInspector.CodeMirrorColorEditingController.prototype.set color):
Simply assing the serialized color to the new "text" public property.

(WebInspector.CodeMirrorColorEditingController.prototype.get text):
(WebInspector.CodeMirrorColorEditingController.prototype.set text):
New public property to set get and set the text for the edited range, automatically updating
the range upon setting to a new text.

(WebInspector.CodeMirrorColorEditingController.prototype.presentHoverMenu):
Obtain the bounds directly from the WebInspector.TextMarker object.

  • UserInterface/CodeMirrorTokenTrackingController.js:

(WebInspector.CodeMirrorTokenTrackingController.prototype._updateHoveredTokenInfo):
Since we're now tracking the hoveredMarker as a WebInspector.TextMarker, get the CodeMirror
TextMarker from that object to check if it's contained within the text markers at the
hovered position.

  • UserInterface/Main.html:

Add the new TextMarker class source.

  • UserInterface/SourceCodeTextEditor.js:

(WebInspector.SourceCodeTextEditor.prototype._hasColorMarkers):
Use the WebInspector.TextMarker type to identify a given text marker is marking a color.

(WebInspector.SourceCodeTextEditor.prototype.tokenTrackingControllerNewHighlightCandidate):
Use the renamed markersAtPosition() method from TextEditor.

(WebInspector.SourceCodeTextEditor.prototype._tokenTrackingControllerHighlightedMarkedExpression):
Use the WebInspector.TextMarker type to identify a given text marker is marking a color.

(WebInspector.SourceCodeTextEditor.prototype.colorEditingControllerDidFinishEditing):
Since the CodeMirrorColorEditingController is now using a WebInspector.TextRange for its range,
update to use a WebInspector.TextRange API to get the range's start line.

  • UserInterface/TextEditor.js:

(WebInspector.TextEditor.prototype.get markers):
Return WebInspector.TextMarker objects instead of CodeMirror TextRange objects.

(WebInspector.TextEditor.prototype.markersAtPosition):
Rename method to a better name instead of using the CodeMirror-influenced name. Also, return
WebInspector.TextMarker objects instead of CodeMirror TextRange objects.

  • UserInterface/TextMarker.js: Added.

(WebInspector.TextMarker):
Create a WebInspector.TextMarker with a CodeMirror TextMarker and an optional type.

(WebInspector.TextMarker.textMarkerForCodeMirrorTextMarker):
Static method to either obtain the existing WebInspector.TextMarker for a given CodeMirror
TextMarker, or create a new WebInspector.TextMarker.

(WebInspector.TextMarker.prototype.get codeMirrorTextMarker):
Public property to access the CodeMirror TextMarker objects for classes that have direct
knowledge of CodeMirror.

(WebInspector.TextMarker.prototype.get type):
Public property to access the type used to create this text marker.

(WebInspector.TextMarker.prototype.get range):
(WebInspector.TextMarker.prototype.get bounds):
Public properties allowing easy access to generally useful information related to marked text.

(WebInspector.TextMarker.prototype.clear):
Wrapper for the CodeMirror TextMarker clear() method.

Location:
trunk/Source/WebInspectorUI
Files:
1 added
7 edited

Legend:

Unmodified
Added
Removed
  • trunk/Source/WebInspectorUI/ChangeLog

    r160548 r160552  
     12013-12-13  Antoine Quint  <graouts@apple.com>
     2
     3        Web Inspector: provide an abstraction for CodeMirror's TextMarker
     4        https://bugs.webkit.org/show_bug.cgi?id=125695
     5
     6        Reviewed by Timothy Hatcher.
     7
     8        Introduce a new WebInspector.TextMarker class which is used by code with CodeMirror knowledge
     9        to return information related to text markers to objects that should have no direct knowledge
     10        of CodeMirror. Start using this class in TextEditor and SourceCodeTextEditor to remove the
     11        last remaining pieces of CodeMirror knowledge added to SourceCodeTextEditor to fix
     12        https://webkit.org/b/124364.
     13
     14        * UserInterface/CodeMirrorAdditions.js:
     15        Stop using __markedColor to identify a color marker and instead use the type on the matching
     16        WebInspector.TextMarker. Additionally, create a WebInspector.TextMarker with type
     17        WebInspector.TextMarker.Type.Color in createColorMarkers().
     18       
     19        * UserInterface/CodeMirrorColorEditingController.js:
     20        (WebInspector.CodeMirrorColorEditingController):
     21        Use a WebInspector.TextRange to track the edited range and obtain it directly from the
     22        WebInspector.TextMaker used to instantiate the object. We also use the new "text" public
     23        property to create the color.
     24
     25        (WebInspector.CodeMirrorColorEditingController.prototype.set color):
     26        Simply assing the serialized color to the new "text" public property.
     27
     28        (WebInspector.CodeMirrorColorEditingController.prototype.get text):
     29        (WebInspector.CodeMirrorColorEditingController.prototype.set text):
     30        New public property to set get and set the text for the edited range, automatically updating
     31        the range upon setting to a new text.
     32
     33        (WebInspector.CodeMirrorColorEditingController.prototype.presentHoverMenu):
     34        Obtain the bounds directly from the WebInspector.TextMarker object.
     35
     36        * UserInterface/CodeMirrorTokenTrackingController.js:
     37        (WebInspector.CodeMirrorTokenTrackingController.prototype._updateHoveredTokenInfo):
     38        Since we're now tracking the hoveredMarker as a WebInspector.TextMarker, get the CodeMirror
     39        TextMarker from that object to check if it's contained within the text markers at the
     40        hovered position.
     41
     42        * UserInterface/Main.html:
     43        Add the new TextMarker class source.
     44
     45        * UserInterface/SourceCodeTextEditor.js:
     46        (WebInspector.SourceCodeTextEditor.prototype._hasColorMarkers):
     47        Use the WebInspector.TextMarker type to identify a given text marker is marking a color.
     48
     49        (WebInspector.SourceCodeTextEditor.prototype.tokenTrackingControllerNewHighlightCandidate):
     50        Use the renamed markersAtPosition() method from TextEditor.
     51
     52        (WebInspector.SourceCodeTextEditor.prototype._tokenTrackingControllerHighlightedMarkedExpression):
     53        Use the WebInspector.TextMarker type to identify a given text marker is marking a color.
     54
     55        (WebInspector.SourceCodeTextEditor.prototype.colorEditingControllerDidFinishEditing):
     56        Since the CodeMirrorColorEditingController is now using a WebInspector.TextRange for its range,
     57        update to use a WebInspector.TextRange API to get the range's start line.
     58
     59        * UserInterface/TextEditor.js:
     60        (WebInspector.TextEditor.prototype.get markers):
     61        Return WebInspector.TextMarker objects instead of CodeMirror TextRange objects.
     62
     63        (WebInspector.TextEditor.prototype.markersAtPosition):
     64        Rename method to a better name instead of using the CodeMirror-influenced name. Also, return
     65        WebInspector.TextMarker objects instead of CodeMirror TextRange objects.
     66
     67        * UserInterface/TextMarker.js: Added.
     68        (WebInspector.TextMarker):
     69        Create a WebInspector.TextMarker with a CodeMirror TextMarker and an optional type.
     70
     71        (WebInspector.TextMarker.textMarkerForCodeMirrorTextMarker):
     72        Static method to either obtain the existing WebInspector.TextMarker for a given CodeMirror
     73        TextMarker, or create a new WebInspector.TextMarker.
     74
     75        (WebInspector.TextMarker.prototype.get codeMirrorTextMarker):
     76        Public property to access the CodeMirror TextMarker objects for classes that have direct
     77        knowledge of CodeMirror.
     78
     79        (WebInspector.TextMarker.prototype.get type):
     80        Public property to access the type used to create this text marker.
     81
     82        (WebInspector.TextMarker.prototype.get range):
     83        (WebInspector.TextMarker.prototype.get bounds):
     84        Public properties allowing easy access to generally useful information related to marked text.
     85
     86        (WebInspector.TextMarker.prototype.clear):
     87        Wrapper for the CodeMirror TextMarker clear() method.
     88
    1892013-12-13  Brent Fulgham  <bfulgham@apple.com>
    290
  • trunk/Source/WebInspectorUI/UserInterface/CodeMirrorAdditions.js

    r160483 r160552  
    451451                var markers = this.findMarksAt(to);
    452452                for (var j = 0; j < markers.length; ++j) {
    453                     if (!markers[j].__markedColor)
    454                         continue;
    455                     foundColorMarker = true;
    456                     break;
     453                    if (WebInspector.TextMarker.textMarkerForCodeMirrorTextMarker(markers[j]).type === WebInspector.TextMarker.Type.Color) {
     454                        foundColorMarker = true;
     455                        break;
     456                    }
    457457                }
    458458
     
    470470
    471471                var marker = this.markText(from, to);
    472                 marker.__markedColor = true;
     472                marker = new WebInspector.TextMarker(marker, WebInspector.TextMarker.Type.Color);
    473473
    474474                createdMarkers.push(marker);
  • trunk/Source/WebInspectorUI/UserInterface/CodeMirrorColorEditingController.js

    r160483 r160552  
    3232    this._delegate = null;
    3333
    34     this._range = marker.find();
    35 
    36     this._color = WebInspector.Color.fromString(codeMirror.getRange(this._range.from, this._range.to));
     34    this._range = marker.range;
     35    this._color = WebInspector.Color.fromString(this.text);
    3736
    3837    this._keyboardShortcutEsc = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Escape);
     
    6261    set color(color)
    6362    {
    64         var colorText = color.toString();
    65         this._codeMirror.replaceRange(colorText, this._range.from, this._range.to);
    66         this._range.to.ch = this._range.from.ch + colorText.length;
    67 
     63        this.text = color.toString();
    6864        this._color = color;
    6965    },
     
    7874        this._delegate = delegate;
    7975    },
     76
     77    get text()
     78    {
     79        var from = {line: this._range.startLine, ch: this._range.startColumn};
     80        var to = {line: this._range.endLine, ch: this._range.endColumn};
     81        return this._codeMirror.getRange(from, to);
     82    },
     83   
     84    set text(text)
     85    {
     86        var from = {line: this._range.startLine, ch: this._range.startColumn};
     87        var to = {line: this._range.endLine, ch: this._range.endColumn};
     88        this._codeMirror.replaceRange(text, from, to);
     89
     90        var lines = text.split("\n");
     91        var endLine = this._range.startLine + lines.length - 1;
     92        var endColumn = lines.length > 1 ? lines.lastValue.length : this._range.startColumn + text.length;
     93        this._range = new WebInspector.TextRange(this._range.startLine, this._range.startColumn, endLine, endColumn);
     94    },
    8095   
    8196    presentHoverMenu: function()
     
    8398        this._hoverMenu = new WebInspector.HoverMenu(this);
    8499        this._hoverMenu.element.classList.add("color");
    85         this._bounds = this._codeMirror.boundsForRange({
    86             start: this._range.from,
    87             end: this._range.to
    88         });
     100        this._bounds = this._marker.bounds;
    89101        this._hoverMenu.present(this._bounds);
    90102    },
  • trunk/Source/WebInspectorUI/UserInterface/CodeMirrorTokenTrackingController.js

    r160483 r160552  
    306306        if (!token || !token.type || !token.string) {
    307307            if (this._hoveredMarker && this._delegate && typeof this._delegate.tokenTrackingControllerMouseOutOfHoveredMarker === "function") {
    308                 var markers = this._codeMirror.findMarksAt(position);
    309                 if (!markers.contains(this._hoveredMarker))
     308                if (!this._codeMirror.findMarksAt(position).contains(this._hoveredMarker.codeMirrorTextMarker))
    310309                    this._delegate.tokenTrackingControllerMouseOutOfHoveredMarker(this, this._hoveredMarker);
    311310            }
  • trunk/Source/WebInspectorUI/UserInterface/Main.html

    r160483 r160552  
    287287    <script src="SearchResultTreeElement.js"></script>
    288288    <script src="TextRange.js"></script>
     289    <script src="TextMarker.js"></script>
    289290    <script src="ConsoleMessage.js"></script>
    290291    <script src="ConsoleMessageImpl.js"></script>
  • trunk/Source/WebInspectorUI/UserInterface/SourceCodeTextEditor.js

    r160483 r160552  
    10171017    {
    10181018        for (var marker of this.markers) {
    1019             if (marker.__markedColor)
     1019            if (marker.type === WebInspector.TextMarker.Type.Color)
    10201020                return true;
    10211021        }
     
    10711071
    10721072        if (this.tokenTrackingController.mode === WebInspector.CodeMirrorTokenTrackingController.Mode.MarkedTokens) {
    1073             var markers = this.findMarkersAtPosition(candidate.hoveredTokenRange.start);
     1073            var markers = this.markersAtPosition(candidate.hoveredTokenRange.start);
    10741074            if (markers.length > 0)
    10751075                this._tokenTrackingControllerHighlightedMarkedExpression(candidate, markers);
     
    12991299        var colorMarker;
    13001300        for (var marker of markers) {
    1301             if (marker.__markedColor) {
     1301            if (marker.type === WebInspector.TextMarker.Type.Color) {
    13021302                colorMarker = marker;
    13031303                break;
     
    13571357    colorEditingControllerDidFinishEditing: function(colorEditingController)
    13581358    {
    1359         this._updateColorMarkers(colorEditingController.range.from.line);
     1359        this._updateColorMarkers(colorEditingController.range.startLine);
    13601360
    13611361        this._ignoreContentDidChange--;
  • trunk/Source/WebInspectorUI/UserInterface/TextEditor.js

    r160483 r160552  
    604604    get markers()
    605605    {
    606         // FIXME: we should not return CodeMirror TextMarker objects but rather wrappers.
    607         return this._codeMirror.getAllMarks();
    608     },
    609 
    610     findMarkersAtPosition: function(position)
    611     {
    612         return this._codeMirror.findMarksAt(position);
     606        return this._codeMirror.getAllMarks().map(function(codeMirrorTextMarker) {
     607            return WebInspector.TextMarker.textMarkerForCodeMirrorTextMarker(codeMirrorTextMarker);
     608        });
     609    },
     610
     611    markersAtPosition: function(position)
     612    {
     613        return this._codeMirror.findMarksAt(position).map(function(codeMirrorTextMarker) {
     614            return WebInspector.TextMarker.textMarkerForCodeMirrorTextMarker(codeMirrorTextMarker);
     615        });
    613616    },
    614617
Note: See TracChangeset for help on using the changeset viewer.