Add login/signup ability

master
Skylar Ittner 5 years ago
parent fc9f955f75
commit 2b7265eaac

@ -8,7 +8,7 @@ $('#username').on("keyup", function () {
$('#username').val($('#username').val().toLowerCase());
});
function checkAndSave(username, password) {
function checkAndSave(username, password, type) {
app.preloader.show();
@ -21,13 +21,15 @@ function checkAndSave(username, password) {
method: "POST",
data: {
username: username,
password: password
password: password,
type: type
},
success: function (data) {
app.preloader.hide();
if (data.status == "OK") {
localStorage.setItem("username", username);
localStorage.setItem("password", password);
localStorage.setItem("accttype", type);
localStorage.setItem("configured", true);
// Restart the app to re-read the config
restartApplication();
@ -45,9 +47,43 @@ function checkAndSave(username, password) {
function setupAccount() {
var type = $("#accttype").val();
var username = $("#username").val();
var password = $("#password").val();
checkAndSave(username, password, type);
}
function createAccount() {
var type = $("#accttype").val();
var username = $("#username").val();
var password = $("#password").val();
checkAndSave(username, password);
app.preloader.show();
var url = SETTINGS["server"] + "/signup";
$.ajax({
url: url,
dataType: "json",
cache: false,
method: "POST",
data: {
username: username,
password: password,
accttype: type
},
success: function (data) {
app.preloader.hide();
if (data.status == "OK") {
checkAndSave(username, password, type);
} else if (data.status == "ERROR") {
app.dialog.alert(data.msg, "Error");
} else {
app.dialog.alert("", "Error");
}
}, error: function () {
app.preloader.hide();
app.dialog.alert("Could not create account. Check your connection.", "Error");
}
});
}

@ -18,7 +18,7 @@
</div>
</div>
<div class="page-content ptr-content">
<div class="page-content ptr-content" data-ptr-mousewheel="true">
<div class="ptr-preloader">
<div class="preloader"></div>

@ -18,26 +18,42 @@
<div class="page-content">
<div class="block">
<p>Select an option to get started.</p>
</div>
<div class="row">
<div class="col-100 tablet-50 desktop-33">
<div class="row" style="justify-content: center;">
<div class="col-100 desktop-66">
<div class="card">
<div class="card-content card-content-padding text-align-center">
<h3>Choose an account type.</h3>
<p>If you don't have an account, you can create one in the next step.</p>
</div>
</div>
</div>
<div class="col-100 tablet-50 desktop-33">
</div>
<div class="row" style="justify-content: center;">
<a class="col-100 tablet-50 desktop-33" href="/setup/1/giver">
<div class="card">
<div class="card-content card-content-padding text-align-center">
<div class="card-content card-content-padding text-align-center bg-color-green text-color-white">
<span class="fa-stack fa-5x">
<i class="fas fa-money-bill-wave-alt fa-stack-2x"></i>
<i class="fas fa-circle fa-stack-1x"></i>
<i class="fas fa-arrow-alt-circle-up fa-inverse fa-stack-1x text-color-green"></i>
</span>
<h3>Giver</h3>
</div>
</div>
</a>
<a class="col-100 tablet-50 desktop-33" href="/setup/1/receiver">
<div class="card">
<div class="card-content card-content-padding text-align-center bg-color-blue text-color-white">
<span class="fa-stack fa-5x">
<i class="fas fa-money-bill-wave-alt fa-stack-2x"></i>
<i class="fas fa-circle fa-stack-1x"></i>
<i class="fas fa-arrow-alt-circle-down fa-inverse fa-stack-1x text-color-blue"></i>
</span>
<h3>Receiver</h3>
</div>
</div>
</div>
</a>
</div>
</div>

@ -16,41 +16,49 @@
</div>
<div class="page-content">
<div class="page-content color-theme-{{js "this.$route.params.acctType == 'giver' ? 'green' : 'blue'"}}">
<div class="block">
<div class="card">
<div class="card-content card-content-padding">
<p>Enter your account information to log in.</p>
<div class="row" style="justify-content: center;">
<div class="card col-100 tablet-50">
<div class="card-content card-content-padding">
<input type="hidden" id="accttype" value="{{$route.params.acctType}}">
<div class="list no-hairlines">
<ul>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-floating-label">Username</div>
<div class="item-input-wrap">
<input type="text" id="username" placeholder="" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
<span class="input-clear-button"></span>
<div class="list no-hairlines">
<ul>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-floating-label">Username</div>
<div class="item-input-wrap">
<input type="text" id="username" placeholder="" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
<span class="input-clear-button"></span>
</div>
</div>
</div>
</li>
</li>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-floating-label">Password</div>
<div class="item-input-wrap">
<input type="password" id="password" placeholder="" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
<span class="input-clear-button"></span>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-floating-label">Password</div>
<div class="item-input-wrap">
<input type="password" id="password" placeholder="" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
<span class="input-clear-button"></span>
</div>
</div>
</div>
</li>
</li>
</ul>
</div>
</ul>
</div>
<br />
<br />
<div class="button button-fill button-raised button-round button-large" onclick="setupAccount()">
Sign In
</div>
<br />
<div class="button button-outline button-raised button-round button-large" onclick="createAccount()">
Create Account
</div>
<br />
<div class="button button-fill button-raised button-round" onclick="setupAccount()">
Continue
</div>
</div>
</div>

@ -21,7 +21,7 @@ var routes = [
name: 'setup0'
},
{
path: '/setup/1',
path: '/setup/1/:acctType',
templateUrl: './pages/setup1.html',
name: 'setup1'
},

Loading…
Cancel
Save