Updated extensions bundle

author: Ruben Rodriguez <ruben@gnu.org> 2019-05-10 19:05:20 -0400
committer: Ruben Rodriguez <ruben@gnu.org> 2019-05-10 19:05:20 -0400
commit: 7859a9131fcda359265dc16ef55933e5ed218119 (patch)
tree: ecb4bf7a0fd005a637d3ff0444ce9afaa8817ba9 /data/extensions/https-everywhere@eff.org/pages/popup
parent: cb4bbb16a12d495eca1ac05ebacc7557e9b05c05 (diff)
3 files changed, 475 insertions, 166 deletions
diff --git a/data/extensions/https-everywhere@eff.org/pages/popup/index.html b/data/extensions/https-everywhere@eff.org/pages/popup/index.html
index 8097c5b..03f76d2 100644
--- a/data/extensions/https-everywhere@eff.org/pages/popup/index.html
+++ b/data/extensions/https-everywhere@eff.org/pages/popup/index.html
@@ -11,78 +11,94 @@
   </head>
   <body>
     <header>
-      <h1 data-i18n="about_ext_name"></h1>
+      <div class="logo-container">
+        <img src="../../images/HTTPS-Everywhere-Logo.png" alt="HTTPS Everywhere logo">
+      </div>
+
+      <small>
+        <span data-i18n="about_version">Version</span>: <span id="current-version"></span>
+        <br>
+        <span id="rulesets-versions"></span>
+      </small>
     </header>
 
-    <section id="disableButton" class="options" style="visibility: hidden;">
-      <div class="onoffswitch">
-        <input id="onoffswitch" type="checkbox" checked><label data-i18n="menu_globalEnable" for="onoffswitch"></label>
+    <section id="disableButton" class="options settings_block" style="visibility: hidden;">
+      <div class="onoffswitch switch" aria-label="Toggle on or off">
+        <h1 id="onoffswitch_label" data-i18n="menu_globalEnable"></h1>
+        <span class="slider round"></span>
+        <input aria-hidden="true" id="onoffswitch" type="checkbox" checked> <label id="onoffswitch__label" for="onoffswitch">
+        </label>
       </div>
     </section>
 
-    <section id="HttpNowhere" class="options" style="visibility: hidden;">
-      <input id="http-nowhere-checkbox" type="checkbox"><label data-i18n="menu_blockUnencryptedRequests" for="http-nowhere-checkbox"></label>
+    <section id="HttpNowhere" class="options settings_block" style="visibility: hidden;">
+      <h1 id="HttpNowhere__header" data-i18n="menu_encryptAllSitesEligible"></h1>
+      <input aria-hidden="true" id="http-nowhere-checkbox" type="checkbox"><label id="http-nowhere-checkbox_label" aria-label="Toggle on or off" for="http-nowhere-checkbox"></label>
+      <h2 id="HttpNowhere__explained" data-i18n="menu_httpNoWhereExplained"></h2>
     </section>
 
-    <div id="RuleManagement">
+    <section id="RuleManagement" class="settings_block">
+      <section id="settingsForThisSite">
+        <h1 data-i18n="chrome_settings_for_this_site_header"></h1>
+        <h2 data-i18n="chrome_settings_for_this_site_subheader"></h2>
+      </section>
       <section id="disableEnableSection">
-        <a href="javascript:void 0" id="disable-on-this-site" data-i18n="chrome_disable_on_this_site"></a>
-        <a href="javascript:void 0" id="enable-on-this-site" data-i18n="chrome_enable_on_this_site"></a>
+          <a href="javascript:void 0" id="disable-on-this-site" class="button" data-i18n="chrome_disable_on_this_site"></a>
+          <a href="javascript:void 0" id="enable-on-this-site" class="button" data-i18n="chrome_enable_on_this_site"></a>
       </section>
