add ability to open the logger in sidebar

platform/webext/manifest.json

@@ -55,5 +55,13 @@
         "<all_urls>"
     ],
     "short_name": "uMatrix",
+    "sidebar_action": {
+        "default_title": "uMatrix logger",
+        "default_panel": "logger-ui.html",
+        "default_icon": {
+            "16": "img/icon_16.png",
+            "128": "img/icon_128.png"
+        }
+    },
     "version": "0.9.9"
 }

src/css/logger-ui.css

@@ -76,7 +76,8 @@ input:focus {
     background-color: #ffe;
     }
 #content {
-    font: 13px sans-serif;
+    font-family: "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+    font-size: 13px;
     width: 100%;
     }
 
@@ -88,19 +89,19 @@ input:focus {
     width: 100%;
     }
 #content table > colgroup > col:nth-of-type(1) {
-    width: 5.5em;
+    width: 4.6em;
     }
 #content table > colgroup > col:nth-of-type(2) {
-    width: 2.5em;
+    width: 2.2em;
     }
 #content table > colgroup > col:nth-of-type(3) {
-    width: 2.5em;
+    width: 2.2em;
     }
 #content table > colgroup > col:nth-of-type(4) {
-    width: 5.5em;
+    width: 5.4em;
     }
 #content table > colgroup > col:nth-of-type(5) {
-    width: calc(100% - 16em);
+    width: calc(100% - 14.4em);
     }
 #content table tr {
     background-color: #fafafa;

src/js/logger-ui.js

@@ -38,6 +38,7 @@ var maxEntries = 0;
 var noTabId = '';
 var allTabIds = {};
 var allTabIdsToken;
+var ownerId = Date.now();
 
 var emphasizeTemplate = document.querySelector('#emphasizeTemplate > span');
 var hiddenTemplate = document.querySelector('#hiddenTemplate > span');
