Add Disabled List Auditing in Options page for HTTPSE

chromium/pages/options/index.html

@@ -19,6 +19,9 @@
         <input type="checkbox" id="autoUpdateRulesets">
         <label for="autoUpdateRulesets" data-i18n="options_autoUpdateRulesets"></label>
       </div>
+      <div id="disabled-rules-wrapper">
+        <p class="disabled-rules-wrapper-header" data-i18n="options_disabledUrlsListed"></p>
+      </div>
     </div>
 
     <div class="section-wrapper" id="advanced-settings-wrapper">
@@ -50,5 +53,6 @@
     <script src="ux.js"></script>
     <script src="../translation.js"></script>
     <script src="../send-message.js"></script>
+    <script src="../util.js"></script>
   </body>
 </html>

chromium/pages/options/style.css

@@ -15,6 +15,31 @@ body{
   margin-bottom: 20px;
 }
 
+/** Disabled Sites Option**/
+.disabled-rules-wrapper-header {
+  font-weight: bold;
+  padding-left: 5px;
+}
+img.remove{
+  cursor: pointer;
+  float: right;
+  height: 15px;
+  margin: 10px 0 0 8%;
+  width: 15px;
+}
+.disabled-rule-list-item:last-of-type {
+  border-bottom: none;
+}
+.disabled-rule-list-item {
+  border-bottom: 1px solid #ccc;
+  display: inline-flex;
+  margin-left: 5%;
+  width: 80%;
+}
+.disabled-rule-list-item p {
+  width: 100%;
+}
+
 .section-header{
   margin-bottom: 10px;
 }

chromium/pages/options/ux.js

@@ -1,4 +1,7 @@
 /* global sendMessage */
+/* global getOption_ */
+/* global e */
+/* global hide */
 
 "use strict";
 
@@ -230,6 +233,40 @@ document.addEventListener("DOMContentLoaded", () => {
     window.scrollTo(0,0);
   }
 
+  // HTTPS Everywhere Sites Disabled section in General Settings module
+  getOption_("disabledList", [], function(item) {
+    let rule_host_parent = e("disabled-rules-wrapper");
+
+    if( 0 === item.disabledList.length ){
+      hide(rule_host_parent);
+      return;
+    }
+    // img element "remove button"
+    let templateRemove = document.createElement("img");
+    templateRemove.src = chrome.extension.getURL("images/remove.png");
+    templateRemove.className = "remove";
+
+    if( item ){
+      for (const key of item.disabledList) {
+        let rule_host = document.createElement("div");
+        let remove = templateRemove.cloneNode(true);
+        let rule_host_site_name = document.createElement("p");
+
+        rule_host.className = "disabled-rule-list-item";
+        rule_host_site_name.className = "disabled-rule-list-item_single"
+        rule_host_site_name.innerText = key;
+        rule_host.appendChild( rule_host_site_name);
+        rule_host_parent.appendChild(rule_host);
+        rule_host.appendChild(remove);
+
+        remove.addEventListener("click", () => {
+          hide( rule_host );
+          sendMessage("enable_on_site", key);
+        });
+      }
+    }
+  });
+
   add_update_channel.addEventListener("click", () => {
     const update_channel_name = update_channel_name_div.value;
     if(update_channel_name.trim() == ""){

chromium/pages/util.js

@@ -0,0 +1,34 @@
+/* exported e */
+/* exported hide */
+/* exported show */
+/* exported getOption_ */
+
+"use strict";
+
+/**
+ * Element helper functions
+ */
+function e(id) {
+  return document.getElementById(id);
+}
+
+function hide(elem) {
+  elem.style.display = "none";
+}
+
+function show(elem) {
+  elem.style.display = "block";
+}
+
+/**
+* Get an option from global settings
+* @param {string} opt
+* @param {mixed} defaultOpt
+* @param {object} callback
+* @returns mixed
+*/
+function getOption_(opt, defaultOpt, callback) {
+  let details = {};
+  details[opt] = defaultOpt;
+  sendMessage("get_option", details, callback);
+}

src/chrome/locale/en/https-everywhere.dtd

@@ -18,6 +18,7 @@
 <!ENTITY https-everywhere.options.enableMixedRulesets "Enable mixed content rulesets">
 <!ENTITY https-everywhere.options.showDevtoolsTab "Show Devtools tab">
 <!ENTITY https-everywhere.options.autoUpdateRulesets "Auto-update rulesets">
+<!ENTITY https-everywhere.options.disabledUrlsListed "HTTPS Everywhere Sites Disabled">
 <!ENTITY https-everywhere.options.updateChannelsWarning "Warning: Adding update channels can cause attackers to hijack your browser. Only edit this section if you know what you're doing!">
 <!ENTITY https-everywhere.options.addUpdateChannel "Add Update Channel">
 <!ENTITY https-everywhere.options.enterUpdateChannelName "Enter update channel name">