+      <div id="RuleManagement__see_more--prompt" class="see_more__prompt" aria-label="Listen or See more for explanation">
+        <span id="RuleManagement__see_more" class="see_more__arrow down"></span>
+        <span class="see_more__text" data-i18n="menu_seeMore"></span>
+      </div>
+      <div class="see_more__content hide">
+        <p class="see_more--clarified" data-i18n="chrome_settings_for_this_site_explained"></p>
 
-      <section id="addRuleSection">
-        <a href="javascript:void 0" id="add-rule-link" data-i18n="chrome_add_rule"></a>
-        <div id="add-new-rule-div" style="display: none">
-          <h3 data-i18n="about_add_new_rule"></h3>
-          <p data-i18n="chrome_always_https_for_host"></p>
-          <label for="new-rule-host" data-i18n="chrome_host"></label><br>
-          <input size="50" id="new-rule-host" type="text" disabled><br>
-          <div id="new-rule-regular-text">
-            <a href="javascript:void 0" id="new-rule-show-advanced-link" data-i18n="chrome_show_advanced"></a><br>
-          </div>
-          <div id="new-rule-advanced" style="display: none">
-            <a href="javascript:void 0" id="new-rule-hide-advanced-link" data-i18n="chrome_hide_advanced"></a><br>
-            <br>
-            <label for="new-rule-name" data-i18n="chrome_rule_name"></label><br>
-            <input size="50" id="new-rule-name" type="text"><br>
-            <label for="new-rule-regex" data-i18n="chrome_regex"></label><br>
-            <input size="50" id="new-rule-regex" type="text"><br>
-            <label for="new-rule-redirect" data-i18n="chrome_redirect_to"></label><br>
-            <input size="50" id="new-rule-redirect" type="text"><br>
+        <section id="addRuleSection">
+          <a href="javascript:void 0" id="add-rule-link" class="button" data-i18n="chrome_add_rule"></a>
+          <div id="add-new-rule-div" style="display: none">
+            <h3 data-i18n="about_add_new_rule"></h3>
+            <p data-i18n="chrome_always_https_for_host"></p>
+            <label for="new-rule-host" data-i18n="chrome_host" class="label_nontoggle"></label>
+            <input size="50" id="new-rule-host" type="text" disabled><br>
+            <div id="new-rule-regular-text">
+              <a href="javascript:void 0" id="new-rule-show-advanced-link" class="button" data-i18n="chrome_show_advanced"></a><br>
+            </div>
+            <div id="new-rule-advanced" style="display: none">
+              <a href="javascript:void 0" id="new-rule-hide-advanced-link" class="button" data-i18n="chrome_hide_advanced"></a><br>
+              <label for="new-rule-name" data-i18n="chrome_rule_name" class="label_nontoggle"></label>
+              <input size="50" id="new-rule-name" type="text">
+              <label for="new-rule-regex" data-i18n="chrome_regex" class="label_nontoggle"></label>
+              <input size="50" id="new-rule-regex" type="text">
+              <label for="new-rule-redirect" data-i18n="chrome_redirect_to" class="label_nontoggle"></label>
+              <input size="50" id="new-rule-redirect" type="text">
+            </div>
+            <button id="add-new-rule-button" class="button" data-i18n="chrome_add_new_rule"></button>
+            <button id="cancel-new-rule" class="button" data-i18n="chrome_status_cancel_button"></button>
           </div>
-          <button id="add-new-rule-button" data-i18n="chrome_add_new_rule"></button><br>
-          <button id="cancel-new-rule" data-i18n="chrome_status_cancel_button"></button>
-        </div>
-      </section>
+        </section>
 
-      <section id="StableRules" class="rules">
-        <h3 data-i18n="chrome_stable_rules"></h3>
-        <p class="description" data-i18n="chrome_stable_rules_description"></p>
-      </section>
+        <section id="StableRules" class="rules">
+          <h3 data-i18n="chrome_stable_rules"></h3>
+          <span id="RuleManagement--counter"></span>
+          <h2 class="description" data-i18n="chrome_stable_rules_description"></h2>
+        </section>
 
