tbb-commits January 2024

tbb-commits@lists.torproject.org

1 participants
128 discussions

[Git][tpo/applications/firefox-android][firefox-android-115.2.1-13.5-1] fixup! Add Tor integration and UI
by Dan Ballard (＠dan) 31 Jan '24

31 Jan '24

Dan Ballard pushed to branch firefox-android-115.2.1-13.5-1 at The Tor Project / Applications / firefox-android Commits: 87e8fea1 by clairehurst at 2024-01-31T16:12:55-07:00 fixup! Add Tor integration and UI - - - - - 10 changed files: - fenix/app/src/main/java/org/mozilla/fenix/HomeActivity.kt - fenix/app/src/main/java/org/mozilla/fenix/IntentReceiverActivity.kt - fenix/app/src/main/java/org/mozilla/fenix/components/TorBrowserFeatures.kt - fenix/app/src/main/java/org/mozilla/fenix/settings/TorNetworkSettingsFragment.kt - fenix/app/src/main/java/org/mozilla/fenix/tor/TorBootstrapStatus.kt - fenix/app/src/main/java/org/mozilla/fenix/tor/TorController.kt - fenix/app/src/main/java/org/mozilla/fenix/tor/TorControllerGV.kt - fenix/app/src/main/java/org/mozilla/fenix/tor/TorControllerTAS.kt - fenix/app/src/main/java/org/mozilla/fenix/tor/view/TorBootstrapConnectViewHolder.kt - fenix/app/src/main/java/org/mozilla/fenix/tor/view/TorBootstrapLoggerViewHolder.kt Changes: ===================================== fenix/app/src/main/java/org/mozilla/fenix/HomeActivity.kt ===================================== @@ -685,7 +685,7 @@ open class HomeActivity : LocaleAwareAppCompatActivity(), NavHostActivity, TorIn } override fun onTorConnecting() { /* no-op */ } override fun onTorStopped() { /* no-op */ } - override fun onTorStatusUpdate(entry: String?, status: String?) { /* no-op */ } + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { /* no-op */ } }) return } ===================================== fenix/app/src/main/java/org/mozilla/fenix/IntentReceiverActivity.kt ===================================== @@ -59,7 +59,7 @@ class IntentReceiverActivity : Activity() { } override fun onTorConnecting() { /* no-op */ } override fun onTorStopped() { /* no-op */ } - override fun onTorStatusUpdate(entry: String?, status: String?) { /* no-op */ } + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { /* no-op */ } }) // In the meantime, open the HomeActivity so the user can get connected. ===================================== fenix/app/src/main/java/org/mozilla/fenix/components/TorBrowserFeatures.kt ===================================== @@ -164,7 +164,7 @@ object TorBrowserFeatures { } @SuppressWarnings("EmptyFunctionBlock") - override fun onTorStatusUpdate(entry: String?, status: String?) { + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { } }) } ===================================== fenix/app/src/main/java/org/mozilla/fenix/settings/TorNetworkSettingsFragment.kt ===================================== @@ -166,7 +166,7 @@ class TorNetworkSettingsFragment : PreferenceFragmentCompat(), TorEvents { override fun onTorStopped() { } - override fun onTorStatusUpdate(entry: String?, status: String?) { + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { setStatus() } } ===================================== fenix/app/src/main/java/org/mozilla/fenix/tor/TorBootstrapStatus.kt ===================================== @@ -34,7 +34,7 @@ class TorBootstrapStatus( } @SuppressWarnings("EmptyFunctionBlock") - override fun onTorStatusUpdate(entry: String?, status: String?) { + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { } fun unregisterTorListener() { ===================================== fenix/app/src/main/java/org/mozilla/fenix/tor/TorController.kt ===================================== @@ -9,7 +9,7 @@ import androidx.lifecycle.LifecycleCoroutineScope interface TorEvents { fun onTorConnecting() fun onTorConnected() - fun onTorStatusUpdate(entry: String?, status: String?) + fun onTorStatusUpdate(entry: String?, status: String?, progress: Double? = 0.0) fun onTorStopped() } @@ -55,7 +55,7 @@ interface TorController: TorEvents { override fun onTorConnecting() override fun onTorConnected() - override fun onTorStatusUpdate(entry: String?, status: String?) + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) override fun onTorStopped() fun registerTorListener(l: TorEvents) ===================================== fenix/app/src/main/java/org/mozilla/fenix/tor/TorControllerGV.kt ===================================== @@ -155,9 +155,9 @@ class TorControllerGV( } // TorEvents - override fun onTorStatusUpdate(entry: String?, status: String?) { + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { synchronized(torListeners) { - torListeners.toList().forEach { it.onTorStatusUpdate(entry, status) } + torListeners.toList().forEach { it.onTorStatusUpdate(entry, status, progress) } } } @@ -221,7 +221,7 @@ class TorControllerGV( // and state for firefox-android (designed for tor-android-service) // fun onTorConnecting() // fun onTorConnected() - // fun onTorStatusUpdate(entry: String?, status: String?) + // fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) // fun onTorStopped() // TorEventsBootstrapStateChangeListener @@ -268,7 +268,7 @@ class TorControllerGV( } entries.add(Pair(status, lastKnownStatus.toTorStatus().status)) - onTorStatusUpdate(status, lastKnownStatus.toTorStatus().status) + onTorStatusUpdate(status, lastKnownStatus.toTorStatus().status, progress) } // TorEventsBootstrapStateChangeListener ===================================== fenix/app/src/main/java/org/mozilla/fenix/tor/TorControllerTAS.kt ===================================== @@ -170,7 +170,7 @@ class TorControllerTAS (private val context: Context): TorController { handlePendingRegistrationChanges() } - override fun onTorStatusUpdate(entry: String?, status: String?) { + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { lockTorListenersMutation = true torListeners.forEach { it.onTorStatusUpdate(entry, status) } lockTorListenersMutation = false ===================================== fenix/app/src/main/java/org/mozilla/fenix/tor/view/TorBootstrapConnectViewHolder.kt ===================================== @@ -92,7 +92,7 @@ class TorBootstrapConnectViewHolder( override fun onTorStopped() { } - override fun onTorStatusUpdate(entry: String?, status: String?) { + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { if (entry == null) return binding.torBootstrapStatusMessage.text = entry @@ -103,7 +103,7 @@ class TorBootstrapConnectViewHolder( percentIdx ) with(binding.torBootstrapProgress) { - progress = percent.toInt() + this.progress = percent.toInt() } } } ===================================== fenix/app/src/main/java/org/mozilla/fenix/tor/view/TorBootstrapLoggerViewHolder.kt ===================================== @@ -55,7 +55,7 @@ class TorBootstrapLoggerViewHolder( override fun onTorStopped() { } - override fun onTorStatusUpdate(entry: String?, status: String?) { + override fun onTorStatusUpdate(entry: String?, status: String?, progress: Double?) { if (status == null || entry == null) return if (status == "ON" && entry.startsWith("Circuit")) return View it on GitLab: https://gitlab.torproject.org/tpo/applications/firefox-android/-/commit/87e… -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/firefox-android/-/commit/87e… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/firefox-android][firefox-android-115.2.1-13.5-1] fixup! Add Tor integration and UI
by Dan Ballard (＠dan) 31 Jan '24

31 Jan '24

