fix #904, #436

gorhill · Jan 6, 2018 · b2e760f · b2e760f
1 parent ed8556a
commit b2e760f
Show file tree

Hide file tree

Showing 12 changed files with 532 additions and 243 deletions.
diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json
@@ -35,6 +35,10 @@
         "message": "Hosts files",
         "description": "a tab in dashboard"
     },
+    "rawSettingsPageName": {
+        "message": "More",
+        "description": "a tab in dashboard"
+    },
     "aboutPageName": {
         "message": "About",
         "description": "a tab in dashboard"
@@ -528,6 +532,10 @@
         "description":""
     },
 
+    "rawSettingsWarning" : {
+        "message": "Warning! Change these raw configuration settings at your own risk.",
+        "description": ""
+    },
 
     "aboutChangelog" : {
         "message": "<a href='https://github.com/gorhill/uMatrix/releases'>Change log</a>",
@@ -727,5 +735,10 @@
     "errorCantConnectTo":{
         "message":"Network error: Unable to connect to {{url}}",
         "description":""
+    },
+
+    "genericApplyChanges": {
+        "message": "Apply changes",
+        "description": "for generic 'Apply changes' buttons"
     }
 }
diff --git a/src/css/dashboard.css b/src/css/dashboard.css
@@ -0,0 +1,67 @@
+body {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    font: 15px sans-serif;
+    position: relative;
+    width: 100vw;
+    height: 100vh;
+    overflow: hidden;
+    }
+#dashboard-nav {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    position: absolute;
+    top: 0;
+    width: 100vw;
+    height: 50px;
+    z-index: 10;
+    }
+#dashboard-nav-widgets {
+    margin: 0;
+    border-bottom: 1px solid #ccc;
+    padding: 4px 0 0 0;
+    white-space: nowrap;
+    background-color: white;
+    }
+#dashboard-nav-widgets span {
+    padding: 0 0.5em;
+    font-size: larger;
+    }
+.tabButton {
+    margin: 0;
+    border: 1px solid #ccc;
+    border-top-left-radius: 3px;
+    border-top-right-radius: 3px;
+    padding: 4px;
+    display: inline-block;
+    position: relative;
+    top: 1px;
+    color: black;
+    background-color: #eee;
+    font: inherit;
+    cursor: pointer;
+    text-decoration: none;
+    }
+.tabButton:focus {
+    outline: 0;
+    }
+.tabButton:active,.tabButton:visited {
+    color: inherited;
+    }
+.tabButton.selected {
+    border-bottom: 1px solid white;
+    background-color: white;
+    }
+iframe {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    background-color: transparent;
+    overflow: auto;
+    position: absolute;
+    top: 50px;
+    width: 100%;
+    height: calc(100% - 50px);
+    }
diff --git a/src/css/raw-settings.css b/src/css/raw-settings.css
@@ -0,0 +1,18 @@
+body {
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
+    justify-content: space-between;
+    }
+p {
+    margin: 0.5em 0;
+    }
+textarea {
+    box-sizing: border-box;
+    flex-grow: 1;
+    resize: none;
+    text-align: left;
+    white-space: pre;
+    width: 100%;
+    word-wrap: normal;
+    }
diff --git a/src/dashboard.html b/src/dashboard.html
@@ -1,79 +1,11 @@
 <!DOCTYPE html>
 <html>
 <head>
-<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="shortcut icon" type="image/png" href="img/icon_16.png">
 <title data-i18n="dashboardPageName"></title>
