Implement quick login

master
Skylar Ittner 6 years ago
parent d6f5ef8b16
commit 7155cbbd6f

@ -15,40 +15,40 @@ var cardSettings = {
function loadCard(type, apiurl, title) { function loadCard(type, apiurl, title) {
$.get("cards/" + type + ".html", {}, function (html) { $.get("cards/" + type + ".html", {}, function (html) {
console.log(type + " " + apiurl + " " + title); console.log(type + " " + apiurl + " " + title);
var cardClasses = "col-sm-12 col-md-6 col-lg-6 col-xl-4 order-12"; var cardClasses = "col-sm-12 col-md-6 col-lg-6 col-xl-4 order-12";
if (cardSettings.hasOwnProperty(type) && cardSettings[type].hasOwnProperty("classes")) { if (cardSettings.hasOwnProperty(type) && cardSettings[type].hasOwnProperty("classes")) {
cardClasses = cardSettings[type]["classes"]; cardClasses = cardSettings[type]["classes"];
} }
var box = $('<div class="col ' + cardClasses + '" id=""></div>'); var box = $('<div class="col ' + cardClasses + '" id=""></div>');
var card = $('<div class="card card_app card_' + type + '" style="width: 100%;" data-title="' + title + '" data-apiurl="' + apiurl + '"></div>'); var card = $('<div class="card card_app card_' + type + '" style="width: 100%;" data-title="' + title + '" data-apiurl="' + apiurl + '"></div>');
$(card).html(html); $(card).html(html);
$(box).html(card); $(box).html(card);
$("#card-box").append(box); $("#card-box").append(box);
if (loadedCardTypes.indexOf(type) == -1) { if (loadedCardTypes.indexOf(type) == -1) {
loadedCardTypes.push(type); loadedCardTypes.push(type);
} }
}); });
} }
function applyCardTitles() { function applyCardTitles() {
$(".card_app").each(function () { $(".card_app").each(function () {
var title = $(this).data("title"); var title = $(this).data("title");
$(this).find(".card_title").text(title); $(this).find(".card_title").text(title);
}); });
} }
function waitForCardsToLoadThenInjectScripts() { function waitForCardsToLoadThenInjectScripts() {
// How's *that* for self-documenting code? // How's *that* for self-documenting code?
for (var i = 0; i < totalCardTypes.length; i++) { for (var i = 0; i < totalCardTypes.length; i++) {
if (loadedCardTypes.indexOf(totalCardTypes[i]) == -1) { if (loadedCardTypes.indexOf(totalCardTypes[i]) == -1) {
setTimeout(waitForCardsToLoadThenInjectScripts, 50); setTimeout(waitForCardsToLoadThenInjectScripts, 50);
return; return;
} }
} }
applyCardTitles(); applyCardTitles();
for (var i = 0; i < loadedCardTypes.length; i++) { for (var i = 0; i < loadedCardTypes.length; i++) {
$.getScript('cards/js/' + loadedCardTypes[i] + '.js'); $.getScript('cards/js/' + loadedCardTypes[i] + '.js');
} }
} }
@ -56,22 +56,22 @@ function waitForCardsToLoadThenInjectScripts() {
getApps(function (apps) { getApps(function (apps) {
console.log(apps); console.log(apps);
for (var appname in apps) { for (var appname in apps) {
if (!apps.hasOwnProperty(appname)) { if (!apps.hasOwnProperty(appname)) {
continue; continue;
} }
var app = apps[appname]; var app = apps[appname];
console.log(app); console.log(app);
console.log(" " + app.url); console.log(" " + app.url);
console.log(" " + app.title); console.log(" " + app.title);
if (typeof app.station_features !== "undefined" && app.station_features.length > 0) { if (typeof app.station_features !== "undefined" && app.station_features.length > 0) {
for (var type in app.station_features) { for (var type in app.station_features) {
if (!app.station_features.hasOwnProperty(type)) { if (!app.station_features.hasOwnProperty(type)) {
continue; continue;
} }
totalCardTypes.push(app.station_features[type]); totalCardTypes.push(app.station_features[type]);
loadCard(app.station_features[type], app.url + "/api.php", app.title); loadCard(app.station_features[type], app.url + "/api.php", app.title);
} }
} }
} }
waitForCardsToLoadThenInjectScripts(); waitForCardsToLoadThenInjectScripts();
}); });

@ -7,46 +7,76 @@
function userpasslogin(username, password) { function userpasslogin(username, password) {
$.post(accounthubapi, { $.post(accounthubapi, {
key: apikey, key: apikey,
username: username, username: username,
password: password, password: password,
action: "auth" action: "auth"
}, function (resp) { }, function (resp) {
if (resp.status == "OK") { if (resp.status == "OK") {
$.post(accounthubapi, { $.post(accounthubapi, {
key: apikey, key: apikey,
username: username, username: username,
action: "userinfo" action: "userinfo"
}, function (resp) { }, function (resp) {
if (resp.status == "OK") { if (resp.status == "OK") {
setuser(resp.data.username); setuser(resp.data.username);
setname(resp.data.name); setname(resp.data.name);
setuid(resp.data.uid); setuid(resp.data.uid);
openScreen("home"); openScreen("home");
} else { } else {
showmsg(resp.msg, "danger"); showmsg(resp.msg, "danger");
} }
}, "json"); }, "json");
} else { } else {
showmsg(resp.msg, "danger"); showmsg(resp.msg, "danger");
} }
}, "json"); }, "json");
} }
function codelogin(code) { function codelogin(code) {
$.post(accounthubapi, { $.post(accounthubapi, {
key: apikey, key: apikey,
code: code, code: code,
action: "codelogin" action: "codelogin"
}, function (resp) { }, function (resp) {
if (resp.status == "OK") { if (resp.status == "OK") {
setuser(resp.user.username); setuser(resp.user.username);
setname(resp.user.realname); setname(resp.user.realname);
setuid(resp.user.uid); setuid(resp.user.uid);
openScreen("home"); openScreen("home");
} else { } else {
showmsg(resp.msg, "danger"); showmsg(resp.msg, "danger");
} }
}, "json");
}
function loadQuickLogin() {
$.post(accounthubapi, {
key: apikey,
gid: 4,
action: "getusersbygroup",
get: "detail"
}, function (resp) {
if (resp.status == "OK") {
var userhtml = "";
for (var user in resp.users) {
var u = resp.users[user];
userhtml += '<div class="col-4 col-lg-3 quick-user" data-uid="' + u["uid"] + '" data-username="' + u["username"] + '" data-name="' + u["name"] + '">\n'
+ '<i class="far fa-user fa-3x"></i>\n'
+ '<br />\n'
+ u["name"] + "\n"
+ '</div>\n';
}
$("#userlist .row").html(userhtml);
$(".quick-user").click(function () {
setuser($(this).data("username"));
setname($(this).data("name"));
setuid($(this).data("uid"));
openScreen("home");
});
} else {
showmsg(resp.msg, "danger");
}
}, "json"); }, "json");
} }
@ -54,13 +84,25 @@ $("#userpassloginbtn").click(function () {
var user = $("#username").val(); var user = $("#username").val();
var pass = $("#password").val(); var pass = $("#password").val();
if (user != "" && pass != "") { if (user != "" && pass != "") {
userpasslogin(user, pass); userpasslogin(user, pass);
} }
}); });
function quicklogin(uid) {
var quickuser =
setuser(resp.data.username);
setname(resp.data.name);
setuid(resp.data.uid);
openScreen("home");
}
$("#mobilecodeloginbtn").click(function () { $("#mobilecodeloginbtn").click(function () {
var code = $("#code").val(); var code = $("#code").val();
if (code != "") { if (code != "") {
codelogin(code); codelogin(code);
} }
});
$(document).ready(function () {
loadQuickLogin();
}); });

