diff --git a/src/css/logger-ui.css b/src/css/logger-ui.css index f37e28bdc..1ae00e874 100644 --- a/src/css/logger-ui.css +++ b/src/css/logger-ui.css @@ -372,6 +372,7 @@ body[dir="rtl"] #vwRenderer .logEntry > div > span:first-child { #vwRenderer #vwContent .logEntry > div > span:nth-of-type(6) { } #vwRenderer .logEntry > div > span:nth-of-type(7) { + position: relative; } #vwRenderer #vwContent .logEntry > div > span:nth-of-type(7) { text-overflow: ellipsis; @@ -380,11 +381,8 @@ body[dir="rtl"] #vwRenderer .logEntry > div > span:first-child { overflow-y: auto; white-space: pre-line; } -#vwRenderer .logEntry > div > span:nth-of-type(7) > span > b { - font-weight: bold; - } #vwRenderer .logEntry > div > span:nth-of-type(7) b { - font-weight: normal; + font-weight: bold; } #vwRenderer .logEntry > div[data-status="1"] > span:nth-of-type(7) b, #netFilteringDialog > .panes > .details > div[data-status="1"] b { @@ -408,6 +406,35 @@ body.colorBlind #vwRenderer .logEntry > div[data-status="2"] > span:nth-of-type( body.colorBlind #netFilteringDialog > .panes > .details > div[data-status="2"] b { background-color: rgba(255, 194, 57, 0.2); } +#vwRenderer .logEntry > div > span:nth-of-type(7) a { + background-color: dimgray; + color: white; + display: none; + height: 100%; + padding: 0 0.25em; + opacity: 0.4; + position: absolute; + right: 0; + text-decoration: none; + top: 0; + } +#netInspector.vExpanded #vwRenderer .logEntry > div > span:nth-of-type(7) a { + bottom: 0px; + height: unset; + padding: 0.25em; + top: unset; + } +#vwRenderer .logEntry > div > span:nth-of-type(7) a::after { + content: '\2197'; + } +#vwRenderer .logEntry > div.networkRealm > span:nth-of-type(7):hover a { + align-items: center; + display: inline-flex; + } +#vwRenderer .logEntry > div > span:nth-of-type(7) a:hover { + opacity: 1; + } + #vwRenderer #vwBottom { background-color: #00F; height: 0; diff --git a/src/js/logger-ui.js b/src/js/logger-ui.js index 040635366..6b8d620ff 100644 --- a/src/js/logger-ui.js +++ b/src/js/logger-ui.js @@ -153,23 +153,39 @@ const regexFromURLFilteringResult = function(result) { // Emphasize hostname in URL, as this is what matters in uMatrix's rules. -const nodeFromURL = function(url, re) { +const nodeFromURL = function(parent, url, re) { + const fragment = document.createDocumentFragment(); if ( re instanceof RegExp === false ) { - return document.createTextNode(url); + fragment.textContent = url; + } else { + const matches = re.exec(url); + if ( matches === null || matches[0].length === 0 ) { + fragment.textContent = url; + } else { + if ( matches.index !== 0 ) { + fragment.appendChild( + document.createTextNode(url.slice(0, matches.index)) + ); + } + const b = document.createElement('b'); + b.textContent = url.slice(matches.index, re.lastIndex); + fragment.appendChild(b); + if ( re.lastIndex !== url.length ) { + fragment.appendChild( + document.createTextNode(url.slice(re.lastIndex)) + ); + } + } } - const matches = re.exec(url); - if ( matches === null || matches[0].length === 0 ) { - return document.createTextNode(url); + if ( /^https?:\/\//.test(url) ) { + const a = document.createElement('a'); + a.setAttribute('href', url); + a.setAttribute('target', '_blank'); + fragment.appendChild(a); } - const node = renderedURLTemplate.cloneNode(true); - node.childNodes[0].textContent = url.slice(0, matches.index); - node.childNodes[1].textContent = url.slice(matches.index, re.lastIndex); - node.childNodes[2].textContent = url.slice(re.lastIndex); - return node; + parent.appendChild(fragment); }; -const renderedURLTemplate = document.querySelector('#renderedURLTemplate > span'); - /******************************************************************************/ const padTo2 = function(v) { @@ -703,8 +719,7 @@ const viewPort = (( ) => { } else if ( filteringType === 'dynamicUrl' ) { re = regexFromURLFilteringResult(filter.rule.join(' ')); } - span = div.children[6]; - span.appendChild(nodeFromURL(cells[6], re)); + nodeFromURL(div.children[6], cells[6], re); return div; }; diff --git a/src/logger-ui.html b/src/logger-ui.html index 19271be50..f6b153e13 100644 --- a/src/logger-ui.html +++ b/src/logger-ui.html @@ -100,7 +100,6 @@