Skip to content

Commit e0284b8

Browse files
gorhillgorhill
committed
this fixes gorhill#193 
1 parent 20f5794 commit e0284b8

7 files changed

Lines changed: 256 additions & 45 deletions

File tree

‎src/_locales/en/messages.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -403,6 +403,10 @@
403403
"message":"No non-blocked requests logged for this page",
404404
"description":"English: No non-blocked requests logged for this page"
405405
},
406+
"logAll":{
407+
"message":"All",
408+
"description":"Appears in the logger's tab selector"
409+
},
406410
"logBehindTheScene":{
407411
"message":"Behind the scene",
408412
"description":"Pretty name for behind-the-scene network requests"

‎src/css/logger-ui.css‎

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ body {
77
margin: 0;
88
overflow-x: hidden;
99
padding: 0;
10-
white-space: nowrap;
1110
width: 100%;
1211
}
1312
#toolbar {
@@ -16,7 +15,7 @@ body {
1615
box-sizing: border-box;
1716
left: 0;
1817
margin: 0;
19-
padding: 0 1em;
18+
padding: 0.5em 1em;
2019
position: fixed;
2120
top: 0;
2221
width: 100%;
@@ -28,7 +27,7 @@ body {
2827
box-sizing: border-box;
2928
cursor: pointer;
3029
display: inline-block;
31-
font-size: 20px;
30+
font-size: 150%;
3231
margin: 0;
3332
padding: 8px;
3433
}
@@ -39,6 +38,19 @@ body {
3938
#toolbar .button:hover {
4039
background-color: #eee;
4140
}
41+
#toolbar > div {
42+
white-space: nowrap;
43+
}
44+
#toolbar > div:first-of-type {
45+
font-size: 120%;
46+
}
47+
#toolbar > div > * {
48+
vertical-align: middle;
49+
}
50+
#pageSelector {
51+
width: 28em;
52+
padding: 0.2em 0;
53+
}
4254
body #compactViewToggler.button:before {
4355
content: '\f102';
4456
}
@@ -55,14 +67,13 @@ body.f #filterButton {
5567
background-color: #fee;
5668
}
5769
#maxEntries {
58-
margin-left: 3em;
70+
margin: 0 2em;
5971
}
6072
input:focus {
6173
background-color: #ffe;
6274
}
6375
#content {
6476
font: 13px sans-serif;
65-
margin-top: 3.5em;
6677
width: 100%;
6778
}
6879

‎src/js/logger-ui.js‎

Lines changed: 144 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,15 @@
3030

3131
/******************************************************************************/
3232

33+
// Adjust top padding of content table, to match that of toolbar height.
34+
35+
document.getElementById('content').style.setProperty(
36+
'margin-top',
37+
document.getElementById('toolbar').offsetHeight + 'px'
38+
);
39+
40+
/******************************************************************************/
41+
3342
var messager = vAPI.messaging.channel('logger-ui.js');
3443
var tbody = document.querySelector('#content tbody');
3544
var trJunkyard = [];
@@ -40,6 +49,8 @@ var maxEntries = 5000;
4049
var noTabId = '';
4150
var allTabIds = {};
4251

