DevTools: implement search for CPUProfiler FlameChart view

Source/devtools/front_end/profiler/CPUProfileView.js

 /*
  * Copyright (C) 2008 Apple 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:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
  *    documentation and/or other materials provided with the distribution.
  *
  * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
  * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
  * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
  * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
  * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
  * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
  * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
 
 /**
  * @constructor
+ * @implements {WebInspector.Searchable}
  * @extends {WebInspector.VBox}
  * @param {!WebInspector.CPUProfileHeader} profileHeader
  */
 WebInspector.CPUProfileView = function(profileHeader)
 {
     WebInspector.VBox.call(this);
     this.element.classList.add("cpu-profile-view");
 
+    this._searchableView = new WebInspector.SearchableView(this);
+    this._searchableView.show(this.element);
+
     this._viewType = WebInspector.settings.createSetting("cpuProfilerView", WebInspector.CPUProfileView._TypeHeavy);
 
     var columns = [];
     columns.push({id: "self", title: WebInspector.UIString("Self"), width: "120px", sort: WebInspector.DataGrid.Order.Descending, sortable: true});
     columns.push({id: "total", title: WebInspector.UIString("Total"), width: "120px", sortable: true});
     columns.push({id: "function", title: WebInspector.UIString("Function"), disclosure: true, sortable: true});
 
     this.dataGrid = new WebInspector.DataGrid(columns);
     this.dataGrid.addEventListener(WebInspector.DataGrid.Events.SortingChanged, this._sortProfile, this);
-    this.dataGrid.show(this.element);
 
     this.viewSelectComboBox = new WebInspector.StatusBarComboBox(this._changeView.bind(this));
 
     var options = {};
     options[WebInspector.CPUProfileView._TypeFlame] = this.viewSelectComboBox.createOption(WebInspector.UIString("Chart"), "", WebInspector.CPUProfileView._TypeFlame);
     options[WebInspector.CPUProfileView._TypeHeavy] = this.viewSelectComboBox.createOption(WebInspector.UIString("Heavy (Bottom Up)"), "", WebInspector.CPUProfileView._TypeHeavy);
     options[WebInspector.CPUProfileView._TypeTree] = this.viewSelectComboBox.createOption(WebInspector.UIString("Tree (Top Down)"), "", WebInspector.CPUProfileView._TypeTree);
 
     var optionName = this._viewType.get() || WebInspector.CPUProfileView._TypeFlame;
     var option = options[optionName] || options[WebInspector.CPUProfileView._TypeFlame];
@@ skipping 23 matching lines @@
 
     this._changeView();
     if (this._flameChart)
         this._flameChart.update();
 }
 
 WebInspector.CPUProfileView._TypeFlame = "Flame";
 WebInspector.CPUProfileView._TypeTree = "Tree";
 WebInspector.CPUProfileView._TypeHeavy = "Heavy";
 