Dan Ballard pushed to branch firefox-android-115.2.1-13.5-1 at The Tor Project / Applications / firefox-android Commits: 54d46f59 by Dan Ballard at 2024-01-31T12:42:11-08:00 fixup! Add Tor integration and UI Bug 42252: Fix safely using iterators while possibly modifying List - - - - - 1 changed file: - fenix/app/src/main/java/org/mozilla/fenix/tor/TorControllerGV.kt Changes: ===================================== fenix/app/src/main/java/org/mozilla/fenix/tor/TorControllerGV.kt ===================================== @@ -143,28 +143,28 @@ class TorControllerGV( // TorEvents override fun onTorConnecting() { synchronized(torListeners) { - torListeners.forEach { it.onTorConnecting() } + torListeners.toList().forEach { it.onTorConnecting() } } } // TorEvents override fun onTorConnected() { synchronized(torListeners) { - torListeners.forEach { it.onTorConnected() } + torListeners.toList().forEach { it.onTorConnected() } } } // TorEvents override fun onTorStatusUpdate(entry: String?, status: String?) { synchronized(torListeners) { - torListeners.forEach { it.onTorStatusUpdate(entry, status) } + torListeners.toList().forEach { it.onTorStatusUpdate(entry, status) } } } // TorEvents override fun onTorStopped() { synchronized(torListeners) { - torListeners.forEach { it.onTorStopped() } + torListeners.toList().forEach { it.onTorStopped() } } } View it on GitLab: https://gitlab.torproject.org/tpo/applications/firefox-android/-/commit/54d… -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/firefox-android/-/commit/54d… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/tor-browser-build] Pushed new tag tbb-13.5a4-build1
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed new tag tbb-13.5a4-build1 at The Tor Project / Applications / tor-browser-build -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser-build/-/tree/tbb… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/tor-browser-build][main] Bug 41051: Update changelogs for Tor Browser 13.5a4
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed to branch main at The Tor Project / Applications / tor-browser-build Commits: b87a696a by Richard Pospesel at 2024-01-31T12:10:10+00:00 Bug 41051: Update changelogs for Tor Browser 13.5a4 - - - - - 1 changed file: - projects/browser/Bundle-Data/Docs-TBB/ChangeLog.txt Changes: ===================================== projects/browser/Bundle-Data/Docs-TBB/ChangeLog.txt ===================================== @@ -1,4 +1,4 @@ -Tor Browser 13.5a4 - January 29 2024 +Tor Browser 13.5a4 - January 31 2024 * All Platforms * Updated zlib to 1.3.1 * Updated Snowflake to 2.8.1 @@ -13,10 +13,15 @@ Tor Browser 13.5a4 - January 29 2024 * Bug 42374: spoof english leaks via numberingSystem: numbers (non-latn) or decimal separator (latn) [tor-browser] * Bug 42384: Regression: quickstart doesn't work anymore [tor-browser] * Bug 41058: Update Snowflake to 2.8.1 [tor-browser-build] + * Bug 262: Mouse-over long links causes the browser element to re-center relative to width of status tooltip [mullvad-browser] * Windows + macOS + Linux * Updated Firefox to 115.7.0esr * Bug 41917: Make the appearance of letterboxing look more intentional [tor-browser] + * Bug 42036: Design and build a user interface for Lox [tor-browser] * Bug 42338: Changing circuit programmatically in Tor Browser not working anymore! [tor-browser] + * Bug 42387: Visual noise in 13.5a4 letterboxing [tor-browser] + * Linux + * Bug 42293: Updater is disabled when tor-browser is run by torbrowser-launcher flatpak [tor-browser] * Android * Updated GeckoView to 115.7.0esr * Bug 42252: Plumb down TorConnect commands from firefox-android to GeckoView [tor-browser] @@ -25,14 +30,15 @@ Tor Browser 13.5a4 - January 29 2024 * Bug 42355: Fullscreen on Android doesn't hide system bars [tor-browser] * Bug 42367: Backport Android security fixes from Firefox 122 [tor-browser] * Bug 42368: Tor Browser 13.5a3 crashes during start-up because of API26+ methods [tor-browser] - * Linux - * Bug 42293: Updater is disabled when tor-browser is run by torbrowser-launcher flatpak [tor-browser] * Build System * All Platforms * Updated Go to 1.20.13 and 1.21.6 * Bug 41037: Set time on signing machine before starting signing [tor-browser-build] + * Bug 41038: Add RPM dependencies to README [tor-browser-build] * Bug 41059: Update keyring/torbrowser.gpg with updated key [tor-browser-build] * Bug 41063: Run "file $keyring" in tools/keyring/list-all-keyrings [tor-browser-build] + * Bug 41067: Use Capture::Tiny instead of IO::CaptureOutput [tor-browser-build] + * Bug 41073: Update documention about required packages for container-less build [tor-browser-build] * Bug 40067: Use --no-verbose wget option when not running in a terminal [rbm] * Windows * Bug 40606: Use Clang to compile NSIS [tor-browser-build] View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser-build/-/commit/b… -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser-build/-/commit/b… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/firefox-android] Pushed new tag firefox-android-115.2.1-13.5-1-build5
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed new tag firefox-android-115.2.1-13.5-1-build5 at The Tor Project / Applications / firefox-android -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/firefox-android/-/tree/firef… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/tor-browser] Pushed new tag tor-browser-115.7.0esr-13.5-1-build2
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed new tag tor-browser-115.7.0esr-13.5-1-build2 at The Tor Project / Applications / Tor Browser -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/tree/tor-brows… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/mullvad-browser][mullvad-browser-115.7.0esr-13.5-1] fixup! Bug 32308: use direct browser sizing for letterboxing.
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed to branch mullvad-browser-115.7.0esr-13.5-1 at The Tor Project / Applications / Mullvad Browser Commits: f74a854e by hackademix at 2024-01-31T13:44:56+00:00 fixup! Bug 32308: use direct browser sizing for letterboxing. Bug 42387: hide visual artifacts and fix the status label on rounded letterboxing borders. - - - - - 3 changed files: - browser/base/content/browser.css - browser/base/content/tabbrowser.js - toolkit/components/resistfingerprinting/RFPHelper.sys.mjs Changes: ===================================== browser/base/content/browser.css ===================================== @@ -127,6 +127,11 @@ body { -moz-window-dragging: drag; } +/** + Never modify the following selector without synchronizing + LETTERBOX_CSS_SELECTOR in RFPHelper.sys.jsm, where + --letterboxing-width & --letterboxing-height are actually set. +**/ .letterboxing .browserContainer { /* From Firefox 115 on, .browserContainer layout is flex / column, @@ -137,6 +142,14 @@ body { background: var(--letterboxing-bgcolor); } +.browserDecorator { + display: none; + pointer-events: none; + background: transparent; + position: relative; + z-index: 1; +} + .letterboxing { --letterboxing-border-radius: 8px; --letterboxing-border-top-radius: 0; @@ -145,6 +158,7 @@ body { --letterboxing-bgcolor: var(--tabpanel-background-color); --letterboxing-gradient-color1: var(--letterboxing-bgcolor); --letterboxing-gradient-color2: color-mix(in srgb, var(--chrome-content-separator-color) 50%, var(--letterboxing-bgcolor)); + --letterboxing-border-color: var(--letterboxing-bgcolor); } .letterboxing.letterboxing-vcenter .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) { @@ -157,6 +171,26 @@ body { box-shadow: rgba(0, 0, 0, 0.5) 0px -1px 2px; } +:root:not([inDOMFullscreen]) .letterboxing .browserContainer:not(.responsive-mode) + > .browserStack:not(.exclude-letterboxing) + > .browserDecorator { + display: initial; + visibility: visible; + border-radius: var(--letterboxing-border-radius); + border-top-left-radius: var(--letterboxing-border-top-radius); + border-top-right-radius: var(--letterboxing-border-top-radius); + box-shadow: var(--letterboxing-border-color) 0px 0px .1px inset, var(--letterboxing-border-color) 0 0 .1px; + border: .1px solid var(--letterboxing-border-color); + outline: .1px solid var(--letterboxing-bgcolor); + height: calc(var(--letterboxing-height) + 1px); + top: -1px; +} + +.letterboxing-vcenter .browserDecorator { + height: auto !important; + top: 0 !important; +} + /* Align status bar with content. TODO: switch to nested CSS selectors for conciseness when available (Firefox >= 117) @@ -167,6 +201,7 @@ body { place-self: end left; left: 0; right: 0; + z-index: 2; --letterboxing-status-left-radius: var(--letterboxing-border-radius); --letterboxing-status-right-radius: 0; } @@ -184,23 +219,24 @@ body { .letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) #statuspanel-label { border-radius: 0 0 var(--letterboxing-status-right-radius) var(--letterboxing-status-left-radius); + margin: 0; + border: 1px solid var(--letterboxing-border-color); + max-width: calc(var(--letterboxing-width) * .5); } -/** - Never modify the following selector without synchronizing - LETTERBOX_CSS_SELECTOR in RFPHelper.jsm! -**/ .letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > browser { - /* width & height to be dynamically set by RFPHelper.jsm */ box-shadow: 0px 4px 8px 0px var(--letterboxing-shadow-color); border-radius: var(--letterboxing-border-radius); border-top-left-radius: var(--letterboxing-border-top-radius); border-top-right-radius: var(--letterboxing-border-top-radius); + width: var(--letterboxing-width) !important; + height: var(--letterboxing-height) !important; } :root:not([inDOMFullscreen]) .letterboxing.letterboxing-ready .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) { place-content: var(--letterboxing-vertical-alignment) center; + background: var(--letterboxing-bgcolor); } #toolbar-menubar[autohide="true"] { ===================================== browser/base/content/tabbrowser.js ===================================== @@ -2238,6 +2238,10 @@ stack.className = "browserStack"; stack.appendChild(b); + let decorator = document.createXULElement("hbox"); + decorator.className = "browserDecorator"; + stack.appendChild(decorator); + let browserContainer = document.createXULElement("vbox"); browserContainer.className = "browserContainer"; browserContainer.appendChild(notificationbox); ===================================== toolkit/components/resistfingerprinting/RFPHelper.sys.mjs ===================================== @@ -447,8 +447,7 @@ class _RFPHelper { // find the rule applying the default letterboxing styles to browsers // preemptively in order to beat race conditions on tab/window creation const LETTERBOX_CSS_URL = "chrome://browser/content/browser.css"; - const LETTERBOX_CSS_SELECTOR = - ".letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > browser"; + const LETTERBOX_CSS_SELECTOR = ".letterboxing .browserContainer"; for (let ss of document.styleSheets) { if (ss.href !== LETTERBOX_CSS_URL) { continue; @@ -572,8 +571,8 @@ class _RFPHelper { const r = (width, height) => { lastRoundedSize = {width, height}; return { - width: `var(--rdm-width, ${width}px)`, - height: `var(--rdm-height, ${height}px)`, + "--letterboxing-width": `var(--rdm-width, ${width}px)`, + "--letterboxing-height": `var(--rdm-height, ${height}px)`, } }; @@ -637,7 +636,7 @@ class _RFPHelper { for (let [name, value] of Object.entries(props)) { if (style[name] !== value) { this.push(() => { - style.setProperty(name, value, "important"); + style.setProperty(name, value); }); } } @@ -668,8 +667,11 @@ class _RFPHelper { ? // optional UI components such as the notification box, the find bar // or devtools are constraining this browser's size: recompute custom roundDimensions(parentWidth, parentHeight) - : { width: "", height: "" }; // otherwise we can keep the default (rounded) size - styleChanges.queueIfNeeded(aBrowser, roundedInline); + : { + "--letterboxing-width": "", + "--letterboxing-height": "", + }; // otherwise we can keep the default (rounded) size + styleChanges.queueIfNeeded(browserParent, roundedInline); if (lastRoundedSize) { // check wether the letterboxing margin is less than the border radius, and if so flatten the borders View it on GitLab: https://gitlab.torproject.org/tpo/applications/mullvad-browser/-/commit/f74… -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/mullvad-browser/-/commit/f74… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/tor-browser][tor-browser-115.7.0esr-13.5-1] fixup! Bug 32308: use direct browser sizing for letterboxing.
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed to branch tor-browser-115.7.0esr-13.5-1 at The Tor Project / Applications / Tor Browser Commits: 922c0f76 by hackademix at 2024-01-31T14:22:39+01:00 fixup! Bug 32308: use direct browser sizing for letterboxing. Bug 42387: hide visual artifacts and fix the status label on rounded letterboxing borders. - - - - - 3 changed files: - browser/base/content/browser.css - browser/base/content/tabbrowser.js - toolkit/components/resistfingerprinting/RFPHelper.sys.mjs Changes: ===================================== browser/base/content/browser.css ===================================== @@ -127,6 +127,11 @@ body { -moz-window-dragging: drag; } +/** + Never modify the following selector without synchronizing + LETTERBOX_CSS_SELECTOR in RFPHelper.sys.jsm, where + --letterboxing-width & --letterboxing-height are actually set. +**/ .letterboxing .browserContainer { /* From Firefox 115 on, .browserContainer layout is flex / column, @@ -137,6 +142,14 @@ body { background: var(--letterboxing-bgcolor); } +.browserDecorator { + display: none; + pointer-events: none; + background: transparent; + position: relative; + z-index: 1; +} + .letterboxing { --letterboxing-border-radius: 8px; --letterboxing-border-top-radius: 0; @@ -145,6 +158,7 @@ body { --letterboxing-bgcolor: var(--tabpanel-background-color); --letterboxing-gradient-color1: var(--letterboxing-bgcolor); --letterboxing-gradient-color2: color-mix(in srgb, var(--chrome-content-separator-color) 50%, var(--letterboxing-bgcolor)); + --letterboxing-border-color: var(--letterboxing-bgcolor); } .letterboxing.letterboxing-vcenter .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) { @@ -157,6 +171,26 @@ body { box-shadow: rgba(0, 0, 0, 0.5) 0px -1px 2px; } +:root:not([inDOMFullscreen]) .letterboxing .browserContainer:not(.responsive-mode) + > .browserStack:not(.exclude-letterboxing) + > .browserDecorator { + display: initial; + visibility: visible; + border-radius: var(--letterboxing-border-radius); + border-top-left-radius: var(--letterboxing-border-top-radius); + border-top-right-radius: var(--letterboxing-border-top-radius); + box-shadow: var(--letterboxing-border-color) 0px 0px .1px inset, var(--letterboxing-border-color) 0 0 .1px; + border: .1px solid var(--letterboxing-border-color); + outline: .1px solid var(--letterboxing-bgcolor); + height: calc(var(--letterboxing-height) + 1px); + top: -1px; +} + +.letterboxing-vcenter .browserDecorator { + height: auto !important; + top: 0 !important; +} + /* Align status bar with content. TODO: switch to nested CSS selectors for conciseness when available (Firefox >= 117) @@ -167,6 +201,7 @@ body { place-self: end left; left: 0; right: 0; + z-index: 2; --letterboxing-status-left-radius: var(--letterboxing-border-radius); --letterboxing-status-right-radius: 0; } @@ -184,23 +219,24 @@ body { .letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) #statuspanel-label { border-radius: 0 0 var(--letterboxing-status-right-radius) var(--letterboxing-status-left-radius); + margin: 0; + border: 1px solid var(--letterboxing-border-color); + max-width: calc(var(--letterboxing-width) * .5); } -/** - Never modify the following selector without synchronizing - LETTERBOX_CSS_SELECTOR in RFPHelper.jsm! -**/ .letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > browser { - /* width & height to be dynamically set by RFPHelper.jsm */ box-shadow: 0px 4px 8px 0px var(--letterboxing-shadow-color); border-radius: var(--letterboxing-border-radius); border-top-left-radius: var(--letterboxing-border-top-radius); border-top-right-radius: var(--letterboxing-border-top-radius); + width: var(--letterboxing-width) !important; + height: var(--letterboxing-height) !important; } :root:not([inDOMFullscreen]) .letterboxing.letterboxing-ready .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) { place-content: var(--letterboxing-vertical-alignment) center; + background: var(--letterboxing-bgcolor); } #toolbar-menubar[autohide="true"] { ===================================== browser/base/content/tabbrowser.js ===================================== @@ -2238,6 +2238,10 @@ stack.className = "browserStack"; stack.appendChild(b); + let decorator = document.createXULElement("hbox"); + decorator.className = "browserDecorator"; + stack.appendChild(decorator); + let browserContainer = document.createXULElement("vbox"); browserContainer.className = "browserContainer"; browserContainer.appendChild(notificationbox); ===================================== toolkit/components/resistfingerprinting/RFPHelper.sys.mjs ===================================== @@ -447,8 +447,7 @@ class _RFPHelper { // find the rule applying the default letterboxing styles to browsers // preemptively in order to beat race conditions on tab/window creation const LETTERBOX_CSS_URL = "chrome://browser/content/browser.css"; - const LETTERBOX_CSS_SELECTOR = - ".letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > browser"; + const LETTERBOX_CSS_SELECTOR = ".letterboxing .browserContainer"; for (let ss of document.styleSheets) { if (ss.href !== LETTERBOX_CSS_URL) { continue; @@ -572,8 +571,8 @@ class _RFPHelper { const r = (width, height) => { lastRoundedSize = {width, height}; return { - width: `var(--rdm-width, ${width}px)`, - height: `var(--rdm-height, ${height}px)`, + "--letterboxing-width": `var(--rdm-width, ${width}px)`, + "--letterboxing-height": `var(--rdm-height, ${height}px)`, } }; @@ -637,7 +636,7 @@ class _RFPHelper { for (let [name, value] of Object.entries(props)) { if (style[name] !== value) { this.push(() => { - style.setProperty(name, value, "important"); + style.setProperty(name, value); }); } } @@ -668,8 +667,11 @@ class _RFPHelper { ? // optional UI components such as the notification box, the find bar // or devtools are constraining this browser's size: recompute custom roundDimensions(parentWidth, parentHeight) - : { width: "", height: "" }; // otherwise we can keep the default (rounded) size - styleChanges.queueIfNeeded(aBrowser, roundedInline); + : { + "--letterboxing-width": "", + "--letterboxing-height": "", + }; // otherwise we can keep the default (rounded) size + styleChanges.queueIfNeeded(browserParent, roundedInline); if (lastRoundedSize) { // check wether the letterboxing margin is less than the border radius, and if so flatten the borders View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/commit/922c0f7… -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/commit/922c0f7… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/tor-browser][tor-browser-115.7.0esr-13.5-1] 2 commits: fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in...
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed to branch tor-browser-115.7.0esr-13.5-1 at The Tor Project / Applications / Tor Browser Commits: d66eecaa by Henry Wilkes at 2024-01-31T09:28:02+00:00 fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in about:preferences#connection Bug 42385: Add lox invite dialog. - - - - - 48110609 by Henry Wilkes at 2024-01-31T09:28:03+00:00 fixup! Tor Browser strings Bug 42385: Add lox invite dialog strings. - - - - - 6 changed files: - browser/components/torpreferences/content/connectionPane.js - + browser/components/torpreferences/content/loxInviteDialog.js - + browser/components/torpreferences/content/loxInviteDialog.xhtml - browser/components/torpreferences/content/torPreferences.css - browser/components/torpreferences/jar.mn - browser/locales/en-US/browser/tor-browser.ftl Changes: ===================================== browser/components/torpreferences/content/connectionPane.js ===================================== @@ -1321,7 +1321,17 @@ const gLoxStatus = { ); this._invitesButton.addEventListener("click", () => { - // TODO: Show invites. + gSubDialog.open( + "chrome://browser/content/torpreferences/loxInviteDialog.xhtml", + { + features: "resizable=yes", + closedCallback: () => { + // TODO: Listen for events from Lox, rather than call _updateInvites + // directly. + this._updateInvites(); + }, + } + ); }); this._unlockAlertButton.addEventListener("click", () => { // TODO: Have a way to ensure that the cleared event data matches the ===================================== browser/components/torpreferences/content/loxInviteDialog.js ===================================== @@ -0,0 +1,347 @@ +"use strict"; + +const { TorSettings, TorSettingsTopics, TorBridgeSource } = + ChromeUtils.importESModule("resource://gre/modules/TorSettings.sys.mjs"); + +const { Lox, LoxErrors } = ChromeUtils.importESModule( + "resource://gre/modules/Lox.sys.mjs" +); + +/** + * Fake Lox module + +const LoxErrors = { + LoxServerUnreachable: "LoxServerUnreachable", + Other: "Other", +}; + +const Lox = { + remainingInvites: 5, + getRemainingInviteCount() { + return this.remainingInvites; + }, + invites: [ + '{"invite": [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22]}', + '{"invite": [9,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22]}', + ], + getInvites() { + return this.invites; + }, + failError: null, + generateInvite() { + return new Promise((res, rej) => { + setTimeout(() => { + if (this.failError) { + rej({ type: this.failError }); + return; + } + if (!this.remainingInvites) { + rej({ type: LoxErrors.Other }); + return; + } + const invite = JSON.stringify({ + invite: Array.from({ length: 100 }, () => + Math.floor(Math.random() * 265) + ), + }); + this.invites.push(invite); + this.remainingInvites--; + res(invite); + }, 4000); + }); + }, +}; +*/ + +const gLoxInvites = { + /** + * Initialize the dialog. + */ + init() { + this._dialog = document.getElementById("lox-invite-dialog"); + this._remainingInvitesEl = document.getElementById( + "lox-invite-dialog-remaining" + ); + this._generateButton = document.getElementById( + "lox-invite-dialog-generate-button" + ); + this._connectingEl = document.getElementById( + "lox-invite-dialog-connecting" + ); + this._errorEl = document.getElementById("lox-invite-dialog-error-message"); + this._inviteListEl = document.getElementById("lox-invite-dialog-list"); + + this._generateButton.addEventListener("click", () => { + this._generateNewInvite(); + }); + + const menu = document.getElementById("lox-invite-dialog-item-menu"); + this._inviteListEl.addEventListener("contextmenu", event => { + if (!this._inviteListEl.selectedItem) { + return; + } + menu.openPopupAtScreen(event.screenX, event.screenY, true); + }); + menu.addEventListener("popuphidden", () => { + menu.setAttribute("aria-hidden", "true"); + }); + menu.addEventListener("popupshowing", () => { + menu.removeAttribute("aria-hidden"); + }); + document + .getElementById("lox-invite-dialog-copy-menu-item") + .addEventListener("command", () => { + const selected = this._inviteListEl.selectedItem; + if (!selected) { + return; + } + const clipboard = Cc[ + "@mozilla.org/widget/clipboardhelper;1" + ].getService(Ci.nsIClipboardHelper); + clipboard.copyString(selected.textContent); + }); + + // NOTE: TorSettings should already be initialized when this dialog is + // opened. + Services.obs.addObserver(this, TorSettingsTopics.SettingsChanged); + // TODO: Listen for new invites from Lox, when supported. + + // Set initial _loxId value. Can close this dialog. + this._updateLoxId(); + + this._updateRemainingInvites(); + this._updateExistingInvites(); + }, + + /** + * Un-initialize the dialog. + */ + uninit() { + Services.obs.removeObserver(this, TorSettingsTopics.SettingsChanged); + }, + + observe(subject, topic, data) { + switch (topic) { + case TorSettingsTopics.SettingsChanged: + const { changes } = subject.wrappedJSObject; + if ( + changes.includes("bridges.source") || + changes.includes("bridges.lox_id") + ) { + this._updateLoxId(); + } + break; + } + }, + + /** + * The loxId this dialog is shown for. null if uninitailized. + * + * @type {string?} + */ + _loxId: null, + /** + * Update the _loxId value. Will close the dialog if it changes after + * initialization. + */ + _updateLoxId() { + const loxId = + TorSettings.bridges.source === TorBridgeSource.Lox + ? TorSettings.bridges.lox_id + : ""; + if (!loxId || (this._loxId !== null && loxId !== this._loxId)) { + // No lox id, or it changed. Close this dialog. + this._dialog.cancelDialog(); + } + this._loxId = loxId; + }, + + /** + * The invites that are already shown. + * + * @type {Set<string>} + */ + _shownInvites: new Set(), + + /** + * Add a new invite at the start of the list. + * + * @param {string} invite - The invite to add. + */ + _addInvite(invite) { + if (this._shownInvites.has(invite)) { + return; + } + const newInvite = document.createXULElement("richlistitem"); + newInvite.classList.add("lox-invite-dialog-list-item"); + newInvite.textContent = invite; + + this._inviteListEl.prepend(newInvite); + this._shownInvites.add(invite); + }, + + /** + * Update the display of the existing invites. + */ + _updateExistingInvites() { + // Add new invites. + + // NOTE: we only expect invites to be appended, so we won't re-order any. + // NOTE: invites are ordered with the oldest first. + for (const invite of Lox.getInvites()) { + this._addInvite(invite); + } + }, + + /** + * The shown number or remaining invites we have. + * + * @type {integer} + */ + _remainingInvites: 0, + + /** + * Update the display of the remaining invites. + */ + _updateRemainingInvites() { + this._remainingInvites = Lox.getRemainingInviteCount(); + + document.l10n.setAttributes( + this._remainingInvitesEl, + "tor-bridges-lox-remaining-invites", + { numInvites: this._remainingInvites } + ); + this._updateGenerateButtonState(); + }, + + /** + * Whether we are currently generating an invite. + * + * @type {boolean} + */ + _generating: false, + /** + * Set whether we are generating an invite. + * + * @param {boolean} isGenerating - Whether we are generating. + */ + _setGenerating(isGenerating) { + this._generating = isGenerating; + this._updateGenerateButtonState(); + this._connectingEl.classList.toggle("show-connecting", isGenerating); + }, + + /** + * Update the state of the generate button. + */ + _updateGenerateButtonState() { + this._generateButton.disabled = this._generating || !this._remainingInvites; + }, + + /** + * Start generating a new invite. + */ + _generateNewInvite() { + if (this._generating) { + console.error("Already generating an invite"); + return; + } + this._setGenerating(true); + // Clear the previous error. + this._updateGenerateError(null); + // Move focus from the button to the connecting element, since button is + // now disabled. + this._connectingEl.focus(); + + let lostFocus = false; + Lox.generateInvite() + .finally(() => { + // Fetch whether the connecting label still has focus before we hide it. + lostFocus = this._connectingEl.contains(document.activeElement); + this._setGenerating(false); + }) + .then( + invite => { + this._addInvite(invite); + + if (!this._inviteListEl.contains(document.activeElement)) { + // Does not have focus, change the selected item to be the new + // invite (at index 0). + this._inviteListEl.selectedIndex = 0; + } + + if (lostFocus) { + // Move focus to the new invite before we hide the "Connecting" + // message. + this._inviteListEl.focus(); + } + + // TODO: When Lox sends out notifications, let the observer handle the + // change rather than calling _updateRemainingInvites directly. + this._updateRemainingInvites(); + }, + loxError => { + console.error("Failed to generate an invite", loxError); + switch (loxError.type) { + case LoxErrors.LoxServerUnreachable: + this._updateGenerateError("no-server"); + break; + default: + this._updateGenerateError("generic"); + break; + } + + if (lostFocus) { + // Move focus back to the button before we hide the "Connecting" + // message. + this._generateButton.focus(); + } + } + ); + }, + + /** + * Update the shown generation error. + * + * @param {string?} type - The error type, or null if no error should be + * shown. + */ + _updateGenerateError(type) { + // First clear the existing error. + this._errorEl.removeAttribute("data-l10n-id"); + this._errorEl.textContent = ""; + this._errorEl.classList.toggle("show-error", !!type); + + if (!type) { + return; + } + + let errorId; + switch (type) { + case "no-server": + errorId = "lox-invite-dialog-no-server-error"; + break; + case "generic": + // Generic error. + errorId = "lox-invite-dialog-generic-invite-error"; + break; + } + + document.l10n.setAttributes(this._errorEl, errorId); + }, +}; + +window.addEventListener( + "DOMContentLoaded", + () => { + gLoxInvites.init(); + window.addEventListener( + "unload", + () => { + gLoxInvites.uninit(); + }, + { once: true } + ); + }, + { once: true } +); ===================================== browser/components/torpreferences/content/loxInviteDialog.xhtml ===================================== @@ -0,0 +1,56 @@ +<?xml version="1.0" encoding="UTF-8"?> +<?xml-stylesheet href="chrome://global/skin/" type="text/css"?> +<?xml-stylesheet href="chrome://browser/skin/preferences/preferences.css"?> +<?xml-stylesheet href="chrome://browser/content/torpreferences/torPreferences.css"?> + +<window + type="child" + xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" + xmlns:html="http://www.w3.org/1999/xhtml" + data-l10n-id="lox-invite-dialog-title" +> +  + <menupopup id="lox-invite-dialog-item-menu" aria-hidden="true"> + <menuitem + id="lox-invite-dialog-copy-menu-item" + data-l10n-id="lox-invite-dialog-menu-item-copy-invite" + /> + </menupopup> + <dialog id="lox-invite-dialog" buttons="accept"> + <linkset> + <html:link rel="localization" href="browser/tor-browser.ftl" /> + </linkset> + + <script src="chrome://browser/content/torpreferences/loxInviteDialog.js" /> + + <description data-l10n-id="lox-invite-dialog-description"></description> + <html:div id="lox-invite-dialog-generate-area"> + <html:span id="lox-invite-dialog-remaining"></html:span> + <html:button + id="lox-invite-dialog-generate-button" + data-l10n-id="lox-invite-dialog-request-button" + ></html:button> + <html:div id="lox-invite-dialog-message-area"> + <html:span + id="lox-invite-dialog-error-message" + role="alert" + ></html:span> + <html:span + id="lox-invite-dialog-connecting" + role="alert" + tabindex="0" + data-l10n-id="lox-invite-dialog-connecting" + ></html:span> + </html:div> + </html:div> + <html:div + id="lox-invite-dialog-list-label" + data-l10n-id="lox-invite-dialog-invites-label" + ></html:div> + <richlistbox + id="lox-invite-dialog-list" + aria-labelledby="lox-invite-dialog-list-label" + ></richlistbox> + </dialog> +</window> ===================================== browser/components/torpreferences/content/torPreferences.css ===================================== @@ -820,6 +820,75 @@ dialog#torPreferences-requestBridge-dialog > hbox { background: var(--qr-one); } +/* Lox invite dialog */ + +#lox-invite-dialog-generate-area { + flex: 0 0 auto; + display: grid; + grid-template: + ". remaining button" min-content + "message message message" auto + / 1fr max-content max-content; + gap: 8px; + margin-block: 16px 8px; + align-items: center; +} + +#lox-invite-dialog-remaining { + grid-area: remaining; +} + +#lox-invite-dialog-generate-button { + grid-area: button; +} + +#lox-invite-dialog-message-area { + grid-area: message; + justify-self: end; +} + +#lox-invite-dialog-message-area::after { + /* Zero width space, to ensure we are always one line high. */ + content: "\200B"; +} + +#lox-invite-dialog-error-message { + color: var(--in-content-error-text-color); +} + +#lox-invite-dialog-error-message:not(.show-error) { + display: none; +} + +#lox-invite-dialog-connecting { + color: var(--text-color-deemphasized); + /* TODO: Add spinner ::before */ +} + +#lox-invite-dialog-connecting:not(.show-connecting) { + display: none; +} + +#lox-invite-dialog-list-label { + font-weight: 700; +} + +#lox-invite-dialog-list { + flex: 1 1 auto; + /* basis height */ + height: 10em; + margin-block: 8px; +} + +.lox-invite-dialog-list-item { + white-space: nowrap; + overflow-x: hidden; + /* FIXME: ellipsis does not show. */ + text-overflow: ellipsis; + padding-block: 6px; + padding-inline: 8px; +} + /* Builtin bridge dialog */ #torPreferences-builtinBridge-header { margin: 8px 0 10px 0; ===================================== browser/components/torpreferences/jar.mn ===================================== @@ -9,6 +9,8 @@ browser.jar: content/browser/torpreferences/lox-success.svg (content/lox-success.svg) content/browser/torpreferences/lox-complete-ring.svg (content/lox-complete-ring.svg) content/browser/torpreferences/lox-progress-ring.svg (content/lox-progress-ring.svg) + content/browser/torpreferences/loxInviteDialog.xhtml (content/loxInviteDialog.xhtml) + content/browser/torpreferences/loxInviteDialog.js (content/loxInviteDialog.js) content/browser/torpreferences/bridgeQrDialog.xhtml (content/bridgeQrDialog.xhtml) content/browser/torpreferences/bridgeQrDialog.js (content/bridgeQrDialog.js) content/browser/torpreferences/builtinBridgeDialog.xhtml (content/builtinBridgeDialog.xhtml) ===================================== browser/locales/en-US/browser/tor-browser.ftl ===================================== @@ -296,3 +296,17 @@ user-provide-bridge-dialog-result-invite = The following bridges were shared wit user-provide-bridge-dialog-result-addresses = The following bridges were entered by you. user-provide-bridge-dialog-next-button = .label = Next + +## Bridge pass invite dialog. Temporary. + +lox-invite-dialog-title = + .title = Bridge pass invites +lox-invite-dialog-description = You can ask the bridge bot to create a new invite, which you can share with a trusted contact to give them their own bridge pass. Each invite can only be redeemed once, but you will unlock access to more invites over time. +lox-invite-dialog-request-button = Request new invite +lox-invite-dialog-connecting = Connecting to bridge pass server… +lox-invite-dialog-no-server-error = Unable to connect to bridge pass server. +lox-invite-dialog-generic-invite-error = Failed to create a new invite. +lox-invite-dialog-invites-label = Created invites: +lox-invite-dialog-menu-item-copy-invite = + .label = Copy invite + .accesskey = C View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/compare/8069e4… -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/compare/8069e4… You're receiving this email because of your account on gitlab.torproject.org.