-      <section id="UnstableRules" class="rules">
-        <h3 data-i18n="chrome_experimental_rules"></h3>
-        <p class="description" data-i18n="chrome_experimental_rules_description"></p>
-      </section>
+        <section id="UnstableRules" class="rules">
+          <h3 data-i18n="chrome_experimental_rules"></h3>
+          <h2 class="description" data-i18n="chrome_experimental_rules_description"></h2>
+        </section>
 
-      <section id="resetButton" class="options">
-        <a href="javascript:void 0" id="reset-to-defaults" data-i18n="prefs_reset_defaults"></a>
-      </section>
-    </div>
+        <section id="resetButton" class="options">
+          <a href="javascript:void 0" id="reset-to-defaults" class="button" data-i18n="prefs_reset_defaults"></a>
+        </section>
+      </div>
+
+    </section>
 
     <footer>
-      <a id="viewAllRules" href="https://www.eff.org/https-everywhere/atlas" target="_blank" data-i18n="menu_viewAllRules"></a><br>
-      <br>
-      <a id="aboutTitle" href="https://www.eff.org/https-everywhere" target="_blank" data-i18n="about_title"></a><br>
-      <br>
-      <a id="donateEFF" href="https://supporters.eff.org/donate/support-https-everywhere" target="_blank" data-i18n="menu_donate_eff_imperative"></a>
-      <p>
-        <small>
-          <span data-i18n="about_version">Version</span>: <span id="current-version"></span>
-          <span id="rulesets-versions">
-          </span>
-        </small>
-      </p>
+      <a class="button" id="viewAllRules" href="https://atlas.eff.org/index.html" target="_blank" data-i18n="menu_viewAllRules"></a>
+      <a class="button" id="aboutTitle" href="https://www.eff.org/https-everywhere" target="_blank" data-i18n="about_title"></a>
+      <a class="button" id="donateEFF" href="https://supporters.eff.org/donate/support-https-everywhere" target="_blank" data-i18n="menu_donate_eff_imperative"></a>
     </footer>
 
   </body>