-<style>
-body {
-    margin: 0;
-    border: 0;
-    padding: 0;
-    font: 15px sans-serif;
-    position: relative;
-    width: 100vw;
-    height: 100vh;
-    overflow: hidden;
-    }
-#dashboard-nav {
-    margin: 0;
-    border: 0;
-    padding: 0;
-    position: absolute;
-    top: 0;
-    width: 100vw;
-    height: 50px;
-    z-index: 10;
-    }
-#dashboard-nav-widgets {
-    margin: 0;
-    border-bottom: 1px solid #ccc;
-    padding: 4px 0 0 0;
-    white-space: nowrap;
-    background-color: white;
-    }
-#dashboard-nav-widgets span {
-    padding: 0 0.5em;
-    font-size: larger;
-    }
-.tabButton {
-    margin: 0;
-    border: 1px solid #ccc;
-    border-top-left-radius: 3px;
-    border-top-right-radius: 3px;
-    padding: 4px;
-    display: inline-block;
-    position: relative;
-    top: 1px;
-    color: black;
-    background-color: #eee;
-    font: inherit;
-    cursor: pointer;
-    text-decoration: none;
-    }
-.tabButton:focus {
-    outline: 0;
-    }
-.tabButton:active,.tabButton:visited {
-    color: inherited;
-    }
-.tabButton.selected {
-    border-bottom: 1px solid white;
-    background-color: white;
-    }
-iframe {
-    margin: 0;
-    border: 0;
-    padding: 0;
-    background-color: transparent;
-    overflow: auto;
-    position: absolute;
-    top: 50px;
-    width: 100%;
-    height: calc(100% - 50px);
-    }
-</style>
+<link href='css/dashboard.css' rel='stylesheet' type='text/css'>
 <link href='css/common.css' rel='stylesheet' type='text/css'>
 </head>
 
@@ -84,6 +16,7 @@
         <a class="tabButton" id="settings" href="#settings" data-dashboard-panel-url="settings.html" data-i18n="settingsPageName"></a>
         <a class="tabButton" id="user-rules" href="#user-rules" data-dashboard-panel-url="user-rules.html" data-i18n="userRulesPageName"></a>
         <a class="tabButton" id="hosts-files" href="#hosts-files" data-dashboard-panel-url="hosts-files.html" data-i18n="ubiquitousRulesPageName"></a>
+        <a class="tabButton" id="raw-settings" href="#raw-settings" data-dashboard-panel-url="raw-settings.html" data-i18n="rawSettingsPageName"></a>
         <a class="tabButton" id="about" href="#about" data-dashboard-panel-url="about.html" data-i18n="aboutPageName"></a>
     </div>
 </div>

