Verified Commit 887f0390 authored by Pier Angelo Vendrame's avatar Pier Angelo Vendrame 🎃 Committed by ma1
Browse files

Temporary changes to about:torconnect for Android.

We are planning of tempoorarily using about:torconnect on Android, until
the native UX is ready.
parent 6c6898ab
Loading
Loading
Loading
Loading
+8 −1
Original line number Diff line number Diff line
@@ -49,6 +49,7 @@ public class TorIntegrationAndroid implements BundleEventListener {
    private static final String EVENT_TOR_LOGS = "GeckoView:Tor:Logs";
    private static final String EVENT_SETTINGS_READY = "GeckoView:Tor:SettingsReady";
    private static final String EVENT_SETTINGS_CHANGED = "GeckoView:Tor:SettingsChanged";
    private static final String EVENT_SETTINGS_OPEN = "GeckoView:Tor:OpenSettings";

    // Events we emit
    private static final String EVENT_SETTINGS_GET = "GeckoView:Tor:SettingsGet";
@@ -118,7 +119,8 @@ public class TorIntegrationAndroid implements BundleEventListener {
                        EVENT_CONNECT_ERROR,
                        EVENT_BOOTSTRAP_PROGRESS,
                        EVENT_BOOTSTRAP_COMPLETE,
                        EVENT_TOR_LOGS);
                        EVENT_TOR_LOGS,
                        EVENT_SETTINGS_OPEN);
    }

    @Override // BundleEventListener
@@ -175,6 +177,10 @@ public class TorIntegrationAndroid implements BundleEventListener {
            for (TorLogListener listener: mLogListeners) {
                    listener.onLog(type, msg);
            }
        } else if (EVENT_SETTINGS_OPEN.equals(event)) {
            for (BootstrapStateChangeListener listener: mBootstrapStateListeners) {
                listener.onSettingsRequested();
            }
        }
    }

@@ -573,6 +579,7 @@ public class TorIntegrationAndroid implements BundleEventListener {
        void onBootstrapProgress(double progress, boolean hasWarnings);
        void onBootstrapComplete();
        void onBootstrapError(String code, String message, String phase, String reason);
        void onSettingsRequested();
    }

    public interface TorLogListener {
+144 −0
Original line number Diff line number Diff line
@@ -9,6 +9,11 @@
  --onion-color: var(--card-outline-color);
}

html {
  width: 100%;
  height: 100%;
}

input[type="checkbox"]:focus, select:focus {
  outline:  none!important;
  box-shadow: 0 0 0 3px var(--purple-30) !important;
@@ -349,3 +354,142 @@ body.aboutTorConnect .title.location {
  background-image: url("chrome://global/content/torconnect/connection-location.svg");
  stroke: var(--warning-color);
}

:root {
  --android-dark-accents-buttons: #9059FF;
  --android-dark-background-secondary: #E1E0E7;
  --android-dark-text-primary: #FBFBFE;
  --android-light-text-primary: #15141A;
}

[hidden=true] {
  display: none !important;
}

body.android {
  --onion-color: var(--android-dark-text-primary);
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 0 24px !important;
  color: var(--onion-color);
  background: linear-gradient(194deg, #692E9D -0.93%, #393270 48.91%);
  font: menu;
  font-size: 14px;
  display: flex;
}

.android #connectPageContainer {
  max-width: none;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.android #breadcrumbs {
  display: none;
}

.android #text-container {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.android .title {
  background-position: left 0;
  background-repeat: no-repeat;
  background-size: 40px;
  padding-top: 64px;
  font-size: 22px;
  line-height: 28px;
}

.android h1 {
  font-weight: normal;
  font-size: 100%;
  margin: 0 0 16px 0;
}

.android p {
  margin: 0;
  padding-bottom: 8px;
  line-height: 20px;
}

.android #quickstartContainer {
  margin-top: 24px;
}

.android .button-container {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.android #locationDropdown {
  width: 100%;
  max-width: none;
  margin: 0;
}

.android select {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--android-dark-text-primary);
  color: var(--android-dark-text-primary);
  display: block;
  width: 100%;
  margin-top: 10px;
  padding: 8px;
}

.android #buttonPadding {
  flex: 1;
}

