[DevTools] Added keyboard search while in sources

third_party/WebKit/Source/devtools/front_end/sources/SourcesNavigator.js

 /*
  * Copyright (C) 2011 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:
  *
  * 1. Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *
@@ skipping 125 matching lines @@
 }
 
 /**
  * @constructor
  * @extends {WebInspector.NavigatorView}
  */
 WebInspector.SourcesNavigatorView = function()
 {
     WebInspector.NavigatorView.call(this);
     WebInspector.targetManager.addEventListener(WebInspector.TargetManager.Events.InspectedURLChanged, this._inspectedURLChanged, this);
+    this.element.addEventListener("blur", this._handleBlur.bind(this), true);
+    this.element.addEventListener("click", this._handleClick.bind(this), true);
+
+    this._scriptsTree.addEventListener(TreeOutline.Events.FilterChanged, this._handleFilterChange.bind(this));
 }
 
 WebInspector.SourcesNavigatorView.prototype = {
     /**
      * @override
      * @param {!WebInspector.UISourceCode} uiSourceCode
      * @return {boolean}
      */
     accept: function(uiSourceCode)
     {
         if (!WebInspector.NavigatorView.prototype.accept(uiSourceCode))
             return false;
         return uiSourceCode.project().type() !== WebInspector.projectTypes.ContentScripts && uiSourceCode.project().type() !== WebInspector.projectTypes.Snippets;
     },
 
     /**
+     * @param {!Event} event
+     */
+    _handleClick: function (event){
+        // remove filter

[lushnikov, 2016/03/14 20:56:38]

we usually don't put comments in the code unless its *absolutely* needed. In an
ideal world, the code is self-explanatory.
And comments are usually overlooked during refactoring/working with code, thus
becoming stale pretty fast.

+        this._scriptsTree.setCurrentSelectionFilterString('');
+    },
+
+    /**
+     * @param {!Event} event
+     */
+    _handleBlur: function (event) {
+        // remove filter
+        this._scriptsTree.setCurrentSelectionFilterString('');
+    },
+
+    /**
+     * Does the highlighting for for when the filter changes

[lushnikov, 2016/03/14 20:56:37]

ditto

+     * @param {!WebInspector.Event} event
+     */
+    _handleFilterChange: function (event){

[lushnikov, 2016/03/14 20:56:37]

style: no space after "function"
style: the { should be on a new line.

+        var node = this._rootNode.treeNode();
+
+        if (node){

[lushnikov, 2016/03/14 20:56:38]

style: space before {

+            var treeOutline = event.data.treeOutline;
+            if (!treeOutline.selectedTreeElement.selectable) {
+                treeOutline.selectNext() || treeOutline.selectPrevious();

[lushnikov, 2016/03/14 20:56:37]

Style: we don't use {} for a one-line statements.
https://www.chromium.org/blink/coding-style

+            }
+
+            do {
+                if (node.titleText !== null) {
+                    let titleText = node.titleText;

[lushnikov, 2016/03/14 20:56:37]

we haven't been using LET and don't have a policy for it yet. Let's not use it
until everybody's agreed on it.

+                    if (typeof titleText !== 'string'){
+                        titleText = titleText.textContent;
+                    }
+                    if (event.data.changeTo === null) {

[lushnikov, 2016/03/14 20:56:38]

let's extract event.data and typecast it to the correct type. Otherwise the
Closure has no idea what's going on here

+                       node.title = titleText;
+                    } else {
+                        let newExp = new RegExp(event.data.changeTo.source, 'gi');
+                        if (node.title) {
+                            let parentSpan = createElementWithClass("span", "tree-element-title");
+                            let match;
+                            let offsetStart = 0;
+                            while((match = newExp.exec(titleText)) !== null){
+                                let leftSpan = createElementWithClass("span"),
+                                    midSpan = createElementWithClass("span", "navigator-tree-item-highlight");
+
+                                leftSpan.textContent = titleText.substring(offsetStart, match.index);
+                                parentSpan.appendChild(leftSpan);
+                                midSpan.textContent = titleText.substr(match.index, match[0].length);
+                                parentSpan.appendChild(midSpan);
+
+                                offsetStart = match.index + match[0].length;
+                            }
+                            if (offsetStart !== titleText.length) {
+                                let rightSpan = createElementWithClass("span");
+                                rightSpan.textContent = titleText.substr(offsetStart);
+                                parentSpan.appendChild(rightSpan);
+                            }
+                            node.title = parentSpan;
+                        }
+                    }
+                }
+                node = node.traverseNextTreeElement(true, null, true);
+            }while(node);
+        }
+    },
+
+    /**
      * @param {!WebInspector.Event} event
      */
     _inspectedURLChanged: function(event)
     {
        var nodes = this._uiSourceCodeNodes.valuesArray();
        for (var i = 0; i < nodes.length; ++i) {
            var uiSourceCode = nodes[i].uiSourceCode();
            var inspectedPageURL = WebInspector.targetManager.inspectedPageURL();
            if (inspectedPageURL && WebInspector.networkMapping.networkURL(uiSourceCode) === inspectedPageURL)
               this.revealUISourceCode(uiSourceCode, true);
@@ skipping 117 matching lines @@
     /**
      * @override
      */
     sourceDeleted: function(uiSourceCode)
     {
         this._handleRemoveSnippet(uiSourceCode);
     },
 
     __proto__: WebInspector.NavigatorView.prototype
 }