From 30c570253ff0409cac9f39a4f8ec4d3ee601a1fb Mon Sep 17 00:00:00 2001 From: gorhill Date: Fri, 31 Oct 2014 18:52:27 -0400 Subject: [PATCH] this fixes #23 --- src/css/user-rules.css | 1 + src/info.html | 1 - src/js/hosts-files.js | 4 +-- src/js/info.js | 75 ++++++++++++++++++++---------------------- src/js/udom.js | 26 +++++++++++++-- 5 files changed, 63 insertions(+), 44 deletions(-) diff --git a/src/css/user-rules.css b/src/css/user-rules.css index d2143d8..7f854f5 100644 --- a/src/css/user-rules.css +++ b/src/css/user-rules.css @@ -79,6 +79,7 @@ div > p:last-child { } #diff .right li:hover { background-color: #ffc; + color: #000; } #diff .right li.notLeft { color: #000; diff --git a/src/info.html b/src/info.html index 36bebf5..4dc684c 100644 --- a/src/info.html +++ b/src/info.html @@ -166,7 +166,6 @@ tr.unused { - diff --git a/src/js/hosts-files.js b/src/js/hosts-files.js index 0dfa0ed..5aa902a 100644 --- a/src/js/hosts-files.js +++ b/src/js/hosts-files.js @@ -304,12 +304,12 @@ var reloadAll = function(update) { var path; while ( i-- ) { path = lis - .subset(i) + .subset(i, 1) .descendants('a') .attr('href'); switches.push({ location: path, - off: lis.subset(i).descendants('input').prop('checked') === false + off: lis.subset(i, 1).descendants('input').prop('checked') === false }); } messaging.tell({ diff --git a/src/js/info.js b/src/js/info.js index 9ae393c..a4e05a4 100644 --- a/src/js/info.js +++ b/src/js/info.js @@ -73,14 +73,14 @@ function renderNumbers(set) { var key; while ( i-- ) { key = keys[i]; - $(key).text(renderNumber(set[key])); + uDom(key).text(renderNumber(set[key])); } } /******************************************************************************/ var renderLocalized = function(id, map) { - var el = $('#' + id); + var uElem = uDom('#' + id); var msg = chrome.i18n.getMessage(id); for ( var k in map ) { if ( map.hasOwnProperty(k) === false ) { @@ -88,7 +88,7 @@ var renderLocalized = function(id, map) { } msg = msg.replace('{{' + k + '}}', map[k]); } - el.html(msg); + uElem.html(msg); }; /******************************************************************************/ @@ -178,7 +178,7 @@ function renderStats() { }); // because some i18n messages may contain links - $('a').attr('target', '_blank'); + uDom('a').attr('target', '_blank'); }; messaging.ask({ @@ -192,30 +192,28 @@ function renderStats() { /******************************************************************************/ function renderRequestRow(row, request) { - var jqRow = $(row); - row = jqRow[0]; - jqRow.attr('id', ''); - jqRow.css('display', ''); - jqRow.removeClass(); + row.attr('id', ''); + row.css('display', ''); + row.removeClass(); if ( request.block !== false ) { - jqRow.addClass('blocked-true'); + row.addClass('blocked-true'); } else { - jqRow.addClass('blocked-false'); + row.addClass('blocked-false'); } - jqRow.addClass('type-' + request.type); - var cells = row.cells; + row.addClass('type-' + request.type); + var cells = row.descendants('td'); // when var when = new Date(request.when); - $(cells[0]).text(when.toLocaleTimeString()); + cells.at(0).text(when.toLocaleTimeString()); // request type - $(cells[1]).text(request.type); + cells.at(1).text(request.type); // Well I got back full control since not using Tempo.js, I can now // generate smarter hyperlinks, that is, not hyperlinking fake // request URLs, which are recognizable with their curly braces inside. - var a = $('a', cells[2]); + var a = cells.at(2).descendants('a'); if ( request.url.search('{') < 0 ) { a.attr('href', request.url); a.css('display', ''); @@ -224,27 +222,27 @@ function renderRequestRow(row, request) { } // request URL - $(cells[3]).text(request.url); + cells.at(3).text(request.url); } /*----------------------------------------------------------------------------*/ var renderRequests = function() { var onResponseReceived = function(requests) { - var table = $('#requestsTable'); + var table = uDom('#requestsTable'); var i, row; - var rowTemplate = table.find('#requestRowTemplate').first(); + var rowTemplate = table.descendants('#requestRowTemplate').first(); // Reuse whatever rows is already in there. - var rows = table.find('tr:not(.ro)').toArray(); + var rows = table.descendants('tr:not(.ro)'); var n = Math.min(requests.length, rows.length); for ( i = 0; i < n; i++ ) { - renderRequestRow(rows[i], requests[i]); + renderRequestRow(rows.at(i), requests[i]); } // Hide extra rows - $(rows.slice(0, i)).removeClass('unused'); - $(rows.slice(i)).addClass('unused'); + rows.subset(0, i).removeClass('unused'); + rows.subset(i).addClass('unused'); // Create new rows to receive what is left n = requests.length; @@ -293,8 +291,8 @@ function changeFilterHandler() { // Initialize request filters as per user settings: // https://github.com/gorhill/httpswitchboard/issues/49 var statsFilters = cachedUserSettings.statsFilters; - $('input[id^="show-"][type="checkbox"]').each(function() { - var input = $(this); + uDom('input[id^="show-"][type="checkbox"]').toArray().forEach(function() { + var input = uDom(this); statsFilters[input.attr('id')] = !!input.prop('checked'); }); changeUserSettings('statsFilters', statsFilters); @@ -315,10 +313,10 @@ function syncWithFilters() { while ( i-- ) { j = type.length; while ( j-- ) { - display = $('#show-' + blocked[i]).prop('checked') && - $('#show-' + type[j]).prop('checked') ? '' : 'none'; + display = uDom('#show-' + blocked[i]).prop('checked') && + uDom('#show-' + type[j]).prop('checked') ? '' : 'none'; selector = '.blocked-' + (blocked[i] === 'blocked') + '.type-' + type[j]; - $(selector).css('display', display); + uDom(selector).css('display', display); } } } @@ -348,35 +346,34 @@ function targetUrlChangeHandler() { /******************************************************************************/ function prepareToDie() { - changeValueHandler($('#max-logged-requests'), 'maxLoggedRequests', 0, 999); - $('input,button,select').off(); + changeValueHandler(uDom('#max-logged-requests'), 'maxLoggedRequests', 0, 999); } /******************************************************************************/ var installEventHandlers = function() { - $('#refresh-requests').on('click', renderRequests); - $('input[id^="show-"][type="checkbox"]').on('change', changeFilterHandler); - $('#selectPageUrls').on('change', targetUrlChangeHandler); - $('#max-logged-requests').on('change', function(){ changeValueHandler($(this), 'maxLoggedRequests', 0, 999); }); + uDom('#refresh-requests').on('click', renderRequests); + uDom('input[id^="show-"][type="checkbox"]').on('change', changeFilterHandler); + uDom('#selectPageUrls').on('change', targetUrlChangeHandler); + uDom('#max-logged-requests').on('change', function(){ changeValueHandler(uDom(this), 'maxLoggedRequests', 0, 999); }); // https://github.com/gorhill/httpswitchboard/issues/197 - $(window).one('beforeunload', prepareToDie); + window.addEventListener('beforeunload', prepareToDie); }; /******************************************************************************/ -$(function(){ +uDom.onLoad(function(){ // Initialize request filters as per user settings: // https://github.com/gorhill/httpswitchboard/issues/49 var onResponseReceived = function(userSettings) { // cache a copy cachedUserSettings = userSettings; // init ui as per user settings - $('#max-logged-requests').val(userSettings.maxLoggedRequests); + uDom('#max-logged-requests').val(userSettings.maxLoggedRequests); var statsFilters = userSettings.statsFilters; - $('input[id^="show-"][type="checkbox"]').each(function() { - var input = $(this); + uDom('input[id^="show-"][type="checkbox"]').toArray().forEach(function() { + var input = uDom(this); var filter = statsFilters[input.attr('id')]; input.prop('checked', filter === undefined || filter === true); }); diff --git a/src/js/udom.js b/src/js/udom.js index 020a53c..d7bda72 100644 --- a/src/js/udom.js +++ b/src/js/udom.js @@ -230,7 +230,7 @@ DOMList.prototype.toArray = function() { DOMList.prototype.subset = function(i, l) { var r = new DOMList(); - var n = l !== undefined ? l : 1; + var n = l !== undefined ? l : this.nodes.length; var j = Math.min(i + n, this.nodes.length); if ( i < j ) { r.nodes = this.nodes.slice(i, j); @@ -241,7 +241,7 @@ DOMList.prototype.subset = function(i, l) { /******************************************************************************/ DOMList.prototype.first = function() { - return this.subset(0); + return this.subset(0, 1); }; /******************************************************************************/ @@ -452,6 +452,28 @@ DOMList.prototype.insertAfter = function(selector, context) { /******************************************************************************/ +DOMList.prototype.insertBefore = function(selector, context) { + if ( this.nodes.length === 0 ) { + return this; + } + var referenceNodes = DOMListFactory(selector, context); + if ( referenceNodes.nodes.length === 0 ) { + return this; + } + var referenceNode = referenceNodes.nodes[0]; + var parentNode = referenceNode.parentNode; + if ( !parentNode ) { + return this; + } + var n = this.nodes.length; + for ( var i = 0; i < n; i++ ) { + parentNode.insertBefore(this.nodes[i], referenceNode); + } + return this; +}; + +/******************************************************************************/ + DOMList.prototype.clone = function(notDeep) { var r = new DOMList(); var n = this.nodes.length;