diff --git a/src/js/background.js b/src/js/background.js
@@ -1,7 +1,7 @@
 /*******************************************************************************
 
     uMatrix - a browser extension to black/white list requests.
-    Copyright (C) 2014-2017 Raymond Hill
+    Copyright (C) 2014-2018 Raymond Hill
 
     This program is free software: you can redistribute it and/or modify
     it under the terms of the GNU General Public License as published by
@@ -79,7 +79,84 @@ var requestStatsFactory = function() {
     return new RequestStats();
 };
 
-/******************************************************************************/
+/*******************************************************************************
+
+    SVG-based icons below were extracted from
+    fontawesome-webfont.svg v4.7. Excerpt of copyright notice at
+    the top of the file:
+
+    > Created by FontForge 20120731 at Mon Oct 24 17:37:40 2016
+    > By ,,,
+    > Copyright Dave Gandy 2016. All rights reserved.
+
+    Excerpt of the license information in the fontawesome CSS
+    file bundled with the package:
+
+    > Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
+    > License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
+
+    Font icons:
+    - glyph-name: "external_link"
+
+*/
+
+var rawSettingsDefault = {
+    placeholderBackground:
+        [
+            'url("data:image/png;base64,',
+                'iVBORw0KGgoAAAANSUhEUgAAAAoAAAAK',
+                'CAAAAACoWZBhAAAABGdBTUEAALGPC/xh',
+                'BQAAAAJiS0dEAP+Hj8y/AAAAB3RJTUUH',
+                '3wwIAAgyL/YaPAAAACJJREFUCFtjfMbO',
+                'AAQ/gZiFnQPEBAEmGIMIJgtIL8QEgtoA',
+                'In4D/96X1KAAAAAldEVYdGRhdGU6Y3Jl',
+                'YXRlADIwMTUtMTItMDhUMDA6MDg6NTAr',
+                'MDM6MDAasuuJAAAAJXRFWHRkYXRlOm1v',
+                'ZGlmeQAyMDE1LTEyLTA4VDAwOjA4OjUw',
+                'KzAzOjAwa+9TNQAAAABJRU5ErkJggg==',
+            '") ',
+            'repeat scroll #fff'
+        ].join(''),
+    placeholderBorder: '1px solid rgba(0, 0, 0, 0.1)',
+    imagePlaceholder: true,
+    imagePlaceholderBackground: 'default',
+    imagePlaceholderBorder: 'default',
+    framePlaceholder: true,
+    framePlaceholderDocument:
+        [
+            '<html><head>',
+            '<meta charset="utf-8">',
+            '<style>',
+            'body { ',
+                'background: {{bg}};',
+                'color: gray;',
+                'font: 12px sans-serif;',
+                'margin: 0;',
+                'overflow: hidden;',
+                'padding: 2px;',
+                'white-space: nowrap;',
+            '}',
+            'a { ',
+                'color: inherit;',
+                'padding: 0 3px;',
+                'text-decoration: none;',
+            '}',
+            'svg {',
+                'display: inline-block;',
+                'fill: gray;',
+                'height: 12px;',
+                'vertical-align: bottom;',
+                'width: 12px;',
+            '}',
+            '</style></head><body>',
+            '<span><a href="{{url}}" title="{{url}}" target="_blank">',
+            '<svg viewBox="0 0 1792 1792"><path transform="scale(1,-1) translate(0,-1536)" d="M1408 608v-320q0 -119 -84.5 -203.5t-203.5 -84.5h-832q-119 0 -203.5 84.5t-84.5 203.5v832q0 119 84.5 203.5t203.5 84.5h704q14 0 23 -9t9 -23v-64q0 -14 -9 -23t-23 -9h-704q-66 0 -113 -47t-47 -113v-832q0 -66 47 -113t113 -47h832q66 0 113 47t47 113v320q0 14 9 23t23 9h64q14 0 23 -9t9 -23zM1792 1472v-512q0 -26 -19 -45t-45 -19t-45 19l-176 176l-652 -652q-10 -10 -23 -10t-23 10l-114 114q-10 10 -10 23t10 23l652 652l-176 176q-19 19 -19 45t19 45t45 19h512q26 0 45 -19t19 -45z" /></svg>',
+            '</a>{{url}}</span>',
+            '</body></html>'
+        ].join(''),
+    framePlaceholderBackground: 'default',
+};
+
 /******************************************************************************/
 
 return {
@@ -109,6 +186,10 @@ return {
         processReferer: false
     },
 
+    rawSettingsDefault: rawSettingsDefault,
+    rawSettings: Object.assign({}, rawSettingsDefault),
+    rawSettingsWriteTime: 0,
+
     clearBrowserCacheCycle: 0,
     cspNoInlineScript: "script-src 'unsafe-eval' blob: *",
     cspNoWorker: undefined,

diff --git a/src/js/contentscript.js b/src/js/contentscript.js
@@ -1,7 +1,7 @@
 /*******************************************************************************
 
     uMatrix - a Chromium browser extension to black/white list requests.
-    Copyright (C) 2014-2017 Raymond Hill
+    Copyright (C) 2014-2018 Raymond Hill
 
     This program is free software: you can redistribute it and/or modify
     it under the terms of the GNU General Public License as published by
@@ -187,11 +187,16 @@ var collapser = (function() {
                 target.hidden = true;
                 continue;
             }
-            if ( tag === 'iframe' ) {
+            switch ( tag ) {
+            case 'iframe':
+                if ( placeholders.frame !== true ) { break; }
                 docurl =
                     'data:text/html,' +
                     encodeURIComponent(
-                        placeholders.iframe.replace(reURLPlaceholder, src)
+                        placeholders.frameDocument.replace(
+                            reURLPlaceholder,
+                            src
+                        )
                     );
                 replaced = false;
                 // Using contentWindow.location prevent tainting browser
@@ -206,14 +211,24 @@ var collapser = (function() {
                 if ( !replaced ) {
                     target.setAttribute('src', docurl);
                 }
-                continue;
+                break;
+            case 'img':
+                if ( placeholders.image !== true ) { break; }
+                target.style.setProperty('display', 'inline-block');
+                target.style.setProperty('min-width', '20px', 'important');
+                target.style.setProperty('min-height', '20px', 'important');
+                target.style.setProperty(
+                    'border',
+                    placeholders.imageBorder,
+                    'important'
+                );
+                target.style.setProperty(
+                    'background',
+                    placeholders.imageBackground,
+                    'important'
+                );
+                break;
             }
-            target.setAttribute(src1stProps[tag], placeholders[tag]);
-            target.style.setProperty('display', 'inline-block');
-            target.style.setProperty('min-width', '20px', 'important');
-            target.style.setProperty('min-height', '20px', 'important');
-            target.style.setProperty('border', placeholders.border, 'important');
-            target.style.setProperty('background', placeholders.background, 'important');
         }
     };