Fixed buttons and improved load times of list.
This commit is contained in:
		@@ -4,9 +4,10 @@ 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.0
 | 
			
		||||
# Version: 1.3.2
 | 
			
		||||
<ul>
 | 
			
		||||
<li>Fixed auto-scroll into view of currently selected tab.</li>
 | 
			
		||||
<li>Fixed lower buttons not detecting clicks.</li>
 | 
			
		||||
<li>Implimented Template html for faster renders of lists.</li>
 | 
			
		||||
</ul>
 | 
			
		||||
 | 
			
		||||
***Note:
 | 
			
		||||
 
 | 
			
		||||
@@ -24,13 +24,16 @@ html, body { overflow-x: hidden; }
 | 
			
		||||
    margin-left: 25%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#udArrows button {
 | 
			
		||||
#udArrows input {
 | 
			
		||||
    font-size: 2em;
 | 
			
		||||
    background-color: rgba(79, 186, 70, 1);
 | 
			
		||||
    color: rgba(255,255,255,1);
 | 
			
		||||
    width: 1em;
 | 
			
		||||
    height: 1em;
 | 
			
		||||
    padding: 0.1em;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#udArrows button:hover {
 | 
			
		||||
#udArrows input:hover {
 | 
			
		||||
    background-color: rgba(152, 152, 152, 1);
 | 
			
		||||
    color: rgba(0,0,0,1);
 | 
			
		||||
    cursor: pointer;
 | 
			
		||||
 
 | 
			
		||||
