commit 61deb44d0c07eb1ec1d71eac2f0a7aeca87ea054 Author: Igor Oliveira igt0@torproject.org Date: Wed Aug 29 07:31:26 2018 -0300
Bug 27111: Update about:tor desktop version to work on mobile
Update torbutton, aboutTor(markup and styling) to work on mobile. --- src/chrome/content/aboutTor/aboutTor-content.js | 3 ++ src/chrome/content/aboutTor/aboutTor.xhtml | 2 ++ src/chrome/content/torbutton.js | 23 +++++++++++---- src/chrome/skin/aboutTor.css | 36 ++++++++++++++++++++++++ src/chrome/skin/torbrowser_mobile_logo.png | Bin 0 -> 9345 bytes 5 files changed, 59 insertions(+), 5 deletions(-)
diff --git a/src/chrome/content/aboutTor/aboutTor-content.js b/src/chrome/content/aboutTor/aboutTor-content.js index e8f5ffa2..d34bbe5c 100644 --- a/src/chrome/content/aboutTor/aboutTor-content.js +++ b/src/chrome/content/aboutTor/aboutTor-content.js @@ -119,6 +119,9 @@ var AboutTorListener = { else body.removeAttribute("showmanual");
+ if (aData.mobile) + body.setAttribute("mobile", "yes"); + // Setting body.initialized="yes" displays the body. body.setAttribute("initialized", "yes"); }, diff --git a/src/chrome/content/aboutTor/aboutTor.xhtml b/src/chrome/content/aboutTor/aboutTor.xhtml index 9256748e..94dd13f3 100644 --- a/src/chrome/content/aboutTor/aboutTor.xhtml +++ b/src/chrome/content/aboutTor/aboutTor.xhtml @@ -18,6 +18,7 @@
<html xmlns="http://www.w3.org/1999/xhtml"> <head> + <meta name="viewport" content="width=device-width, initial-scale=1"/> <title>&aboutTor.title;</title> <link rel="stylesheet" type="text/css" media="all" href="resource://torbutton-assets/aboutTor.css"/> @@ -73,6 +74,7 @@ window.addEventListener("pageshow", function() { </script> <div id="torstatus-version"/> <div class="torcontent-container"> + <img class="torcontent-logo" src="resource://torbutton-assets/torbrowser_mobile_logo.png"/> <div id="torstatus" class="top"> <div id="torstatus-on-container" class="hideIfTorOff torstatus-container"> <div class="heading1">&aboutTor.ready.label;</div> diff --git a/src/chrome/content/torbutton.js b/src/chrome/content/torbutton.js index 90da5827..ee13f461 100644 --- a/src/chrome/content/torbutton.js +++ b/src/chrome/content/torbutton.js @@ -238,6 +238,10 @@ function torbutton_donation_banner_countdown() { } }
+function torbutton_is_mobile() { + return Services.appinfo.OS === "Android"; +} + // Bug 1506 P2-P4: This code sets some version variables that are irrelevant. // It does read out some important environment variables, though. It is // called once per browser window.. This might belong in a component. @@ -408,11 +412,19 @@ function torbutton_init() { torbutton_update_toolbutton(); torbutton_notify_if_update_needed();
- createTorCircuitDisplay(m_tb_control_ipc_file, m_tb_control_host, - m_tb_control_port, m_tb_control_pass, - "extensions.torbutton.display_circuit"); + try { + createTorCircuitDisplay(m_tb_control_ipc_file, m_tb_control_host, + m_tb_control_port, m_tb_control_pass, + "extensions.torbutton.display_circuit"); + } catch(e) { + torbutton_log(4, "Error creating the tor circuit display " + e); + }
- torbutton_init_user_manual_links(); + try { + torbutton_init_user_manual_links(); + } catch(e) { + torbutton_log(4, "Error loading the user manual " + e); + }
// Arrange for our about:tor content script to be loaded in each frame. window.messageManager.loadFrameScript( @@ -449,6 +461,7 @@ var torbutton_abouttor_message_handler = { // not working. get chromeData() { return { + mobile: torbutton_is_mobile(), torOn: torbutton_tor_check_ok() }; } @@ -1932,7 +1945,7 @@ function showSecurityPreferencesPanel(chromeWindow) { }
function setupPreferencesForMobile() { - if (Services.appinfo.OS !== "Android") { + if (!torbutton_is_mobile()) { return; }
diff --git a/src/chrome/skin/aboutTor.css b/src/chrome/skin/aboutTor.css index 9f195cfd..60035a24 100644 --- a/src/chrome/skin/aboutTor.css +++ b/src/chrome/skin/aboutTor.css @@ -199,6 +199,8 @@ body:not([showmanual]) .showForManual { width: 100%; max-width: 2200px; /* room for our 20 circles */ overflow: hidden; + position: absolute; + bottom: 0px; }
.onion-pattern-row { @@ -395,3 +397,37 @@ body[show-donation-banner="true"] #onboarding-overlay-button { transition: transform 0ms; position: absolute; } + +/* + * Mobile specific css + */ + +.torcontent-logo { + display: none; +} + +body[mobile] #torstatus-version, +body[mobile] .searchbox, +body[mobile] .top .heading2, +body[mobile] #bottom { + display: none; +} + +body[mobile] .top { + white-space: normal; + margin-top: 0px !important; +} + +body[mobile] .torcontent-logo { + display: block; + margin-top: 20px; + width: 50%; + height: auto; + margin-left: auto; + margin-right: auto; +} + +body[mobile] .top .heading1 { + font-size: 62px; + line-height: 1.1 +} diff --git a/src/chrome/skin/torbrowser_mobile_logo.png b/src/chrome/skin/torbrowser_mobile_logo.png new file mode 100644 index 00000000..9d8317f0 Binary files /dev/null and b/src/chrome/skin/torbrowser_mobile_logo.png differ