handle more device types on mobile login page

fixes: #11476

restyle mobile login page to handle different
screen dimensions and resolution (retina/non-retina)
so that it works on new iPhone, android browsers, etc.

use mobile_login for iPad iOS app and android app too
the iOS and android apps are now going to pass a
query string param of mobile=1 when it loads the
webview for login. it will set a cookie to
remember that it prefers the mobile optimized
login screen so that if it goes through any
redirection (bad user/pass) it still looks right.
fixes: #11686

Change-Id: Iafdc7522189dc44be5c5bc4592c5cb194a188612
Reviewed-on: https://gerrit.instructure.com/15283
Tested-by: Jenkins <jenkins@instructure.com>
Reviewed-by: Chris Hart <chris@12spokes.com>
This commit is contained in:
Ryan Shaw 2012-11-09 09:29:16 -07:00
parent b7f98c2630
commit 1926251974
4 changed files with 27 additions and 10 deletions

View File

@ -114,7 +114,14 @@ class PseudonymSessionsController < ApplicationController
end
def maybe_render_mobile_login(status = nil)
if request.user_agent.to_s =~ /ipod|iphone|Android/i
cookies['mobile'] = true if params['mobile']
# Our iOS and Android native apps are always going to pass a query string param of ?mobile=1
# to this page, so they will be always given the mobile formatted page for the native app login
# process. We do not show the mobile formated page if you come to web canvas on mobile devices
# on purpose, because the rest of the site is not mobile formated--with the exception of iPod
# and iPhone, which we continue to do because that is what we have done and did not want to
# change existing functionalitiy.
if cookies['mobile'] || request.user_agent.to_s =~ /ipod|iphone/i
@login_handle_name = @domain_root_account.login_handle_name rescue AccountAuthorizationConfig.default_login_handle_name
@login_handle_is_email = @login_handle_name == AccountAuthorizationConfig.default_login_handle_name
@shared_js_vars = {
@ -312,7 +319,7 @@ class PseudonymSessionsController < ApplicationController
if response.is_valid?
aac.debug_set(:is_valid_login_response, 'true') if debugging
if response.success_status?
@pseudonym = @domain_root_account.pseudonyms.custom_find_by_unique_id(unique_id)
@ -324,7 +331,7 @@ class PseudonymSessionsController < ApplicationController
#Successful login and we have a user
@domain_root_account.pseudonym_sessions.create!(@pseudonym, false)
@user = @pseudonym.login_assertions_for_user
if debugging
aac.debug_set(:login_to_canvas_success, 'true')
aac.debug_set(:logged_in_user_id, @user.id)

View File

@ -14,14 +14,23 @@
}
html, body {
height: 100%;
width: 100%;
}
body {
html {
margin: 0;
padding: 0;
background: #353534 url("/images/mobile_login/mobile-login-bg.jpg") left -40px;
background-color: black;
background: url('/images/Money_Noise_tm.png?1348625397'),
-webkit-gradient(radial, 50% 0px, 0, 50% 0px, 0, color-stop(0%, rgba(255, 255, 255, 0.4)), color-stop(100%, transparent)),
-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #2B2B2B), color-stop(100%, black));
background: url('/images/Money_Noise_tm.png?1348625397'),
-webkit-radial-gradient(50% 0px, circle cover, rgba(255, 255, 255, 0.4) 0%, transparent 100%),
-webkit-linear-gradient(top, #2B2B2B, black);
background: url('/images/Money_Noise_tm.png?1348625397'),
radial-gradient(50% -100px, circle cover, rgba(255, 255, 255, 0.6) 0%, transparent 100%),
linear-gradient(top, #2B2B2B, black);
min-height: 420px; /* this is a workaround to be high enough on an iphone */
font-size: 114%;
-webkit-background-size: cover;
-webkit-perspective: 800;
font-family: Helvetica;
}
@ -37,6 +46,10 @@
width: 300px;
height: 198px;
z-index: 1;
background-image: url("/images/canvas_logo_for_mobile_login.png?1");
background-position: center 30px;
background-repeat: no-repeat;
background-size: 270px 48px;
}
.face.back {
display: none;

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View File

@ -25,9 +25,6 @@ describe PseudonymSessionsController do
[
"Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_3_3 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8J2 Safari/6533.18.5",
"Mozilla/5.0 (iPod; U; CPU iPhone OS 4_3_3 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8J2 Safari/6533.18.5",
"Mozilla/5.0 (Linux; U; Android 2.2; en-us; SCH-I800 Build/FROYO) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1",
"Mozilla/5.0 (Linux; U; Android 2.2; en-us; Sprint APA9292KT Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1",
"Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1"
]
end