@ -5,10 +5,10 @@
<h3 class="card-header"><i class="fas fa-lock"></i> Login</h3> <h3 class="card-header"><i class="fas fa-lock"></i> Login</h3>
<ul class="nav nav-tabs"> <ul class="nav nav-tabs">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#userlist">Quick Access</a> <a class="nav-link active" data-toggle="tab" href="#userlist">Quick Access</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#userpass">Username/Password</a> <a class="nav-link" data-toggle="tab" href="#userpass">Username/Password</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#mobilecode">Mobile Code</a> <a class="nav-link" data-toggle="tab" href="#mobilecode">Mobile Code</a>
@ -16,41 +16,13 @@
</ul> </ul>
<div class="card-body"> <div class="card-body">
<div class="tab-content"> <div class="tab-content">
<div class="tab-pane fade" id="userlist"> <div class="tab-pane fade active show" id="userlist">
<div class="row justify-content-around"> <div class="row justify-content-around">
<div class="col-4 col-lg-3 quick-user">
<i class="far fa-user fa-3x"></i>
<br />
Caroline Herschel
</div>
<div class="col-4 col-lg-3 quick-user">
<i class="far fa-user fa-3x"></i>
<br />
Edmond Halley
</div>
<div class="col-4 col-lg-3 quick-user">
<i class="far fa-user fa-3x"></i>
<br />
Jocelyn Bell Burnell
</div>
<div class="col-4 col-lg-3 quick-user">
<i class="far fa-user fa-3x"></i>
<br />
Max Born
</div>
<div class="col-4 col-lg-3 quick-user">
<i class="far fa-user fa-3x"></i>
<br />
Patty Jo Watson
</div>
<div class="col-4 col-lg-3 quick-user">
<i class="far fa-user fa-3x"></i>
<br />
Sarah Boysen
</div>
</div> </div>
</div> </div>
<div class="tab-pane fade active show" id="userpass">
<div class="tab-pane fade" id="userpass">
<div id="userpass_form"> <div id="userpass_form">
<div class="input-group"> <div class="input-group">
<span class="input-group-addon"><i class="far fa-user"></i></span> <span class="input-group-addon"><i class="far fa-user"></i></span>
@ -64,8 +36,10 @@
<button class="btn btn-primary" id="userpassloginbtn">Log In</button> <button class="btn btn-primary" id="userpassloginbtn">Log In</button>
</div> </div>
</div> </div>
<div class="tab-pane fade" id="mobilecode"> <div class="tab-pane fade" id="mobilecode">
<div class="alert alert-info">Open the Business app on your phone, <br />then press the <i class="fas fa-lock"></i> button to get a code.</div> <div class="alert alert-info">Open the Business app on your phone, <br />then press the <i class="fas fa-desktop"></i> button to get a code.</div>
<div id="mobilecode_form"> <div id="mobilecode_form">
<div class="input-group input-group-lg"> <div class="input-group input-group-lg">
<span class="input-group-addon">B-</span> <span class="input-group-addon">B-</span>

Loading…
Cancel
Save