Mirror/filesafe
1
0
Fork 0
mirror of https://github.com/BobbyWibowo/lolisafe.git synced 2025-01-19 09:41:33 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Updated auth page

Browse Source 
Experimental changes:
* No more elements with "onclick" attribute.
* Form can now be submitted with Enter button as long as both the user and the pass inputs are filled.
This commit is contained in:
Bobby Wibowo 2018-07-17 10:13:48 +07:00
parent fcdac004f3
commit c238f4f8ed
No known key found for this signature in database
GPG Key ID: 51C3A1E1E22D26CF
3 changed files with 67 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
public/js/auth.js
View File

@ -2,12 +2,22 @@
var page = { var page = {
// user token // user token
token: localStorage.token token: localStorage.token,
// HTML elements
form: null,
user: null,
pass: null
} }
page.do = function (dest) { page.do = function (dest, onEnter) {
var user = document.getElementById('user').value var user = page.user.value
var pass = document.getElementById('pass').value var pass = page.pass.value
// If the form is submitted with Enter button and the form is still empty
if (onEnter && !user.length && !pass.length) { return }
console.log('page.do()\'ing: ' + dest)
if (!user) { if (!user) {
return swal('Error', 'You need to specify a username', 'error') return swal('Error', 'You need to specify a username', 'error')
@ -54,14 +64,33 @@ page.verify = function () {
}) })
} }
page.formEnter = function (event) {
if (event.keyCode === 13 || event.which === 13) {
event.preventDefault()
event.stopPropagation()
page.do('login', true)
}
}
window.onload = function () { window.onload = function () {
page.verify() page.verify()
document.body.addEventListener('keydown', function (event) { page.user = document.getElementById('user')
event = event || window.event page.pass = document.getElementById('pass')
if (!event) { return }
var id = event.target.id page.form = document.getElementById('authForm')
if (!['user', 'pass'].includes(id)) { return } page.form.addEventListener('keyup', page.formEnter)
if (event.keyCode === 13 || event.which === 13) { page.do('login') } page.form.addEventListener('keypress', page.formEnter)
page.form.onsubmit = function (event) {
event.preventDefault()
event.stopPropagation()
}
document.getElementById('loginBtn').addEventListener('click', function () {
page.do('login')
})
document.getElementById('registerBtn').addEventListener('click', function () {
page.do('register')
}) })
} }

2
views/_globals.njk
View File

@ -13,7 +13,7 @@
v2: Images and config files (manifest.json, browserconfig.xml, etc). v2: Images and config files (manifest.json, browserconfig.xml, etc).
v3: CSS and JS files (libs such as bulma, lazyload, etc). v3: CSS and JS files (libs such as bulma, lazyload, etc).
#} #}
{% set v1 = "Xo8dt9SFWE" %} {% set v1 = "iz81GIx05U" %}
{% set v2 = "Ii3JYKIhb0" %} {% set v2 = "Ii3JYKIhb0" %}
{% set v3 = "HrvcYD3KTh" %} {% set v3 = "HrvcYD3KTh" %}

52
views/auth.njk
View File

@ -28,34 +28,36 @@
<h2 class="subtitle"> <h2 class="subtitle">
Login or register Login or register
</h2> </h2>
<div class="field"> <form id="authForm">
<div class="control"> <div class="field">
<input id="user" class="input" type="text" placeholder="Your username"> <div class="control">
<input id="user" name="user" class="input" type="text" placeholder="Your username">
</div>
</div> </div>
</div> <div class="field">
<div class="field"> <div class="control">
<div class="control"> <input id="pass" name="pass" class="input" type="password" placeholder="Your password">
<input id="pass" class="input" type="password" placeholder="Your password"> </div>
</div> </div>
</div> <div class="field is-grouped is-grouped-right">
<div class="field is-grouped is-grouped-right"> <div class="control">
<div class="control"> <a id="registerBtn" class="button">
<a id="registerBtn" class="button" onclick="page.do('register')"> <span class="icon">
<span class="icon"> <i class="icon-user-plus"></i>
<i class="icon-user-plus"></i> </span>
</span> <span>Register</span>
<span>Register</span> </a>
</a> </div>
<div class="control">
<button id="loginBtn" type="submit" class="button">
<span class="icon">
<i class="icon-login"></i>
</span>
<span>Log in</span>
</button>
</div>
</div> </div>
<div class="control"> </form>
<a id="loginBtn" class="button" onclick="page.do('login')">
<span class="icon">
<i class="icon-login"></i>
</span>
<span>Log in</span>
</a>
</div>
</div>
</div> </div>
<div class="column is-one-third is-hidden-mobile"></div> <div class="column is-one-third is-hidden-mobile"></div>
</div> </div>