@@ -429,6 +430,11 @@ var truncateLog = function(size) {
 /******************************************************************************/
 
 var onLogBufferRead = function(response) {
+    if ( !response || response.unavailable ) {
+        readLogBufferAsync();
+        return;
+    }
+
     // This tells us the behind-the-scene tab id
     noTabId = response.noTabId;
 
@@ -460,7 +466,7 @@ var onLogBufferRead = function(response) {
         tbody.querySelector('tr') === null
     );
 
-    vAPI.setTimeout(readLogBuffer, 1200);
+    readLogBufferAsync();
 };
 
 /******************************************************************************/
@@ -470,7 +476,17 @@ var onLogBufferRead = function(response) {
 // require a bit more code to ensure no multi time out events.
 
 var readLogBuffer = function() {
-    vAPI.messaging.send('logger-ui.js', { what: 'readMany' }, onLogBufferRead);
+    if ( ownerId === undefined ) { return; }
+    vAPI.messaging.send(
+        'logger-ui.js',
+        { what: 'readMany', ownerId: ownerId },
+        onLogBufferRead
+    );
+};
+
+var readLogBufferAsync = function() {
+    if ( ownerId === undefined ) { return; }
+    vAPI.setTimeout(readLogBuffer, 1200);
 };
 
 /******************************************************************************/
@@ -850,17 +866,38 @@ var popupManager = (function() {
 
 /******************************************************************************/
 
-uDom.onLoad(function() {
-    readLogBuffer();
+var grabView = function() {
+    if ( ownerId === undefined ) {
+        ownerId = Date.now();
+    }
+    readLogBufferAsync();
+};
 
-    uDom('#pageSelector').on('change', pageSelectorChanged);
-    uDom('#refresh').on('click', refreshTab);
-    uDom('#compactViewToggler').on('click', toggleCompactView);
-    uDom('#clean').on('click', cleanBuffer);
-    uDom('#clear').on('click', clearBuffer);
-    uDom('#maxEntries').on('change', onMaxEntriesChanged);
-    uDom('#content table').on('click', 'tr.canMtx > td:nth-of-type(2)', popupManager.toggleOn);
-});
+var releaseView = function() {
+    if ( ownerId === undefined ) { return; }
+    vAPI.messaging.send(
+        'logger-ui.js',
+        { what: 'releaseView', ownerId: ownerId }
+    );
+    ownerId = undefined;
+};
+
+window.addEventListener('pagehide', releaseView);
+window.addEventListener('pageshow', grabView);
+// https://bugzilla.mozilla.org/show_bug.cgi?id=1398625
+window.addEventListener('beforeunload', releaseView);
+
+/******************************************************************************/
+
+readLogBuffer();
+
+uDom('#pageSelector').on('change', pageSelectorChanged);
+uDom('#refresh').on('click', refreshTab);
+uDom('#compactViewToggler').on('click', toggleCompactView);
+uDom('#clean').on('click', cleanBuffer);
+uDom('#clear').on('click', clearBuffer);
+uDom('#maxEntries').on('change', onMaxEntriesChanged);
+uDom('#content table').on('click', 'tr.canMtx > td:nth-of-type(2)', popupManager.toggleOn);
 
 /******************************************************************************/
 

src/js/logger.js

@@ -46,7 +46,7 @@
 
     // After 60 seconds without being read, a buffer will be considered
     // unused, and thus removed from memory.
-    var logBufferObsoleteAfter = 60 * 1000;
+    var logBufferObsoleteAfter = 30 * 1000;
 
     var janitor = function() {
         if (
@@ -55,13 +55,15 @@
         ) {
             buffer = null;
             writePtr = 0;
+            api.ownerId = undefined;
         }
         if ( buffer !== null ) {
             vAPI.setTimeout(janitor, logBufferObsoleteAfter);
         }
     };
 
-    return {
+    var api = {
+        ownerId: undefined,
         writeOne: function() {
             if ( buffer === null ) { return; }
             if ( writePtr === buffer.length ) {
@@ -71,7 +73,8 @@
             }
             writePtr += 1;
         },
-        readAll: function() {
+        readAll: function(ownerId) {
+            this.ownerId = ownerId;
             if ( buffer === null ) {
                 buffer = [];
                 vAPI.setTimeout(janitor, logBufferObsoleteAfter);
@@ -83,6 +86,7 @@
         }
     };
 
+    return api;
 })();
 
 /******************************************************************************/

src/js/messaging.js

@@ -874,7 +874,8 @@ vAPI.messaging.listen('about.js', onMessage);
 
 /******************************************************************************/
 
-var µm = µMatrix;
+var µm = µMatrix,
+    loggerURL = vAPI.getURL('logger-ui.html');
 
 /******************************************************************************/
 
@@ -890,22 +891,23 @@ var onMessage = function(request, sender, callback) {
 
     switch ( request.what ) {
     case 'readMany':
+        if (
+            µm.logger.ownerId !== undefined &&
+            request.ownerId !== µm.logger.ownerId
+        ) {
+            response = { unavailable: true };
+            break;
+        }
         var tabIds = {};
-        var loggerURL = vAPI.getURL('logger-ui.html');
-        var pageStore;
         for ( var tabId in µm.pageStores ) {
-            pageStore = µm.pageStoreFromTabId(tabId);
-            if ( pageStore === null ) {
-                continue;
-            }
-            if ( pageStore.rawUrl.lastIndexOf(loggerURL, 0) === 0 ) {
-                continue;
-            }
+            var pageStore = µm.pageStoreFromTabId(tabId);
+            if ( pageStore === null ) { continue; }
+            if ( pageStore.rawUrl.startsWith(loggerURL) ) { continue; }
             tabIds[tabId] = pageStore.title || pageStore.rawUrl;
         }
         response = {
             colorBlind: false,
-            entries: µm.logger.readAll(),
+            entries: µm.logger.readAll(request.ownerId),
             maxLoggedRequests: µm.userSettings.maxLoggedRequests,
             noTabId: vAPI.noTabId,
             tabIds: tabIds,
@@ -913,6 +915,12 @@ var onMessage = function(request, sender, callback) {
         };
         break;
 
+    case 'releaseView':
+        if ( request.ownerId === µm.logger.ownerId ) {
+            µm.logger.ownerId = undefined;
+        }
+        break;
+
     default:
         return vAPI.messaging.UNHANDLED;
     }