Tab duplicate behavior change

README.md

@@ -4,9 +4,8 @@ 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.3.9
-* Added tab duplicate button
-* Added secondary control menu
+# Version: 1.3.10
+* Improved tab duplicate behavior
 
 
 ***Note:

src/manifest.json

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

src/scripts/eventListeners.js

@@ -88,21 +88,26 @@ function setNewTabAction(target, targetID, parentElm, id) {
 }
 
 function popoutSelectedTabAction(target, targetID) {
-    parentElm = target.parentElement;
-    id        = parseInt(target.getAttribute("tabID"));
+    let parentElm = target.parentElement;
+    let id        = parseInt(target.getAttribute("tabID"));
     popoutSelectedTab(id);
 }
 
 function duplicateTabAction(target, targetID) {
-    parentElm = target.parentElement;
-    id        = parseInt(target.getAttribute("tabID"));
-    duplicateTab(id);
+    let parentElm = target.parentElement;
+    let id        = parseInt(target.getAttribute("tabID"));
+    let kids      = parentElm.children;
+    let toIndex   = 0;
+
+    while (kids[toIndex] !== target) { toIndex++; }
+
+    duplicateTab(id, (toIndex += 1));
 }
 
 function hideSelectedTabAction(target, targetID) {
-    parentElm = target.parentElement;
-    id        = parseInt(target.getAttribute("tabID"));
-    control   = document.getElementById("tabControls").querySelector("#hideTgglBttn");
+    let parentElm = target.parentElement;
+    let id        = parseInt(target.getAttribute("tabID"));
+    let control   = document.getElementById("tabControls").querySelector("#hideTgglBttn");
 
     if (id != oldElm.getAttribute("tabID")) {
         if (control.src.includes("eyeClosed.png")) {

src/scripts/generateView.js

@@ -21,36 +21,24 @@ function popoutSelectedTab(id) {
     windowsAction.create({tabId: id});
 }
 
-
-async function duplicateTab(id) {
-    tab = await tabsAction.duplicate(id);
-    createContainer(tab);
+async function duplicateTab(id, pos) {
+    tab = await tabsAction.duplicate(id, {index: pos, active: true});
+    createContainer(tab, pos);
 }
 
-function unhideSelectedTab(id) {
-    tabsAction.show(id).then(successMsg, errMsg);
+function unhideSelectedTab(id) { tabsAction.show(id).then(successMsg, errMsg); }
+function hideSelectedTab(id)   { tabsAction.hide(id).then(successMsg, errMsg); }
+function muteSelectedTab(id)   { tabsAction.update(id, {muted: true}) }
+function unmuteSelectedTab(id) { tabsAction.update(id, {muted: false}) }
+
+function resetWinIndex() { windowIndex = 0; }
+function createWin()     { windowsAction.create({}); }
+function onError(error)  { console.log(`Error: ${error}`); }
+
+function createTab()     {
+    tabsAction.create({}).then(function (tab) { createContainer(tab); });
 }
 
-function hideSelectedTab(id)   {
-    tabsAction.hide(id).then(successMsg, errMsg);
-}
-
-function muteSelectedTab(id) {
-    tabsAction.update(
-        id,
-        {muted: true}
-    )
-}
-
-function unmuteSelectedTab(id)   {
-    tabsAction.update(
-        id,
-        {muted: false}
-    )
-}
-
-
-
 
 function logTabs(tabs) {
     windowIndex = 0;
@@ -60,13 +48,14 @@ function logTabs(tabs) {
     }, focusedWinID).then(() => {
         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;
+                                        ? "[  Current Window  ] " : "Window: " + tab.windowId;
                     var pText      = document.createTextNode(msg);
                     pTag.className = "windowIdHeaders";
                     pTag.appendChild(pText);
@@ -86,7 +75,7 @@ function logTabs(tabs) {
     scrollToView();
 }
 
-function createContainer(tab) {
+function createContainer(tab, pos = null) {
     var template       = document.querySelector('#tabContainerTemplate');
     var clone          = document.importNode(template.content, true);
     var spanTag        = clone.querySelector("#iconElm");
@@ -111,71 +100,59 @@ function createContainer(tab) {
     }
 
     spanTag.setAttribute("tabID", tab.id);
-    spanTag.title         = tab.title;
+    spanTag.title = tab.title;
 
-    if (!tab.hidden)
+    if (!tab.hidden) {
         spanTag.className = "block";
-    else
+    } else {
         spanTag.className = "block hiddenBGColor";
+    }
 
-
-    spanTag.style.backgroundImage    = "url(" + tab.favIconUrl + ")";
-    icoImgTag.src         = tab.favIconUrl;
-    icoImgTag.onerror     = function() { spanTag.style.backgroundImage = "url(" + tabImg + ")"; }
-
+    spanTag.style.backgroundImage = "url(" + tab.favIconUrl + ")";
+    icoImgTag.src = tab.favIconUrl;
+    icoImgTag.onerror = function() { spanTag.style.backgroundImage = "url(" + tabImg + ")"; }
     spanTag.addEventListener("mouseenter", function (eve) {
         moveTabControlTo(eve.target);
     });
 
     pTag.appendChild(iconText);
-    listZone.appendChild(clone);
-}
-
-function createTab() {
-  tabsAction.create({})
-            .then(function (tab) {
-                createContainer(tab);
-            });
-}
-
-function createWin() {
-  windowsAction.create({});
+    if (pos == null) {
+        listZone.appendChild(clone);
+    } else {
+        listZone.insertBefore(clone, listZone.children[pos]);
+    }
 }
 
 async function moveTabControlTo(elm) {
-    let tabControls        = document.getElementById("tabControls");
-    let tabControls2       = document.getElementById("tabControls2");
-    let hideTgglBttn       = tabControls.querySelector("#hideTgglBttn")
-    let muteTgglBttn       = tabControls.querySelector("#muteTgglBttn")
-
-    let rect               = elm.getBoundingClientRect();
-
-    tabControls.style.left = (rect.left) + "px";
-    tabControls.style.top  = (rect.top) + "px";
-
+    let tabControls         = document.getElementById("tabControls");
+    let tabControls2        = document.getElementById("tabControls2");
+    let hideTgglBttn        = tabControls.querySelector("#hideTgglBttn")
+    let muteTgglBttn        = tabControls.querySelector("#muteTgglBttn")
+    let rect                = elm.getBoundingClientRect();
+    tabControls.style.left  = (rect.left) + "px";
+    tabControls.style.top   = (rect.top) + "px";
     tabControls2.style.left = (rect.left - 46) + "px";
     tabControls2.style.top  = rect.top + "px";
-    hoverTarget            = elm;
+    hoverTarget             = elm;
 
-    if (elm.className == "block hiddenBGColor")
+    if (elm.className == "block hiddenBGColor") {
         hideTgglBttn.src = "../icons/eyeClosed.png";
-    else
+    } else {
         hideTgglBttn.src = "../icons/eyeOpen.png";
-
+    }
 
     id  = parseInt(hoverTarget.getAttribute("tabID"));
     tab = await tabsAction.get(id);
-    if (tab.mutedInfo.muted == false)
+    if (tab.mutedInfo.muted == false) {
         muteTgglBttn.src  = "../icons/isNotMuted.png";
-    else
+    } else {
         muteTgglBttn.src  = "../icons/isMuted.png";
+    }
 
     tabControls.style.display  = "";
     tabControls2.style.display = "";
 }
 
-function onError(error) { console.log(`Error: ${error}`); }
-
 function getTabs() {
     clearNodes(listZone);
 
@@ -209,8 +186,8 @@ function getTabs() {
 }
 
 async function setSearchMode(target, text, img, state) {
-    target.title   = "Searching " + text + "...";
-    target.src     = "../icons/" + img + ".png";
+    target.title = "Searching " + text + "...";
+    target.src   = "../icons/" + img + ".png";
     target.setAttribute("searchwindowsmode", state);
 
     await storageArea.set({"searchMode": state });
@@ -222,7 +199,3 @@ function clearNodes(targetNode) {
         targetNode.removeChild(targetNode.firstChild);
     }
 }
-
-function resetWinIndex() {
-    windowIndex    = 0;
-}