arno/lychee
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Use new modal for login

Browse Source
This commit is contained in:
Tobias Reich 2015-01-29 22:57:42 +01:00
parent f9e604ed6f
commit 0d3593fe58
3 changed files with 50 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/scripts/build.coffee
View File

@ -178,25 +178,6 @@ build.modal = (title, text, button, marginTop, closeButton) ->
return html
build.signInModal = ->
html = """
<div class='message_overlay'>
<div class='message center'>
<h1><a class='icon-lock'></a> Sign In</h1>
<a class='close icon-remove-sign'></a>
<div class='sign_in'>
<input id='username' type='text' value='' placeholder='username' autocapitalize='off' autocorrect='off'>
<input id='password' type='password' value='' placeholder='password'>
</div>
<div id='version'>Version #{ lychee.version }<span> &#8211; <a target='_blank' href='#{ lychee.updateURL }'>Update available!</a><span></div>
<a onclick='lychee.login()' class='button active'>Sign in</a>
</div>
</div>
"""
return html
build.uploadModal = (title, files) ->
html = """

43
src/scripts/lychee.js
View File

@ -117,10 +117,10 @@ lychee.api = function(params, callback) {
}
lychee.login = function() {
lychee.login = function(data) {
var user = $('input#username').val(),
password = md5($('input#password').val()),
var user = data.username,
password = md5(data.password),
params;
params = 'login&user=' + user + '&password=' + password;
@ -137,8 +137,7 @@ lychee.login = function() {
} else {
// Show error and reactive button
$('#password').val('').addClass('error').focus();
$('.message .button.active').removeClass('pressed');
basicModal.error('password');
}
@ -148,16 +147,34 @@ lychee.login = function() {
lychee.loginDialog = function() {
var local_username;
var localUsername,
msg = '';
$('body').append(build.signInModal());
$('#username').focus();
msg += "<p class='signIn'>";
msg += "<input class='text' data-name='username' type='text' value='' placeholder='username' autocapitalize='off' autocorrect='off'>";
msg += "<input class='text' data-name='password' type='password' value='' placeholder='password'>";
msg += "</p>";
msg += "<p class='version'>Lychee " + lychee.version + "<span> &#8211; <a target='_blank' href='" + lychee.updateURL + "'>Update available!</a><span></p>";
basicModal.show({
body: msg,
buttons: {
action: {
title: 'Sign In',
fn: lychee.login
},
cancel: {
title: 'Cancel',
fn: basicModal.close
}
}
});
if (localStorage) {
local_username = localStorage.getItem('lychee_username');
if (local_username!==null) {
if (local_username.length>0) $('#username').val(local_username);
$('#password').focus();
localUsername = localStorage.getItem('lychee_username');
if (localUsername!==null) {
if (localUsername.length>0) $('.basicModal input[data-name="username"]').val(localUsername);
$('.basicModal input[data-name="password"]').focus();
}
}
@ -244,7 +261,7 @@ lychee.getUpdate = function() {
$.ajax({
url: lychee.update_path,
success: function(data) { if (parseInt(data)>parseInt(lychee.version_code)) $('#version span').show(); }
success: function(data) { if (parseInt(data)>parseInt(lychee.version_code)) $('.version span').show(); }
});
}

22
src/styles/_message.scss
View File

@ -39,6 +39,10 @@
&:first-of-type { padding-top: 42px; }
&:last-of-type { padding-bottom: 40px; }
&.signIn:first-of-type { padding-top: 30px; }
&.signIn:last-of-type { padding-bottom: 30px; }
}
/* Buttons ------------------------------------------------*/
@ -72,9 +76,11 @@
color: #fff;
text-shadow: $shadow;
border: none;
border-bottom: 1px solid black(.4);
// Do not use rgba() for border-bottom
// to avoid a blurry line in Safari on non-retina screens
border-bottom: 1px solid #222;
border-radius: 0;
box-shadow: 0 1px 0 white(.08);
box-shadow: 0 1px 0 white(.05);
outline: none;
&:focus { border-bottom-color: $colorBlue; }
@ -161,6 +167,18 @@
}
}
/* Version ------------------------------------------------*/
.version {
padding: 0px 30px 20px;
color: #888;
font-size: 12px;
text-align: left;
span { display: none; }
span a { color: #888; }
}
}
.message_overlay {