+/**
+ * @interface
+ */
+WebInspector.CPUProfileView.Searchable = function()
+{
+}
+
+WebInspector.CPUProfileView.Searchable.prototype = {
+    jumpToNextSearchResult: function() {},
+    jumpToPreviousSearchResult: function() {},
+    searchCanceled: function() {},
+    /**
+     * @param {!WebInspector.SearchableView.SearchConfig} searchConfig
+     * @param {boolean} shouldJump
+     * @param {boolean=} jumpBackwards
+     * @return {number}
+     */
+    performSearch: function(searchConfig, shouldJump, jumpBackwards) {},
+    /**
+     * @return {number}
+     */
+    currentSearchResultIndex: function() {}
+}
+
 WebInspector.CPUProfileView.prototype = {
     focus: function()
     {
         if (this._flameChart)
             this._flameChart.focus();
         else
             WebInspector.View.prototype.focus.call(this);
     },
 
     /**
@@ skipping 63 matching lines @@
 
     refreshVisibleData: function()
     {
         var child = this.dataGrid.rootNode().children[0];
         while (child) {
             child.refresh();
             child = child.traverseNextNode(false, null, true);
         }
     },
 
+    /**
+     * @return {!WebInspector.SearchableView}
+     */
+    searchableView: function()
+    {
+        return this._searchableView;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    supportsCaseSensitiveSearch: function()
+    {
+        return true;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    supportsRegexSearch: function()
+    {
+        return false;
+    },
+
     searchCanceled: function()
     {
-        if (this._searchResults) {
-            for (var i = 0; i < this._searchResults.length; ++i) {
-                var profileNode = this._searchResults[i].profileNode;
-
-                delete profileNode._searchMatchedSelfColumn;
-                delete profileNode._searchMatchedTotalColumn;
-                delete profileNode._searchMatchedFunctionColumn;
-
-                profileNode.refresh();
-            }
-        }
-
-        delete this._searchFinishedCallback;
-        this._currentSearchResultIndex = -1;
-        this._searchResults = [];
+        this._searchableElement.searchCanceled();
     },
 
-    performSearch: function(query, finishedCallback)
+    /**
+     * @param {!WebInspector.SearchableView.SearchConfig} searchConfig
+     * @param {boolean} shouldJump
+     * @param {boolean=} jumpBackwards
+     */
+    performSearch: function(searchConfig, shouldJump, jumpBackwards)
     {
-        // Call searchCanceled since it will reset everything we need before doing a new search.
-        this.searchCanceled();
-
-        query = query.trim();
-
-        if (!query.length)
-            return;
-
-        this._searchFinishedCallback = finishedCallback;
-
-        var greaterThan = (query.startsWith(">"));
-        var lessThan = (query.startsWith("<"));
-        var equalTo = (query.startsWith("=") || ((greaterThan || lessThan) && query.indexOf("=") === 1));
-        var percentUnits = (query.lastIndexOf("%") === (query.length - 1));
-        var millisecondsUnits = (query.length > 2 && query.lastIndexOf("ms") === (query.length - 2));
-        var secondsUnits = (!millisecondsUnits && query.lastIndexOf("s") === (query.length - 1));
-
-        var queryNumber = parseFloat(query);
-        if (greaterThan || lessThan || equalTo) {
-            if (equalTo && (greaterThan || lessThan))
-                queryNumber = parseFloat(query.substring(2));
-            else
-                queryNumber = parseFloat(query.substring(1));
-        }
-
-        var queryNumberMilliseconds = (secondsUnits ? (queryNumber * 1000) : queryNumber);
-
-        // Make equalTo implicitly true if it wasn't specified there is no other operator.
-        if (!isNaN(queryNumber) && !(greaterThan || lessThan))
-            equalTo = true;
-
-        var matcher = createPlainTextSearchRegex(query, "i");
-
-        function matchesQuery(/*ProfileDataGridNode*/ profileDataGridNode)
-        {
-            delete profileDataGridNode._searchMatchedSelfColumn;
-            delete profileDataGridNode._searchMatchedTotalColumn;
-            delete profileDataGridNode._searchMatchedFunctionColumn;
-
-            if (percentUnits) {
-                if (lessThan) {
-                    if (profileDataGridNode.selfPercent < queryNumber)
-                        profileDataGridNode._searchMatchedSelfColumn = true;
-                    if (profileDataGridNode.totalPercent < queryNumber)
-                        profileDataGridNode._searchMatchedTotalColumn = true;
-                } else if (greaterThan) {
-                    if (profileDataGridNode.selfPercent > queryNumber)
-                        profileDataGridNode._searchMatchedSelfColumn = true;
-                    if (profileDataGridNode.totalPercent > queryNumber)
-                        profileDataGridNode._searchMatchedTotalColumn = true;
-                }
-
-                if (equalTo) {
-                    if (profileDataGridNode.selfPercent == queryNumber)
-                        profileDataGridNode._searchMatchedSelfColumn = true;
-                    if (profileDataGridNode.totalPercent == queryNumber)
-                        profileDataGridNode._searchMatchedTotalColumn = true;
-                }
-            } else if (millisecondsUnits || secondsUnits) {
-                if (lessThan) {
-                    if (profileDataGridNode.selfTime < queryNumberMilliseconds)
-                        profileDataGridNode._searchMatchedSelfColumn = true;
-                    if (profileDataGridNode.totalTime < queryNumberMilliseconds)
-                        profileDataGridNode._searchMatchedTotalColumn = true;
-                } else if (greaterThan) {
-                    if (profileDataGridNode.selfTime > queryNumberMilliseconds)
-                        profileDataGridNode._searchMatchedSelfColumn = true;
-                    if (profileDataGridNode.totalTime > queryNumberMilliseconds)
-                        profileDataGridNode._searchMatchedTotalColumn = true;
-                }
-
-                if (equalTo) {
-                    if (profileDataGridNode.selfTime == queryNumberMilliseconds)
-                        profileDataGridNode._searchMatchedSelfColumn = true;
-                    if (profileDataGridNode.totalTime == queryNumberMilliseconds)
-                        profileDataGridNode._searchMatchedTotalColumn = true;
-                }
-            }
-
-            if (profileDataGridNode.functionName.match(matcher) || (profileDataGridNode.url && profileDataGridNode.url.match(matcher)))
-                profileDataGridNode._searchMatchedFunctionColumn = true;
-
-            if (profileDataGridNode._searchMatchedSelfColumn ||
-                profileDataGridNode._searchMatchedTotalColumn ||
-                profileDataGridNode._searchMatchedFunctionColumn)
-            {
-                profileDataGridNode.refresh();
-                return true;
-            }
-
-            return false;
-        }
-
-        var current = this.profileDataGridTree.children[0];
-
-        while (current) {
-            if (matchesQuery(current)) {
-                this._searchResults.push({ profileNode: current });
-            }
-
-            current = current.traverseNextNode(false, null, false);
-        }
-
-        finishedCallback(this, this._searchResults.length);
-    },
-
-    jumpToFirstSearchResult: function()
-    {
-        if (!this._searchResults || !this._searchResults.length)
-            return;
-        this._currentSearchResultIndex = 0;
-        this._jumpToSearchResult(this._currentSearchResultIndex);
-    },
-
-    jumpToLastSearchResult: function()
-    {
-        if (!this._searchResults || !this._searchResults.length)
-            return;
-        this._currentSearchResultIndex = (this._searchResults.length - 1);
-        this._jumpToSearchResult(this._currentSearchResultIndex);
+        var matchesCount = this._searchableElement.performSearch(searchConfig, shouldJump, jumpBackwards);
+        this._searchableView.updateSearchMatchesCount(matchesCount);
+        this._searchableView.updateCurrentMatchIndex(this._searchableElement.currentSearchResultIndex());
     },
 
     jumpToNextSearchResult: function()
     {
-        if (!this._searchResults || !this._searchResults.length)
-            return;
-        if (++this._currentSearchResultIndex >= this._searchResults.length)
-            this._currentSearchResultIndex = 0;
-        this._jumpToSearchResult(this._currentSearchResultIndex);
+        this._searchableElement.jumpToNextSearchResult();
+        this._searchableView.updateCurrentMatchIndex(this._searchableElement.currentSearchResultIndex());
     },
 
     jumpToPreviousSearchResult: function()
     {
-        if (!this._searchResults || !this._searchResults.length)
-            return;
-        if (--this._currentSearchResultIndex < 0)
-            this._currentSearchResultIndex = (this._searchResults.length - 1);
-        this._jumpToSearchResult(this._currentSearchResultIndex);
-    },
-
-    /**
-     * @return {number}
-     */
-    currentSearchResultIndex: function() {
-        return this._currentSearchResultIndex;
-    },
-
-    _jumpToSearchResult: function(index)
-    {
-        var searchResult = this._searchResults[index];
-        if (!searchResult)
-            return;
-
-        var profileNode = searchResult.profileNode;
-        profileNode.revealAndSelect();
+        this._searchableElement.jumpToPreviousSearchResult();
+        this._searchableView.updateCurrentMatchIndex(this._searchableElement.currentSearchResultIndex());
     },
 
     _ensureFlameChartCreated: function()
     {
         if (this._flameChart)
             return;
         this._dataProvider = new WebInspector.CPUFlameChartDataProvider(this.profile, this._profileHeader.target());
         this._flameChart = new WebInspector.CPUProfileFlameChart(this._dataProvider);
         this._flameChart.addEventListener(WebInspector.FlameChart.Events.EntrySelected, this._onEntrySelected.bind(this));
     },
@@ skipping 13 matching lines @@
             return;
         var location = /** @type {!WebInspector.DebuggerModel.Location} */ (script.target().debuggerModel.createRawLocation(script, node.lineNumber, 0));
         WebInspector.Revealer.reveal(WebInspector.debuggerWorkspaceBinding.rawLocationToUILocation(location));
     },
 
     _changeView: function()
     {
         if (!this.profile)
             return;
 
-        switch (this.viewSelectComboBox.selectedOption().value) {
+        this._searchableView.closeSearch();
+
+        if (this._visibleView)
+            this._visibleView.detach();
+
+        this._viewType.set(this.viewSelectComboBox.selectedOption().value);
+        switch (this._viewType.get()) {
         case WebInspector.CPUProfileView._TypeFlame:
             this._ensureFlameChartCreated();
-            this.dataGrid.detach();
-            this._flameChart.show(this.element);
-            this._viewType.set(WebInspector.CPUProfileView._TypeFlame);
             this._statusBarButtonsElement.classList.toggle("hidden", true);
-            return;
+            this._visibleView = this._flameChart;
+            this._searchableElement = this._flameChart;
+            break;
         case WebInspector.CPUProfileView._TypeTree:
             this.profileDataGridTree = this._getTopDownProfileDataGridTree();
             this._sortProfile();
-            this._viewType.set(WebInspector.CPUProfileView._TypeTree);
+            this._visibleView = this.dataGrid;
+            this._searchableElement = this.profileDataGridTree;
             break;
         case WebInspector.CPUProfileView._TypeHeavy:
             this.profileDataGridTree = this._getBottomUpProfileDataGridTree();
             this._sortProfile();
-            this._viewType.set(WebInspector.CPUProfileView._TypeHeavy);
+            this._visibleView = this.dataGrid;
+            this._searchableElement = this.profileDataGridTree;
             break;
         }
 
-        this._statusBarButtonsElement.classList.toggle("hidden", false);
-
-        if (this._flameChart)
-            this._flameChart.detach();
-        this.dataGrid.show(this.element);
-
-        if (!this.currentQuery || !this._searchFinishedCallback || !this._searchResults)
-            return;
-
-        // The current search needs to be performed again. First negate out previous match
-        // count by calling the search finished callback with a negative number of matches.
-        // Then perform the search again the with same query and callback.
-        this._searchFinishedCallback(this, -this._searchResults.length);
-        this.performSearch(this.currentQuery, this._searchFinishedCallback);
+        this._statusBarButtonsElement.classList.toggle("hidden", this._viewType.get() === WebInspector.CPUProfileView._TypeFlame);
+        this._visibleView.show(this._searchableView.element);
     },
 
     _focusClicked: function(event)
     {
         if (!this.dataGrid.selectedNode)
             return;
 
         this.resetButton.visible = true;
         this.profileDataGridTree.focus(this.dataGrid.selectedNode);
         this.refresh();
@@ skipping 454 matching lines @@
     _notifyTempFileReady: function()
     {
         if (this._onTempFileReady) {
             this._onTempFileReady();
             this._onTempFileReady = null;
         }
     },
 
     __proto__: WebInspector.ProfileHeader.prototype
 }