Added all window search and list with toggling functionality.

README.md

@@ -4,11 +4,9 @@ Search Firefox tabs and get a list or automatic direct to the searched tab.
 # Download
 https://addons.mozilla.org/en-US/firefox/addon/tab-search-and-manage/
 
-# Version: 1.2.2
+# Version: 1.2.6
 <ul>
-<li>Changed plugin name</li>
-<li>Added show/hide tabs functionality</li>
-<li>Changed some theming and css rules</li>
+<li>Added all window search and list with toggling functionality.</li>
 </ul>
 
 ***Note:

src/css/tabsSearch.css

@@ -21,7 +21,7 @@ html, body { overflow-x: hidden; }
 #udArrows {
     position: fixed;
     bottom: 0;
-    margin-left: 28%;
+    margin-left: 25%;
 }
 
 #udArrows button {
@@ -66,26 +66,36 @@ html, body { overflow-x: hidden; }
     margin: 1.5em;
 }
 
-.block {
+.block, .windowIdHeaders {
     display: block;
-    background-color: rgba(20, 107, 134, 0.87);
+    clear: right;
+    float: left;
+    background-color: rgba(9,107,120, 0.85);
+    color: rgb(255,255,255);
+}
+
+.block {
     background-repeat: no-repeat;
     background-size: 6em;
     background-position: center;
-    color: rgba(255,255,255,1);
-    float: left;
     width: 125px;
     height: 125px;
-    clear: right;
     overflow: hidden;
     margin: 1.5em;
 }
+
 .block:hover {
     cursor: pointer;
     background-color: rgba(110, 194, 45, 0.94);
     color: rgba(255, 255, 255, 0.84);
 }
 
+.windowIdHeaders {
+    width: 100%;
+    font-size: 2em;
+    text-align: center;
+}
+
 .closeImg, .hiderImg {
     padding: 0.5em;
     width: 28px;

src/manifest.json

@@ -1,7 +1,7 @@
 {
     "manifest_version": 2,
     "name": "Tab Search and Manage",
-    "version": "1.2.5",
+    "version": "1.2.6",
     "description": "This plugin can search, drag-n-drop ordering, and (un)hide all or some tabs.",
 
   "applications": {

src/pages/tabsSearch.html

@@ -24,6 +24,9 @@
         <button id="goToTab" type="button" title="Scroll Current Tab To View">
             <img style="width:1em; height:1em;" src="../icons/go2-arrow.png"/>
         </button>
+        <button id="searchMode" searchwindowsmode="false"  type="button" title="Searching curent window...">
+            <img style="width:1em; height:1em;" src="../icons/window.png"/>
+        </button>
         <button id="newTab" type="button" title="New Tab">
             <img style="width:1em; height:1em;" src="../icons/plus.png"/>
         </button>

src/scripts/eventListeners.js

@@ -1,29 +1,33 @@
 // Set click events for tab blocks
 document.addEventListener("click", (e) => {
-    var target    = undefined;
-
-    if (!e.target.className.includes("pTagTitleText")) {
-        target = e.target;
-    } else {
-        target = e.target.parentElement;
-    }
+    var target = (!e.target.className.includes("pTagTitleText")) ? e.target : e.target.parentElement;
     var targetID  = target.id;
     var parentElm = target.parentElement;
     var id        = 0;
 
-
     if (targetID == "closeBttn") {
+        if (parentElm == oldElm) {
+            var index = Array.from(parentElm.parentElement.children).indexOf(parentElm);
+            (index - 1 < 0) ? index++ :  index-- ;  // Check what index to chose
+            var newElm = parentElm.parentElement.children[index];
+
+            id = parseInt(newElm.getAttribute("tabID"));
+            browser.tabs.update(id, { active: true });
+            setOldElm(newElm);
+        }
+
         id = parseInt(parentElm.getAttribute("tabID"));
         browser.tabs.remove(id);
+
         parentElm.parentElement.removeChild(parentElm);
     } else if (targetID == "iconElm") {
         id = parseInt(target.getAttribute("tabID"));
+        tabsAction.get(id).then((tab) => {
+            browser.windows.update(tab.windowId, {focused: true});
             browser.tabs.update(id, { active: true });
+        },id);
 
-        target.querySelectorAll(".hiderImg")[0].src = "../icons/eyeOpen.png";
-        oldElm.setAttribute("class", "block");
-        oldElm = target;
-        target.setAttribute("class", "block block-focused");
+        setOldElm(target);
     } else if (targetID == "goTop") {
         window.scrollTo(0,0);
     } else if (targetID == "goBottom") {
@@ -52,9 +56,29 @@ document.addEventListener("click", (e) => {
         doAllTabs(0)
     } else if (targetID == "showAllBttn") {
         doAllTabs(1);
+    } else if (targetID == "searchMode") {
+        var currentMode = target.getAttribute("searchwindowsmode");
+        if (currentMode == "true") {
+            target.title           = "Searching curent window...";
+            target.children[0].src = "../icons/window.png";
+            target.setAttribute("searchwindowsmode", "false");
+        } else {
+            target.title           = "Searching all windows...";
+            target.children[0].src = "../icons/windows.png";
+            target.setAttribute("searchwindowsmode", "true");
+        }
+        clearNodes(listZone);
+        getTabs();
     }
 });
 
+function setOldElm(target) {
+    target.querySelectorAll(".hiderImg")[0].src = "../icons/eyeOpen.png";
+    oldElm.setAttribute("class", "block");
+    oldElm = target;
+    target.setAttribute("class", "block block-focused");
+}
+
 document.getElementById("searchBar").onkeypress = function () {
     searchTabs();
 }

src/scripts/generateView.js

@@ -6,12 +6,40 @@ const notFoundText  = document.createTextNode("Search not found...");
 const tabImg        = browser.extension.getURL("icons/tab.png");
 var oldElm          = "";
 var plusTag         = ""
+var currentWinId    = undefined;
+var newWinId        = undefined;
+var focusedWinID    = undefined;
+var windowIndex     = 0;
 
 function logTabs(tabs) {
-    // tab.url requires the `tabs` permission
+    windowIndex = 0;
+    tabsAction.query({currentWindow: true, active: true}).then((tab) => {
+        focusedWinID = tab[0].windowId;
+    }, focusedWinID);
+
     for (let tab of tabs) {
+        currentWinId = tab.windowId;
+        if (currentWinId == newWinId) {
             createContainer(tab);
+        } else {
+            if (windowIndex != 0) {
+                var pTag       = document.createElement("P");
+                var msg        = (focusedWinID == tab.windowId)
+                                 ? "[  Current Window  ] " : "Window: " + tab.windowId;
+                var pText      = document.createTextNode(msg);
+                pTag.className = "windowIdHeaders";
+                pTag.appendChild(pText);
+                listZone.appendChild(pTag);
+                windowIndex++;
+                createContainer(tab);
+            } else {
+                windowIndex = 1;
             }
+        }
+        newWinId = currentWinId;
+    }
+
+    newWinId    = undefined;
     // Set poped-out-window position and 100px up from selected elm
      oldElm.scrollIntoView();
      window.scrollBy(0, -100);
@@ -75,9 +103,21 @@ function createTab() {
 
 function onError(error) { console.log(`Error: ${error}`); }
 
-function getTabs(tabs) {
-    // Get current tab and then list of tabs
-    tabsAction.query({currentWindow: true})
-            .then(logTabs, onError);
+function getTabs() {
+    var elm         = document.getElementById("searchMode");
+    var currentMode = (elm.getAttribute("searchwindowsmode") == "false");
+
+    if (currentMode == false) {
+        tabsAction.query({}).then(logTabs, onError)
+                            .then(resetWinIndex, onError);
+    } else {
+        tabsAction.query({currentWindow: currentMode})
+                  .then(logTabs, onError)
     }
+}
+
+function resetWinIndex() {
+    windowIndex    = 0;
+}
+
 getTabs();

src/scripts/searchTabs.js

@@ -1,7 +1,5 @@
 function findTabs(tabs) {
     var selection = [];
-
-    clearNodes(listZone);
     if (searchBar.value != "") {
         for (let tab of tabs) {
             var title = tab.title;
@@ -10,16 +8,16 @@ function findTabs(tabs) {
             }
         }
         if (selection.length > 1) {
-            for (let sel of selection) {
-                createContainer(sel)
-            }
+            logTabs(selection);
             errHandler.style.display = "none";
             clearNodes(errHandler);
         } else {
             if (selection[0] != undefined) {
+                searchBar.value          = "";
                 errHandler.style.display = "none";
                 clearNodes(errHandler);
                 loadSelTab(selection[0].id);
+                getTabs();
             } else {
                 errHandler.style.display = "block";
                 errHandler.appendChild(notFoundText);
@@ -37,6 +35,14 @@ function clearNodes(targetNode) {
 function loadSelTab(id) { browser.tabs.update(id, { active: true }); }
 
 function searchTabs() {
-    tabsAction.query({currentWindow: true})
-              .then(findTabs, onError);
+    var elm         = document.getElementById("searchMode");
+    var currentMode = (elm.getAttribute("searchwindowsmode") == "false");
+    clearNodes(listZone);
+
+    if (currentMode == false) {
+        tabsAction.query({}).then(findTabs, onError);
+    } else {
+        tabsAction.query({currentWindow: currentMode})
+                  .then(findTabs, onError)
+    }
 }