body:not(.android) #connectButtonContainer {
  /* Use the .button-container context */
  display: contents;
}

.android #connectButtonContainer {
  width: 100%;
  padding-bottom: 18px;
  display: grid;
}

/* Be sure not to match the togglee */
.android #connectButtonContainer button {
  display: block;
  width: 100%;
  margin: 4px 0;
  padding: 11px 30px;
  font-size: 14px;
  font-weight: 500;
  border: none;
  border-radius: 4px;
}

.android #connectButton, .android #tryBridgeButton, .android #configureButton.primary {
  color: var(--android-dark-text-primary);
  background-color: var(--android-dark-accents-buttons);
}

.android #configureButton {
  order: 1;
}

.android #restartButton {
  order: 2;
}

.android #restartButton, .android #cancelButton, .android #configureButton {
  color: var(--android-light-text-primary);
  background-color: var(--android-dark-background-secondary);
}

.android .onion-pattern-container {
  display: none;
}
+10 −6
Original line number Diff line number Diff line
@@ -6,6 +6,7 @@
      http-equiv="Content-Security-Policy"
      content="default-src chrome:; object-src 'none'"
    />
    <meta name="viewport" content="width=device-width" />
    <link
      rel="stylesheet"
      href="chrome://global/content/torconnect/aboutTorConnect.css"
@@ -64,16 +65,19 @@
          <moz-toggle id="quickstartToggle" label-align-after=""></moz-toggle>
        </div>

        <div id="connectButtonContainer" class="button-container">
          <button id="restartButton" hidden="true"></button>
          <button id="configureButton" hidden="true"></button>
          <button id="cancelButton" hidden="true"></button>
          <button id="connectButton" class="primary" hidden="true"></button>
        <div class="button-container">
          <label id="locationDropdownLabel" for="countries"></label>
          <form id="locationDropdown" hidden="true">
            <select id="countries"></select>
          </form>
          <span id="buttonPadding"></span>
          <span id="connectButtonContainer">
            <button id="restartButton" hidden="true"></button>
            <button id="configureButton" hidden="true"></button>
            <button id="cancelButton" hidden="true"></button>
            <button id="connectButton" class="primary" hidden="true"></button>
            <button id="tryBridgeButton" class="primary" hidden="true"></button>
          </span>
        </div>
      </div>
    </div>
+5 −2
Original line number Diff line number Diff line
@@ -69,8 +69,8 @@ class AboutTorConnect {
      connect: "button#connectButton",
      tryBridge: "button#tryBridgeButton",
      locationDropdownLabel: "#locationDropdownLabel",
      locationDropdown: "form#locationDropdown",
      locationDropdownSelect: "form#locationDropdown select",
      locationDropdown: "#locationDropdown",
      locationDropdownSelect: "#locationDropdown select",
    },
  });

@@ -718,6 +718,9 @@ class AboutTorConnect {
  }

  initElements(direction) {
    const isAndroid = navigator.userAgent.includes("Android");
    document.body.classList.toggle("android", isAndroid);

    document.documentElement.setAttribute("dir", direction);

    this.elements.connectToTorLink.addEventListener("click", event => {
+7 −0
Original line number Diff line number Diff line
@@ -8,6 +8,7 @@ const lazy = {};

ChromeUtils.defineESModuleGetters(lazy, {
  ConsoleAPI: "resource://gre/modules/Console.sys.mjs",
  EventDispatcher: "resource://gre/modules/Messaging.sys.mjs",
  MoatRPC: "resource://gre/modules/Moat.sys.mjs",
  TorBootstrapRequest: "resource://gre/modules/TorBootstrapRequest.sys.mjs",
  TorProviderBuilder: "resource://gre/modules/TorProviderBuilder.sys.mjs",
@@ -1183,6 +1184,12 @@ export const TorConnect = {
    Further external commands and helper methods
   */
  openTorPreferences() {
    if (lazy.TorLauncherUtil.isAndroid) {
      lazy.EventDispatcher.instance.sendRequest({
        type: "GeckoView:Tor:OpenSettings",
      });
      return;
    }
    const win = lazy.BrowserWindowTracker.getTopWindow();
    win.switchToTabHavingURI("about:preferences#connection", true);
  },