summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorjessib <jessib@riseup.net>2013-10-15 11:10:31 -0700
committerjessib <jessib@riseup.net>2013-10-15 11:10:31 -0700
commita6f196d0bfe632408db7350829507478b825b1a8 (patch)
treeba2de17a08c11619a74a0be6cf4c3939a2b9f223
parent0acbf6a158f149c1f4273bde0cfca47547e080f8 (diff)
parent8e5aa5093ab6e67db4f603a44bb7027245b91a21 (diff)
Merge pull request #99 from azul/feature/os-detection
detect os in browser and show proper download link
-rw-r--r--app/assets/javascripts/application.js3
-rw-r--r--app/assets/stylesheets/leap.scss85
-rw-r--r--app/helpers/application_helper.rb23
-rw-r--r--core/app/assets/javascripts/platform.js92
-rw-r--r--core/app/helpers/core_helper.rb38
-rw-r--r--core/app/views/common/_download_for_os.html.haml16
-rw-r--r--core/app/views/common/_home_page_buttons.html.haml5
-rw-r--r--core/config/locales/en.yml12
-rw-r--r--public/leap-img/128/mask.pngbin0 -> 10080 bytes
-rw-r--r--test/integration/home_test.rb24
10 files changed, 277 insertions, 21 deletions
diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index cd90934..03a40da 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -16,9 +16,8 @@
//= require bootstrap
//= require rails.validations
//= require rails.validations.simple_form
-
//= require leap
+//= require platform
//= require tickets
//= require users
-
//= require_tree .
diff --git a/app/assets/stylesheets/leap.scss b/app/assets/stylesheets/leap.scss
index b382773..30f7741 100644
--- a/app/assets/stylesheets/leap.scss
+++ b/app/assets/stylesheets/leap.scss
@@ -43,25 +43,95 @@
}
//
+// OS specific
+//
+
+.os-android {
+ display: none !important;
+}
+
+html.android .os-android {
+ display: inherit !important;
+}
+
+.os-linux32 {
+ display: none !important;
+}
+
+html.linux .os-linux32 {
+ display: inherit !important;
+}
+
+.os-linux64 {
+ display: none !important;
+}
+
+html.linux64 .os-linux64 {
+ display: inherit !important;
+}
+
+.os-windows {
+ display: none !important;
+}
+
+html.windows .os-windows {
+ display: inherit !important;
+}
+
+.os-mac {
+ display: none !important;
+}
+
+html.mac .os-mac {
+ display: inherit !important;
+}
+
+.os-other {
+ display: none !important;
+}
+
+html.oldmac, html.oldwin, html.ios, html.fxos, html.other {
+ .os-other {
+ display: inherit !important;
+ }
+}
+
+//
// ICONS
//
-[class^="big-icon-"],
-[class*=" big-icon-"] {
+[class*="-icon-"] {
display: inline-block;
- width: 32px;
- height: 32px;
@include ie7-restore-right-whitespace();
- line-height: 32px;
vertical-align: middle;
background-repeat: no-repeat;
margin-top: 1px;
}
+[class^="big-icon-"],
+[class*=" big-icon-"] {
+ width: 32px;
+ height: 32px;
+ line-height: 32px;
+}
+
+[class^="huge-icon-"],
+[class*=" huge-icon-"] {
+ width: 128px;
+ height: 128px;
+ line-height: 128px;
+}
+
+
.big-icon-arrow-down {
background-image: url(/leap-img/32/arrow-down.png)
}
+.huge-icon-mask {
+ height: 64px;
+ background-image: url(/leap-img/128/mask.png)
+}
+
//
// TYPOGRAPHY
//
@@ -152,6 +222,9 @@ input, textarea {
.download {
a.btn {
width: 14em;
+ small {
+ font-weight: normal;
+ }
}
}
a.btn {
@@ -191,4 +264,4 @@ input, textarea {
.overview li {
padding: 6px 0;
-} \ No newline at end of file
+}
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index 1e79990..90e649a 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -19,18 +19,25 @@ module ApplicationHelper
# http://twitter.github.io/bootstrap/base-css.html#icons
#
def icon(name, color=nil)
+ "<i class=\"icon-#{name} #{color_class(color)}\"></i> ".html_safe
+ end
+
+ def big_icon(name, color=nil)
+ "<i class=\"big-icon-#{name} #{color_class(color)}\"></i> ".html_safe
+ end
+
+ def huge_icon(name, color=nil)
+ "<i class=\"huge-icon-#{name} #{color_class(color)}\"></i> ".html_safe
+ end
+
+ def color_class(color)
if color.nil?
- color_class = nil
+ nil
elsif color == :black
- color_class = 'icon-black'
+ 'icon-black'
elsif color == :white
- color_class = 'icon-white'
+ 'icon-white'
end
- "<i class=\"icon-#{name} #{color_class}\"></i> ".html_safe
- end
-
- def big_icon(name, color=nil)
- "<i class=\"big-icon-#{name}\"></i> ".html_safe
end
def format_flash(msg)
diff --git a/core/app/assets/javascripts/platform.js b/core/app/assets/javascripts/platform.js
new file mode 100644
index 0000000..3ab77d7
--- /dev/null
+++ b/core/app/assets/javascripts/platform.js
@@ -0,0 +1,92 @@
+/* Inspired by mozillas platform detection:
+ https://github.com/mozilla/bedrock/tree/master/media/js/base
+*/
+ (function () {
+ 'use strict';
+ function getPlatform() {
+ var ua = navigator.userAgent,
+ pf = navigator.platform;
+ if (/Win(16|9[x58]|NT( [1234]| 5\.0| [^0-9]|[^ -]|$))/.test(ua) ||
+ /Windows ([MC]E|9[x58]|3\.1|4\.10|NT( [1234]| 5\.0| [^0-9]|[^ ]|$))/.test(ua) ||
+ /Windows_95/.test(ua)) {
+ /**
+ * Officially unsupported platforms are Windows 95, 98, ME, NT 4.x, 2000
+ * These regular expressions match:
+ * - Win16
+ * - Win9x
+ * - Win95
+ * - Win98
+ * - WinNT (not followed by version or followed by version <= 5)
+ * - Windows ME
+ * - Windows CE
+ * - Windows 9x
+ * - Windows 95
+ * - Windows 98
+ * - Windows 3.1
+ * - Windows 4.10
+ * - Windows NT (not followed by version or followed by version <= 5)
+ * - Windows_95
+ */
+ return 'oldwin';
+ }
+ if (ua.indexOf("MSIE 6.0") !== -1 &&
+ ua.indexOf("Windows NT 5.1") !== -1 &&
+ ua.indexOf("SV1") === -1) {
+ // Windows XP SP1
+ return 'oldwin';
+ }
+ if (pf.indexOf("Win32") !== -1 ||
+ pf.indexOf("Win64") !== -1) {
+ return 'windows';
+ }
+ if (/android/i.test(ua)) {
+ return 'android';
+ }
+ if (/armv[6-7]l/.test(pf)) {
+ return 'android';
+ }
+ if (pf.indexOf("Linux") !== -1) {
+ if (pf.indexOf("64") !== -1) {
+ return 'linux64';
+ } else {
+ return 'linux32';
+ }
+ }
+ if (pf.indexOf("MacPPC") !== -1) {
+ return 'oldmac';
+ }
+ if (/Mac OS X 10.[0-5]/.test(ua)) {
+ return 'oldmac';
+ }
+ if (pf.indexOf('iPhone') !== -1 ||
+ pf.indexOf('iPad') !== -1 ||
+ pf.indexOf('iPod') !== -1 ) {
+ return 'ios';
+ }
+ if (ua.indexOf("Mac OS X") !== -1) {
+ return 'osx';
+ }
+ if (ua.indexOf("MSIE 5.2") !== -1) {
+ return 'oldmac';
+ }
+ if (pf.indexOf("Mac") !== -1) {
+ return 'oldmac';
+ }
+ if (navigator.platform === '' &&
+ navigator.userAgent.indexOf("Firefox") !== -1 &&
+ navigator.userAgent.indexOf("Mobile") !== -1) {
+ return 'fxos';
+ }
+
+ return 'other';
+ }
+ (function () {
+ // Immediately set the platform classname on the html-element
+ // to avoid lots of flickering
+ var h = document.documentElement;
+ window.site = {
+ platform : getPlatform()
+ };
+ h.className = window.site.platform;
+ })();
+ })();
diff --git a/core/app/helpers/core_helper.rb b/core/app/helpers/core_helper.rb
index a496144..29a4700 100644
--- a/core/app/helpers/core_helper.rb
+++ b/core/app/helpers/core_helper.rb
@@ -10,4 +10,40 @@ module CoreHelper
render 'common/home_page_buttons'
end
-end \ No newline at end of file
+ def available_clients
+ CLIENT_AVAILABILITY
+ end
+
+ def alternative_client_links(os = nil)
+ alternative_clients(os).map do |client|
+ link_to(client.capitalize, client_download_url(client))
+ end
+ end
+
+ def alternative_clients(os = nil)
+ CLIENT_AVAILABILITY - [os]
+ end
+
+ def client_download_url(os = nil)
+ client_download_domain(os) + client_download_path(os)
+ end
+
+ def client_download_domain(os)
+ "https://downloads.leap.se"
+ end
+
+ def client_download_path(os)
+ CLIENT_DOWNLOAD_PATHS[os] || '/client'
+ end
+
+
+ CLIENT_AVAILABILITY = %w/linux32 linux64 mac windows android/
+ CLIENT_DOWNLOAD_PATHS = {
+ android: '/client/android',
+ linux: '/client/linux',
+ linux32: '/client/linux/Bitmask-linux32-latest.tar.bz2',
+ linux64: '/client/linux/Bitmask-linux64-latest.tar.bz2',
+ osx: '/client/osx/Bitmask-OSC-latest.dmg',
+ windows: '/client/windows'
+ }.with_indifferent_access
+end
diff --git a/core/app/views/common/_download_for_os.html.haml b/core/app/views/common/_download_for_os.html.haml
new file mode 100644
index 0000000..b7c88ba
--- /dev/null
+++ b/core/app/views/common/_download_for_os.html.haml
@@ -0,0 +1,16 @@
+- os = download_for_os
+%div{:class => "os-#{os}"}
+ %span.link
+ - btn_class = (os == "other") ? "disabled" : "btn-primary"
+ = link_to client_download_url(os), :class => "btn btn-large #{btn_class}" do
+ .pull-left= huge_icon('mask')
+ = t(:download_client)
+ %br/
+ %small= I18n.t("os.#{os}")
+ %span.info
+ = t(:client_info, :provider => content_tag(:b,APP_CONFIG[:domain])).html_safe
+ %br/
+ - if os == "other"
+ = t(:all_downloads_info, :clients => alternative_client_links(os).to_sentence).html_safe
+ - else
+ = t(:other_downloads_info, :clients => alternative_client_links(os).to_sentence).html_safe
diff --git a/core/app/views/common/_home_page_buttons.html.haml b/core/app/views/common/_home_page_buttons.html.haml
index 7eb4c40..b87c867 100644
--- a/core/app/views/common/_home_page_buttons.html.haml
+++ b/core/app/views/common/_home_page_buttons.html.haml
@@ -1,11 +1,10 @@
- icon_color = :black
-.home-buttons
+.home-buttons.linux64
.row-fluid.first
.span3
.download.span6
- %span.link= link_to(big_icon('arrow-down', icon_color) + t(:download_client), "https://downloads.leap.se/client", :class => 'btn btn-large')
- %span.info= t(:download_client_info, :provider => content_tag(:b,APP_CONFIG[:domain])).html_safe
+ = render partial: 'common/download_for_os', collection: available_clients + ['other']
.span3
.row-fluid.second
.login.span4
diff --git a/core/config/locales/en.yml b/core/config/locales/en.yml
index 25b377a..344eee4 100644
--- a/core/config/locales/en.yml
+++ b/core/config/locales/en.yml
@@ -21,10 +21,20 @@ en:
are_you_sure: "Are you sure? This change cannot be undone."
download_client: "Download Bitmask"
- download_client_info: "The Bitmask application allows you to use %{provider} services. It is available for Linux, Mac, Windows, and Android."
+ client_info: "The Bitmask application allows you to use %{provider} services."
+ all_downloads_info: "It is available for %{clients}."
+ other_downloads_info: "It is also available for %{clients}."
login_info: "Log in to change your account settings, create support tickets, and manage payments."
signup_info: "Sign up for a new user account via this website (it is better if you use the Bitmask application to sign up, but this website works too)."
welcome: "Welcome to %{provider}."
get_help: "Get Help"
help_info: "Can't login? Create a new support ticket anonymously."
example_email: 'user@domain.org'
+ os:
+ linux32: "Linux (32 bit)"
+ linux64: "Linux (64 bit)"
+ windows: "Windows"
+ android: "Android"
+ mac: "Mac OSX"
+ other: "(not available for your OS.)"
+
diff --git a/public/leap-img/128/mask.png b/public/leap-img/128/mask.png
new file mode 100644
index 0000000..c7390eb
--- /dev/null
+++ b/public/leap-img/128/mask.png
Binary files differ
diff --git a/test/integration/home_test.rb b/test/integration/home_test.rb
new file mode 100644
index 0000000..126a420
--- /dev/null
+++ b/test/integration/home_test.rb
@@ -0,0 +1,24 @@
+require 'test_helper'
+
+class AccountTest < BrowserIntegrationTest
+
+ setup do
+ Capybara.current_driver = Capybara.javascript_driver
+ end
+
+ test "old windows shows deactivated download" do
+ page.driver.headers = { "User-Agent" => "Win98" }
+ visit '/'
+ assert_selector "html.oldwin"
+ assert has_text? "not available"
+ end
+
+ test "android shows android download" do
+ page.driver.headers = { "User-Agent" => "Android" }
+ visit '/'
+ assert_selector "html.android"
+ assert has_no_text? "not available"
+ assert_selector "small", text: "Android"
+ end
+
+end