diff --git a/data/extensions/https-everywhere@eff.org/pages/popup/style.css b/data/extensions/https-everywhere@eff.org/pages/popup/style.css
index 0d3b805..6207daa 100644
--- a/data/extensions/https-everywhere@eff.org/pages/popup/style.css
+++ b/data/extensions/https-everywhere@eff.org/pages/popup/style.css
@@ -1,116 +1,296 @@
-html {
-  background-color: #fff
+:root {
+  --https-blue: #0a84ff;
+  --darker-blue: #0060df;
+  --text-main: #000;
+  --text-secondary: #464646;
+  --light-grey: #ececec;
+  --space: 5px;
 }
 
 body {
-  cursor: default;
-  margin-left: 1em;
-  margin-right: 1em;
-  margin-top: 0;
-  margin-bottom: 0;
-  min-width: 23em;
+  color: var(--text-secondary);
   font-family: 'Lucida Grande', 'Segoe UI', Tahoma, 'DejaVu Sans', Arial, sans-serif;
-  font-size: 75%;
-  color: #303942;
+  margin: 0;
+  max-width: 400px;
+  min-width: 380px;
 }
 
-p {
-  line-height: 1.8em;
+header {
+  background-color: var(--light-grey);
+  color: var(--text-main);
+  display: flex;
+  padding: var(--space);
 }
 
-h1, h2, h3 {
-  user-select: none;
-  font-weight: normal;
-  line-height: 1;
+header h1 {
+  font-size: 2em;
+}
+
+header .logo-container {
+  margin: var(--space);
+  width: 85%;
+}
+
+header .logo-container img {
+  width: 100%;
+}
+
+header small {
+  color: #000;
+  display: block;
+  font-size: .70em;
+  font-weight: bold;
+  margin: 1%;
+  width: 100%;
 }
 
 h1 {
-  font-size: 1.5em;
+  font-size: 16px;
+  margin: var(--space) auto
 }
 
 h2 {
-  font-size: 1.3em;
-  margin-bottom: 0.4em;
+  clear: both;
+  font-size: 12px;
+  font-weight: normal;
+  margin: 0;
 }
 
 h3 {
-  color: black;
-  font-size: 1.2em;
-  margin-bottom: 0.8em;
+  font-size: 16px;
 }
 
-a {
-  color: #15c;
-  text-decoration: underline;
+h1,
+h2 {
+  color: var(--text-main);
 }
 
-a:active {
-  color: #052577;
+footer {
+  display: inline-flex;
+  margin: var(--space);
 }
 
-/* Don't wrap text for important stuff. */
-h1, h2, h3, .rule > label {
-  white-space: nowrap;
+footer a.button {
+  margin: var(--space);
 }
 
-/* Hide rules & options if the extension is off. */
-.disabled #RuleManagement,.disabled #HttpNowhere {
-  display: none;
+/* Elements */
+.settings_block {
+  display: inline-block;
+  padding: 5px 1em 20px 1em;
+  border-bottom: var(--light-grey) solid 1px;
 }
 
-/* Initially hide section (until rules get added). */
-section.rules {
-  display: none;
+.button {
+  border: var(--https-blue) solid 1px;
+  color: var(--text-main);
+  display: block;
+  font-size: 12px;
+  font-weight: bold;
+  margin: var(--space) auto;
+  padding: 10px;
+  text-align: center;
+  text-decoration: none;
+}
+
+.button:hover {
+  background-color: var(--darker-blue);
+  color: #fff
+}
+
+.see_more__prompt {
+  color: var(--text-main);
+  cursor: pointer;
+  font-size: 12px;
+  float: right;
+  margin: 5px 0;
+}
+
+.see_more__arrow {
+  border: solid var(--darker-blue);
+  border-width: 0 3px 3px 0;
+  float: right;
+  margin-left: 10px;
+  margin-top: 3px;
+  padding: 3px;
+}
+
+.see_more__content.show p {
+  font-size: 12px;
+  margin: 10px 0;
+}
+
+.down {
+  transform: rotate(45deg);
+}
+
+.up {
+  transform: rotate(-135deg);
+}
+
+input[type=checkbox] {
+  opacity: 0;
+}
+
+label {
+  background: grey;
+  border-radius: 25px;
+  color: var(--text-main);
+  cursor: pointer;
+  display: block;
+  float: right;
+  font-weight: bold;
+  height: 30px;
+  position: relative;
+  text-indent: -400px;
+  width: 50px;
+}
+
+label:after {
+  background: #fff;
+  border-radius: 90px;
+  content: '';
+  height: 20px;
+  left: 5px;
+  position: absolute;
+  top: 5px;
+  transition: 0.3s; /* Acts on transform below */
+  width: 20px;
+}
+input:checked+label {
+  background: var(--https-blue);
+}
+/* position  when checked*/
+input:checked+label:after {
+  left: calc(100% - 5px);
+  transform: translateX(-100%);
+}
+
+.label_nontoggle {
+  background: none;
+  border-radius: 0;
+  color: var(--text-main);
+  display: block;
+  font-weight: normal;
+  height: inherit;
+  position: relative;
+  text-indent: 0;
+  width: auto;
+}
+
+.label_nontoggle:after {
+  background: none;
+  border-radius: 0;
+  content: none;
+  height: auto;
+  left: initial;
+  position: relative;
+  top: initial;
+  transition: none;
+  width: auto;
+}
+
+/* Specific rules */
+.rule.checkbox {
+  clear: both;
+  margin: 5% auto;
+}
+
+.rule.checkbox .remove {
+  float: left;
 }
 
-.rule {
+.rule.checkbox label {
+  font-size: 12px;
+  font-weight: normal;
   height: 25px;
+  text-indent: -285px;
+  width: 40px;
+}
+.rule.checkbox label:after {
+  border-radius: 20px;
+  height: 15px;
+  width: 15px;
 }
 
-.rule label {
-  padding: 0;
-  max-width: 93%;
-  overflow: hidden;
+#disable-on-this-site {
+  clear: both;
+}
+
+#disableButton {
+  display: block;
+}
+
+#HttpNowhere h1,
+#disableButton h1 {
+  float: left;
+}
+
+#RuleManagement {
+  padding: 5px 1em 10px 1em;
 }
 
-/* Underline rules that have notes. */
-.rule[title] span {
-  border-bottom: 1px dotted;
-  cursor: help;
+#settingsForThisSite h1 {
+  float: left;
 }
 
-input[type='checkbox'] {
-  vertical-align: middle;
+#addRuleSection label,
+#addRuleSection button {
+  font-size: 14px;
+  width: 100%;
 }
 
-.rule img.remove {
+#addRuleSection input {
+  background: #fff;
+  border: 1px solid #000;
   float: right;
+  margin: 5px auto;
+  padding: 5px;
+  width: 95%;
 }
 
-header {
-  border-bottom: 1px solid #eee;
+#new-rule-advanced,
+#new-rule-regular-text {
+  margin-top: 40px;
 }
 
-header > h1 {
-  margin: 0;
-  padding: 21px 0 13px;
+#HttpNowhere {
+  display: block;
+  padding: 5px 1em;
 }
 
-section {
-  padding-left: 18px;
-  padding-top: 9px;
-  padding-bottom: 9px;
+#StableRules h3 {
+  float: left;
+  margin-left: 10px;
+}
+#StableRules h2 {
+  margin-left: 10px;
+}
+#StableRules #RuleManagement--counter {
+  background: var(--darker-blue);
+  border-radius: 20px;
+  color: #fff;
+  display: block;
+  float: right;
+  font-size: 12px;
+  font-weight: bold;
+  height: 15px;
+  margin-top: 10px;
+  margin-right: 55%;
+  padding: 5px;
+  text-align: center;
+  width: 15px;
 }
 
-section > h3 {
-  margin-left: -18px;
+/* Event based */
+.see_more--clarified {
+  font-size: 12px;
 }
 
-footer {
-  border-top: 1px solid #eee;
-  margin-top: 8px;
-  padding-top: 8px;
-  padding-bottom: 8px;
+/* Hide rules & options if the extension is off. */
+.disabled #RuleManagement,
+.disabled #HttpNowhere {
+  display: none;
 }
 
 /* By default the "Add a rule" link is hidden. It's shown on HTTPS sites only. */
@@ -118,11 +298,32 @@ footer {
   display: none;
 }
 
-#rulesets-versions{
+#rulesets-versions {
   display: block;
   clear: both;
 }
 
-.rulesets-version{
+.rulesets-version {
   display: block;
 }
+
+/* Initially hide section (until rules get added). */
+section.rules {
+  display: none;
+}
+
+/* For "see more" content */
+.hide {
+  height: 0;
+  opacity: 0;
+  overflow: hidden;
+  transition: 0s;
+  visibility: hidden;
+}
+
+.show {
+  clear: both;
+  opacity: 1;
+  transition: visibility 0s linear 0s, opacity 300ms;
+  visibility: visible;
+}
diff --git a/data/extensions/https-everywhere@eff.org/pages/popup/ux.js b/data/extensions/https-everywhere@eff.org/pages/popup/ux.js
index f50a928..142c372 100644
--- a/data/extensions/https-everywhere@eff.org/pages/popup/ux.js
+++ b/data/extensions/https-everywhere@eff.org/pages/popup/ux.js
@@ -11,34 +11,67 @@
  * Handles rule (de)activation in the popup
  */
 function toggleRuleLine(event) {
-  if (event.target.matches("input[type=checkbox]")) {
-    getTab(activeTab => {
-      const set_ruleset = {
-        active: event.target.checked,
-        name: event.target.nextSibling.innerText,
-        tab_id: activeTab.id,
-      };
-
-      sendMessage("set_ruleset_active_status", set_ruleset, () => {
-        // purge the name from the cache so that this unchecking is persistent.
-        sendMessage("delete_from_ruleset_cache", set_ruleset.name, () => {
-          // Now reload the selected tab of the current window.
-          chrome.tabs.reload(set_ruleset.tab_id);
-        });
+  getTab(activeTab => {
+    const set_ruleset = {
+      active: event.target.parentNode.firstChild.checked,
+      name: event.target.innerText,
+      tab_id: activeTab.id,
+    };
+
+    sendMessage("set_ruleset_active_status", set_ruleset, () => {
+      // purge the name from the cache so that this unchecking is persistent.
+      sendMessage("delete_from_ruleset_cache", set_ruleset.name, () => {
+        // Now reload the selected tab of the current window.
+        chrome.tabs.reload(set_ruleset.tab_id);
       });
     });
-  }
+  });
 }
 
+/**
+ * @param {object} event
+ * @description Toggles content for user to view rules and explanations for different modes
+ */
+function toggleSeeMore(event) {
+  let target = event.target;
+  let content;
+
+  if (target !== this) {
+    content = document.querySelector('.see_more__content');
+  } else {
+    content = target.parentNode.querySelector('.see_more__content');
+  }
+
+  let arrow  = target.parentNode.querySelector('.see_more__arrow');
+  let text = target.parentNode.querySelector('.see_more__text');
+
+  if(arrow.classList.contains('down')) {
+    arrow.classList.replace('down', 'up');
+    text.innerText = 'See less';
+  } else if (arrow.classList.contains('up')) {
+    arrow.classList.replace('up', 'down');
+    text.innerText = 'See more';
+  }
+
+  if (content.classList.contains('hide')) {
+    content.classList.replace('hide', 'show');
+  } else if (content.classList.contains('show')) {
+    content.classList.replace('show', 'hide');
+  }
+}
 
 /**
  * Creates rule lines (including checkbox and icon) for the popup
  * @param rulesets
  * @param list_div
+ * @param {string} ruleType
  * @returns {*}
  */
-function appendRulesToListDiv(rulesets, list_div) {
+function appendRulesToListDiv(rulesets, list_div, ruleType) {
   if (rulesets && rulesets.length) {
+    let counter = rulesets.length;
+    let counterElement = document.querySelector("#RuleManagement--counter");
+    counterElement.innerText = counter;
     // template parent block for each ruleset
     let templateLine = document.createElement("div");
     templateLine.className = "rule checkbox";
@@ -55,18 +88,26 @@ function appendRulesToListDiv(rulesets, list_div) {
 
     // img "remove" button
     let templateRemove = document.createElement("img");
-    templateRemove.src = chrome.extension.getURL("images/remove.png");
+    templateRemove.src = chrome.runtime.getURL("images/remove.png");
     templateRemove.className = "remove";
 
-    templateLabel.appendChild(templateCheckbox);
+    templateLine.appendChild(templateCheckbox);
     templateLabel.appendChild(templateLabelText);
     templateLine.appendChild(templateLabel);
 
+    let increment = 0;
+
     for (const ruleset of rulesets) {
+      increment++;
       let line = templateLine.cloneNode(true);
       let checkbox = line.querySelector("input[type=checkbox]");
+      let label = line.querySelector("label");
       let text = line.querySelector("span");
 
+      // For each "id" attribute in each checkbox input and "for" attribute in label
+      checkbox.setAttribute("id", `${ruleType}_ruleset_${increment}`);
+      label.setAttribute("for", `${ruleType}_ruleset_${increment}`);
+
       checkbox.checked = ruleset.active;
       text.innerText = ruleset.name;
 
@@ -95,6 +136,8 @@ function showHttpNowhereUI() {
   getOption_('httpNowhere', false, function(item) {
     if (item.httpNowhere) {
       e('http-nowhere-checkbox').checked = true;
+      e('HttpNowhere__header').innerText = 'Encrypt All Sites Eligible is ON';
+      e('HttpNowhere__explained').innerText = 'Unencrypted requests are currently blocked';
     }
     e('HttpNowhere').style.visibility = "visible";
   });
@@ -108,30 +151,32 @@ function updateEnabledDisabledUI() {
     // Hide or show the rules sections
     if (item.globalEnabled) {
       document.body.className = ""
-      showHttpNowhereUI()
+      showHttpNowhereUI();
     } else {
-      document.body.className = "disabled"
+      document.body.className = "disabled";
+      e('onoffswitch_label').innerText = 'HTTPS Everywhere is OFF';
     }
   });
 }
 
 // Toggle extension enabled/disabled status
 function toggleEnabledDisabled() {
-  var extension_toggle_effect = function() {
+  let extension_toggle_effect = function() {
     updateEnabledDisabledUI();
-    // The extension state changed, so reload this tab.
-    chrome.tabs.reload();
-    window.close();
+    // The extension state changed, give some time for toggle animation and reload tab
+    setTimeout(function() {
+      chrome.tabs.reload();
+      window.close();
+    }, 1500);
   }
 
   getOption_('globalEnabled', true, function(item) {
     setOption_('globalEnabled', !item.globalEnabled, extension_toggle_effect);
   });
-
 }
 
 /**
- * Create the list of rules for a specific tab
+ * @description Create the list of rules for a specific tab
  * @param activeTab
  */
 function listRules(activeTab) {
@@ -140,11 +185,11 @@ function listRules(activeTab) {
       const stableRules = rulesets.filter(ruleset => ruleset.default_state);
       const unstableRules = rulesets.filter(ruleset => !ruleset.default_state);
 
-      appendRulesToListDiv(stableRules, e("StableRules"));
-      appendRulesToListDiv(unstableRules, e("UnstableRules"));
+      appendRulesToListDiv(stableRules, e("StableRules"), 'stable');
+      appendRulesToListDiv(unstableRules, e("UnstableRules"), 'unstable');
 
       // Add listener to capture the toggle event
-      e("RuleManagement").addEventListener("click", toggleRuleLine);
+      e("add-new-rule-button").addEventListener("click", toggleRuleLine);
     }
 
     // Only show the "Add a rule" section if we're on an HTTPS page
@@ -161,7 +206,7 @@ document.addEventListener("DOMContentLoaded", function () {
   getTab(tab => {
     const url = new URL(tab.url);
     sendMessage("check_if_site_disabled", url.host, disabled => {
-      if(!disabled){
+      if(!disabled) {
         listRules(tab);
       }
       showEnableOrDisable(url, disabled);
@@ -172,12 +217,22 @@ document.addEventListener("DOMContentLoaded", function () {
   updateEnabledDisabledUI();
   e('onoffswitch').addEventListener('click', toggleEnabledDisabled);
   e('http-nowhere-checkbox').addEventListener('click', toggleHttpNowhere, false);
+  e('RuleManagement__see_more--prompt').addEventListener('click', toggleSeeMore);
+
   e('reset-to-defaults').addEventListener('click', () => {
-    if (confirm(chrome.i18n.getMessage("prefs_reset_defaults_message"))) {
-      sendMessage("reset_to_defaults", null, () => {
-        window.close();
-      });
-    }
+    sendMessage("is_firefox", null, is_firefox => {
+      if (is_firefox) {
+        sendMessage("reset_to_defaults", null, () => {
+          window.close();
+        });
+      } else {
+        if (confirm(chrome.i18n.getMessage("prefs_reset_defaults_message"))) {
+          sendMessage("reset_to_defaults", null, () => {
+            window.close();
+          });
+        }
+      }
+    });
   });
 
   // Print the extension's current version.
@@ -186,16 +241,27 @@ document.addEventListener("DOMContentLoaded", function () {
   version_info.innerText = the_manifest.version;
 
   let rulesets_versions = e('rulesets-versions');
+
+  rulesets_versions.addSpan = function(update_channel_name, ruleset_version_string) {
+    let timestamp_span = document.createElement("span");
+    timestamp_span.className = "rulesets-version";
+    timestamp_span.innerText = `${chrome.i18n.getMessage("about_rulesets_version")} ${update_channel_name}: ${ruleset_version_string}`;
+    this.appendChild(timestamp_span);
+  }
+
   sendMessage("get_ruleset_timestamps", null, timestamps => {
-    for(let [update_channel, timestamp] of timestamps){
-      if(timestamp > 0){
+    let replaces = timestamps.some(([update_channel, timestamp]) =>
+      update_channel.replaces_default_rulesets && timestamp > 0
+    );
+    if(!replaces) {
+      rulesets_versions.addSpan("EFF (Full, Bundled)", the_manifest.version);
+    }
+    for(let [update_channel, timestamp] of timestamps) {
+      if(timestamp > 0) {
         let ruleset_date = new Date(timestamp * 1000);
         let ruleset_version_string = ruleset_date.getUTCFullYear() + "." + (ruleset_date.getUTCMonth() + 1) + "." + ruleset_date.getUTCDate();
 
-        let timestamp_span = document.createElement("span");
-        timestamp_span.className = "rulesets-version";
-        timestamp_span.innerText = chrome.i18n.getMessage("about_rulesets_version") + " " + update_channel + ": " + ruleset_version_string;
-        rulesets_versions.appendChild(timestamp_span);
+        rulesets_versions.addSpan(update_channel.name, ruleset_version_string);
       }
     }
   });
@@ -205,7 +271,6 @@ document.addEventListener("DOMContentLoaded", function () {
   e("enable-on-this-site").addEventListener("click", enableOnSite);
 });
 
-
 var escapeForRegex = function( value ) {
   return value.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&");
 };
@@ -303,9 +368,24 @@ function enableOnSite() {
   });
 }
 
+/**
+ * @description Turns EASE Mode on and off
+ */
 function toggleHttpNowhere() {
-  getOption_('httpNowhere', false, function(item) {
-    setOption_('httpNowhere', !item.httpNowhere);
+  getTab(tab => {
+    getOption_('httpNowhere', false, item => {
+      const enabled = !item.httpNowhere;
+      setOption_('httpNowhere', enabled, () => {
+        if (enabled) {
+          chrome.tabs.reload(tab.id);
+          e('HttpNowhere__header').innerText = 'Encrypt All Sites Eligible is ON';
+          e('HttpNowhere__explained').innerText = 'Unencrypted requests are currently blocked';
+        } else {
+          e('HttpNowhere__header').innerText = 'Encrypt All Sites Eligible is OFF';
+          e('HttpNowhere__explained').innerText = 'Unencrypted requests are currently allowed';
+        }
+      });
+    });
   });
 }
 
@@ -317,3 +397,15 @@ function getTab(callback) {
   }
   chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => callback(tabs[0]));
 }
+
+// This code fixes a Chromium-specific bug that causes links in extension popup
+// to open in regular tab even if the popup is opened in incognito mode.
+
+document.addEventListener('click', e => {
+  const { target } = e
+
+  if (target.matches('a[target="_blank"]')) {
+    chrome.tabs.create({ url: target.href })
+    e.preventDefault()
+  }
+})
author	Ruben Rodriguez <ruben@gnu.org>	2019-05-10 19:05:20 -0400
committer	Ruben Rodriguez <ruben@gnu.org>	2019-05-10 19:05:20 -0400
commit	7859a9131fcda359265dc16ef55933e5ed218119 (patch)
tree	ecb4bf7a0fd005a637d3ff0444ce9afaa8817ba9 /data/extensions/https-everywhere@eff.org/pages/popup
parent	cb4bbb16a12d495eca1ac05ebacc7557e9b05c05 (diff)