Select existing "Advanced settings" page if any

Related issue:
- https://github.com/uBlockOrigin/uBlock-issues/issues/591

Additionally, I added a link to the logger in the
"About" pane in the dashboard in order to be able
to access the logger without having to go through
the popup panel.

src/about.html

@@ -19,6 +19,9 @@
         <li><a href="https://github.com/gorhill/uBlock/releases" data-i18n="aboutChangelog"></a>
         <li><a href="https://github.com/gorhill/uBlock/wiki" data-i18n="aboutWiki"></a>
         <li><a href="https://old.reddit.com/r/uBlockOrigin/" data-i18n="aboutSupport"></a>
+            <ul>
+                <li><a href="logger-ui.html" data-i18n="popupTipLog"></a>
+            </ul>
         <li><a href="https://github.com/uBlockOrigin/uBlock-issues/issues" data-i18n="aboutIssues"></a>
         <li><a href="https://github.com/gorhill/uBlock" data-i18n="aboutCode"></a>
         <li><span data-i18n="aboutContributors"></span>

src/js/about.js

@@ -21,20 +21,21 @@
 
 /* global uDom */
 
-/******************************************************************************/
-
-uDom.onLoad(function() {
-
 'use strict';
 
 /******************************************************************************/
 
-var onAppDataReady = function(appData) {
+(( ) => {
-    uDom('#aboutNameVer').text(appData.name + ' v' + appData.version);
-};
 
-vAPI.messaging.send('dashboard', { what: 'getAppData' }, onAppDataReady);
+    vAPI.messaging.send('dashboard', { what: 'getAppData' }, appData => {
+        uDom('#aboutNameVer').text(appData.name + ' v' + appData.version);
+    });
 
-/******************************************************************************/
+    document.querySelector(
+        '[href="logger-ui.html"]'
+    ).addEventListener(
+        'click',
+        self.uBlockDashboard.openOrSelectPage
+    );
 
-});
+})();

src/js/dashboard-common.js

