Bug 1335905 Spacebar case fixed, can find in label tags and value attributes but can not hightlight in them. Functional buttons draft
authorFirefox <manotejmeka@gmail.com>
Thu, 16 Feb 2017 20:30:12 -0500
changeset 488393 3a8211b2fbeb07753e6bf0cb8aa9490e077a25f4
parent 488392 72705740e97215935be98905d854f6c5e551252b
child 488394 fc0ad3c9878a6c44c40133a8514d9d97eaa12dee
push id46506
push userbmo:manotejmeka@gmail.com
push dateThu, 23 Feb 2017 01:53:57 +0000
bugs1335905
milestone54.0a1
Bug 1335905 Spacebar case fixed, can find in label tags and value attributes but can not hightlight in them. Functional buttons MozReview-Commit-ID: BbK6uWsTNz9
browser/components/preferences/in-content/SearchEach.js
browser/components/preferences/in-content/preferences.xul
--- a/browser/components/preferences/in-content/SearchEach.js
+++ b/browser/components/preferences/in-content/SearchEach.js
@@ -1,309 +1,301 @@
-console.log('in the SearchEach file');
+// No lint errors
+// console.log("in the SearchEach file");
 
-let mainSearchElement = document.querySelectorAll('#searchTextIMF');
+let mainSearchElement = document.querySelectorAll("#searchTextIMF");
+
+let firstTimeSearch = true;
 
 document.getElementById("searchTextIMF").addEventListener("command", searchFunc);
 
