add view favicon for url

Author: hai-altx-soft

manifest.json

@@ -21,7 +21,7 @@
             "storage"
         ],
         "background": {
-            "scripts": ["scripts/background.js", "scripts/webTimer.js", "scripts/tab.js"],
+            "scripts": ["scripts/webTimer.js", "scripts/tab.js", "scripts/background.js"],
             "persistent": false
         },
         "browser_action": {

scripts/background.js

@@ -1,8 +1,12 @@
+var timer = new WebTimer();
+
 window.onload = function () {
-    window.timer = new WebTimer();
     chrome.tabs.onActivated.addListener(function (info) {
         chrome.tabs.get(info.tabId, function (tab) {
-            window.timer.addTab(tab);
+            timer.addTab(tab);
         });
     });
+    chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
+        timer.addTab(tab);
+    });
 };

scripts/webTimer.js

@@ -6,42 +6,35 @@ WebTimer.prototype = {
 
     addTab: function (tab) {
         if (this.isValidPage(tab) === true) {
-            if (tab.id && (tab.id != 0)) { 
+            if (tab.id && (tab.id != 0)) {
                 this.tabs = this.tabs || [];
-                var domain = this.extractRootDomain(tab.url);
-                if (!this.tabs.includes(domain)){
-                    this.tabs.push(domain);
+                var domain = this.extractHostname(tab.url);
+                if (this.isNewUrl(domain)) {
+                    var newTab = new Tab(domain, tab.favIconUrl);
+                    this.tabs.push(newTab);
                 }
                 this.startTimeTracker(tab);
                 this.currentTab = domain;
             }
         }
     },
 
-    extractRootDomain: function (url) {
-        var domain = this.extractHostname(url),
-            splitArr = domain.split('.'),
-            arrLen = splitArr.length;
-    
-        if (arrLen > 2) {
-            domain = splitArr[arrLen - 2] + '.' + splitArr[arrLen - 1];
-            if (splitArr[arrLen - 2].length == 2 && splitArr[arrLen - 1].length == 2) {
-                domain = splitArr[arrLen - 3] + '.' + domain;
-            }
-        }
-        return domain;
+    isNewUrl: function (domain) {
+        if (this.tabs.length > 0)
+            return this.tabs.find(o => o.url === domain) === undefined;
+        else return true;
     },
 
-    extractHostname: function(url) {
+    extractHostname: function (url) {
         var hostname;
-    
+
         if (url.indexOf("//") > -1) {
             hostname = url.split('/')[2];
         }
         else {
             hostname = url.split('/')[0];
         }
-    
+
         hostname = hostname.split(':')[0];
         hostname = hostname.split('?')[0];
 
@@ -56,7 +49,7 @@ WebTimer.prototype = {
         return true;
     },
 
-    startTimeTracker: function(tab){
+    startTimeTracker: function (tab) {
         var tab = new Tab(tab.url, tab.favIconUrl);
     }
 };

scripts/webact.js

@@ -2,8 +2,19 @@ window.onload = function () {
     var table = document.getElementById('resultTable');
     var tabs = chrome.extension.getBackgroundPage().timer.tabs;
     for (var i = 0; i < tabs.length; i++) {
-        var p = document.createElement('p');
-        p.innerText = tabs[i];
-        table.appendChild(p);
+        var div = document.createElement('div');
+        div.classList.add('inline-flex');
+
+        var img = document.createElement('img');
+        img.setAttribute('height', 15);
+        img.setAttribute('src', tabs[i].favicon);
+
+        var span = document.createElement('span');
+        span.innerText = tabs[i].url;
+        span.classList.add('margin-left-5');
+
+        div.appendChild(img);
+        div.appendChild(span);
+        table.appendChild(div);
     }
 };

style/webact.css

@@ -0,0 +1,7 @@
+.inline-flex{
+    display: inline-flex;
+}
+
+.margin-left-5{
+    margin-left: 5px;
+}