1 0

[Git][tpo/applications/tor-browser][tor-browser-115.7.0esr-13.5-1] 3 commits: fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in...
by richard (＠richard) 31 Jan '24

31 Jan '24

richard pushed to branch tor-browser-115.7.0esr-13.5-1 at The Tor Project / Applications / Tor Browser Commits: 277b6464 by Henry Wilkes at 2024-01-30T15:58:12+00:00 fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in about:preferences#connection Bug 42036: Add Lox to settings UI. - - - - - 9209ad02 by Henry Wilkes at 2024-01-30T15:58:12+00:00 fixup! Tor Browser strings Bug 42036: Add strings for Lox UI. - - - - - 8069e4ee by Henry Wilkes at 2024-01-30T15:58:13+00:00 fixup! Lox integration - - - - - 14 changed files: - browser/components/torpreferences/content/connectionPane.js - browser/components/torpreferences/content/connectionPane.xhtml - + browser/components/torpreferences/content/lox-bridge-icon.svg - + browser/components/torpreferences/content/lox-bridge-pass.svg - + browser/components/torpreferences/content/lox-complete-ring.svg - + browser/components/torpreferences/content/lox-invite-icon.svg - + browser/components/torpreferences/content/lox-progress-ring.svg - + browser/components/torpreferences/content/lox-success.svg - browser/components/torpreferences/content/provideBridgeDialog.js - browser/components/torpreferences/content/provideBridgeDialog.xhtml - browser/components/torpreferences/content/torPreferences.css - browser/components/torpreferences/jar.mn - browser/locales/en-US/browser/tor-browser.ftl - toolkit/components/lox/Lox.sys.mjs Changes: ===================================== browser/components/torpreferences/content/connectionPane.js ===================================== @@ -36,6 +36,60 @@ const { TorStrings } = ChromeUtils.importESModule( "resource://gre/modules/TorStrings.sys.mjs" ); +const { Lox } = ChromeUtils.importESModule( + "resource://gre/modules/Lox.sys.mjs" +); + +/* + * Fake Lox module: + +const Lox = { + levelHistory: [0, 1], + // levelHistory: [1, 2], + // levelHistory: [2, 3], + // levelHistory: [3, 4], + // levelHistory: [0, 1, 2], + // levelHistory: [1, 2, 3], + // levelHistory: [4, 3], + // levelHistory: [4, 1], + // levelHistory: [2, 1], + //levelHistory: [2, 3, 4, 1, 2], + // Gain some invites and then loose them all. Shouldn't show any change. + // levelHistory: [0, 1, 2, 1], + // levelHistory: [1, 2, 3, 1], + getEventData() { + let prevLevel = this.levelHistory[0]; + const events = []; + for (let i = 1; i < this.levelHistory.length; i++) { + const level = this.levelHistory[i]; + events.push({ type: level > prevLevel ? "levelup" : "blockage", newLevel: level }); + prevLevel = level; + } + return events; + }, + clearEventData() { + this.levelHistory = []; + }, + nextUnlock: { date: "2024-01-31T00:00:00Z", nextLevel: 1 }, + //nextUnlock: { date: "2024-01-31T00:00:00Z", nextLevel: 2 }, + //nextUnlock: { date: "2024-01-31T00:00:00Z", nextLevel: 3 }, + //nextUnlock: { date: "2024-01-31T00:00:00Z", nextLevel: 4 }, + getNextUnlock() { + return this.nextUnlock; + }, + remainingInvites: 3, + // remainingInvites: 0, + getRemainingInviteCount() { + return this.remainingInvites; + }, + invites: [], + // invites: ["a", "b"], + getInvites() { + return this.invites; + }, +}; +*/ + const InternetStatus = Object.freeze({ Unknown: 0, Online: 1, @@ -678,15 +732,23 @@ const gBridgeGrid = { row.optionsButton.focus(); }); - row.menu - .querySelector(".tor-bridges-options-qr-one-menu-item") - .addEventListener("click", () => { - const bridgeLine = row.bridgeLine; - if (!bridgeLine) { - return; - } - showBridgeQr(bridgeLine); - }); + const qrItem = row.menu.querySelector( + ".tor-bridges-options-qr-one-menu-item" + ); + row.menu.addEventListener("showing", () => { + qrItem.hidden = !( + this._bridgeSource === TorBridgeSource.UserProvided || + this._bridgeSource === TorBridgeSource.BridgeDB + ); + }); + + qrItem.addEventListener("click", () => { + const bridgeLine = row.bridgeLine; + if (!bridgeLine) { + return; + } + showBridgeQr(bridgeLine); + }); row.menu .querySelector(".tor-bridges-options-copy-one-menu-item") .addEventListener("click", () => { @@ -734,7 +796,11 @@ const gBridgeGrid = { * * @type {string[]} */ - _supportedSources: [TorBridgeSource.BridgeDB, TorBridgeSource.UserProvided], + _supportedSources: [ + TorBridgeSource.BridgeDB, + TorBridgeSource.UserProvided, + TorBridgeSource.Lox, + ], /** * Update the grid to show the latest bridge strings. @@ -1169,6 +1235,335 @@ const gBuiltinBridgesArea = { }, }; +/** + * Controls the bridge pass area. + */ +const gLoxStatus = { + /** + * The status area. + * + * @type {Element?} + */ + _area: null, + /** + * The area for showing the next unlock and invites. + * + * @type {Element?} + */ + _detailsArea: null, + /** + * The day counter for the next unlock. + * + * @type {Element?} + */ + _nextUnlockCounterEl: null, + /** + * Shows the number of remaining invites. + * + * @type {Element?} + */ + _remainingInvitesEl: null, + /** + * The button to show the invites. + * + * @type {Element?} + */ + _invitesButton: null, + /** + * The alert for new unlocks. + * + * @type {Element?} + */ + _unlockAlert: null, + /** + * The alert title. + * + * @type {Element?} + */ + _unlockAlertTitle: null, + /** + * The alert invites item. + * + * @type {Element?} + */ + _unlockAlertInvitesItem: null, + /** + * Button for the user to dismiss the alert. + * + * @type {Element?} + */ + _unlockAlertButton: null, + + /** + * Initialize the bridge pass area. + */ + init() { + this._area = document.getElementById("tor-bridges-lox-status"); + this._detailsArea = document.getElementById("tor-bridges-lox-details"); + this._nextUnlockCounterEl = document.getElementById( + "tor-bridges-lox-next-unlock-counter" + ); + this._remainingInvitesEl = document.getElementById( + "tor-bridges-lox-remaining-invites" + ); + this._invitesButton = document.getElementById( + "tor-bridges-lox-show-invites-button" + ); + this._unlockAlert = document.getElementById("tor-bridges-lox-unlock-alert"); + this._unlockAlertTitle = document.getElementById( + "tor-bridge-unlock-alert-title" + ); + this._unlockAlertInviteItem = document.getElementById( + "tor-bridges-lox-unlock-alert-invites" + ); + this._unlockAlertButton = document.getElementById( + "tor-bridges-lox-unlock-alert-button" + ); + + this._invitesButton.addEventListener("click", () => { + // TODO: Show invites. + }); + this._unlockAlertButton.addEventListener("click", () => { + // TODO: Have a way to ensure that the cleared event data matches the + // current _loxId + Lox.clearEventData(); + // TODO: Listen for events from Lox, rather than call _updateUnlocks + // directly. + this._updateUnlocks(); + }); + + Services.obs.addObserver(this, TorSettingsTopics.SettingsChanged); + // TODO: Listen for new events from Lox, when it is supported. + + // NOTE: Before initializedPromise completes, this area is hidden. + TorSettings.initializedPromise.then(() => { + this._updateLoxId(); + }); + }, + + /** + * Uninitialize the built-in bridges area. + */ + uninit() { + Services.obs.removeObserver(this, TorSettingsTopics.SettingsChanged); + }, + + observe(subject, topic, data) { + switch (topic) { + case TorSettingsTopics.SettingsChanged: + const { changes } = subject.wrappedJSObject; + if ( + changes.includes("bridges.source") || + changes.includes("bridges.lox_id") + ) { + this._updateLoxId(); + } + break; + } + }, + + /** + * The Lox id currently shown. Empty if deactivated, and null if + * uninitialized. + * + * @type {string?} + */ + _loxId: null, + + /** + * Update the shown bridge pass. + */ + async _updateLoxId() { + let loxId = + TorSettings.bridges.source === TorBridgeSource.Lox + ? TorSettings.bridges.lox_id + : ""; + if (loxId !== this._loxId) { + this._loxId = loxId; + this._updateUnlocks(); + this._updateInvites(); + } + }, + + /** + * Update the display of the current or next unlock. + */ + async _updateUnlocks() { + // Cache the loxId before we await. + const loxId = this._loxId; + + if (!loxId) { + // NOTE: This area should already be hidden by the change in Lox source, + // but we clean up for the next non-empty id. + this._area.classList.remove("show-unlock-alert"); + this._area.classList.remove("show-next-unlock"); + return; + } + + let pendingEvents; + let nextUnlock; + let numInvites; + // Fetch the latest events or details about the next unlock. + try { + nextUnlock = await Lox.getNextUnlock(); + pendingEvents = Lox.getEventData(); + numInvites = Lox.getRemainingInviteCount(); + } catch (e) { + console.error("Failed get get lox updates", e); + return; + } + + if (loxId !== this._loxId) { + // Replaced during await. + return; + } + + // Grab focus state before changing visibility. + const alertHadFocus = this._unlockAlert.contains(document.activeElement); + const detailsHadFocus = this._detailsArea.contains(document.activeElement); + + const showAlert = !!pendingEvents.length; + this._area.classList.toggle("show-unlock-alert", showAlert); + this._area.classList.toggle("show-next-unlock", !showAlert); + + if (showAlert) { + // At level 0 and level 1, we do not have any invites. + // If the user starts and ends on level 0 or 1, then overall they would + // have had no change in their invites. So we do not want to show their + // latest updates. + // NOTE: If the user starts at level > 1 and ends with level 1 (levelling + // down to level 0 should not be possible), then we *do* want to show the + // user that they now have "0" invites. + // NOTE: pendingEvents are time-ordered, with the most recent event + // *last*. + const firstEvent = pendingEvents[0]; + // NOTE: We cannot get a blockage event when the user starts at level 1 or + // 0. + const startingAtLowLevel = + firstEvent.type === "levelup" && firstEvent.newLevel <= 2; + const lastEvent = pendingEvents[pendingEvents.length - 1]; + const endingAtLowLevel = lastEvent.newLevel <= 1; + + const showInvites = !(startingAtLowLevel && endingAtLowLevel); + + let blockage = false; + let levelUp = false; + let bridgeGain = false; + // Go through events, in the order that they occurred. + for (const loxEvent of pendingEvents) { + if (loxEvent.type === "levelup") { + levelUp = true; + if (loxEvent.newLevel === 1) { + // Gain 2 bridges from level 0 to 1. + bridgeGain = true; + } + } else { + blockage = true; + } + } + let alertTitleId; + if (levelUp && !blockage) { + alertTitleId = "tor-bridges-lox-upgrade"; + } else { + // Show as blocked bridges replaced. + // Even if we have a mixture of level ups as well. + alertTitleId = "tor-bridges-lox-blocked"; + } + document.l10n.setAttributes(this._unlockAlertTitle, alertTitleId); + document.l10n.setAttributes( + this._unlockAlertInviteItem, + "tor-bridges-lox-new-invites", + { numInvites } + ); + this._unlockAlert.classList.toggle( + "lox-unlock-upgrade", + levelUp && !blockage + ); + this._unlockAlert.classList.toggle("lox-unlock-new-bridges", blockage); + this._unlockAlert.classList.toggle("lox-unlock-gain-bridges", bridgeGain); + this._unlockAlert.classList.toggle("lox-unlock-invites", showInvites); + } else { + // Show next unlock. + // Number of days until the next unlock, rounded up. + const numDays = Math.max( + 1, + Math.ceil( + (new Date(nextUnlock.date).getTime() - Date.now()) / + (24 * 60 * 60 * 1000) + ) + ); + document.l10n.setAttributes( + this._nextUnlockCounterEl, + "tor-bridges-lox-days-until-unlock", + { numDays } + ); + + // Gain 2 bridges from level 0 to 1. After that gain invites. + const bridgeGain = nextUnlock.nextLevel === 1; + const firstInvites = nextUnlock.nextLevel === 2; + const moreInvites = nextUnlock.nextLevel > 2; + + this._detailsArea.classList.toggle("lox-next-gain-bridges", bridgeGain); + this._detailsArea.classList.toggle( + "lox-next-first-invites", + firstInvites + ); + this._detailsArea.classList.toggle("lox-next-more-invites", moreInvites); + } + + if (alertHadFocus && !showAlert) { + // Has become hidden. + this._nextUnlockCounterEl.focus(); + } else if (detailsHadFocus && showAlert) { + this._unlockAlertButton.focus(); + } + }, + + /** + * Update the invites area. + */ + _updateInvites() { + if (!this._loxId) { + return; + } + + let remainingInvites; + let existingInvites; + // Fetch the latest events or details about the next unlock. + try { + remainingInvites = Lox.getRemainingInviteCount(); + existingInvites = Lox.getInvites().length; + } catch (e) { + console.error("Failed get get remaining invites", e); + return; + } + + const hasInvites = !!existingInvites || !!remainingInvites; + + if (!hasInvites) { + if ( + this._remainingInvitesEl.contains(document.activeElement) || + this._invitesButton.contains(document.activeElement) + ) { + // About to loose focus. + // Unexpected for the lox level to loose all invites. + // Move to the top of the details area, which should be visible if we + // just had focus. + this._nextUnlockCounterEl.focus(); + } + } + // Hide the invite elements if we have no historic invites or a way of + // creating new ones. + this._detailsArea.classList.toggle("lox-has-invites", hasInvites); + + document.l10n.setAttributes( + this._remainingInvitesEl, + "tor-bridges-lox-remaining-invites", + { numInvites: remainingInvites } + ); + }, +}; + /** * Controls the bridge settings. */ @@ -1295,6 +1690,7 @@ const gBridgeSettings = { gBridgeGrid.init(); gBuiltinBridgesArea.init(); + gLoxStatus.init(); this._initBridgesMenu(); this._initShareArea(); @@ -1315,6 +1711,7 @@ const gBridgeSettings = { uninit() { gBridgeGrid.uninit(); gBuiltinBridgesArea.uninit(); + gLoxStatus.uninit(); Services.obs.removeObserver(this, TorSettingsTopics.SettingsChanged); }, @@ -1387,6 +1784,10 @@ const gBridgeSettings = { "source-requested", bridgeSource === TorBridgeSource.BridgeDB ); + this._bridgesEl.classList.toggle( + "source-lox", + bridgeSource === TorBridgeSource.Lox + ); // Force the menu to close whenever the source changes. // NOTE: If the menu had focus then hadFocus will be true, and focus will be @@ -1615,7 +2016,10 @@ const gBridgeSettings = { this._bridgesMenu.addEventListener("showing", () => { const canCopy = this._bridgeSource !== TorBridgeSource.BuiltIn; - qrItem.hidden = !this._canQRBridges || !canCopy; + const canShare = + this._bridgeSource === TorBridgeSource.UserProvided || + this._bridgeSource === TorBridgeSource.BridgeDB; + qrItem.hidden = !canShare || !this._canQRBridges; copyItem.hidden = !canCopy; editItem.hidden = this._bridgeSource !== TorBridgeSource.UserProvided; }); @@ -1763,13 +2167,19 @@ const gBridgeSettings = { "chrome://browser/content/torpreferences/provideBridgeDialog.xhtml", { mode }, result => { - if (!result.bridges?.length) { + const loxId = result.loxId; + if (!loxId && !result.addresses?.length) { return null; } return setTorSettings(() => { TorSettings.bridges.enabled = true; - TorSettings.bridges.source = TorBridgeSource.UserProvided; - TorSettings.bridges.bridge_strings = result.bridges; + if (loxId) { + TorSettings.bridges.source = TorBridgeSource.Lox; + TorSettings.bridges.lox_id = loxId; + } else { + TorSettings.bridges.source = TorBridgeSource.UserProvided; + TorSettings.bridges.bridge_strings = result.addresses; + } }); } ); ===================================== browser/components/torpreferences/content/connectionPane.xhtml ===================================== @@ -172,6 +172,10 @@ id="tor-bridges-requested-label" data-l10n-id="tor-bridges-source-requested" ></html:span> + <html:span id="tor-bridges-lox-label"> + <html:img id="tor-bridges-lox-label-icon" alt="" /> + <html:span data-l10n-id="tor-bridges-source-lox"></html:span> + </html:span> <html:button id="tor-bridges-all-options-button" class="tor-bridges-options-button" @@ -275,7 +279,7 @@ </html:span> </html:div> </html:template> - <html:div id="tor-bridges-share"> + <html:div id="tor-bridges-share" class="tor-bridges-details-box"> <html:h3 id="tor-bridges-share-heading" data-l10n-id="tor-bridges-share-heading" @@ -293,6 +297,77 @@ data-l10n-id="tor-bridges-qr-addresses-button" ></html:button> </html:div> + <html:div id="tor-bridges-lox-status"> + <html:div data-l10n-id="tor-bridges-lox-description"></html:div> + <html:div + id="tor-bridges-lox-details" + class="tor-bridges-details-box tor-bridges-lox-box" + > + <html:img alt="" class="tor-bridges-lox-image-inner" /> + <html:img alt="" class="tor-bridges-lox-image-outer" /> + <html:div + id="tor-bridges-lox-next-unlock-counter" + class="tor-bridges-lox-intro" + tabindex="-1" + ></html:div> + <html:ul class="tor-bridges-lox-list"> + <html:li + id="tor-bridges-lox-next-unlock-gain-bridges" + class="tor-bridges-lox-list-item tor-bridges-lox-list-item-bridge" + data-l10n-id="tor-bridges-lox-unlock-two-bridges" + ></html:li> + <html:li + id="tor-bridges-lox-next-unlock-first-invites" + class="tor-bridges-lox-list-item tor-bridges-lox-list-item-invite" + data-l10n-id="tor-bridges-lox-unlock-first-invites" + ></html:li> + <html:li + id="tor-bridges-lox-next-unlock-more-invites" + class="tor-bridges-lox-list-item tor-bridges-lox-list-item-invite" + data-l10n-id="tor-bridges-lox-unlock-more-invites" + ></html:li> + </html:ul> + <html:div id="tor-bridges-lox-remaining-invites"></html:div> + <html:button + id="tor-bridges-lox-show-invites-button" + class="tor-bridges-lox-button" + data-l10n-id="tor-bridges-lox-show-invites-button" + ></html:button> + </html:div> + <html:div + id="tor-bridges-lox-unlock-alert" + role="alert" + class="tor-bridges-details-box tor-bridges-lox-box" + > + <html:img alt="" class="tor-bridges-lox-image-inner" /> + <html:img alt="" class="tor-bridges-lox-image-outer" /> + <html:div + id="tor-bridge-unlock-alert-title" + class="tor-bridges-lox-intro" + ></html:div> + <html:ul class="tor-bridges-lox-list"> + <html:li + id="tor-bridges-lox-unlock-alert-gain-bridges" + class="tor-bridges-lox-list-item tor-bridges-lox-list-item-bridge" + data-l10n-id="tor-bridges-lox-gained-two-bridges" + ></html:li> + <html:li + id="tor-bridges-lox-unlock-alert-new-bridges" + class="tor-bridges-lox-list-item tor-bridges-lox-list-item-bridge" + data-l10n-id="tor-bridges-lox-new-bridges" + ></html:li> + <html:li + id="tor-bridges-lox-unlock-alert-invites" + class="tor-bridges-lox-list-item tor-bridges-lox-list-item-invite" + ></html:li> + </html:ul> + <html:button + id="tor-bridges-lox-unlock-alert-button" + class="tor-bridges-lox-button" + data-l10n-id="tor-bridges-lox-got-it-button" + ></html:button> + </html:div> + </html:div> </html:div> <html:h2 id="tor-bridges-change-heading"></html:h2> <hbox align="center"> ===================================== browser/components/torpreferences/content/lox-bridge-icon.svg ===================================== @@ -0,0 +1,6 @@ +<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> +<rect x="0.5" y="0.5" width="17" height="17" rx="1.5" stroke="context-stroke"/> +<path d="M14.625 11.625C14.625 8.5184 12.1066 6 9 6C5.8934 6 3.375 8.5184 3.375 11.625V12.5596H4.25391V11.625C4.25391 9.0038 6.3788 6.87891 9 6.87891C11.6212 6.87891 13.7461 9.0038 13.7461 11.625V12.5596H14.625V11.625Z" fill="context-fill"/> +<path d="M12.9375 11.625C12.9375 9.45037 11.1746 7.6875 9 7.6875C6.82537 7.6875 5.0625 9.45037 5.0625 11.625L5.06242 12.5596H5.94132L5.9414 11.625C5.9414 9.93578 7.31078 8.5664 9 8.5664C10.6892 8.5664 12.0586 9.93578 12.0586 11.625L12.0587 12.5596H12.9376L12.9375 11.625Z" fill="context-fill"/> +<path d="M9 9.375C10.2426 9.375 11.25 10.3824 11.25 11.625L11.2502 12.5596H10.3713L10.3711 11.625C10.3711 10.8678 9.75724 10.2539 9 10.2539C8.24277 10.2539 7.62891 10.8678 7.62891 11.625L7.62873 12.5596H6.74982V11.625C6.74982 10.3824 7.75736 9.375 9 9.375Z" fill="context-fill"/> +</svg> ===================================== browser/components/torpreferences/content/lox-bridge-pass.svg ===================================== @@ -0,0 +1,6 @@ +<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path fill-rule="evenodd" clip-rule="evenodd" d="M0.825958 10.1991C0.191356 9.56445 0.191356 8.53556 0.825958 7.90095L7.89702 0.829887C8.53163 0.195285 9.56052 0.195285 10.1951 0.829887L11.3198 1.95455C11.5751 2.2099 11.6412 2.59873 11.4846 2.92409C11.0031 3.9241 12.0507 4.97168 13.0507 4.4902C13.376 4.33354 13.7649 4.39962 14.0202 4.65497L15.1449 5.77963C15.7795 6.41424 15.7795 7.44313 15.1449 8.07773L8.0738 15.1488C7.4392 15.7834 6.41031 15.7834 5.7757 15.1488L4.65104 14.0241C4.39569 13.7688 4.32961 13.38 4.48627 13.0546C4.96775 12.0546 3.92017 11.007 2.92016 11.4885C2.5948 11.6451 2.20597 11.5791 1.95062 11.3237L0.825958 10.1991ZM1.70984 8.78484C1.56339 8.93128 1.56339 9.16872 1.70984 9.31517L2.64555 10.2509C4.53493 9.58573 6.38902 11.4398 5.72388 13.3292L6.65959 14.2649C6.80603 14.4114 7.04347 14.4114 7.18992 14.2649L14.261 7.19385C14.4074 7.0474 14.4074 6.80996 14.261 6.66352L13.3253 5.7278C11.4359 6.39295 9.5818 4.53886 10.247 2.64948L9.31124 1.71377C9.16479 1.56732 8.92735 1.56732 8.78091 1.71377L1.70984 8.78484Z" fill="context-fill"/> + <path d="M8.87637 9.78539L9.76025 8.90151L10.6441 9.78539L9.76025 10.6693L8.87637 9.78539Z" fill="context-fill"/> + <path d="M7.1086 8.01763L7.99249 7.13374L8.87637 8.01763L7.99249 8.90151L7.1086 8.01763Z" fill="context-fill"/> + <path d="M5.34084 6.24986L6.22472 5.36598L7.1086 6.24986L6.22472 7.13374L5.34084 6.24986Z" fill="context-fill"/> +</svg> ===================================== browser/components/torpreferences/content/lox-complete-ring.svg ===================================== @@ -0,0 +1,12 @@ +<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg"> +<defs> + <filter id="ring-blur" x="0" y="0" width="44" height="44" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> + <feColorMatrix in="SourceGraphic" type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0"/> + <feGaussianBlur stdDeviation="2"/> + <feBlend mode="normal" in="SourceGraphic"/> + </filter> +</defs> +<g filter="url(#ring-blur)"> +<path d="M40 22C40 31.9411 31.9411 40 22 40C12.0589 40 4 31.9411 4 22C4 12.0589 12.0589 4 22 4C31.9411 4 40 12.0589 40 22ZM6.25 22C6.25 30.6985 13.3015 37.75 22 37.75C30.6985 37.75 37.75 30.6985 37.75 22C37.75 13.3015 30.6985 6.25 22 6.25C13.3015 6.25 6.25 13.3015 6.25 22Z" fill="context-fill"/> +</g> +</svg> ===================================== browser/components/torpreferences/content/lox-invite-icon.svg ===================================== @@ -0,0 +1,4 @@ +<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> +<rect x="0.5" y="0.5" width="17" height="17" rx="1.5" stroke="context-stroke"/> +<path d="M9 9C8.45 9 7.97917 8.80417 7.5875 8.4125C7.19583 8.02083 7 7.55 7 7C7 6.45 7.19583 5.97917 7.5875 5.5875C7.97917 5.19583 8.45 5 9 5C9.55 5 10.0208 5.19583 10.4125 5.5875C10.8042 5.97917 11 6.45 11 7C11 7.55 10.8042 8.02083 10.4125 8.4125C10.0208 8.80417 9.55 9 9 9ZM5 12V11.6C5 11.3167 5.07292 11.0563 5.21875 10.8187C5.36458 10.5812 5.55833 10.4 5.8 10.275C6.31667 10.0167 6.84167 9.82292 7.375 9.69375C7.90833 9.56458 8.45 9.5 9 9.5C9.55 9.5 10.0917 9.56458 10.625 9.69375C11.1583 9.82292 11.6833 10.0167 12.2 10.275C12.4417 10.4 12.6354 10.5812 12.7812 10.8187C12.9271 11.0563 13 11.3167 13 11.6V12C13 12.275 12.9021 12.5104 12.7063 12.7063C12.5104 12.9021 12.275 13 12 13H6C5.725 13 5.48958 12.9021 5.29375 12.7063C5.09792 12.5104 5 12.275 5 12ZM6 12H12V11.6C12 11.5083 11.9771 11.425 11.9313 11.35C11.8854 11.275 11.825 11.2167 11.75 11.175C11.3 10.95 10.8458 10.7813 10.3875 10.6688C9.92917 10.5563 9.46667 10.5 9 10.5C8.53333 10.5 8.07083 10.5563 7.6125 10.6688C7.15417 10.7813 6.7 10.95 6.25 11.175C6.175 11.2167 6.11458 11.275 6.06875 11.35C6.02292 11.425 6 11.5083 6 11.6V12ZM9 8C9.275 8 9.51042 7.90208 9.70625 7.70625C9.90208 7.51042 10 7.275 10 7C10 6.725 9.90208 6.48958 9.70625 6.29375C9.51042 6.09792 9.275 6 9 6C8.725 6 8.48958 6.09792 8.29375 6.29375C8.09792 6.48958 8 6.725 8 7C8 7.275 8.09792 7.51042 8.29375 7.70625C8.48958 7.90208 8.725 8 9 8Z" fill="context-fill"/> +</svg> ===================================== browser/components/torpreferences/content/lox-progress-ring.svg ===================================== @@ -0,0 +1,13 @@ +<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg"> +<defs> + <filter id="ring-blur" x="0" y="0" width="44" height="44" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> + <feColorMatrix in="SourceGraphic" type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0"/> + <feGaussianBlur stdDeviation="2"/> + <feBlend mode="normal" in="SourceGraphic"/> + </filter> +</defs> +<path d="M 40,22 C 40,31.9411 31.9411,40 22,40 12.05887,40 4,31.9411 4,22 4,12.0589 12.05887,4 22,4 31.9411,4 40,12.0589 40,22 Z M 6.25,22 c 0,8.6985 7.05152,15.75 15.75,15.75 8.6985,0 15.75,-7.0515 15.75,-15.75 C 37.75,13.3015 30.6985,6.25 22,6.25 13.30152,6.25 6.25,13.3015 6.25,22 Z" fill="context-stroke"/> +<g filter="url(#ring-blur)"> + <path d="m 22,5.125 c 0,-0.62132 0.5042,-1.12866 1.1243,-1.08986 3.0298,0.18958 5.963,1.14263 8.5256,2.77013 0.5245,0.3331 0.6342,1.03991 0.269,1.54257 C 31.5537,8.8505 30.852,8.95814 30.3246,8.62974 28.1505,7.27609 25.6786,6.47291 23.1241,6.29015 22.5044,6.24582 22,5.74632 22,5.125 Z" fill="context-fill"/> +</g> +</svg> ===================================== browser/components/torpreferences/content/lox-success.svg ===================================== @@ -0,0 +1,5 @@ +<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M10 14C9.62059 14.0061 9.25109 13.8787 8.95594 13.6403C8.6608 13.4018 8.45874 13.0672 8.385 12.695L8.028 11.028C7.97202 10.7692 7.84264 10.5321 7.65536 10.345C7.46807 10.1579 7.23081 10.0287 6.972 9.973L5.305 9.616C4.524 9.447 4 8.798 4 8C4 7.202 4.524 6.553 5.305 6.385L6.972 6.028C7.23078 5.97185 7.46794 5.84243 7.65519 5.65519C7.84243 5.46794 7.97185 5.23078 8.028 4.972L8.386 3.305C8.553 2.524 9.202 2 10 2C10.798 2 11.447 2.524 11.615 3.305L11.972 4.972C12.086 5.5 12.5 5.914 13.028 6.027L14.695 6.384C15.476 6.553 16 7.202 16 8C16 8.798 15.476 9.447 14.695 9.615L13.028 9.972C12.769 10.028 12.5316 10.1575 12.3443 10.345C12.157 10.5324 12.0277 10.7699 11.972 11.029L11.614 12.695C11.5407 13.0672 11.3388 13.4019 11.0438 13.6404C10.7488 13.8789 10.3793 14.0062 10 14ZM10 3.25C9.902 3.25 9.669 3.28 9.608 3.566L9.25 5.234C9.14333 5.72828 8.89643 6.18132 8.53888 6.53888C8.18132 6.89643 7.72828 7.14333 7.234 7.25L5.567 7.607C5.281 7.669 5.25 7.902 5.25 8C5.25 8.098 5.281 8.331 5.567 8.393L7.234 8.75C7.72828 8.85667 8.18132 9.10357 8.53888 9.46112C8.89643 9.81868 9.14333 10.2717 9.25 10.766L9.608 12.434C9.669 12.72 9.902 12.75 10 12.75C10.098 12.75 10.331 12.72 10.392 12.434L10.75 10.767C10.8565 10.2725 11.1033 9.81928 11.4609 9.46154C11.8185 9.10379 12.2716 8.85674 12.766 8.75L14.433 8.393C14.719 8.331 14.75 8.098 14.75 8C14.75 7.902 14.719 7.669 14.433 7.607L12.766 7.25C12.2717 7.14333 11.8187 6.89643 11.4611 6.53888C11.1036 6.18132 10.8567 5.72828 10.75 5.234L10.392 3.566C10.331 3.28 10.098 3.25 10 3.25Z" fill="context-fill"/> + <path d="M2.44399 12.151L2.62599 11.302C2.71199 10.9 3.28599 10.9 3.37299 11.302L3.55499 12.151C3.57035 12.2229 3.60618 12.2888 3.65817 12.3408C3.71016 12.3928 3.77609 12.4286 3.84799 12.444L4.69699 12.626C5.09899 12.712 5.09899 13.286 4.69699 13.373L3.84799 13.555C3.77609 13.5704 3.71016 13.6062 3.65817 13.6582C3.60618 13.7102 3.57035 13.7761 3.55499 13.848L3.37299 14.697C3.28699 15.099 2.71299 15.099 2.62599 14.697L2.44399 13.848C2.42863 13.7761 2.39279 13.7102 2.3408 13.6582C2.28881 13.6062 2.22289 13.5704 2.15099 13.555L1.30199 13.373C0.899988 13.287 0.899988 12.713 1.30199 12.626L2.15099 12.444C2.22294 12.4288 2.28893 12.393 2.34094 12.341C2.39295 12.2889 2.42875 12.223 2.44399 12.151Z" fill="context-fill"/> + <path d="M2.44399 2.151L2.62599 1.302C2.71199 0.900004 3.28599 0.900004 3.37299 1.302L3.55499 2.151C3.57035 2.22291 3.60618 2.28883 3.65817 2.34082C3.71016 2.39281 3.77609 2.42864 3.84799 2.444L4.69699 2.626C5.09899 2.712 5.09899 3.286 4.69699 3.373L3.84899 3.556C3.77703 3.57125 3.71105 3.60704 3.65904 3.65905C3.60703 3.71106 3.57123 3.77705 3.55599 3.849L3.37299 4.698C3.28699 5.1 2.71299 5.1 2.62599 4.698L2.44399 3.849C2.42875 3.77705 2.39295 3.71106 2.34094 3.65905C2.28893 3.60704 2.22294 3.57125 2.15099 3.556L1.30199 3.373C0.899988 3.287 0.899988 2.713 1.30199 2.626L2.15099 2.444C2.22294 2.42876 2.28893 2.39296 2.34094 2.34095C2.39295 2.28894 2.42875 2.22296 2.44399 2.151Z" fill="context-fill"/> +</svg> ===================================== browser/components/torpreferences/content/provideBridgeDialog.js ===================================== @@ -15,6 +15,46 @@ const { TorParsers } = ChromeUtils.importESModule( "resource://gre/modules/TorParsers.sys.mjs" ); +const { Lox, LoxErrors } = ChromeUtils.importESModule( + "resource://gre/modules/Lox.sys.mjs" +); + +/* + * Fake Lox module: + +const LoxErrors = { + BadInvite: "BadInvite", + LoxServerUnreachable: "LoxServerUnreachable", + Other: "Other", +}; + +const Lox = { + failError: null, + // failError: LoxErrors.BadInvite, + // failError: LoxErrors.LoxServerUnreachable, + // failError: LoxErrors.Other, + redeemInvite(invite) { + return new Promise((res, rej) => { + setTimeout(() => { + if (this.failError) { + rej({ type: this.failError }); + } + res("lox-id-000000"); + }, 4000); + }); + }, + validateInvitation(invite) { + return invite.startsWith("lox-invite"); + }, + getBridges(id) { + return [ + "0:0 AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA", + "0:1 BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB", + ]; + }, +}; +*/ + const gProvideBridgeDialog = { init() { this._result = window.arguments[0]; @@ -36,10 +76,14 @@ const gProvideBridgeDialog = { document.l10n.setAttributes(document.documentElement, titleId); + // TODO: Make conditional on Lox being enabled. + this._allowLoxInvite = mode !== "edit"; // && Lox.enabled + document.l10n.setAttributes( document.getElementById("user-provide-bridge-textarea-label"), - // TODO change string when we can also accept Lox share codes. - "user-provide-bridge-dialog-textarea-addresses-label" + this._allowLoxInvite + ? "user-provide-bridge-dialog-textarea-addresses-or-invite-label" + : "user-provide-bridge-dialog-textarea-addresses-label" ); this._dialog = document.getElementById("user-provide-bridge-dialog"); @@ -48,6 +92,9 @@ const gProvideBridgeDialog = { this._errorEl = document.getElementById( "user-provide-bridge-error-message" ); + this._connectingEl = document.getElementById( + "user-provide-bridge-connecting" + ); this._resultDescription = document.getElementById( "user-provide-result-description" ); @@ -68,8 +115,9 @@ const gProvideBridgeDialog = { // Set placeholder if not editing. document.l10n.setAttributes( this._textarea, - // TODO: change string when we can also accept Lox share codes. - "user-provide-bridge-dialog-textarea-addresses" + this._allowLoxInvite + ? "user-provide-bridge-dialog-textarea-addresses-or-invite" + : "user-provide-bridge-dialog-textarea-addresses" ); } @@ -98,7 +146,17 @@ const gProvideBridgeDialog = { this._page = page; this._dialog.classList.toggle("show-entry-page", page === "entry"); this._dialog.classList.toggle("show-result-page", page === "result"); - if (page === "entry") { + this.takeFocus(); + this.updateResult(); + this.updateAcceptDisabled(); + this.onAcceptStateChange(); + }, + + /** + * Reset focus position in the dialog. + */ + takeFocus() { + if (this._page === "entry") { this._textarea.focus(); } else { // Move focus to the <xul:window> element. @@ -106,9 +164,6 @@ const gProvideBridgeDialog = { // button (with now different text). document.documentElement.focus(); } - - this.updateAcceptDisabled(); - this.onAcceptStateChange(); }, /** @@ -149,7 +204,36 @@ const gProvideBridgeDialog = { */ updateAcceptDisabled() { this._acceptButton.disabled = - this._page === "entry" && validateBridgeLines(this._textarea.value).empty; + this._page === "entry" && (this.isEmpty() || this._loxLoading); + }, + + /** + * The lox loading state. + * + * @type {boolean} + */ + _loxLoading: false, + + /** + * Set the lox loading state. I.e. whether we are connecting to the lox + * server. + * + * @param {boolean} isLoading - Whether we are loading or not. + */ + setLoxLoading(isLoading) { + this._loxLoading = isLoading; + this._textarea.readOnly = isLoading; + this._connectingEl.classList.toggle("show-connecting", isLoading); + if ( + isLoading && + this._acceptButton.contains( + this._acceptButton.getRootNode().activeElement + ) + ) { + // Move focus to the alert before we disable the button. + this._connectingEl.focus(); + } + this.updateAcceptDisabled(); }, /** @@ -166,23 +250,63 @@ const gProvideBridgeDialog = { // Prevent closing the dialog. event.preventDefault(); - const bridges = this.checkValue(); - if (!bridges.length) { + if (this._loxLoading) { + // User can still click Next whilst loading. + console.error("Already have a pending lox invite"); + return; + } + + // Clear the result from any previous attempt. + delete this._result.loxId; + delete this._result.addresses; + // Clear any previous error. + this.updateError(null); + + const value = this.checkValue(); + if (!value) { + // Not valid. + return; + } + if (value.loxInvite) { + this.setLoxLoading(true); + Lox.redeemInvite(value.loxInvite) + .finally(() => { + // Set set the loading to false before setting the errors. + this.setLoxLoading(false); + }) + .then( + loxId => { + this._result.loxId = loxId; + this.setPage("result"); + }, + loxError => { + console.error("Redeeming failed", loxError); + switch (loxError.type) { + case LoxErrors.BadInvite: + // TODO: distinguish between a bad invite, an invite that has + // expired, and an invite that has already been redeemed. + this.updateError({ type: "bad-invite" }); + break; + case LoxErrors.LoxServerUnreachable: + this.updateError({ type: "no-server" }); + break; + default: + this.updateError({ type: "invite-error" }); + break; + } + } + ); + return; + } + + if (!value.addresses?.length) { // Not valid return; } - this._result.bridges = bridges; - this.updateResult(); + this._result.addresses = value.addresses; this.setPage("result"); }, - /** - * The current timeout for updating the error. - * - * @type {integer?} - */ - _updateErrorTimeout: null, - /** * Update the displayed error. * @@ -191,14 +315,13 @@ const gProvideBridgeDialog = { */ updateError(error) { // First clear the existing error. - if (this._updateErrorTimeout !== null) { - clearTimeout(this._updateErrorTimeout); - } - this._updateErrorTimeout = null; this._errorEl.removeAttribute("data-l10n-id"); this._errorEl.textContent = ""; if (error) { this._textarea.setAttribute("aria-invalid", "true"); + // Move focus back to the text area, likely away from the Next button or + // the "Connecting..." alert. + this._textarea.focus(); } else { this._textarea.removeAttribute("aria-invalid"); } @@ -216,54 +339,122 @@ const gProvideBridgeDialog = { errorId = "user-provide-bridge-dialog-address-error"; errorArgs = { line: error.line }; break; + case "multiple-invites": + errorId = "user-provide-bridge-dialog-multiple-invites-error"; + break; + case "mixed": + errorId = "user-provide-bridge-dialog-mixed-error"; + break; + case "not-allowed-invite": + errorId = "user-provide-bridge-dialog-invite-not-allowed-error"; + break; + case "bad-invite": + errorId = "user-provide-bridge-dialog-bad-invite-error"; + break; + case "no-server": + errorId = "user-provide-bridge-dialog-no-server-error"; + break; + case "invite-error": + // Generic invite error. + errorId = "user-provide-bridge-dialog-generic-invite-error"; + break; } - // Wait a small amount of time to actually set the textContent. Otherwise - // the screen reader (tested with Orca) may not pick up on the change in - // text. - this._updateErrorTimeout = setTimeout(() => { - document.l10n.setAttributes(this._errorEl, errorId, errorArgs); - }, 500); + document.l10n.setAttributes(this._errorEl, errorId, errorArgs); + }, + + /** + * The condition for the value to be empty. + * + * @type {RegExp} + */ + _emptyRegex: /^\s*$/, + /** + * Whether the input is considered empty. + * + * @returns {boolean} true if it is considered empty. + */ + isEmpty() { + return this._emptyRegex.test(this._textarea.value); }, /** * Check the current value in the textarea. * - * @returns {string[]} - The bridge addresses, if the entry is valid. + * @returns {object?} - The bridge addresses, or lox invite, or null if no + * valid value. */ checkValue() { - let bridges = []; - let error = null; - const validation = validateBridgeLines(this._textarea.value); - if (!validation.empty) { + if (this.isEmpty()) { // If empty, we just disable the button, rather than show an error. - if (validation.errorLines.length) { - // Report first error. - error = { - type: "invalid-address", - line: validation.errorLines[0], - }; - } else { - bridges = validation.validBridges; + this.updateError(null); + return null; + } + + let loxInvite = null; + for (let line of this._textarea.value.split(/\r?\n/)) { + line = line.trim(); + if (!line) { + continue; + } + // TODO: Once we have a Lox invite encoding, distinguish between a valid + // invite and something that looks like it should be an invite. + const isLoxInvite = Lox.validateInvitation(line); + if (isLoxInvite) { + if (!this._allowLoxInvite) { + this.updateError({ type: "not-allowed-invite" }); + return null; + } + if (loxInvite) { + this.updateError({ type: "multiple-invites" }); + return null; + } + loxInvite = line; + } else if (loxInvite) { + this.updateError({ type: "mixed" }); + return null; } } - this.updateError(error); - return bridges; + + if (loxInvite) { + return { loxInvite }; + } + + const validation = validateBridgeLines(this._textarea.value); + if (validation.errorLines.length) { + // Report first error. + this.updateError({ + type: "invalid-address", + line: validation.errorLines[0], + }); + return null; + } + + return { addresses: validation.validBridges }; }, /** * Update the shown result on the last page. */ updateResult() { + if (this._page !== "result") { + return; + } + + const loxId = this._result.loxId; + document.l10n.setAttributes( this._resultDescription, - // TODO: Use a different id when added through Lox invite. - "user-provide-bridge-dialog-result-addresses" + loxId + ? "user-provide-bridge-dialog-result-invite" + : "user-provide-bridge-dialog-result-addresses" ); this._bridgeGrid.replaceChildren(); - for (const bridgeLine of this._result.bridges) { + const bridgeResult = loxId ? Lox.getBridges(loxId) : this._result.addresses; + + for (const bridgeLine of bridgeResult) { let details; try { details = TorParsers.parseBridgeLine(bridgeLine); @@ -305,6 +496,11 @@ const gProvideBridgeDialog = { }, }; +document.subDialogSetDefaultFocus = () => { + // Set the focus to the text area on load. + gProvideBridgeDialog.takeFocus(); +}; + window.addEventListener( "DOMContentLoaded", () => { ===================================== browser/components/torpreferences/content/provideBridgeDialog.xhtml ===================================== @@ -48,8 +48,15 @@ <html:div id="user-provide-bridge-message-area"> <html:span id="user-provide-bridge-error-message" + role="alert" aria-live="assertive" ></html:span> + <html:span + id="user-provide-bridge-connecting" + role="alert" + tabindex="0" + data-l10n-id="user-provide-bridge-dialog-connecting" + ></html:span> </html:div> </html:div> <html:div id="user-provide-bridge-result-page"> ===================================== browser/components/torpreferences/content/torPreferences.css ===================================== @@ -161,6 +161,10 @@ display: none; } +#tor-bridges-current:not(.source-lox) #tor-bridges-lox-label { + display: none; +} + #tor-bridges-current:not( .source-user, .source-requested @@ -168,6 +172,10 @@ display: none; } +#tor-bridges-current:not(.source-lox) #tor-bridges-lox-status { + display: none; +} + #tor-bridges-none, #tor-bridges-current { margin-inline: 0; @@ -214,6 +222,24 @@ flex: 0 0 auto; } +#tor-bridges-lox-label { + display: flex; + align-items: center; + gap: 6px; +} + +#tor-bridges-lox-label > * { + flex: 0 0 auto; +} + +#tor-bridges-lox-label-icon { + content: url("chrome://browser/content/torpreferences/lox-bridge-pass.svg"); + width: 16px; + height: 16px; + -moz-context-properties: fill; + fill: var(--in-content-icon-color); +} + #tor-bridges-current-heading { margin: 0; margin-inline-end: 2em; @@ -397,11 +423,14 @@ clip-path: inset(50%); } -#tor-bridges-share { +.tor-bridges-details-box { margin-block-start: 24px; border-radius: 4px; border: 1px solid var(--in-content-border-color); padding: 16px; +} + +#tor-bridges-share { display: grid; grid-template: "heading heading heading" min-content @@ -452,6 +481,169 @@ fill: currentColor; } +#tor-bridges-lox-status { + margin-block-start: 8px; +} + +#tor-bridges-lox-status:not(.show-next-unlock) #tor-bridges-lox-details { + display: none; +} + +#tor-bridges-lox-status:not(.show-unlock-alert) #tor-bridges-lox-unlock-alert { + display: none; +} + +.tor-bridges-lox-box { + display: grid; + grid-template: + "image intro intro" min-content + ". list list" auto + ". invites button" min-content + / min-content 1fr max-content; + align-items: start; + gap: 0 8px; +} + +.tor-bridges-lox-image-outer { + grid-area: image; + /* The ring is 36px by 36px, but has 4px of padding for a Gaussian blur. */ + width: 44px; + height: 44px; + margin: -4px; + align-self: center; + justify-self: center; + /* fill is the progress, stroke is the empty ring. */ + -moz-context-properties: fill, stroke; + fill: var(--in-content-success-icon-color); + stroke: var(--in-content-border-color); + content: url("chrome://browser/content/torpreferences/lox-progress-ring.svg"); +} + +#tor-bridges-lox-unlock-alert.lox-unlock-upgrade .tor-bridges-lox-image-outer { + content: url("chrome://browser/content/torpreferences/lox-complete-ring.svg"); +} + +.tor-bridges-lox-image-inner { + grid-area: image; + /* Extra 4px space for gaussian blur. */ + width: 16px; + height: 16px; + align-self: center; + justify-self: center; + -moz-context-properties: fill; + fill: var(--in-content-icon-color); +} + +#tor-bridges-lox-details .tor-bridges-lox-image-inner { + content: url("chrome://browser/content/torpreferences/lox-bridge-pass.svg"); +} + +#tor-bridges-lox-unlock-alert .tor-bridges-lox-image-inner { + content: url("chrome://browser/content/torpreferences/bridge.svg"); +} + +#tor-bridges-lox-unlock-alert.lox-unlock-upgrade .tor-bridges-lox-image-inner { + content: url("chrome://browser/content/torpreferences/lox-success.svg"); +} + +.tor-bridges-lox-intro { + grid-area: intro; + font-weight: 700; + align-self: center; +} + +.tor-bridges-lox-list { + grid-area: list; + margin: 0; + padding: 0; + display: grid; + /* Align the icons, as if list markers. */ + grid-template-columns: max-content 1fr; + align-items: start; +} + +.tor-bridges-lox-list-item { + display: contents; +} + +.tor-bridges-lox-list-item::before { + /* We use ::before rather than list-style-image to have more control. */ + display: block; + box-sizing: content-box; + width: 18px; + height: 18px; + margin-inline: 4px 6px; + /* We want the icons to be center-aligned relative to the *first* line. */ + /* TODO: After firefox 120, can use line-height unit "lh" to do proper + * center-alignment: calc((1lh - 18px) / 2) + * For now, we use 3.4ex as an approximation for 1lh */ + margin-block-start: calc((3.4ex - 18px) / 2); + /* fill is the icon color, stroke is the border color. */ + -moz-context-properties: fill, stroke; + fill: var(--in-content-icon-color); +} + +.tor-bridges-lox-list-item-bridge::before { + content: url("chrome://browser/content/torpreferences/lox-bridge-icon.svg"); +} + +.tor-bridges-lox-list-item-invite::before { + content: url("chrome://browser/content/torpreferences/lox-invite-icon.svg"); +} + +#tor-bridges-lox-details .tor-bridges-lox-list-item::before { + stroke: var(--in-content-border-color); +} + +#tor-bridges-lox-unlock-alert .tor-bridges-lox-list-item::before { + stroke: var(--in-content-success-icon-color); +} + +#tor-bridges-lox-details:not(.lox-next-gain-bridges) #tor-bridges-lox-next-unlock-gain-bridges { + display: none; +} + +#tor-bridges-lox-details:not(.lox-next-first-invites) #tor-bridges-lox-next-unlock-first-invites { + display: none; +} + +#tor-bridges-lox-details:not(.lox-next-more-invites) #tor-bridges-lox-next-unlock-more-invites { + display: none; +} + + +#tor-bridges-lox-unlock-alert:not(.lox-unlock-gain-bridges) #tor-bridges-lox-unlock-alert-gain-bridges { + display: none; +} + +#tor-bridges-lox-unlock-alert:not(.lox-unlock-new-bridges) #tor-bridges-lox-unlock-alert-new-bridges { + display: none; +} + +#tor-bridges-lox-unlock-alert:not(.lox-unlock-invites) #tor-bridges-lox-unlock-alert-invites { + display: none; +} + +#tor-bridges-lox-remaining-invites { + grid-area: invites; + justify-self: end; + align-self: center; +} + +#tor-bridges-lox-details:not(.lox-has-invites) :is( + #tor-bridges-lox-remaining-invites, + #tor-bridges-lox-show-invites-button +) { + display: none; +} + +.tor-bridges-lox-button { + grid-area: button; + margin: 0; + line-height: 1; + align-self: center; +} + #tor-bridges-provider-heading { font-size: 1.14em; margin-block: 48px 8px; @@ -723,6 +915,15 @@ groupbox#torPreferences-bridges-group textarea { display: none; } +#user-provide-bridge-connecting { + color: var(--text-color-deemphasized); + /* TODO: Add spinner ::before */ +} + +#user-provide-bridge-connecting:not(.show-connecting) { + display: none; +} + #user-provide-bridge-result-page { flex: 1 1 0; min-height: 0; ===================================== browser/components/torpreferences/jar.mn ===================================== @@ -3,6 +3,12 @@ browser.jar: content/browser/torpreferences/bridge-qr.svg (content/bridge-qr.svg) content/browser/torpreferences/telegram-logo.svg (content/telegram-logo.svg) content/browser/torpreferences/bridge-bot.svg (content/bridge-bot.svg) + content/browser/torpreferences/lox-invite-icon.svg (content/lox-invite-icon.svg) + content/browser/torpreferences/lox-bridge-icon.svg (content/lox-bridge-icon.svg) + content/browser/torpreferences/lox-bridge-pass.svg (content/lox-bridge-pass.svg) + content/browser/torpreferences/lox-success.svg (content/lox-success.svg) + content/browser/torpreferences/lox-complete-ring.svg (content/lox-complete-ring.svg) + content/browser/torpreferences/lox-progress-ring.svg (content/lox-progress-ring.svg) content/browser/torpreferences/bridgeQrDialog.xhtml (content/bridgeQrDialog.xhtml) content/browser/torpreferences/bridgeQrDialog.js (content/bridgeQrDialog.js) content/browser/torpreferences/builtinBridgeDialog.xhtml (content/builtinBridgeDialog.xhtml) ===================================== browser/locales/en-US/browser/tor-browser.ftl ===================================== @@ -56,6 +56,10 @@ tor-bridges-your-bridges = Your bridges tor-bridges-source-user = Added by you tor-bridges-source-built-in = Built-in tor-bridges-source-requested = Requested from Tor +# Here "Bridge pass" is a noun: a bridge pass gives users access to some tor bridges. +# So "pass" is referring to something that gives permission or access. Similar to "token", "permit" or "voucher", but for permanent use rather than one-time. +# This is shown when the user is getting their bridges from Lox. +tor-bridges-source-lox = Bridge pass # The "..." menu button for all current bridges. tor-bridges-options-button = .title = All bridges @@ -116,12 +120,75 @@ tor-bridges-update-changed-bridges = Your Tor bridges have changed. # Shown for requested bridges and bridges added by the user. tor-bridges-share-heading = Help others connect -# tor-bridges-share-description = Share your bridges with trusted contacts. tor-bridges-copy-addresses-button = Copy addresses tor-bridges-qr-addresses-button = .title = Show QR code +# Shown when using a "bridge pass", i.e. using Lox. +# Here "bridge pass" is a noun: a bridge pass gives users access to some tor bridges. +# So "pass" is referring to something that gives permission or access. Similar to "token", "permit" or "voucher", but for permanent use rather than one-time. +# Here "bridge bot" refers to a service that automatically gives out bridges for the user to use, i.e. the Lox authority. +tor-bridges-lox-description = With a bridge pass, the bridge bot will send you new bridges when your bridges get blocked. If your bridges don’t get blocked, you’ll unlock invites that let you share bridges with trusted contacts. +# The number of days until the user's "bridge pass" is upgraded. +# $numDays (Number) - The number of days until the next upgrade, an integer (1 or higher). +# The "[one]" and "[other]" are special Fluent syntax to mark plural categories that depend on the value of "$numDays". You can use any number of plural categories that work for your locale: "[zero]", "[one]", "[two]", "[few]", "[many]" and/or "[other]". The "*" marks a category as default, and is required. +# See https://projectfluent.org/fluent/guide/selectors.html . +# So in English, the first form will be used if $numDays is "1" (singular) and the second form will be used if $numDays is anything else (plural). +tor-bridges-lox-days-until-unlock = + { $numDays -> + [one] { $numDays } day until you unlock: + *[other] { $numDays } days until you unlock: + } +# This is shown as a list item after "N days until you unlock:" when the user will gain two more bridges in the future. +# Here "bridge bot" refers to a service that automatically gives out bridges for the user to use, i.e. the Lox authority. +tor-bridges-lox-unlock-two-bridges = +2 bridges from the bridge bot +# This is shown as a list item after "N days until you unlock:" when the user will gain access to invites for the first time. +# Here "invites" is a noun, short for "invitations". +tor-bridges-lox-unlock-first-invites = Invites for your trusted contacts +# This is shown as a list item after "N days until you unlock:" when the user already has invites. +# Here "invites" is a noun, short for "invitations". +tor-bridges-lox-unlock-more-invites = More invites for your trusted contacts +# Here "invite" is a noun, short for "invitation". +# $numInvites (Number) - The number of invites remaining, an integer (0 or higher). +# The "[one]" and "[other]" are special Fluent syntax to mark plural categories that depend on the value of "$numInvites". You can use any number of plural categories that work for your locale: "[zero]", "[one]", "[two]", "[few]", "[many]" and/or "[other]". The "*" marks a category as default, and is required. +# See https://projectfluent.org/fluent/guide/selectors.html . +# So in English, the first form will be used if $numInvites is "1" (singular) and the second form will be used if $numInvites is anything else (plural). +tor-bridges-lox-remaining-invites = + { $numInvites -> + [one] { $numInvites } invite remaining + *[other] { $numInvites } invites remaining + } +# Here "invites" is a noun, short for "invitations". +tor-bridges-lox-show-invites-button = Show invites + +# Shown when the user's "bridge pass" has been upgraded. +# Here "bridge pass" is a noun: a bridge pass gives users access to some tor bridges. +# So "pass" is referring to something that gives permission or access. Similar to "token", "permit" or "voucher", but for permanent use rather than one-time. +tor-bridges-lox-upgrade = Your bridge pass has been upgraded! +# Shown when the user's bridges accessed through "bridge pass" have been blocked. +tor-bridges-lox-blocked = Your blocked bridges have been replaced +# Shown *after* the user has had their blocked bridges replaced. +# Here "bridge bot" refers to a service that automatically gives out bridges for the user to use, i.e. the Lox authority. +tor-bridges-lox-new-bridges = New bridges from the bridge bot +# Shown *after* the user has gained two more bridges. +# Here "bridge bot" refers to a service that automatically gives out bridges for the user to use, i.e. the Lox authority. +tor-bridges-lox-gained-two-bridges = +2 bridges from the bridge bot +# Shown *after* a user's "bridge pass" has changed. +# Here "invite" is a noun, short for "invitation". +# $numInvites (Number) - The number of invites remaining, an integer (0 or higher). +# The "[one]" and "[other]" are special Fluent syntax to mark plural categories that depend on the value of "$numInvites". You can use any number of plural categories that work for your locale: "[zero]", "[one]", "[two]", "[few]", "[many]" and/or "[other]". The "*" marks a category as default, and is required. +# See https://projectfluent.org/fluent/guide/selectors.html . +# So in English, the first form will be used if $numInvites is "1" (singular) and the second form will be used if $numInvites is anything else (plural). +tor-bridges-lox-new-invites = + { $numInvites -> + [one] You now have { $numInvites } remaining invite for your trusted contacts + *[other] You now have { $numInvites } remaining invites for your trusted contacts + } +# Button for the user to acknowledge a change in their "bridge pass". +tor-bridges-lox-got-it-button = Got it + + # Shown as a heading when the user has no current bridges. tor-bridges-add-bridges-heading = Add bridges # Shown as a heading when the user has existing bridges that can be replaced. @@ -182,13 +249,50 @@ user-provide-bridge-dialog-description = Use bridges provided by a trusted organ user-provide-bridge-dialog-learn-more = Learn more # Short accessible name for the bridge addresses text area. user-provide-bridge-dialog-textarea-addresses-label = Bridge addresses +# Here "invite" is a noun, short for "invitation". +# Short accessible name for text area when it can accept either bridge address or a single "bridge pass" invite. +user-provide-bridge-dialog-textarea-addresses-or-invite-label = Bridge addresses or invite # Placeholder shown when adding new bridge addresses. user-provide-bridge-dialog-textarea-addresses = .placeholder = Paste your bridge addresses here +# Placeholder shown when the user can add new bridge addresses or a single "bridge pass" invite. +# Here "bridge pass invite" is a noun: a bridge pass invite can be shared with other users to give them their own bridge pass, so they can get access to tor bridges. +# So "pass" is referring to something that gives permission or access. Similar to "token", "permit" or "voucher", but for permanent use rather than one-time. +# And "invite" is simply short for "invitation". +# NOTE: "invite" is singular, whilst "addresses" is plural. +user-provide-bridge-dialog-textarea-addresses-or-invite = + .placeholder = Paste your bridge addresses or a bridge pass invite here # Error shown when one of the address lines is invalid. # $line (Number) - The line number for the invalid address. user-provide-bridge-dialog-address-error = Incorrectly formatted bridge address on line { $line }. +# Error shown when the user has entered more than one "bridge pass" invite. +# Here "invite" is a noun, short for "invitation". +user-provide-bridge-dialog-multiple-invites-error = Cannot include more than one invite. +# Error shown when the user has mixed their invite with addresses. +# Here "invite" is a noun, short for "invitation". +user-provide-bridge-dialog-mixed-error = Cannot mix bridge addresses with an invite. +# Error shown when the user has entered an invite when it is not supported. +# Here "bridge pass invite" is a noun: a bridge pass invite can be shared with other users to give them their own bridge pass, so they can get access to tor bridges. +# So "pass" is referring to something that gives permission or access. Similar to "token", "permit" or "voucher", but for permanent use rather than one-time. +# And "invite" is simply short for "invitation". +user-provide-bridge-dialog-invite-not-allowed-error = Cannot include a bridge pass invite. +# Error shown when the invite was not accepted by the server. +user-provide-bridge-dialog-bad-invite-error = Invite was not accepted. Try a different one. +# Error shown when the "bridge pass" server does not respond. +# Here "bridge pass" is a noun: a bridge pass gives users access to some tor bridges. +# So "pass" is referring to something that gives permission or access. Similar to "token", "permit" or "voucher", but for permanent use rather than one-time. +user-provide-bridge-dialog-no-server-error = Unable to connect to bridge pass server. +# Generic error when an invite failed. +# Here "invite" is a noun, short for "invitation". +user-provide-bridge-dialog-generic-invite-error = Failed to redeem invite. + +# Here "bridge pass" is a noun: a bridge pass gives users access to some tor bridges. +# So "pass" is referring to something that gives permission or access. Similar to "token", "permit" or "voucher", but for permanent use rather than one-time. +user-provide-bridge-dialog-connecting = Connecting to bridge pass server… +# Shown after the user has entered a "bridge pass" invite. +user-provide-bridge-dialog-result-invite = The following bridges were shared with you. +# Shown after the user has entered bridge addresses. user-provide-bridge-dialog-result-addresses = The following bridges were entered by you. user-provide-bridge-dialog-next-button = .label = Next ===================================== toolkit/components/lox/Lox.sys.mjs ===================================== @@ -128,12 +128,12 @@ class LoxImpl { } /** - * Formats and returns bridges from the stored Lox credential + * Formats and returns bridges from the stored Lox credential. * - * @param {string} loxid The id string associated with a lox credential + * @param {string} loxid The id string associated with a lox credential. * * @returns {string[]} An array of formatted bridge lines. The array is empty - * if there are no bridges. + * if there are no bridges. */ getBridges(loxid) { if (!this.#initialized) { @@ -250,6 +250,7 @@ class LoxImpl { this.#pubKeyPromise = this.#makeRequest("pubkeys", []) .then(pubKeys => { this.#pubKeys = JSON.stringify(pubKeys); + this.#store(); }) .catch(() => { // We always try to update, but if that doesn't work fall back to stored data @@ -266,6 +267,7 @@ class LoxImpl { this.#encTablePromise = this.#makeRequest("reachability", []) .then(encTable => { this.#encTable = JSON.stringify(encTable); + this.#store(); }) .catch(() => { // Try to update first, but if that doesn't work fall back to stored data @@ -283,6 +285,7 @@ class LoxImpl { this.#constantsPromise = this.#makeRequest("constants", []) .then(constants => { this.#constants = JSON.stringify(constants); + this.#store(); }) .catch(() => { if (!this.#constants) { @@ -389,18 +392,17 @@ class LoxImpl { } /** - * Parses an input string to check if it is a valid Lox invitation + * Parses an input string to check if it is a valid Lox invitation. * - * @param {string} invite A Lox invitation - * @returns {Promise<bool>} A promise that resolves to true if the value passed - * in was a Lox invitation and false if it is not + * @param {string} invite A Lox invitation. + * @returns {bool} Whether the value passed in was a Lox invitation. */ - async validateInvitation(invite) { + validateInvitation(invite) { if (!this.#initialized) { throw new LoxError(LoxErrors.NotInitialized); } try { - await lazy.invitation_is_trusted(invite); + lazy.invitation_is_trusted(invite); } catch (err) { console.log(err); return false; @@ -420,22 +422,27 @@ class LoxImpl { } /** - * Redeems a Lox invitation to obtain a credential and bridges + * Redeems a Lox invitation to obtain a credential and bridges. * - * @param {string} invite A Lox invitation - * @returns {Promise<string>} A promise with the loxid of the associated credential on success + * @param {string} invite A Lox invitation. + * @returns {string} The loxid of the associated credential on success. */ async redeemInvite(invite) { if (!this.#initialized) { throw new LoxError(LoxErrors.NotInitialized); } await this.#getPubKeys(); - let request = await lazy.open_invite(invite.invite); + let request = await lazy.open_invite(JSON.parse(invite).invite); let id = this.#genLoxId(); - let response = await this.#makeRequest( - "openreq", - JSON.parse(request).request - ); + let response; + try { + response = await this.#makeRequest( + "openreq", + JSON.parse(request).request + ); + } catch { + throw new LoxError(LoxErrors.LoxServerUnreachable); + } console.log("openreq response: ", response); if (response.hasOwnProperty("error")) { throw new LoxError(LoxErrors.BadInvite); @@ -451,9 +458,9 @@ class LoxImpl { } /** - * Get metadata on all invites historically generated by this credential + * Get metadata on all invites historically generated by this credential. * - * @returns {object[]} A list of all historical invites + * @returns {string[]} A list of all historical invites. */ getInvites() { if (!this.#initialized) { @@ -463,12 +470,14 @@ class LoxImpl { } /** - * Generates a new trusted Lox invitation that a user can pass to their contacts + * Generates a new trusted Lox invitation that a user can pass to their + * contacts. * - * @returns {Promise<string>} A promise that resolves to a valid Lox invitation. The promise - * will reject if: - * - there is no saved Lox credential - * - the saved credential does not have any invitations available + * Throws if: + * - there is no saved Lox credential, or + * - the saved credential does not have any invitations available. + * + * @returns {string} A valid Lox invitation. */ async generateInvite() { if (!this.#initialized) { @@ -514,11 +523,10 @@ class LoxImpl { } /** - * Get the number of invites that a user has remaining + * Get the number of invites that a user has remaining. * - * @returns {Promise<int>} A promise with the number of invites that can still be generated - * by a user's credential. This promise will reject if: - * - There is no credential + * @returns {int} The number of invites that can still be generated by a + * user's credential. */ getRemainingInviteCount() { if (!this.#initialized) { @@ -691,11 +699,10 @@ class LoxImpl { */ /** - * Get a list of accumulated events + * Get a list of accumulated events. * - * @returns {Promise<EventData[]>} A promise with a list of the accumulated, - * unacknowledged events associated with a user's credential. This promise will reject if - * - There is no credential + * @returns {EventData[]} A list of the accumulated, unacknowledged events + * associated with a user's credential. */ getEventData() { if (!this.#initialized) { @@ -709,7 +716,7 @@ class LoxImpl { } /** - * Clears accumulated event data + * Clears accumulated event data. */ clearEventData() { if (!this.#initialized) { @@ -720,7 +727,7 @@ class LoxImpl { } /** - * Clears accumulated invitations + * Clears accumulated invitations. */ clearInvites() { if (!this.#initialized) { @@ -739,7 +746,9 @@ class LoxImpl { */ /** - * Get dates at which access to new features will unlock + * Get details about the next feature unlock. + * + * @returns {UnlockData} - Details about the next unlock. */ async getNextUnlock() { if (!this.#initialized) { @@ -753,10 +762,10 @@ class LoxImpl { let nextUnlocks = JSON.parse( lazy.get_next_unlock(this.#constants, this.#credentials[loxid]) ); - const level = lazy.get_trust_level(this.#credentials[loxid]); + const level = parseInt(lazy.get_trust_level(this.#credentials[loxid])); const unlocks = { date: nextUnlocks.trust_level_unlock_date, - level: level + 1, + nextLevel: level + 1, }; return unlocks; } View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/compare/fd4565… -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/compare/fd4565… You're receiving this email because of your account on gitlab.torproject.org.

1 0

2024

2023

2022

2021

2020

2019

2018

2017

2016

2015

2014

tbb-commits January 2024