Add PIN login prompt to Quick Access (close #1)
This commit is contained in:
parent
c6b4d7eaa1
commit
f73fdf9b94
@ -40,3 +40,18 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
#sign-out-btn, #refresh-btn {
|
||||
background-color: rgba(255,255,255,.75);
|
||||
}
|
||||
|
||||
#pinpad .digits {
|
||||
height: 50px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#pinpad .digits p {
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
#pincode-box {
|
||||
font-size: 200%;
|
||||
}
|
70
js/login.js
70
js/login.js
@ -30,6 +30,7 @@ function userpasslogin(username, password) {
|
||||
} else {
|
||||
showmsg(resp.msg, "danger");
|
||||
}
|
||||
$(this).data("uid")
|
||||
}, "json");
|
||||
}
|
||||
|
||||
@ -50,6 +51,22 @@ function codelogin(code) {
|
||||
}, "json");
|
||||
}
|
||||
|
||||
function doQuickLogin(username, name, uid, pin) {
|
||||
$('#pinmodal').modal('hide');
|
||||
if (pin) {
|
||||
$('#pinmodal').data("username", username);
|
||||
$('#pinmodal').data("name", name);
|
||||
$('#pinmodal').data("uid", uid);
|
||||
$('#pinmodal').modal('show');
|
||||
$('#pincode-box').val("");
|
||||
} else {
|
||||
setuser(username);
|
||||
setname(name);
|
||||
setuid(uid);
|
||||
openScreen("home");
|
||||
}
|
||||
}
|
||||
|
||||
function loadQuickLogin() {
|
||||
if (!isNaN(group) && group != "") {
|
||||
$.post(accounthubapi, {
|
||||
@ -62,7 +79,7 @@ function loadQuickLogin() {
|
||||
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'
|
||||
userhtml += '<div class="col-4 col-lg-3 quick-user" data-uid="' + u["uid"] + '" data-username="' + u["username"] + '" data-name="' + u["name"] + '" data-pin="' + (u["pin"] == true ? "1" : "") + '" >\n'
|
||||
+ '<i class="far fa-user fa-3x"></i>\n'
|
||||
+ '<br />\n'
|
||||
+ u["name"] + "\n"
|
||||
@ -70,10 +87,7 @@ function loadQuickLogin() {
|
||||
}
|
||||
$("#userlist .row").html(userhtml);
|
||||
$(".quick-user").click(function () {
|
||||
setuser($(this).data("username"));
|
||||
setname($(this).data("name"));
|
||||
setuid($(this).data("uid"));
|
||||
openScreen("home");
|
||||
doQuickLogin($(this).data("username"), $(this).data("name"), $(this).data("uid"), $(this).data("pin") == "1");
|
||||
});
|
||||
} else {
|
||||
$("#quickaccess_tab").tab("dispose");
|
||||
@ -104,6 +118,52 @@ $("#mobilecode_form").submit(function (event) {
|
||||
}
|
||||
});
|
||||
|
||||
function tryPinModalLogin(pin) {
|
||||
$.post(accounthubapi, {
|
||||
key: apikey,
|
||||
pin: pin,
|
||||
uid: $('#pinmodal').data("uid"),
|
||||
action: "checkpin"
|
||||
}, function (resp) {
|
||||
if (resp.pinvalid === true || resp.nopinset === true) {
|
||||
doQuickLogin($('#pinmodal').data("username"), $('#pinmodal').data("name"), $('#pinmodal').data("uid"), false);
|
||||
} else if (resp.pinvalid === false) {
|
||||
showmsg("PIN incorrect.", "danger");
|
||||
} else {
|
||||
showmsg(resp.msg, "danger");
|
||||
}
|
||||
}, "json");
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
var dials = $("#pinpad .digits");
|
||||
var index;
|
||||
var number = $("#pincode-box");
|
||||
|
||||
dials.click(function () {
|
||||
index = dials.index(this);
|
||||
if (index === 9) {
|
||||
number.val("");
|
||||
} else if (index === 10) {
|
||||
number.val(number.val() + "0");
|
||||
} else if (index === 11) {
|
||||
tryPinModalLogin(number.val());
|
||||
} else {
|
||||
number.val(number.val() + (index + 1));
|
||||
}
|
||||
});
|
||||
|
||||
number.keypress(function (event) {
|
||||
// Handle pressing Enter key
|
||||
if (event.keyCode === 13) {
|
||||
tryPinModalLogin(number.val());
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
loadQuickLogin();
|
||||
});
|
||||
|
||||
$('#pinmodal').on('shown.bs.modal', function () {
|
||||
$('#pincode-box').trigger('focus');
|
||||
})
|
@ -1,5 +1,90 @@
|
||||
<div class="modal fade" tabindex="-1" role="dialog" id="pinmodal" data-username="" data-uid="" data-name="">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title"><i class="fas fa-th"></i> Enter PIN</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<input id="pincode-box" type="text" style="-webkit-text-security: disc;" class="form-control" maxlength="8" pattern="[0-9]*" inputmode="numeric" />
|
||||
<br />
|
||||
<div id="main-wrapper">
|
||||
<div style="width: 60%; margin: 0 auto;">
|
||||
<div class="row justify-content-center" id="pinpad">
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
1
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
2
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
3
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
4
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
5
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
6
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
7
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
8
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
9
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-danger">
|
||||
<p>
|
||||
<i class="fas fa-angle-double-left"></i>
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-default">
|
||||
<p>
|
||||
0
|
||||
</p>
|
||||
</div>
|
||||
<div class="digits col-4 btn btn-success">
|
||||
<p id="pin-action">
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal" onclick="$('#pincode-box').val('');">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container" style="height: 100%;">
|
||||
<div class="row justify-content-center align-items-center" style="height: 100%;">
|
||||
<div class="row justify-content-center" style="height: 100%;">
|
||||
<div class="col-12 col-sm-10 col-md-8 col-lg-6">
|
||||
<div class="card" style="width: 100%;">
|
||||
<h3 class="card-header"><i class="fas fa-lock"></i> Login</h3>
|
||||
|
Loading…
x
Reference in New Issue
Block a user