| ... |
... |
@@ -659,8 +659,11 @@ const gConnectionPane = (function() { |
|
659
|
659
|
const showAll = prefpane.querySelector(selectors.bridges.showAll);
|
|
660
|
660
|
showAll.setAttribute("label", TorStrings.settings.bridgeShowAll);
|
|
661
|
661
|
showAll.addEventListener("command", () => {
|
|
662
|
|
- this._currentBridgesExpanded = true;
|
|
|
662
|
+ this._currentBridgesExpanded = !this._currentBridgesExpanded;
|
|
663
|
663
|
this._populateBridgeCards();
|
|
|
664
|
+ if (!this._currentBridgesExpanded) {
|
|
|
665
|
+ bridgeSwitch.scrollIntoView({ behavior: "smooth" });
|
|
|
666
|
+ }
|
|
664
|
667
|
});
|
|
665
|
668
|
const removeAll = prefpane.querySelector(selectors.bridges.removeAll);
|
|
666
|
669
|
removeAll.setAttribute("label", TorStrings.settings.bridgeRemoveAll);
|
| ... |
... |
@@ -673,17 +676,17 @@ const gConnectionPane = (function() { |
|
673
|
676
|
const newStrings = new Set(TorSettings.bridges.bridge_strings);
|
|
674
|
677
|
const numBridges = newStrings.size;
|
|
675
|
678
|
if (!newStrings.size) {
|
|
676
|
|
- bridgeHeader.setAttribute("hidden", "true");
|
|
677
|
|
- bridgeDescription.setAttribute("hidden", "true");
|
|
678
|
|
- bridgeCards.setAttribute("hidden", "true");
|
|
679
|
|
- showAll.setAttribute("hidden", "true");
|
|
680
|
|
- removeAll.setAttribute("hidden", "true");
|
|
|
679
|
+ bridgeHeader.hidden = true;
|
|
|
680
|
+ bridgeDescription.hidden = true;
|
|
|
681
|
+ bridgeCards.hidden = true;
|
|
|
682
|
+ showAll.hidden = true;
|
|
|
683
|
+ removeAll.hidden = true;
|
|
681
|
684
|
bridgeCards.textContent = "";
|
|
682
|
685
|
return;
|
|
683
|
686
|
}
|
|
684
|
|
- bridgeHeader.removeAttribute("hidden");
|
|
685
|
|
- bridgeDescription.removeAttribute("hidden");
|
|
686
|
|
- bridgeCards.removeAttribute("hidden");
|
|
|
687
|
+ bridgeHeader.hidden = false;
|
|
|
688
|
+ bridgeDescription.hidden = false;
|
|
|
689
|
+ bridgeCards.hidden = false;
|
|
687
|
690
|
bridgeSwitch.checked = TorSettings.bridges.enabled;
|
|
688
|
691
|
bridgeCards.classList.toggle("disabled", !TorSettings.bridges.enabled);
|
|
689
|
692
|
bridgeCards.classList.toggle("single-card", numBridges === 1);
|
| ... |
... |
@@ -729,22 +732,32 @@ const gConnectionPane = (function() { |
|
729
|
732
|
}
|
|
730
|
733
|
|
|
731
|
734
|
// And finally update the buttons
|
|
732
|
|
- if (numBridges > collapseThreshold && !this._currentBridgesExpanded) {
|
|
733
|
|
- showAll.removeAttribute("hidden");
|
|
734
|
|
- if (TorSettings.bridges.enabled) {
|
|
735
|
|
- showAll.classList.add("primary");
|
|
736
|
|
- } else {
|
|
737
|
|
- showAll.classList.remove("primary");
|
|
738
|
|
- }
|
|
739
|
|
- removeAll.setAttribute("hidden", "true");
|
|
740
|
|
- if (TorSettings.bridges.enabled) {
|
|
741
|
|
- // We do not want both collapsed and disabled at the same time,
|
|
742
|
|
- // because we use collapsed only to display a gradient on the list.
|
|
743
|
|
- bridgeCards.classList.add("list-collapsed");
|
|
744
|
|
- }
|
|
|
735
|
+ removeAll.hidden = false;
|
|
|
736
|
+ showAll.classList.toggle("primary", TorSettings.bridges.enabled);
|
|
|
737
|
+ if (numBridges > collapseThreshold) {
|
|
|
738
|
+ showAll.hidden = false;
|
|
|
739
|
+ showAll.setAttribute(
|
|
|
740
|
+ "aria-expanded",
|
|
|
741
|
+ // Boolean value gets converted to string "true" or "false".
|
|
|
742
|
+ this._currentBridgesExpanded
|
|
|
743
|
+ );
|
|
|
744
|
+ showAll.setAttribute(
|
|
|
745
|
+ "label",
|
|
|
746
|
+ this._currentBridgesExpanded
|
|
|
747
|
+ ? TorStrings.settings.bridgeShowFewer
|
|
|
748
|
+ : TorStrings.settings.bridgeShowAll
|
|
|
749
|
+ );
|
|
|
750
|
+ // We do not want both collapsed and disabled at the same time,
|
|
|
751
|
+ // because we use collapsed only to display a gradient on the list.
|
|
|
752
|
+ bridgeCards.classList.toggle(
|
|
|
753
|
+ "list-collapsed",
|
|
|
754
|
+ !this._currentBridgesExpanded && TorSettings.bridges.enabled
|
|
|
755
|
+ );
|
|
745
|
756
|
} else {
|
|
746
|
|
- showAll.setAttribute("hidden", "true");
|
|
747
|
|
- removeAll.removeAttribute("hidden");
|
|
|
757
|
+ // NOTE: We do not expect the showAll button to have focus when we
|
|
|
758
|
+ // hide it since we do not expect `numBridges` to decrease whilst
|
|
|
759
|
+ // this button is focused.
|
|
|
760
|
+ showAll.hidden = true;
|
|
748
|
761
|
bridgeCards.classList.remove("list-collapsed");
|
|
749
|
762
|
}
|
|
750
|
763
|
};
|