[tor-commits] [tor-browser] 64/85: fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in about:preferences#connection

gitolite role git at cupani.torproject.org
Fri Jun 10 17:01:55 UTC 2022


This is an automated email from the git hooks/post-receive script.

pierov pushed a commit to branch tor-browser-91.9.0esr-11.5-2
in repository tor-browser.

commit 6bb230b225baf1a79439324a20fb8506d6d899b3
Author: Pier Angelo Vendrame <pierov at torproject.org>
AuthorDate: Fri Apr 8 11:20:37 2022 +0200

    fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in about:preferences#connection
    
    Changes introduced by !275
---
 .../torpreferences/content/connectionPane.js       | 402 ++++++---------------
 .../torpreferences/content/connectionPane.xhtml    |  17 +
 .../torpreferences/content/torPreferences.css      | 130 ++++++-
 3 files changed, 251 insertions(+), 298 deletions(-)

diff --git a/browser/components/torpreferences/content/connectionPane.js b/browser/components/torpreferences/content/connectionPane.js
index 309d6498a0c80..46fbbfecf832f 100644
--- a/browser/components/torpreferences/content/connectionPane.js
+++ b/browser/components/torpreferences/content/connectionPane.js
@@ -110,6 +110,7 @@ const gConnectionPane = (function() {
       chooseForMe: "#torPreferences-bridges-buttonChooseBridgeForMe",
       currentHeader: "#torPreferences-currentBridges-header",
       currentHeaderText: "#torPreferences-currentBridges-headerText",
+      currentDescriptionText: "#torPreferences-currentBridges-description",
       switch: "#torPreferences-currentBridges-switch",
       cards: "#torPreferences-currentBridges-cards",
       cardTemplate: "#torPreferences-bridgeCard-template",
@@ -135,6 +136,13 @@ const gConnectionPane = (function() {
       requestButton: "#torPreferences-addBridge-buttonRequestBridge",
       enterLabel: "#torPreferences-addBridge-labelEnterBridge",
       enterButton: "#torPreferences-addBridge-buttonEnterBridge",
+      removeOverlay: "#bridge-remove-overlay",
+      removeModal: "#bridge-remove-modal",
+      removeDismiss: "#bridge-remove-dismiss",
+      removeQuestion: "#bridge-remove-question",
+      removeWarning: "#bridge-remove-warning",
+      removeConfirm: "#bridge-remove-confirm",
+      removeCancel: "#bridge-remove-cancel",
     },
     advanced: {
       header: "h1#torPreferences-advanced-header",
@@ -280,9 +288,7 @@ const gConnectionPane = (function() {
         if (TorConnect.state === TorConnectState.Bootstrapped) {
           torIcon.className = "connected";
           torStatus.textContent = TorStrings.settings.statusTorConnected;
-        } else if (
-          TorConnect.detectedCensorshipLevel > TorCensorshipLevel.None
-        ) {
+        } else if (TorConnect.hasBootstrapEverFailed) {
           torIcon.className = "blocked";
           torStatus.textContent = TorStrings.settings.statusTorBlocked;
         } else {
@@ -346,36 +352,46 @@ const gConnectionPane = (function() {
           TorConnect.beginAutoBootstrap(location.value);
         });
         this._populateLocations = () => {
-          let value = location.value;
+          const currentValue = location.value;
           locationEntries.textContent = "";
-
-          {
-            const item = document.createXULElement("menuitem");
-            item.setAttribute("value", "");
-            item.setAttribute(
-              "label",
-              TorStrings.settings.bridgeLocationAutomatic
-            );
-            locationEntries.appendChild(item);
-          }
-
-          const codes = TorConnect.countryCodes;
-          const items = codes.map(code => {
+          const createItem = (value, label, disabled) => {
             const item = document.createXULElement("menuitem");
-            item.setAttribute("value", code);
-            item.setAttribute(
-              "label",
-              TorConnect.countryNames[code]
-                ? TorConnect.countryNames[code]
-                : code
-            );
+            item.setAttribute("value", value);
+            item.setAttribute("label", label);
+            if (disabled) {
+              item.setAttribute("disabled", "true");
+            }
             return item;
-          });
-          items.sort((left, right) =>
-            left.textContent.localeCompare(right.textContent)
+          };
+          const addLocations = codes => {
+            const items = [];
+            for (const code of codes) {
+              items.push(
+                createItem(
+                  code,
+                  TorConnect.countryNames[code]
+                    ? TorConnect.countryNames[code]
+                    : code
+                )
+              );
+            }
+            items.sort((left, right) => left.label.localeCompare(right.label));
+            locationEntries.append(...items);
+          };
+          locationEntries.append(
+            createItem("", TorStrings.settings.bridgeLocationAutomatic)
           );
-          locationEntries.append(...items);
-          location.value = value;
+          if (TorConnect.countryCodes.length) {
+            locationEntries.append(
+              createItem("", TorStrings.settings.bridgeLocationFrequent, true)
+            );
+            addLocations(TorConnect.countryCodes);
+            locationEntries.append(
+              createItem("", TorStrings.settings.bridgeLocationOther, true)
+            );
+          }
+          addLocations(Object.keys(TorConnect.countryNames));
+          location.value = currentValue;
         };
         this._showAutoconfiguration = () => {
           if (
@@ -413,6 +429,9 @@ const gConnectionPane = (function() {
           this._populateBridgeCards();
         });
       });
+      prefpane.querySelector(
+        selectors.bridges.currentDescriptionText
+      ).textContent = TorStrings.settings.bridgeCurrentDescription;
       const bridgeTemplate = prefpane.querySelector(
         selectors.bridges.cardTemplate
       );
@@ -439,6 +458,12 @@ const gConnectionPane = (function() {
         card.removeAttribute("id");
         const grid = card.querySelector(selectors.bridges.cardQrGrid);
         card.addEventListener("click", e => {
+          if (
+            card.classList.contains("currently-connected") ||
+            bridgeCards.classList.contains("single-card")
+          ) {
+            return;
+          }
           let target = e.target;
           let apply = true;
           while (target !== null && target !== card && apply) {
@@ -598,7 +623,7 @@ const gConnectionPane = (function() {
       const removeAll = prefpane.querySelector(selectors.bridges.removeAll);
       removeAll.setAttribute("label", TorStrings.settings.bridgeRemoveAll);
       removeAll.addEventListener("command", () => {
-        this.onRemoveAllBridges();
+        this._confirmBridgeRemoval();
       });
       this._populateBridgeCards = async () => {
         const collapseThreshold = 4;
@@ -617,6 +642,7 @@ const gConnectionPane = (function() {
         bridgeCards.removeAttribute("hidden");
         bridgeSwitch.checked = TorSettings.bridges.enabled;
         bridgeCards.classList.toggle("disabled", !TorSettings.bridges.enabled);
+        bridgeCards.classList.toggle("single-card", numBridges === 1);
 
         let shownCards = 0;
         const toShow = this._currentBridgesExpanded
@@ -787,7 +813,37 @@ const gConnectionPane = (function() {
         });
       }
 
-      Services.obs.addObserver(this, TorConnectTopics.StateChange);
+      {
+        const overlay = prefpane.querySelector(selectors.bridges.removeOverlay);
+        this._confirmBridgeRemoval = () => {
+          overlay.classList.remove("hidden");
+        };
+        const closeDialog = () => {
+          overlay.classList.add("hidden");
+        };
+        overlay.addEventListener("click", closeDialog);
+        const modal = prefpane.querySelector(selectors.bridges.removeModal);
+        modal.addEventListener("click", e => {
+          e.stopPropagation();
+        });
+        const dismiss = prefpane.querySelector(selectors.bridges.removeDismiss);
+        dismiss.addEventListener("click", closeDialog);
+        const question = prefpane.querySelector(
+          selectors.bridges.removeQuestion
+        );
+        question.textContent = TorStrings.settings.removeBridgesQuestion;
+        const warning = prefpane.querySelector(selectors.bridges.removeWarning);
+        warning.textContent = TorStrings.settings.removeBridgesWarning;
+        const confirm = prefpane.querySelector(selectors.bridges.removeConfirm);
+        confirm.setAttribute("label", TorStrings.settings.remove);
+        confirm.addEventListener("command", () => {
+          this.onRemoveAllBridges();
+          closeDialog();
+        });
+        const cancel = prefpane.querySelector(selectors.bridges.removeCancel);
+        cancel.setAttribute("label", TorStrings.settings.cancel);
+        cancel.addEventListener("command", closeDialog);
+      }
 
       // Advanced setup
       prefpane.querySelector(selectors.advanced.header).innerText =
@@ -816,6 +872,8 @@ const gConnectionPane = (function() {
       torLogsButton.addEventListener("command", () => {
         this.onViewTorLogs();
       });
+
+      Services.obs.addObserver(this, TorConnectTopics.StateChange);
     },
 
     init() {
@@ -915,6 +973,9 @@ const gConnectionPane = (function() {
     onRemoveAllBridges() {
       TorSettings.bridges.enabled = false;
       TorSettings.bridges.bridge_strings = "";
+      if (TorSettings.bridges.source == TorBridgeSource.BuiltIn) {
+        TorSettings.bridges.builtin_type = "";
+      }
       TorSettings.saveToPrefs();
       TorSettings.applySettings().then(result => {
         this._populateBridgeCards();
@@ -1018,272 +1079,33 @@ function makeBridgeId(bridgeString) {
   // JS uses UTF-16. While most of these emojis are surrogate pairs, a few
   // ones fit one UTF-16 character. So we could not use neither indices,
   // nor substr, nor some function to split the string.
-  const emojis = [
-    "๐Ÿ˜„๏ธ",
-    "๐Ÿ˜’๏ธ",
-    "๐Ÿ˜‰",
-    "๐Ÿ˜ญ๏ธ",
-    "๐Ÿ˜‚๏ธ",
-    "๐Ÿ˜Ž๏ธ",
-    "๐Ÿคฉ๏ธ",
-    "๐Ÿ˜˜",
-    "๐Ÿ˜œ๏ธ",
-    "๐Ÿ˜๏ธ",
-    "๐Ÿ˜ท",
-    "๐Ÿคข",
-    "๐Ÿค•",
-    "๐Ÿคง",
-    "๐Ÿฅต",
-    "๐Ÿฅถ",
-    "๐Ÿฅด",
-    "๐Ÿ˜ต๏ธ",
-    "๐Ÿคฎ๏ธ",
-    "๐Ÿค‘",
-    "๐Ÿค”",
-    "๐Ÿซข",
-    "๐Ÿค",
-    "๐Ÿ˜ฎโ€๐Ÿ’จ",
-    "๐Ÿ˜",
-    "๐Ÿคค",
-    "๐Ÿ˜ด",
-    "๐Ÿคฏ",
-    "๐Ÿค ",
-    "๐Ÿฅณ",
-    "๐Ÿฅธ",
-    "๐Ÿค“",
-    "๐Ÿง",
-    "๐Ÿ˜จ",
-    "๐Ÿ˜ณ",
-    "๐Ÿฅบ",
-    "๐Ÿคฌ",
-    "๐Ÿ˜ˆ",
-    "๐Ÿ‘ฟ",
-    "๐Ÿ’€",
-    "๐Ÿ’ฉ",
-    "๐Ÿคก",
-    "๐Ÿ‘บ",
-    "๐Ÿ‘ป",
-    "๐Ÿ‘ฝ",
-    "๐Ÿฆด",
-    "๐Ÿค–",
-    "๐Ÿ˜ธ",
-    "๐Ÿ™ˆ",
-    "๐Ÿ™‰",
-    "๐Ÿ™Š",
-    "๐Ÿ’‹",
-    "๐Ÿ’–",
-    "๐Ÿ’ฏ",
-    "๐Ÿ’ข",
-    "๐Ÿ’ง",
-    "๐Ÿ’จ",
-    "๐Ÿ’ญ",
-    "๐Ÿ’ค",
-    "๐Ÿ‘‹",
-    "๐Ÿ‘Œ",
-    "โœŒ",
-    "๐Ÿ‘",
-    "๐Ÿ‘Ž",
-    "๐Ÿค›",
-    "๐Ÿ™Œ",
-    "๐Ÿ’ช",
-    "๐Ÿ™",
-    "โœ",
-    "๐Ÿง ",
-    "๐Ÿ‘€",
-    "๐Ÿ‘‚",
-    "๐Ÿ‘…",
-    "๐Ÿฆท",
-    "๐Ÿพ",
-    "๐Ÿถ",
-    "๐ŸฆŠ",
-    "๐Ÿฆ",
-    "๐Ÿˆ",
-    "๐Ÿฆ",
-    "๐Ÿฏ",
-    "๐Ÿด",
-    "๐Ÿฆ„",
-    "๐Ÿฆ“",
-    "๐Ÿฎ",
-    "๐Ÿท",
-    "๐Ÿ‘",
-    "๐Ÿช",
-    "๐Ÿ˜",
-    "๐Ÿญ",
-    "๐Ÿฐ",
-    "๐Ÿฆ”",
-    "๐Ÿฆ‡",
-    "๐Ÿป",
-    "๐Ÿจ",
-    "๐Ÿผ",
-    "๐Ÿ”",
-    "๐Ÿฆจ",
-    "๐Ÿฆ˜",
-    "๐Ÿฆ",
-    "๐Ÿง",
-    "๐Ÿฆฉ",
-    "๐Ÿฆ‰",
-    "๐Ÿฆœ",
-    "๐Ÿชถ",
-    "๐Ÿธ",
-    "๐ŸŠ",
-    "๐Ÿข",
-    "๐ŸฆŽ",
-    "๐Ÿ",
-    "๐Ÿฆ–",
-    "๐Ÿฆ€",
-    "๐Ÿฌ",
-    "๐Ÿ™",
-    "๐ŸŒ",
-    "๐Ÿ",
-    "๐Ÿž",
-    "๐ŸŒธ",
-    "๐ŸŒฒ",
-    "๐ŸŒต",
-    "๐Ÿ€",
-    "๐Ÿ",
-    "๐Ÿ‡",
-    "๐Ÿ‰",
-    "๐ŸŠ",
-    "๐Ÿ‹",
-    "๐ŸŒ",
-    "๐Ÿ",
-    "๐ŸŽ",
-    "๐Ÿฅฅ",
-    "๐Ÿ",
-    "๐Ÿ’",
-    "๐Ÿ“",
-    "๐Ÿซ",
-    "๐Ÿฅ",
-    "๐Ÿฅ”",
-    "๐Ÿฅ•",
-    "๐Ÿง…",
-    "๐ŸŒฐ",
-    "๐Ÿ„",
-    "๐Ÿž",
-    "๐Ÿฅž",
-    "๐Ÿง€",
-    "๐Ÿ–",
-    "๐Ÿ”",
-    "๐ŸŸ",
-    "๐Ÿ•",
-    "๐Ÿฅš",
-    "๐Ÿฟ",
-    "๐Ÿง‚",
-    "๐Ÿ™",
-    "๐Ÿฆ",
-    "๐Ÿฉ",
-    "๐Ÿช",
-    "๐ŸŽ‚",
-    "๐Ÿฌ",
-    "๐Ÿญ",
-    "๐Ÿฅ›",
-    "โ˜•",
-    "๐Ÿซ–",
-    "๐Ÿพ",
-    "๐Ÿท",
-    "๐Ÿน",
-    "๐Ÿบ",
-    "๐Ÿด",
-    "๐Ÿฅ„",
-    "๐Ÿซ™",
-    "๐Ÿงญ",
-    "๐ŸŒ‹",
-    "๐Ÿชต",
-    "๐Ÿก",
-    "๐Ÿข",
-    "๐Ÿฐ",
-    "โ›ฒ",
-    "โ›บ",
-    "๐ŸŽก",
-    "๐Ÿš‚",
-    "๐Ÿš˜",
-    "๐Ÿšœ",
-    "๐Ÿšฒ",
-    "๐Ÿš”",
-    "๐Ÿšจ",
-    "โ›ฝ",
-    "๐Ÿšฅ",
-    "๐Ÿšง",
-    "โš“",
-    "โ›ต",
-    "๐Ÿ›Ÿ",
-    "๐Ÿช‚",
-    "๐Ÿš€",
-    "โŒ›",
-    "โฐ",
-    "๐ŸŒ‚",
-    "๐ŸŒž",
-    "๐ŸŒ™",
-    "๐ŸŒŸ",
-    "โ›…",
-    "โšก",
-    "๐Ÿ”ฅ",
-    "๐ŸŒŠ",
-    "๐ŸŽƒ",
-    "๐ŸŽˆ",
-    "๐ŸŽ‰",
-    "โœจ",
-    "๐ŸŽ€",
-    "๐ŸŽ",
-    "๐Ÿ†",
-    "๐Ÿ…",
-    "๐Ÿ”ฎ",
-    "๐Ÿช„",
-    "๐ŸŽพ",
-    "๐ŸŽณ",
-    "๐ŸŽฒ",
-    "๐ŸŽญ",
-    "๐ŸŽจ",
-    "๐Ÿงต",
-    "๐ŸŽฉ",
-    "๐Ÿ“ข",
-    "๐Ÿ””",
-    "๐ŸŽต",
-    "๐ŸŽค",
-    "๐ŸŽง",
-    "๐ŸŽท",
-    "๐ŸŽธ",
-    "๐Ÿฅ",
-    "๐Ÿ”‹",
-    "๐Ÿ”Œ",
-    "๐Ÿ’ป",
-    "๐Ÿ’พ",
-    "๐Ÿ’ฟ",
-    "๐ŸŽฌ",
-    "๐Ÿ“บ",
-    "๐Ÿ“ท",
-    "๐ŸŽฎ",
-    "๐Ÿงฉ",
-    "๐Ÿ”",
-    "๐Ÿ’ก",
-    "๐Ÿ“–",
-    "๐Ÿ’ฐ",
-    "๐Ÿ’ผ",
-    "๐Ÿ“ˆ",
-    "๐Ÿ“Œ",
-    "๐Ÿ“Ž",
-    "๐Ÿ”’",
-    "๐Ÿ”‘",
-    "๐Ÿ”ง",
-    "๐Ÿช›",
-    "๐Ÿ”ฉ",
-    "๐Ÿงฒ",
-    "๐Ÿ”ฌ",
-    "๐Ÿ”ญ",
-    "๐Ÿ“ก",
-    "๐Ÿšช",
-    "๐Ÿช‘",
-    "โ›”",
-    "๐Ÿšฉ",
+const emojis = [
+    "๐Ÿ‘ฝ","๐Ÿค–","๐Ÿงš","๐Ÿงœ","๐Ÿ„","๐Ÿต","๐Ÿฆ","๐Ÿถ","๐Ÿบ","๐ŸฆŠ","๐Ÿˆ","๐Ÿฆ","๐Ÿฏ","๐Ÿด","๐Ÿฆ„","๐Ÿฆ“",
+    "๐ŸฆŒ","๐Ÿฎ","๐Ÿท","๐Ÿ—","๐Ÿ‘","๐Ÿฆ™","๐Ÿฆ’","๐Ÿ˜","๐Ÿญ","๐Ÿน","๐Ÿ‡","๐Ÿฟ","๐Ÿฆ”","๐Ÿจ","๐Ÿผ","๐Ÿฆฅ",
+    "๐Ÿฆจ","๐Ÿฆ˜","๐Ÿ“","๐Ÿฅ","๐Ÿฆ","๐Ÿง","๐Ÿ•Š","๐Ÿฆ†","๐Ÿฆข","๐Ÿฆ‰","๐Ÿฆค","๐Ÿฆฉ","๐Ÿฆš","๐Ÿฆœ","๐ŸŠ","๐Ÿข",
+    "๐ŸฆŽ","๐Ÿ","๐Ÿ‰","๐Ÿฆ•","๐Ÿฆ–","๐Ÿ‹","๐Ÿฌ","๐ŸŸ","๐Ÿ ","๐Ÿก","๐Ÿฆˆ","๐Ÿ™","๐Ÿš","๐ŸŒ","๐Ÿฆ‹","๐Ÿ›",
+    "๐Ÿ","๐Ÿž","๐Ÿ’","๐ŸŒธ","๐ŸŒน","๐ŸŒบ","๐ŸŒป","๐ŸŒผ","๐ŸŒท","๐ŸŒฑ","๐ŸŒฒ","๐ŸŒณ","๐ŸŒด","๐ŸŒต","๐ŸŒฟ","๐Ÿ",
+    "๐Ÿ‡","๐Ÿ‰","๐ŸŠ","๐Ÿ‹","๐ŸŒ","๐Ÿ","๐Ÿฅญ","๐Ÿ","๐Ÿ","๐Ÿ‘","๐Ÿ’","๐Ÿ“","๐Ÿฅ","๐Ÿ…","๐Ÿฅฅ","๐Ÿฅ‘",
+    "๐Ÿ†","๐Ÿฅ•","๐ŸŒฝ","๐ŸŒถ","๐Ÿฅฌ","๐Ÿฅฆ","๐Ÿง…","๐Ÿ„","๐Ÿฅœ","๐Ÿฅ","๐Ÿฅ–","๐Ÿฅจ","๐Ÿฅž","๐Ÿง‡","๐Ÿ”","๐Ÿ•",
+    "๐ŸŒญ","๐ŸŒฎ","๐ŸŒฏ","๐Ÿฅš","๐Ÿฟ","๐Ÿ™","๐ŸฅŸ","๐Ÿฆ€","๐Ÿฆž","๐Ÿฆ‘","๐Ÿฆ","๐Ÿฉ","๐Ÿง","๐Ÿฌ","๐Ÿญ","๐Ÿงƒ",
+    "๐Ÿง‰","๐Ÿงญ","โ›ฐ","๐ŸŒ‹","๐Ÿ","๐Ÿก","โ›ฒ","โ›บ","๐ŸŽ ","๐ŸŽก","๐Ÿ’ˆ","๐Ÿš‚","๐Ÿšƒ","๐ŸšŒ","๐Ÿš—","๐Ÿšš",
+    "๐Ÿšœ","๐Ÿ›ต","๐Ÿ›บ","๐Ÿšฒ","๐Ÿ›ด","๐Ÿ›น","โš“๏ธ","โ›ต","๐Ÿ›ถ","๐Ÿšค","๐Ÿšข","โœˆ๏ธ","๐Ÿช‚","๐Ÿš","๐Ÿš ","๐Ÿ›ฐ",
+    "๐Ÿš€","๐Ÿ›ธ","โณ","๐ŸŒ™","๐ŸŒก","โ˜€๏ธ","๐Ÿช","โญ","โ˜๏ธ","๐ŸŒง","๐ŸŒฉ","๐ŸŒ€","๐ŸŒˆ","โ˜‚๏ธ","โ„๏ธ","โ˜„๏ธ",
+    "๐Ÿ”ฅ","๐Ÿ’ง","๐ŸŒŠ","๐ŸŽƒ","โœจ","๐ŸŽˆ","๐ŸŽ‰","๐ŸŽŠ","๐ŸŽ","๐ŸŽŸ","๐Ÿ†","โšฝ","๐Ÿ€","๐Ÿˆ","๐ŸŽพ","๐Ÿฅ",
+    "๐Ÿ“","โ›ธ","๐Ÿช€","๐Ÿช","๐ŸŽฑ","๐Ÿ”ฎ","๐Ÿช„","๐Ÿ•น","๐ŸŽฒ","๐Ÿงฉ","๐Ÿงธ","๐ŸŽจ","๐Ÿงต","๐Ÿงถ","๐Ÿ•ถ","๐Ÿงฆ",
+    "๐ŸŽ’","๐Ÿ‘Ÿ","๐Ÿ‘ ","๐Ÿ‘‘","๐ŸŽ“","๐Ÿงข","๐Ÿ’","๐Ÿ’Ž","๐Ÿ“ข","๐ŸŽต","๐ŸŽ™","๐ŸŽค","๐ŸŽง","๐Ÿ“ป","๐ŸŽท","๐Ÿช—",
+    "๐ŸŽธ","๐ŸŽบ","๐ŸŽป","๐Ÿช•","๐Ÿฅ","โ˜Ž๏ธ","๐Ÿ’ฟ","๐ŸŽฅ","๐ŸŽฌ","๐Ÿ“บ","๐Ÿ“ท","๐Ÿ”","๐Ÿ’ก","๐Ÿ”ฆ","๐Ÿ“–","๐Ÿ“š",
+    "๐Ÿท","โœ๏ธ","๐Ÿ–Œ","๐Ÿ–","๐Ÿ“Ž","๐Ÿ“Œ","๐Ÿ”‘","๐Ÿชƒ","๐Ÿน","โš™๏ธ","๐Ÿงฒ","๐Ÿงช","๐Ÿงฌ","๐Ÿ”ญ","๐Ÿ“ก","๐Ÿ—ฟ",
   ];
 
+
   // FNV-1a implementation that is compatible with other languages
   const prime = 0x01000193;
   const offset = 0x811c9dc5;
   let hash = offset;
   const encoder = new TextEncoder();
-  for (const charCode of encoder.encode(bridgeString)) {
-    hash = Math.imul(hash ^ charCode, prime);
+  for (const byte of encoder.encode(bridgeString)) {
+    hash = Math.imul(hash ^ byte, prime);
   }
 
   const hashBytes = [
diff --git a/browser/components/torpreferences/content/connectionPane.xhtml b/browser/components/torpreferences/content/connectionPane.xhtml
index 67f98685d8038..39a9c184502f0 100644
--- a/browser/components/torpreferences/content/connectionPane.xhtml
+++ b/browser/components/torpreferences/content/connectionPane.xhtml
@@ -93,6 +93,9 @@
     <html:span id="torPreferences-currentBridges-headerText"/>
     <html:input type="checkbox" id="torPreferences-currentBridges-switch" class="toggle-button"/>
   </html:h2>
+  <description flex="1">
+    <html:span id="torPreferences-currentBridges-description"/>
+  </description>
   <menupopup id="torPreferences-bridgeCard-menu"/>
   <vbox id="torPreferences-bridgeCard-template" class="torPreferences-bridgeCard">
     <hbox class="torPreferences-bridgeCard-heading">
@@ -174,4 +177,18 @@
     </hbox>
   </box>
 </groupbox>
+
+<html:div id="bridge-remove-overlay" class="hidden">
+  <html:div id="bridge-remove-modal">
+    <html:img id="bridge-remove-dismiss" src="chrome://global/skin/icons/close.svg"/>
+    <html:div id="bridge-remove-icon"/>
+    <html:p id="bridge-remove-question"/>
+    <html:p id="bridge-remove-warning"/>
+    <html:div id="bridge-remove-buttonbar">
+    <button id="bridge-remove-cancel"/>
+    <button id="bridge-remove-confirm"/>
+    </html:div>
+  </html:div>
+</html:div>
+
 </html:template>
diff --git a/browser/components/torpreferences/content/torPreferences.css b/browser/components/torpreferences/content/torPreferences.css
index 31b6e29d679f3..2ab29bcd60faa 100644
--- a/browser/components/torpreferences/content/torPreferences.css
+++ b/browser/components/torpreferences/content/torPreferences.css
@@ -176,6 +176,11 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
   width: 280px;
 }
 
+#torPreferences-bridges-location menuitem[disabled="true"] {
+  color: var(--in-content-button-text-color, inherit);
+  font-weight: 700;
+}
+
 /* Bridge cards */
 :root {
   --bridgeCard-animation-time: 0.25s;
@@ -188,7 +193,7 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
 }
 
 #torPreferences-currentBridges-cards.list-collapsed {
-  mask-image: linear-gradient(rgb(0, 0, 0), rgba(0, 0, 0, 0.1));
+  mask-image: linear-gradient(rgb(0, 0, 0) 0% 75%, rgba(0, 0, 0, 0.1));
 }
 
 #torPreferences-currentBridges-cards.disabled {
@@ -200,9 +205,12 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
   /* define border-radius here because of the transition */
   border-radius: 4px;
   transition: margin var(--bridgeCard-animation-time), box-shadow 150ms;
+  cursor: pointer;
 }
 
-.torPreferences-bridgeCard.expanded {
+.torPreferences-bridgeCard.expanded,
+.torPreferences-bridgeCard.currently-connected,
+.single-card .torPreferences-bridgeCard {
   margin: 12px 0;
   background: var(--in-content-box-background);
   box-shadow: var(--card-shadow);
@@ -211,7 +219,11 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
 .torPreferences-bridgeCard:hover {
   background: var(--in-content-box-background);
   box-shadow: var(--card-shadow-hover);
-  cursor: pointer;
+}
+
+.single-card .torPreferences-bridgeCard,
+.torPreferences-bridgeCard.currently-connected {
+  cursor: default;
 }
 
 .torPreferences-bridgeCard-heading {
@@ -228,7 +240,7 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
   padding: 4px;
   font-size: 20px;
   border-radius: 4px;
-  background: var(--in-content-button-background-hover);
+  background: var(--in-content-box-background-odd);
 }
 
 .torPreferences-bridgeCard-headingAddr {
@@ -237,12 +249,15 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
   width: 20px;
   flex: 1;
   margin: 0 8px;
-  white-space: nowrap;
   overflow: hidden;
+  color: var(--in-content-deemphasized-text);
+  white-space: nowrap;
   text-overflow: ellipsis;
 }
 
-.expanded .torPreferences-bridgeCard-headingAddr {
+.expanded .torPreferences-bridgeCard-headingAddr,
+.currently-connected .torPreferences-bridgeCard-headingAddr,
+.single-card .torPreferences-bridgeCard-headingAddr {
   display: none;
 }
 
@@ -354,10 +369,17 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
   visibility: hidden;
 }
 
-.expanded .torPreferences-bridgeCard-grid {
+.expanded .torPreferences-bridgeCard-grid,
+.currently-connected .torPreferences-bridgeCard-grid,
+.single-card .torPreferences-bridgeCard-grid {
   visibility: visible;
 }
 
+.currently-connected .torPreferences-bridgeCard-grid,
+.single-card .torPreferences-bridgeCard-grid {
+  height: auto;
+}
+
 .torPreferences-bridgeCard-grid.to-animate {
   transition: height var(--bridgeCard-animation-time) ease-out, visibility var(--bridgeCard-animation-time);
   overflow: hidden;
@@ -375,8 +397,9 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
   margin: 8px 0;
 }
 
-.torPreferences-bridgeCard-addr {
+input.torPreferences-bridgeCard-addr {
   width: 100%;
+  color: var(--in-content-deemphasized-text);
 }
 
 .torPreferences-bridgeCard-leranMoreBox {
@@ -539,3 +562,94 @@ textarea#torPreferences-torDialog-textarea {
   /* 10 lines */
   min-height: 20em;
 }
+
+/* Bridge remove overlay */
+#bridge-remove-overlay {
+  position: fixed;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  top: 0;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+
+#bridge-remove-overlay.hidden {
+  display: none;
+}
+
+#bridge-remove-modal {
+  position: relative;
+  min-width: 250px;
+  max-width: 500px;
+  min-height: 200px;
+  z-index: 2;
+  text-align: center;
+  background: var(--in-content-page-background);
+  box-shadow: var(--shadow-30);
+}
+
+#bridge-remove-dismiss {
+  position: absolute;
+  top: 16px;
+  inset-inline-end: 16px;
+  width: 16px;
+  height: 16px;
+  fill: currentColor;
+  -moz-context-properties: fill;
+}
+
+#bridge-remove-dismiss:hover {
+  background-color: var(--in-content-button-background-hover);
+  color: var(--in-content-button-text-color-hover);
+  border: 1px solid var(--in-content-button-border-color-hover);
+  border-radius: 4px;
+}
+
+#bridge-remove-dismiss:hover:active {
+  background-color: var(--in-content-button-background-active);
+}
+
+#bridge-remove-icon {
+  width: 40px;
+  height: 40px;
+  background-image: url("chrome://global/skin/icons/warning.svg");
+  background-size: 40px;
+  margin: 16px auto;
+  fill: currentColor;
+  -moz-context-properties: fill;
+}
+
+#bridge-remove-question {
+  font-size: 150%;
+}
+
+#bridge-remove-warning {
+  color: var(--in-content-deemphasized-text);
+}
+
+#bridge-remove-buttonbar {
+  padding: 16px 32px;
+}
+
+#bridge-remove-buttonbar button {
+  min-width: 140px;
+}
+
+#bridge-remove-confirm {
+  background: var(--in-content-danger-button-background);
+  color: var(--in-content-primary-button-text-color);
+}
+
+#bridge-remove-confirm:hover {
+  background: var(--in-content-danger-button-background-hover);
+  color: var(--in-content-primary-button-text-color-hover);
+  border-color: var(--in-content-primary-button-border-hover);
+}
+
+#bridge-remove-confirm:hover:active {
+  background: var(--in-content-danger-button-background-active);
+}

-- 
To stop receiving notification emails like this one, please contact
the administrator of this repository.


More information about the tor-commits mailing list