@@ -1,7 +1,7 @@
 | 
			
		||||
{
 | 
			
		||||
    "manifest_version": 2,
 | 
			
		||||
    "name": "Tab Search and Manage",
 | 
			
		||||
    "version": "1.3.0",
 | 
			
		||||
    "version": "1.3.2",
 | 
			
		||||
    "description": "This plugin can search, drag-n-drop ordering, and (un)hide all or some tabs.",
 | 
			
		||||
 | 
			
		||||
  "applications": {
 | 
			
		||||
 
 | 
			
		||||
@@ -15,30 +15,24 @@
 | 
			
		||||
    <div id="errorZone" style="display: none;"></div>
 | 
			
		||||
 | 
			
		||||
    <div id="udArrows">
 | 
			
		||||
        <button id="goTop" type="button" title="To Top">
 | 
			
		||||
            <img style="width:1em; height:1em;" src="../icons/up-arrow.png"/>
 | 
			
		||||
        </button>
 | 
			
		||||
        <button id="showAllBttn" type="button" title="Unhide All Tabs">
 | 
			
		||||
            <img style="width:1em; height:1em;" src="../icons/eyeOpen.png"/>
 | 
			
		||||
        </button>
 | 
			
		||||
        <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>
 | 
			
		||||
        <button id="hideAllBttn" type="button" title="Hide All Tabs">
 | 
			
		||||
            <img style="width:1em; height:1em;" src="../icons/eyeClosed.png"/>
 | 
			
		||||
        </button>
 | 
			
		||||
        <button id="goBottom" type="button" title="To Bottom">
 | 
			
		||||
            <img style="width:1em; height:1em;" src="../icons/down-arrow.png"/>
 | 
			
		||||
        </button>
 | 
			
		||||
        <input type="image" id="goTop" title="To Top" src="../icons/up-arrow.png" />
 | 
			
		||||
        <input type="image" id="showAllBttn" title="Unhide All Tabs" src="../icons/eyeOpen.png" />
 | 
			
		||||
        <input type="image" id="goToTab" title="Scroll Current Tab To View" src="../icons/go2-arrow.png" />
 | 
			
		||||
        <input type="image" id="searchMode" searchwindowsmode="false" src="../icons/window.png" />
 | 
			
		||||
        <input type="image" id="newTab" title="New Tab" src="../icons/plus.png" />
 | 
			
		||||
        <input type="image" id="hideAllBttn" title="Hide All Tabs" src="../icons/eyeClosed.png"/>
 | 
			
		||||
        <input type="image" id="goBottom" title="To Bottom" src="../icons/down-arrow.png"/>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
    <template id="tabContainerTemplate">
 | 
			
		||||
        <div title="" id="iconElm" class="">
 | 
			
		||||
            <img id="closeBttn" class="closeImg" src="" />
 | 
			
		||||
            <img id="hideTgglBttn" class="hiderImg" src="" />
 | 
			
		||||
            <p class="pTagTitleText" ></p>
 | 
			
		||||
        </div>
 | 
			
		||||
    </template>
 | 
			
		||||
 | 
			
		||||
    <script src="../scripts/libs/dragula.min.js" charset="utf-8"></script>
 | 
			
		||||
    <script src="../scripts/dragContainersSetup.js" charset="utf-8"></script>
 | 
			
		||||
    <script src="../scripts/showHideLogic.js"></script>
 | 
			
		||||
 
 | 
			
		||||
@@ -6,7 +6,6 @@ const listZone      = document.getElementById("listZone");
 | 
			
		||||
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;
 | 
			
		||||
@@ -47,13 +46,15 @@ function logTabs(tabs) {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function createContainer(tab) {
 | 
			
		||||
    var id                = tab.id;
 | 
			
		||||
    var spanTag           = document.createElement("DIV");
 | 
			
		||||
    var pTag              = document.createElement("P");
 | 
			
		||||
    var iconText          = document.createTextNode(tab.title);
 | 
			
		||||
    var closeImgTag       = document.createElement("IMG");
 | 
			
		||||
    var hidnStImgTag      = document.createElement("IMG");
 | 
			
		||||
    var icoImgTag         = document.createElement("IMG");  // Used to properly set bg
 | 
			
		||||
    var template       = document.querySelector('#tabContainerTemplate');
 | 
			
		||||
    var clone          = document.importNode(template.content, true);
 | 
			
		||||
    var spanTag        = clone.querySelector("#iconElm");
 | 
			
		||||
    var closeImgTag    = clone.querySelector("#closeBttn");
 | 
			
		||||
    var hidnStImgTag   = clone.querySelector("#hideTgglBttn");
 | 
			
		||||
    var pTag           = clone.querySelector(".pTagTitleText");
 | 
			
		||||
    var icoImgTag      = document.createElement("IMG");  // Used to detect image load failure
 | 
			
		||||
    var iconText       = document.createTextNode(tab.title);
 | 
			
		||||
    var id             = tab.id;
 | 
			
		||||
 | 
			
		||||
    // Set oldElm so eventListeners.js has starting ref
 | 
			
		||||
    if (tab.active == true) {
 | 
			
		||||
@@ -70,13 +71,7 @@ function createContainer(tab) {
 | 
			
		||||
 | 
			
		||||
    spanTag.setAttribute("tabID", tab.id);
 | 
			
		||||
    spanTag.title         = tab.title;
 | 
			
		||||
    spanTag.id            = "iconElm";
 | 
			
		||||
    closeImgTag.id        = "closeBttn";
 | 
			
		||||
    closeImgTag.className = "closeImg";
 | 
			
		||||
    closeImgTag.src       = "../icons/x.png";
 | 
			
		||||
    hidnStImgTag.id       = "hideTgglBttn"
 | 
			
		||||
    hidnStImgTag.className= "hiderImg";
 | 
			
		||||
    pTag.className        = "pTagTitleText";
 | 
			
		||||
 | 
			
		||||
    if (!tab.hidden) {
 | 
			
		||||
        spanTag.className = "block";
 | 
			
		||||
@@ -89,21 +84,15 @@ function createContainer(tab) {
 | 
			
		||||
    spanTag.style.backgroundImage    = "url(" + tab.favIconUrl + ")";
 | 
			
		||||
    icoImgTag.src         = tab.favIconUrl;
 | 
			
		||||
    icoImgTag.onerror     = function() { spanTag.style.backgroundImage = "url(" + tabImg + ")"; }
 | 
			
		||||
 | 
			
		||||
    spanTag.appendChild(closeImgTag);
 | 
			
		||||
    spanTag.appendChild(hidnStImgTag);
 | 
			
		||||
    pTag.appendChild(iconText);
 | 
			
		||||
    spanTag.appendChild(pTag);
 | 
			
		||||
    listZone.appendChild(spanTag);
 | 
			
		||||
    listZone.appendChild(clone);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function createTab() {
 | 
			
		||||
  tabsAction.create({})
 | 
			
		||||
            .then(function (tab) {
 | 
			
		||||
                createContainer(tab);
 | 
			
		||||
            }).then(function () {
 | 
			
		||||
                listZone.appendChild(plusTag);
 | 
			
		||||
            });
 | 
			
		||||
            })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function onError(error) { console.log(`Error: ${error}`); }
 | 
			
		||||
@@ -120,14 +109,14 @@ function getTabs() {
 | 
			
		||||
 | 
			
		||||
                if (key) {
 | 
			
		||||
                    target.title           = "Searching curent windows...";
 | 
			
		||||
                    target.children[0].src = "../icons/windows.png";
 | 
			
		||||
                    target.src = "../icons/windows.png";
 | 
			
		||||
                    target.setAttribute("searchwindowsmode", true);
 | 
			
		||||
 | 
			
		||||
                    tabsAction.query({}).then(logTabs, onError)
 | 
			
		||||
                                        .then(resetWinIndex, onError);
 | 
			
		||||
                } else {
 | 
			
		||||
                    target.title           = "Searching curent window...";
 | 
			
		||||
                    target.children[0].src = "../icons/window.png";
 | 
			
		||||
                    target.src = "../icons/window.png";
 | 
			
		||||
                    target.setAttribute("searchwindowsmode", false);
 | 
			
		||||
 | 
			
		||||
                    tabsAction.query({currentWindow: true})
 | 
			
		||||
@@ -141,8 +130,8 @@ function getTabs() {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
async function setSearchMode(target, text, img, state) {
 | 
			
		||||
    target.title           = "Searching " + text + "...";
 | 
			
		||||
    target.children[0].src = "../icons/" + img + ".png";
 | 
			
		||||
    target.title   = "Searching " + text + "...";
 | 
			
		||||
    target.src     = "../icons/" + img + ".png";
 | 
			
		||||
    target.setAttribute("searchwindowsmode", state);
 | 
			
		||||
 | 
			
		||||
    await storageArea.set({"searchMode": state });
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user