fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in...

fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in about:preferences#connection

bug 41085: move remove all bridges button and modernize dialoge to proton

browser/components/torpreferences/content/connectionPane.js

@@ -117,9 +117,9 @@ const gConnectionPane = (function() {
       locationEntries: "#torPreferences-bridges-locationEntries",
       chooseForMe: "#torPreferences-bridges-buttonChooseBridgeForMe",
       currentHeader: "#torPreferences-currentBridges-header",
-      currentHeaderText: "#torPreferences-currentBridges-headerText",
       currentDescription: "#torPreferences-currentBridges-description",
       currentDescriptionText: "#torPreferences-currentBridges-descriptionText",
+      switchLabel: "#torPreferences-currentBridges-enableAll-label",
       switch: "#torPreferences-currentBridges-switch",
       cards: "#torPreferences-currentBridges-cards",
       cardTemplate: "#torPreferences-bridgeCard-template",
@@ -426,10 +426,9 @@ const gConnectionPane = (function() {
       const bridgeHeader = prefpane.querySelector(
         selectors.bridges.currentHeader
       );
-      bridgeHeader.querySelector(
-        selectors.bridges.currentHeaderText
-      ).textContent = TorStrings.settings.bridgeCurrent;
-      const bridgeSwitch = bridgeHeader.querySelector(selectors.bridges.switch);
+      bridgeHeader.textContent = TorStrings.settings.bridgeCurrent;
+      prefpane.querySelector(selectors.bridges.switchLabel).textContent = TorStrings.settings.allBridgesEnabled;
+      const bridgeSwitch = prefpane.querySelector(selectors.bridges.switch);
       bridgeSwitch.addEventListener("change", () => {
         TorSettings.bridges.enabled = bridgeSwitch.checked;
         TorSettings.saveToPrefs();
@@ -860,35 +859,32 @@ const gConnectionPane = (function() {
       }
 
       {
-        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
+          const aParentWindow = Services.wm.getMostRecentWindow("navigator:browser");
+
+          const ps = Services.prompt;
+          const btnFlags =
+            ps.BUTTON_POS_0 * ps.BUTTON_TITLE_IS_STRING +
+            ps.BUTTON_POS_0_DEFAULT +
+            ps.BUTTON_POS_1 * ps.BUTTON_TITLE_CANCEL;
+
+          const notUsed = { value: false };
+          const btnIndex = ps.confirmEx(
+            aParentWindow,
+            TorStrings.settings.bridgeRemoveAllDialogTitle,
+            TorStrings.settings.bridgeRemoveAllDialogDescription,
+            btnFlags,
+            TorStrings.settings.remove,
+            null,
+            null,
+            null,
+            notUsed
           );
-        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", () => {
+
+          if (btnIndex === 0) {
             this.onRemoveAllBridges();
-          closeDialog();
-        });
-        const cancel = prefpane.querySelector(selectors.bridges.removeCancel);
-        cancel.setAttribute("label", TorStrings.settings.cancel);
-        cancel.addEventListener("command", closeDialog);
+          }
+        };
       }
 
       // Advanced setup

browser/components/torpreferences/content/connectionPane.xhtml

@@ -91,12 +91,17 @@
     <button id="torPreferences-bridges-buttonChooseBridgeForMe" class="primary"/>
   </hbox>
   <html:h2 id="torPreferences-currentBridges-header">
-    <html:span id="torPreferences-currentBridges-headerText"/>
-    <html:input type="checkbox" id="torPreferences-currentBridges-switch" class="toggle-button"/>
   </html:h2>
   <description flex="1" id="torPreferences-currentBridges-description">
     <html:span id="torPreferences-currentBridges-descriptionText"/>
   </description>
+  <hbox align="center">
+    <html:input type="checkbox" id="torPreferences-currentBridges-switch" class="toggle-button"/>
+    <html:label id="torPreferences-currentBridges-enableAll-label" for="torPreferences-currentBridges-switch">
+    </html:label>
+    <spacer flex="1"/>
+    <button id="torPreferences-currentBridges-removeAll"/>
+  </hbox>
   <menupopup id="torPreferences-bridgeCard-menu"/>
   <vbox id="torPreferences-bridgeCard-template" class="torPreferences-bridgeCard">
     <hbox class="torPreferences-bridgeCard-heading">
@@ -133,7 +138,6 @@
   <vbox id="torPreferences-currentBridges-cards"></vbox>
   <vbox align="center">
     <button id="torPreferences-currentBridges-showAll"/>
-    <button id="torPreferences-currentBridges-removeAll" class="primary danger-button"/>
   </vbox>
   <html:h2 id="torPreferences-addBridge-header"></html:h2>
   <hbox align="center">
@@ -176,17 +180,4 @@
   </hbox>
 </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>

browser/components/torpreferences/content/torPreferences.css

@@ -187,6 +187,12 @@ html:dir(rtl) input[type="checkbox"].toggle-button::before {
   font-weight: 700;
 }
 
+#torPreferences-currentBridges-enableAll-label {
+  /* Block display to work with parent's xul box layout. */
+  display: block;
+  margin-inline: 6px;
+}
+
 /* Bridge cards */
 :root {
   --bridgeCard-animation-time: 0.25s;