52+
var hiddenTemplate = document.querySelector('#hiddenTemplate > span');
53+
4354
var prettyRequestTypes = {
4455
'main_frame': 'doc',
4556
'stylesheet': 'css',
@@ -61,6 +72,18 @@ var dateOptions = {
6172

6273
/******************************************************************************/
6374

75+
var classNameFromTabId = function(tabId) {
76+
if ( tabId === noTabId ) {
77+
return 'tab_bts';
78+
}
79+
if ( tabId !== '' ) {
80+
return 'tab_' + tabId;
81+
}
82+
return '';
83+
};
84+
85+
/******************************************************************************/
86+
6487
// Emphasize hostname in URL, as this is what matters in uMatrix's rules.
6588

6689
var nodeFromURL = function(url, filter) {
@@ -165,6 +188,14 @@ var createRow = function(layout) {
165188

166189
/******************************************************************************/
167190

191+
var createHiddenTextNode = function(text) {
192+
var node = hiddenTemplate.cloneNode(true);
193+
node.textContent = text;
194+
return node;
195+
};
196+
197+
/******************************************************************************/
198+
168199
var createGap = function(tabId, url) {
169200
var tr = createRow('1');
170201
tr.classList.add('tab');
@@ -246,11 +277,9 @@ var renderLogEntry = function(entry) {
246277
tr.cells[0].title = time.toLocaleDateString('fullwide', dateOptions);
247278

248279
if ( entry.tab ) {
249-
tr.classList.add('tab');
280+
tr.classList.add('tab', classNameFromTabId(entry.tab));
250281
if ( entry.tab === noTabId ) {
251-
tr.classList.add('tab_bts');
252-
} else if ( entry.tab !== '' ) {
253-
tr.classList.add('tab_' + entry.tab);
282+
tr.cells[1].appendChild(createHiddenTextNode('bts'));
254283
}
255284
}
256285
if ( entry.cat !== '' ) {
@@ -316,6 +345,78 @@ var renderLogEntries = function(response) {
316345

317346
/******************************************************************************/
318347

348+
var synchronizeTabIds = function(newTabIds) {
349+
var oldTabIds = allTabIds;
350+
351+
// Neuter rows for which a tab does not exist anymore
352+
// TODO: sort to avoid using indexOf
353+
354+
var autoDeleteVoidRows = !!vAPI.localStorage.getItem('loggerAutoDeleteVoidRows');
355+
var rowVoided = false;
356+
var trs;
357+
for ( var tabId in oldTabIds ) {
358+
if ( oldTabIds.hasOwnProperty(tabId) === false ) {
359+
continue;
360+
}
361+
if ( newTabIds.hasOwnProperty(tabId) ) {
362+
continue;
363+
}
364+
// Mark or remove voided rows
365+
trs = uDom('.tab_' + tabId);
366+
if ( autoDeleteVoidRows ) {
367+
toJunkyard(trs);
368+
} else {
369+
trs.removeClass('canMtx');
370+
rowVoided = true;
371+
}
372+
// Remove popup if it is currently bound to a removed tab.
373+
if ( tabId === popupManager.tabId ) {
374+
popupManager.toggleOff();
375+
}
376+
}
377+
378+
var select = document.getElementById('pageSelector');
379+
var selectValue = select.value;
380+
var tabIds = Object.keys(newTabIds).sort(function(a, b) {
381+
return newTabIds[a].localeCompare(newTabIds[b]);
382+
});
383+
var option;
384+
for ( var i = 0, j = 2; i < tabIds.length; i++ ) {
385+
tabId = tabIds[i];
386+
if ( tabId === noTabId ) {
387+
continue;
388+
}
389+
option = select.options[j];
390+
j += 1;
391+
if ( !option ) {
392+
option = document.createElement('option');
393+
select.appendChild(option);
394+
}
395+
option.textContent = newTabIds[tabId];
396+
option.value = classNameFromTabId(tabId);
397+
if ( option.value === selectValue ) {
398+
option.setAttribute('selected', '');
399+
} else {
400+
option.removeAttribute('selected');
401+
}
402+
}
403+
while ( j < select.options.length ) {
404+
select.removeChild(select.options[j]);
405+
}
406+
if ( select.value !== selectValue ) {
407+
select.selectedIndex = 0;
408+
select.value = '';
409+
select.options[0].setAttribute('selected', '');
410+
pageSelectorChanged();
411+
}
412+
413+
allTabIds = newTabIds;
414+
415+
return rowVoided;
416+
};
417+
418+
/******************************************************************************/
419+
319420
var truncateLog = function(size) {
320421
if ( size === 0 ) {
321422
size = 5000;
@@ -343,28 +444,7 @@ var onLogBufferRead = function(response) {
343444

344445
// Neuter rows for which a tab does not exist anymore
345446
// TODO: sort to avoid using indexOf
346-
var autoDeleteVoidRows = vAPI.localStorage.getItem('loggerAutoDeleteVoidRows');
347-
var rowVoided = false, trs;
348-
for ( var tabId in allTabIds ) {
349-
if ( allTabIds.hasOwnProperty(tabId) === false ) {
350-
continue;
351-
}
352-
if ( response.tabIds.hasOwnProperty(tabId) ) {
353-
continue;
354-
}
355-
trs = uDom('.tab_' + tabId);
356-
if ( autoDeleteVoidRows ) {
357-
toJunkyard(trs);
358-
} else {
359-
trs.removeClass('canMtx');
360-
rowVoided = true;
361-
}
362-
if ( tabId === popupManager.tabId ) {
363-
popupManager.toggleOff();
364-
}
365-
}
366-
allTabIds = response.tabIds;
367-
447+
var rowVoided = synchronizeTabIds(response.tabIds);
368448
renderLogEntries(response);
369449

370450
if ( rowVoided ) {
@@ -395,6 +475,41 @@ var readLogBuffer = function() {
395475

396476
/******************************************************************************/
397477

478+
var pageSelectorChanged = function() {
479+
var style = document.getElementById('tabFilterer');
480+
var tabClass = document.getElementById('pageSelector').value;
481+
var sheet = style.sheet;
482+
while ( sheet.cssRules.length !== 0 ) {
483+
sheet.deleteRule(0);
484+
}
485+
if ( tabClass !== '' ) {
486+
sheet.insertRule(
487+
'#content table tr:not(.' + tabClass + ') { display: none; }',
488+
0
489+
);
490+
}
491+
uDom('#refresh').toggleClass(
492+
'disabled',
493+
tabClass === '' || tabClass === 'tab_bts'
494+
);
495+
};
496+
497+
/******************************************************************************/
498+
499+
var reloadTab = function() {
500+
var tabClass = document.getElementById('pageSelector').value;
501+
var matches = tabClass.match(/^tab_(.+)$/);
502+
if ( matches === null ) {
503+
return;
504+
}
505+
if ( matches[1] === 'bts' ) {
506+
return;
507+
}
508+
messager.send({ what: 'reloadTab', tabId: matches[1] });
509+
};
510+
511+
/******************************************************************************/
512+
398513
var onMaxEntriesChanged = function() {
399514
var raw = uDom(this).val();
400515
try {
@@ -649,7 +764,7 @@ var popupManager = (function() {
649764
popupObserver = new MutationObserver(resizePopup);
650765
container.appendChild(popup);
651766

652-
style = document.querySelector('#content > style');
767+
style = document.getElementById('popupFilterer');
653768
style.textContent = styleTemplate.replace('{{tabId}}', localTabId);
654769

655770
document.body.classList.add('popupOn');
@@ -701,6 +816,8 @@ var popupManager = (function() {
701816
uDom.onLoad(function() {
702817
readLogBuffer();
703818

819+
uDom('#pageSelector').on('change', pageSelectorChanged);
820+
uDom('#refresh').on('click', reloadTab);
704821
uDom('#compactViewToggler').on('click', toggleCompactView);
705822
uDom('#clean').on('click', cleanBuffer);
706823
uDom('#clear').on('click', clearBuffer);

‎src/js/messaging.js‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1193,11 +1193,17 @@ var onMessage = function(request, sender, callback) {
11931193

11941194
switch ( request.what ) {
11951195
case 'readAll':
1196-
var tabIds = {};
1196+
var tabIds = {}, pageStore;
1197+
var loggerURL = vAPI.getURL('logger-ui.html');
11971198
for ( var tabId in µb.pageStores ) {
1198-
if ( µb.pageStores.hasOwnProperty(tabId) ) {
1199-
tabIds[tabId] = true;
1199+
pageStore = µb.pageStoreFromTabId(tabId);
1200+
if ( pageStore === null ) {
1201+
continue;
12001202
}
1203+
if ( pageStore.rawURL.lastIndexOf(loggerURL, 0) === 0 ) {
1204+
continue;
1205+
}
1206+
tabIds[tabId] = pageStore.title;
12011207
}
12021208
response = {
12031209
colorBlind: µb.userSettings.colorBlindFriendly,

‎src/js/pagestore.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -295,6 +295,8 @@ PageStore.prototype.init = function(tabId) {
295295
var tabContext = µb.tabContextManager.lookup(tabId);
296296
this.tabId = tabId;
297297
this.tabHostname = tabContext.rootHostname;
298+
this.title = tabContext.rawURL;
299+
this.rawURL = tabContext.rawURL;
298300
this.hostnameToCountMap = {};
299301
this.contentLastModified = 0;
300302
this.frames = {};
@@ -334,6 +336,7 @@ PageStore.prototype.reuse = function(context) {
334336
if ( context === 'tabUpdated' ) {
335337
// As part of https://github.com/chrisaljoudi/uBlock/issues/405
336338
// URL changed, force a re-evaluation of filtering switch
339+
this.rawURL = tabContext.rawURL;
337340
this.netFilteringReadTime = 0;
338341
return this;
339342
}
@@ -354,6 +357,9 @@ PageStore.prototype.dispose = function() {
354357
// need to release the memory taken by these, which can amount to
355358
// sizeable enough chunks (especially requests, through the request URL
356359
// used as a key).
360+
this.tabHostname = '';
361+
this.title = '';
362+
this.rawURL = '';
357363
this.hostnameToCountMap = null;
358364
this.disposeFrameStores();
359365
this.netFilteringCache = this.netFilteringCache.dispose();

0 commit comments

Comments
 (0)