@@ -218,6 +218,21 @@ self.uBlockDashboard.patchCodeMirrorEditor = (function() {
 
 /******************************************************************************/
 
+self.uBlockDashboard.openOrSelectPage = function(url, options = {}) {
+    let ev;
+    if ( url instanceof MouseEvent ) {
+        ev = url;
+        url = ev.target.getAttribute('href');
+    } 
+    const details = Object.assign({ url, select: true, index: -1 }, options);
+    vAPI.messaging.send('default', { what: 'gotoURL', details });
+    if ( ev ) {
+        ev.preventDefault();
+    }
+};
+
+/******************************************************************************/
+
 // Open links in the proper window
 uDom('a').attr('target', '_blank');
 uDom('a[href*="dashboard.html"]').attr('target', '_parent');

src/js/settings.js

@@ -21,30 +21,27 @@
 
 /* global uDom */
 
-/******************************************************************************/
-
-(function() {
-
 'use strict';
 
 /******************************************************************************/
 
-var messaging = vAPI.messaging;
+(( ) => {
 
 /******************************************************************************/
 
-var handleImportFilePicker = function() {
+const messaging = vAPI.messaging;
-    var file = this.files[0];
-    if ( file === undefined || file.name === '' ) {
-        return;
-    }
-    if ( file.type.indexOf('text') !== 0 ) {
-        return;
-    }
-    var filename = file.name;
 
-    var fileReaderOnLoadHandler = function() {
+/******************************************************************************/
-        var userData;
+
+const handleImportFilePicker = function() {
+    const file = this.files[0];
+    if ( file === undefined || file.name === '' ) { return; }
+    if ( file.type.indexOf('text') !== 0 ) { return; }
+
+    const filename = file.name;
+
+    const fileReaderOnLoadHandler = function() {
+        let userData;
         try {
             userData = JSON.parse(this.result);
             if ( typeof userData !== 'object' ) {
@@ -70,10 +67,10 @@ var handleImportFilePicker = function() {
             window.alert(vAPI.i18n('aboutRestoreDataError'));
             return;
         }
-        var time = new Date(userData.timeStamp);
+        const time = new Date(userData.timeStamp);
-        var msg = vAPI.i18n('aboutRestoreDataConfirm')
+        const msg = vAPI.i18n('aboutRestoreDataConfirm')
-                      .replace('{{time}}', time.toLocaleString());
+                        .replace('{{time}}', time.toLocaleString());
-        var proceed = window.confirm(msg);
+        const proceed = window.confirm(msg);
         if ( proceed ) {
             messaging.send(
                 'dashboard',
@@ -86,15 +83,15 @@ var handleImportFilePicker = function() {
         }
     };
 
-    var fr = new FileReader();
+    const fr = new FileReader();
     fr.onload = fileReaderOnLoadHandler;
     fr.readAsText(file);
 };
 
 /******************************************************************************/
 
-var startImportFilePicker = function() {
+const startImportFilePicker = function() {
-    var input = document.getElementById('restoreFilePicker');
+    const input = document.getElementById('restoreFilePicker');
     // Reset to empty string, this will ensure an change event is properly
     // triggered if the user pick a file, even if it is the same as the last
     // one picked.
@@ -104,8 +101,8 @@ var startImportFilePicker = function() {
 
 /******************************************************************************/
 
-var exportToFile = function() {
+const exportToFile = function() {
-    messaging.send('dashboard', { what: 'backupUserData' }, function(response) {
+    messaging.send('dashboard', { what: 'backupUserData' }, response => {
         if (
             response instanceof Object === false ||
             response.userData instanceof Object === false
@@ -123,7 +120,7 @@ var exportToFile = function() {
 
 /******************************************************************************/
 
-var onLocalDataReceived = function(details) {
+const onLocalDataReceived = function(details) {
     uDom('#localData > ul > li:nth-of-type(1)').text(
         vAPI.i18n('settingsStorageUsed')
             .replace(
@@ -132,8 +129,7 @@ var onLocalDataReceived = function(details) {
             )
     );
 
-    var elem, dt;
+    const timeOptions = {
-    var timeOptions = {
         weekday: 'long',
         year: 'numeric',
         month: 'long',
@@ -142,18 +138,19 @@ var onLocalDataReceived = function(details) {
         minute: 'numeric',
         timeZoneName: 'short'
     };
-    var lastBackupFile = details.lastBackupFile || '';
+
+    const lastBackupFile = details.lastBackupFile || '';
     if ( lastBackupFile !== '' ) {
-        dt = new Date(details.lastBackupTime);
+        const dt = new Date(details.lastBackupTime);
         uDom('#localData > ul > li:nth-of-type(2) > ul > li:nth-of-type(1)').text(dt.toLocaleString('fullwide', timeOptions));
         //uDom('#localData > ul > li:nth-of-type(2) > ul > li:nth-of-type(2)').text(lastBackupFile);
         uDom('#localData > ul > li:nth-of-type(2)').css('display', '');
     }
 
-    var lastRestoreFile = details.lastRestoreFile || '';
+    const lastRestoreFile = details.lastRestoreFile || '';
-    elem = uDom('#localData > p:nth-of-type(3)');
+    uDom('#localData > p:nth-of-type(3)');
     if ( lastRestoreFile !== '' ) {
-        dt = new Date(details.lastRestoreTime);
+        const dt = new Date(details.lastRestoreTime);
         uDom('#localData > ul > li:nth-of-type(3) > ul > li:nth-of-type(1)').text(dt.toLocaleString('fullwide', timeOptions));
         uDom('#localData > ul > li:nth-of-type(3) > ul > li:nth-of-type(2)').text(lastRestoreFile);
         uDom('#localData > ul > li:nth-of-type(3)').css('display', '');
@@ -162,6 +159,7 @@ var onLocalDataReceived = function(details) {
     if ( details.cloudStorageSupported === false ) {
         uDom('#cloud-storage-enabled').attr('disabled', '');
     }
+
     if ( details.privacySettingsSupported === false ) {
         uDom('#prefetching-disabled').attr('disabled', '');
         uDom('#hyperlink-auditing-disabled').attr('disabled', '');
@@ -171,9 +169,9 @@ var onLocalDataReceived = function(details) {
 
 /******************************************************************************/
 
-var resetUserData = function() {
+const resetUserData = function() {
-    var msg = vAPI.i18n('aboutResetDataConfirm');
+    const msg = vAPI.i18n('aboutResetDataConfirm');
-    var proceed = window.confirm(msg);
+    const proceed = window.confirm(msg);
     if ( proceed ) {
         messaging.send('dashboard', { what: 'resetUserData' });
     }
@@ -181,7 +179,7 @@ var resetUserData = function() {
 
 /******************************************************************************/
 
-var synchronizeDOM = function() {
+const synchronizeDOM = function() {
     document.body.classList.toggle(
         'advancedUser',
         uDom.nodeFromId('advanced-user-enabled').checked === true
@@ -190,7 +188,7 @@ var synchronizeDOM = function() {
 
 /******************************************************************************/
 
-var changeUserSettings = function(name, value) {
+const changeUserSettings = function(name, value) {
     messaging.send(
         'dashboard',
         {
@@ -203,10 +201,10 @@ var changeUserSettings = function(name, value) {
 
 /******************************************************************************/
 
-var onInputChanged = function(ev) {
+const onInputChanged = function(ev) {
-    var input = ev.target;
+    const input = ev.target;
-    var name = this.getAttribute('data-setting-name');
+    const name = this.getAttribute('data-setting-name');
-    var value = input.value;
+    let value = input.value;
     if ( name === 'largeMediaSize' ) {
         value = Math.min(Math.max(Math.floor(parseInt(value, 10) || 0), 0), 1000000);
     }
@@ -221,7 +219,7 @@ var onInputChanged = function(ev) {
 // Workaround for:
 // https://github.com/gorhill/uBlock/issues/1448
 
-var onPreventDefault = function(ev) {
+const onPreventDefault = function(ev) {
     ev.target.focus();
     ev.preventDefault();
 };
@@ -230,7 +228,7 @@ var onPreventDefault = function(ev) {
 
 // TODO: use data-* to declare simple settings
 
-var onUserSettingsReceived = function(details) {
+const onUserSettingsReceived = function(details) {
     uDom('[data-setting-type="bool"]').forEach(function(uNode) {
         uNode.prop('checked', details[uNode.attr('data-setting-name')] === true)
              .on('change', function() {
@@ -262,10 +260,16 @@ var onUserSettingsReceived = function(details) {
 
 /******************************************************************************/
 
-uDom.onLoad(function() {
+messaging.send('dashboard', { what: 'userSettings' }, onUserSettingsReceived);
-    messaging.send('dashboard', { what: 'userSettings' }, onUserSettingsReceived);
+messaging.send('dashboard', { what: 'getLocalData' }, onLocalDataReceived);
-    messaging.send('dashboard', { what: 'getLocalData' }, onLocalDataReceived);
+
-});
+// https://github.com/uBlockOrigin/uBlock-issues/issues/591
+document.querySelector(
+    '[data-i18n-title="settingsAdvancedUserSettings"]'
+).addEventListener(
+    'click',
+    self.uBlockDashboard.openOrSelectPage
+);
 
 /******************************************************************************/