diff --git a/web/app/assets/javascripts/checkout_payment.js b/web/app/assets/javascripts/checkout_payment.js new file mode 100644 index 000000000..e69de29bb diff --git a/web/app/assets/javascripts/checkout_signin.js b/web/app/assets/javascripts/checkout_signin.js index 4f0968920..26fb3a1ed 100644 --- a/web/app/assets/javascripts/checkout_signin.js +++ b/web/app/assets/javascripts/checkout_signin.js @@ -15,24 +15,46 @@ var $signinBtn = null; var $signupBtn = null; var $inputElements = null; + var $contentHolder = null; + var $btnNext = null; function beforeShow(data) { renderNavigation(); + renderLoggedInState(); } function afterShow(data) { } - function + + function renderLoggedInState(){ + if(isLoggedIn()) { + $contentHolder.removeClass('not-signed-in').addClass('signed-in') + } + else { + $contentHolder.removeClass('signed-in').addClass('not-signed-in') + } + } + + function isLoggedIn() { + return !!context.JK.currentUserId; + } + function events() { $signinForm.on('submit', login); $signinBtn.on('click', login); + $btnNext.on('click', moveNext); } function reset() { $inputElements.removeClass('login-error'); } + function moveNext() { + window.location = '/client#/checkout_payment'; + + return false; + } function login() { if($signinBtn.is('.disabled')) { return false; @@ -48,6 +70,7 @@ rest.login({email: email, password: password, remember_me: true}) .done(function() { window.location = '/client#/checkout_payment' + window.location.reload(); }) .fail(function(jqXHR) { if(jqXHR.status == 422) { @@ -92,6 +115,8 @@ $email = $signinForm.find('input[name="email"]'); $password = $signinForm.find('input[name="password"]'); $inputElements = $signinForm.find('.input-elements'); + $contentHolder = $screen.find('.content-holder'); + $btnNext = $screen.find('.btnNext'); if($screen.length == 0) throw "$screen must be specified"; if($navigation.length == 0) throw "$navigation must be specified"; diff --git a/web/app/assets/stylesheets/client/checkout_payment.css.scss b/web/app/assets/stylesheets/client/checkout_payment.css.scss new file mode 100644 index 000000000..e69de29bb diff --git a/web/app/assets/stylesheets/client/checkout_signin.css.scss b/web/app/assets/stylesheets/client/checkout_signin.css.scss index ef24c78a1..d436c5c58 100644 --- a/web/app/assets/stylesheets/client/checkout_signin.css.scss +++ b/web/app/assets/stylesheets/client/checkout_signin.css.scss @@ -19,7 +19,7 @@ } } .already-signed-in { - + text-align:center; } a.forgot-password { diff --git a/web/app/views/clients/_checkout_payment.html.slim b/web/app/views/clients/_checkout_payment.html.slim new file mode 100644 index 000000000..9490df73c --- /dev/null +++ b/web/app/views/clients/_checkout_payment.html.slim @@ -0,0 +1,92 @@ +div layout="screen" layout-id="checkout_payment" id="checkoutPaymentScreen" class="screen secondary no-login-required" + .content + .content-head + .content-icon= image_tag("content/icon_shopping_cart.png", {:height => 19, :width => 19}) + h1 check out + = render "screen_navigation" + .content-body + .content-body-scroller + .checkout-signin + .checkout-navigation-bar + + .content-holder + .already-signed-in + h3 YOU ARE ALREADY LOGGED IN + p.carry-on-prompt + | You can move on to the next step of checkout. + .actions + a.btnNext.button-orange NEXT + + .left-side + h3 ALREADY A MEMBER OF THE JAMKAZAM COMMUNITY? + .left-side-content + .signin-form + .signin-prompt Sign in using your email address: + .clearall + form.signin-form + .input-elements + .out + label.inline Email: + .email.field + input name='email' autofocus="true" type="text" + .out + label.inline Password: + .password.field + input name='password' autofocus="true" type="password" + .login-error-msg Invalid login + + + br clear='all' + + .actions + small + a.forgot-password href='/request_reset_password' Forgot Password? + = link_to "SIGN IN", '#', class: 'button-orange signin-submit' + + + p.facebook-prompt Or sign in using Facebook: + = link_to image_tag("content/button_facebook_signin.png", {:width => 249, :height => 46}), '/auth/facebook', class: "signin-facebook" + .right-side + h3 NOT A MEMBER YET? + + p.signup-later-prompt + | Thousands of musicians are now registered members of JamKazam. Click the NEXT button below to join us, and welcome! + + .actions + a.btnNext.button-orange NEXT + +script type='text/template' id='template-checkout-navigation' + .checkout-navigation + .nav-signin + = "{% if (data.current == 1) { %}" + .nav-text.selected + .badge-number 1 + | Sign In + = "{% } else { %}" + .nav-text + .badge-number.disabled 1 + | Sign In + = "{% } %}" + .clearall + .nav-payment-info + = "{% if (data.current == 2) { %}" + .nav-text.selected + .badge-number 2 + | Address & Payment + = "{% } else { %}" + .nav-text + .badge-number.disabled 2 + | Address & Payment + = "{% } %}" + .clearall + .nav-place-order + = "{% if (data.current == 3) { %}" + .nav-text.selected + .badge-number 3 + | Place Order + = "{% } else { %}" + .nav-text + .badge-number.disabled 3 + | Place Order + = "{% } %}" + .clearall diff --git a/web/app/views/clients/_checkout_signin.html.slim b/web/app/views/clients/_checkout_signin.html.slim index 80d5edb18..e0f089326 100644 --- a/web/app/views/clients/_checkout_signin.html.slim +++ b/web/app/views/clients/_checkout_signin.html.slim @@ -11,6 +11,12 @@ div layout="screen" layout-id="checkout_signin" id="checkoutSignInScreen" class= .content-holder .already-signed-in + h3 YOU ARE ALREADY LOGGED IN + p.carry-on-prompt + | You can move on to the next step of checkout. + .actions + a.btnNext.button-orange NEXT + .left-side h3 ALREADY A MEMBER OF THE JAMKAZAM COMMUNITY? .left-side-content