Changed new tab workings.

src/manifest.json

@@ -1,7 +1,7 @@
 {
     "manifest_version": 2,
     "name": "Tab Search",
-    "version": "1.1.8",
+    "version": "1.2.0",
     "description": "Search Tabs and switch to them quickly.",
 
   "applications": {

src/pages/tabsSearch.html

@@ -15,9 +15,18 @@
     <div id="errorZone" style="display: none;"></div>
 
     <div id="udArrows">
-        <button id="goTop" type="button" title="To Top">&Wedge;</button>
-        <button id="goToTab" type="button" title="Scroll Current Tab To View">&mdash;</button>
-        <button id="goBottom" type="button" title="To Bottom">&Vee;</button>
+        <button id="goTop" type="button" title="To Top">
+            <img style="width:1em; height:1em;" src="../icons/up-arrow.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="newTab" type="button" title="New Tab">
+            <img style="width:1em; height:1em;" src="../icons/plus.png"/>
+        </button>
+        <button id="goBottom" type="button" title="To Bottom">
+            <img style="width:1em; height:1em;" src="../icons/down-arrow.png"/>
+        </button>
     </div>
 
 

src/scripts/eventListeners.js

@@ -1,4 +1,4 @@
-// Set click events
+// Set click events for tab blocks
 document.addEventListener("click", (e) => {
     var target    = e.target;
     var targetID  = target.id;
@@ -15,12 +15,12 @@ document.addEventListener("click", (e) => {
         if (targetID == "faveIcon")
             target = parentElm.parentElement;
 
+        id = parseInt(target.getAttribute("tabID"));
+            browser.tabs.update(id, { active: true });
+
         oldElm.setAttribute("class", "block");
         oldElm = target;
         target.setAttribute("class", "block block-focused");
-
-        id = parseInt(target.getAttribute("tabID"));
-        browser.tabs.update(id, { active: true });
     } else if (targetID == "goTop") {
         window.scrollTo(0,0);
     } else if (targetID == "goBottom") {
@@ -29,6 +29,8 @@ document.addEventListener("click", (e) => {
         // Go to selected and 100px up
          oldElm.scrollIntoView();
          window.scrollBy(0, -100);
+    } else if (targetID == "newTab") {
+        createTab();
     }
 });
 

src/scripts/generateView.js

@@ -11,7 +11,6 @@ function logTabs(tabs) {
     for (let tab of tabs) {
         createContainer(tab);
     }
-    addPlusContainer();
     // Set poped-out-window position and 100px up from selected elm
      oldElm.scrollIntoView();
      window.scrollBy(0, -100);
@@ -53,23 +52,6 @@ function createContainer(tab) {
     }
 }
 
-function addPlusContainer() {
-    var spanTag           = document.createElement("SPAN");
-    var centerTag         = document.createElement("CENTER");
-    var icoImgTag         = document.createElement("IMG");
-
-    spanTag .addEventListener("click", createTab);
-    spanTag.title         = "Open a new tab...";
-    spanTag.className     = "block";
-    icoImgTag.style       = "width: 100%; height:auto";
-    icoImgTag.src         = "../icons/plus.png";
-
-    centerTag.appendChild(icoImgTag);
-    spanTag.appendChild(centerTag);
-    listZone.appendChild(spanTag);
-    plusTag = spanTag;
-}
-
 function createTab() {
   tabsAction.create({})
             .then(function (tab) {