-function hideShowSearch () {
-    
-    let mainSearchEnable = Services.prefs.getBoolPref('browser.preference.search')
-
-    mainSearchElement.forEach(function (node){
-        let vis = node.style;
+function searchOnClick(){
+    // console.log("Search was clicked on");
+    //  Initializing all the JS for all the tabs
+    if (firstTimeSearch) {
+        firstTimeSearch = false;
+        gCategoryInits.forEach( function(eachTab) {
+            if (!eachTab.inited) {
+                eachTab.init();
+            }
+        });
+    }
+}
 
-        if (mainSearchEnable)
-        {
-            vis.display = 'block';
-        }
-        else
-        {
-            vis.display = 'none';
+function hideShowSearch() {
+    let mainSearchEnable = Services.prefs.getBoolPref("browser.preference.search");
+    mainSearchElement.forEach(function(node) {
+
+        let vis = node.style;
+        if (mainSearchEnable) {
+            vis.display = "block";
+        } else {
+            vis.display = "none";
         }
     });
-    
-    //if (!TransientPrefs.prefShouldBeVisible("browser.tabs.warnOnOpen"))
-    //  document.getElementById("warnOpenMany").hidden = true
-    
-
-    
-
+    // if (!TransientPrefs.prefShouldBeVisible("browser.tabs.warnOnOpen"))
+    //   document.getElementById("warnOpenMany").hidden = true
 }
 
 function searchFunc(event) {
     let element = event.target;
-    //Controller
+    // Controller
     let controller = getSelectionController();
     let findSelection = controller.getSelection(Ci.nsISelectionController.SELECTION_FIND);
     findSelection.removeAllRanges();
 
-    if(element.value){
-        console.time('SearchTime');
+    if (element.value.trim()) {
+        console.time("SearchTime");
+        
+        // Building the range for highlighted areas
+        let rootPreferences = document.getElementById("mainPrefPane")// .querySelectorAll("*")
+        let rootPreferencesChildren = rootPreferences.childNodes;
+        // Remove later, used for the debugs
+        // let foundCounter = 0;
+        for (let i = 0; i < rootPreferences.childElementCount; i++) {
+            rootPreferencesChildren[i].setAttribute("hidden", "false");
+        }
 
-        //Building the range for highlighted areas
-        let rootPreferences = document.getElementById('mainPrefPane')//.querySelectorAll('*')
-        let rootPreferencesChildren = rootPreferences.childNodes
-        //Remove later, used for the debugs
-        let foundCounter = 0;
-
-        for (let i = 0; i<rootPreferences.childElementCount; i++){
-            if(nodeRecursion(rootPreferencesChildren[i], element.value, findSelection)){
-                foundCounter++; //<Remove this 
-                rootPreferencesChildren[i].setAttribute('hidden', 'false');
-            }else{
-                rootPreferencesChildren[i].setAttribute('hidden', 'true');
+        for (let i = 0; i < rootPreferences.childElementCount; i++) {
+            if (nodeRecursion(rootPreferencesChildren[i], element.value.trim(), findSelection)) {
+                // foundCounter++; //  < Remove this
+                rootPreferencesChildren[i].setAttribute("hidden", "false");
+            } else {
+                rootPreferencesChildren[i].setAttribute("hidden", "true");
             }
         }
-        console.log('found and highlighted: ', foundCounter) //<Remove later
-        console.timeEnd('SearchTime')
-    } else{
+        // console.log("found and highlighted: ", foundCounter) //  < Remove later
+        console.timeEnd("SearchTime");
+    } else {
         console.log("Empty string not searching, clearing shit instead");
     }
 
 }
-mainSearchElement.innerHTML = ''
-mainSearchElement.value = ''
+mainSearchElement.innerHTML = "";
+mainSearchElement.value = "";
 hideShowSearch();
 
 
 /**
  * Check that the passed string matches the filter arguments.
  *
  * @param String str
  *        to search for filter words in.
  * @param String filter
  *        is a string containing all of the words to filter on.
  * @returns boolean
  */
-function stringMatchesFilters (str, filter) {
+function stringMatchesFilters(str, filter) {
     if (!filter || !str) {
         return true;
     }
 
     let searchStr = str.toLowerCase();
     let filterStrings = filter.toLowerCase().split(/\s+/);
-    return !filterStrings.some(function (f) {
+    return !filterStrings.some(function(f) {
         return searchStr.indexOf(f) == -1;
     });
 }
 
 function nodeRecursion(nodeObject, searchPhrase, findSelection) {
-    let foundIn = false
-    if(nodeObject.childElementCount == 0){
-        let leafTextNodes, otherTextNodes = []
-        let listOfWords = searchPhrase.trim().split()
-        if(nodeObject){
-        leafTextNodes = textNodesUnder(nodeObject)
-        }
-        if(nodeObject.boxObject){
-        otherTextNodes = textNodesUnder(nodeObject.boxObject)
+    let foundIn = false;
+    if (nodeObject.childElementCount == 0) {
+        let leafTextNodes, otherTextNodes = [];
+        let listOfWords = searchPhrase.trim().split(); //  List of words to search from
+
+        //  Searching in the Text Nodes
+        if (nodeObject) {
+            leafTextNodes = textNodesUnder(nodeObject);
         }
-        
-        if (leafTextNodes || otherTextNodes){
-            //console.log(nodeObject)
-            //console.log(leafTextNodes,otherTextNodes)
+        if (nodeObject.boxObject) {
+            otherTextNodes = textNodesUnder(nodeObject.boxObject);
         }
-        
-        leafTextNodes.forEach(function (node) {
-            //console.log(node
-            listOfWords.forEach(function (word){
-                let boolAns = searchWord(node,node.textContent,word,findSelection)
-                foundIn = foundIn || boolAns
+        leafTextNodes.forEach(function(node) {
+            listOfWords.forEach(function(word) {
+                let boolAns = searchWord(node, node.textContent, word, findSelection);
+                foundIn = foundIn || boolAns;
             });
         });
-        otherTextNodes.forEach(function (node) {
-            //console.log(node)
-            listOfWords.forEach(function (word){
+        /*
+        otherTextNodes.forEach(function(node) {
+            // console.log(node)
+            listOfWords.forEach(function(word){
                 let boolAns = searchWord(node,node.textContent,word,findSelection)
                 foundIn = foundIn || boolAns
             });
         });
-    }
-    for(let i=0; i<nodeObject.childElementCount; i++){
-        let boolAns = nodeRecursion(nodeObject.childNodes[i], searchPhrase, findSelection)
-        foundIn = foundIn || boolAns
-        //foundIn = foundIn || nodeRecursion(nodeObject.childNodes[i], searchPhrase, findSelection)
-    }
-    return foundIn
-}
-/*
-  function nodeRecursion(nodeObject, searchPhrase, findSelection) {
-      console.log(nodeObject)
-      if(nodeObject.childElementCount == 0 //&& 
-      //(getTextContentAttribute(nodeObject,searchPhrase) || 
-       //getLabelAttribute(nodeObject,searchPhrase))
-     // (textNodesUnder(nodeObject) || textNodesUnder(nodeObject.boxObject))
-      ) {
-          //Drill down deeper 
-          //if(nodeObject.boxObject){
-          //    getRangeObject(nodeObject.boxObject, searchPhrase.trim().split(), range);
-          //}
+        */
+        //  Searching in Text boxes, radio buttons
+        let nodeSizes = [];
+        let allNodeText = "";
+        let runningSize = 0;
 
-          // Finding Text nodes in leaf node
-          let leaf = textNodesUnder(nodeObject)
-          let listOfWords = searchPhrase.trim().split()
+        otherTextNodes.forEach(function(node) {
+            runningSize += node.textContent.length;
+            allNodeText += node.textContent;
+            nodeSizes.push(runningSize);
+        });
+
+        listOfWords.forEach(function(word) {
+            let boolAns = multiSearch(otherTextNodes, nodeSizes, allNodeText, word, findSelection);
+            // searchWord(node,node.textContent,word,findSelection)
+            foundIn = foundIn || boolAns;
+        });
 
-          //console.log("Leaf")
-          //console.log(leaf)
-          leaf.forEach(function (node) {
-              //console.log(node)
-              listOfWords.forEach(function (word){
-                searchWord(node,node.textContent,word,findSelection)
-            });
-          });
-          
-          // Checkboxes, radio buttons
-          let anonymous = textNodesUnder(nodeObject.boxObject)
-          let anonymousTextContent = ''
-          let anonymousLabelContent = ''
-          let nodeSizes = []
-          let nodeLengthCounter = 0
-          //console.log("anonymousTextContent", nodeObject, anonymous)
-          anonymous.forEach(function (node) {
-              anonymousTextContent += node.textContent
-              anonymousLabelContent += node.label
-              nodeLengthCounter += node.length
-              //console.log("itter:",node, anonymousTextContent,anonymousLabelContent,nodeLengthCounter)
-              nodeSizes.push(nodeLengthCounter)
-          });
-          
-          //console.log(anonymousTextContent)
-          
-          listOfWords.forEach(function (word){
-                multiSearch(anonymous,nodeSizes,anonymousTextContent,word,findSelection)
-          });
-          
-          
-          /*
-          allTextNodes.forEach(function (node) {
-              listOfWords.forEach(function (word){
-                searchWord(node,node.textContent,word,range)
-            });
-          });
-          *
-          
-          return true
-      }
-      let foundInChild = false
-      for (let i = 0; i<nodeObject.childElementCount; i++){
-          foundInChild = foundInChild || nodeRecursion(nodeObject.childNodes[i],searchPhrase, findSelection)
-      }
+        //  Searching in the buttons
+        listOfWords.forEach(function(word) {
+            let boolAns = getLabelAttribute(nodeObject, word);
+            foundIn = foundIn || boolAns;
+            // if (getLabelAttribute(nodeObject,word)){
+            //     console.log(nodeObject)
+            //     foundIn = true
+            // }
+        });
 
-      //return foundInChild
-  }
-  */
+        //  Label tag that does not have textCont but text is in Value attr
+        listOfWords.forEach(function(word) {
+            let boolAns = getValueAttribute(nodeObject, word);
+            foundIn = foundIn || boolAns;
+            if (boolAns) {
+                searchWord(nodeObject, nodeObject.value, word, findSelection)
+            }
+            // if (getLabelAttribute(nodeObject,word)){
+            //     console.log(nodeObject)
+            //     foundIn = true
+            // }
+        });
+    }
+    for (let i = 0; i < nodeObject.childElementCount; i++) {
+        let boolAns = nodeRecursion(nodeObject.childNodes[i], searchPhrase, findSelection);
+        foundIn = foundIn || boolAns;
+        // foundIn = foundIn || nodeRecursion(nodeObject.childNodes[i], searchPhrase, findSelection)
+    }
+    return foundIn;
+}
 
-  //http://stackoverflow.com/questions/10730309/find-all-text-nodes-in-html-page
-  function textNodesUnder(node) {
+// http:// stackoverflow.com/questions/10730309/find-all-text-nodes-in-html-page
+function textNodesUnder(node) {
     let all = [];
-    for (node=node.firstChild;node;node=node.nextSibling){
-        if (node.nodeType===node.TEXT_NODE) all.push(node);
+    for (node = node.firstChild; node; node = node.nextSibling) {
+        if (node.nodeType === node.TEXT_NODE) all.push(node);
         else all = all.concat(textNodesUnder(node));
     }
     return all;
-  }
+}
 
-  /*
-  function getRangeObject(elementObject, listOfWords, range){
-    let firstChildElement = elementObject.firstChild
-    if(firstChildElement.nodeType === firstChildElement.TEXT_NODE){
-        listOfWords.forEach(function (word){
-            searchWord(firstChildElement,nodeObject.textContent,word,range)
-        });
-    } else if(firstChildElement.nextSibling){
-        getRangeObject(firstChildElement.nextSibling, listOfWords, range)
+function searchWord(textNode, textSearch, word, findSelection) {
+    let regExp = new RegExp(word, "gi");
+    let result, indices = [];
+
+    while ((result = regExp.exec(textSearch))) {
+        indices.push(result.index);
     }
 
-    
-  }
-  */
-
-  //nodeObject.boxObject.firstChild.nextSibling.firstChild.nextSibling.firstChild.textContent.includes("Night")
-
-  function searchWord(textNode, textSearch, word, findSelection){
-      let regExp = new RegExp(word,'gi')
-      let result,indices = []
-
-      while( (result=regExp.exec(textSearch)) ){
-          indices.push(result.index)
-      }
-
-      // Add each found word to range
-      for(let i=0;i<indices.length; i++){
+    //  Add each found word to range
+    for (let i = 0; i < indices.length; i++) {
         let range = document.createRange();
         range.setStart(textNode, indices[i]);
-        range.setEnd(textNode, (indices[i]+word.length) );
-        findSelection.addRange(range); // Add each range to be highlighted
-      }
-      return indices.length > 0
-  }
-
-  function multiSearch(textNodes, nodeSizes, textSearch, word, findSelection){
-      let regExp = new RegExp(word,'gi')
-      let result,indices = []
-
-      while( (result=regExp.exec(textSearch)) ){
-          indices.push(result.index)
-      }
-
-      //console.log("multiSearch")
-      //console.log(textNodes)
-      //console.log(nodeSizes)
-      //console.log(indices)      
-  }
-
-  function getTextContentAttribute(nodeObject,searchPhrase){
-      if(typeof nodeObject.textContent == 'string' && nodeObject.textContent != ''
-      && stringMatchesFilters(nodeObject.textContent, searchPhrase)){
-          /*
-          words = searchPhrase.trim().split()
-          for(let i=0; i<words.length; i++){
-            searchWord(nodeObject,nodeObject.textContent,words[i],range)
-          }
-          */
-          return true
-      }
-      return false
-  }
-
-  function getLabelAttribute(nodeObject,searchPhrase){
-      if(typeof nodeObject.label == 'string' && nodeObject.label != ''
-      && stringMatchesFilters(nodeObject.label, searchPhrase)){
-          /*
-          words = searchPhrase.trim().split()
-          for(let i=0; i<words.length; i++){
-            searchWord(nodeObject,nodeObject.label,words[i],range)
-          }
-          */
-          return true
-      }
-      return false
-  }
-
-  /*
-  function replaceText(originalText,words){
-      words = words.replace(/ /g,'|')
-      let regExp = new RegExp(words,'gi')
-      originalText = originalText.replace(regExp, function subFunction(x){return '<span class=\'search-highlighted\'>'+x+'</span>';});
-      return originalText
+        range.setEnd(textNode, (indices[i] + word.length) );
+        findSelection.addRange(range); //  Add each range to be highlighted
+    }
+    return indices.length > 0;
 }
 
-function removeHighlightedSearch() {
-    let x = document.getElementsByClassName('search-highlighted');
-    while(x.length){
-        x[0].outerHTML = x[0].textContent
+function multiSearch(textNodes, nodeSizes, textSearch, word, findSelection) {
+    let regExp = new RegExp(word, "gi");
+    let result, indices = [];
+
+    while ((result = regExp.exec(textSearch))) {
+        indices.push(result.index);
     }
-    
+
+    /* if (indices.length > 0){
+        console.log("Other words")
+        console.log(textNodes)
+        console.log(nodeSizes)
+        console.log(textSearch)
+        console.log("End other words")
+    } */
+    indices.forEach(function(startValue, startIndex) {
+        let endValue = startValue + word.length;
+        let startNode = null;
+        let endNode = null;
+        let nodeStartIndex = null;
+
+        nodeSizes.forEach(function(lengthNodes, index) {
+            if (!startNode && lengthNodes >= startValue) {
+                startNode = textNodes[index];
+                nodeStartIndex = index;
+                if (index > 0 ) {
+                    startValue -= nodeSizes[index - 1];
+                }
+            }
+
+            if (!endNode && lengthNodes >= endValue) {
+                endNode = textNodes[index];
+                if (index != nodeStartIndex || index > 0 ) {
+                    endValue -= nodeSizes[index - 1];
+                }
+            }
+        });
+        let range = document.createRange();
+        range.setStart(startNode, startValue);
+        range.setEnd(endNode, endValue);
+        findSelection.addRange(range);
+    });
+
+    return indices.length > 0;
+
 }
-*/
+
+function getTextContentAttribute(nodeObject, searchPhrase) {
+    if (typeof nodeObject.textContent == "string" && nodeObject.textContent != ""
+    && stringMatchesFilters(nodeObject.textContent, searchPhrase)) {
+        return true;
+    }
+    return false;
+}
+
+function getLabelAttribute(nodeObject, searchPhrase) {
+    if (typeof nodeObject.label == "string" && nodeObject.label != ""
+    && stringMatchesFilters(nodeObject.label, searchPhrase)) {
+        console.log("Found it in label", nodeObject);
+        // nodeObject.classList.add("search-bubble");
+
+        // var creatSpanTag = document.createElement("span");
+        // creatSpanTag.classList.add("search-bubble-text");
+        // creatSpanTag.innerHTML = searchPhrase;
+       //  nodeObject.appendChild(creatSpanTag);
+        return true;
+    }
+    return false;
+}
+
+function getValueAttribute(nodeObject, searchPhrase) {
+    if (typeof nodeObject.value == "string" && nodeObject.value != ""
+    && stringMatchesFilters(nodeObject.value, searchPhrase)) {
+        console.log("Found it in value", nodeObject);
+        nodeObject.textContent = nodeObject.value
+        nodeObject.innerHTML = nodeObject.value
+        // nodeObject.classList.add("search-bubble");
+
+        // var creatSpanTag = document.createElement("span");
+        // creatSpanTag.classList.add("search-bubble-text");
+        // creatSpanTag.innerHTML = searchPhrase;
+       //  nodeObject.appendChild(creatSpanTag);
+        return true;
+    }
+    return false;
+}
+
+
 function getSelectionController() {
-    // Yuck. See bug 138068.
+    //  Yuck. See bug 138068.
     let docShell = window.QueryInterface(Ci.nsIInterfaceRequestor)
                           .getInterface(Ci.nsIWebNavigation)
                           .QueryInterface(Ci.nsIDocShell);
 
     let controller = docShell.QueryInterface(Ci.nsIInterfaceRequestor)
                              .getInterface(Ci.nsISelectionDisplay)
                              .QueryInterface(Ci.nsISelectionController);
 
-    return controller
-} 
+    return controller;
+}
--- a/browser/components/preferences/in-content/preferences.xul
+++ b/browser/components/preferences/in-content/preferences.xul
@@ -185,17 +185,17 @@
            Remove this keyset once bug 1094240 ("disablefastfind" attribute
            broken in e10s mode) is fixed. -->
       <key key="&focusSearch1.key;" modifiers="accel" id="focusSearch1" oncommand=";"/>
     </keyset>
 
 
     <vbox class="main-content" flex="1">
       <div align="right">  
-        <textbox type="search" name="q" value="" id="searchTextIMF" placeholder="Search" oncommand=";"/>
+        <textbox type="search" name="q" value="" id="searchTextIMF" placeholder="Search" oncommand=";" onclick="searchOnClick()"/>
       </div>
       <prefpane id="mainPrefPane">
 #include main.xul
 #include search.xul
 #include privacy.xul
 #include containers.xul
 #include advanced.xul
 #include applications.xul