Skip to content

P
postbox
Commit f4ad973c authored by Wen Wei Li's avatar Wen Wei Li
Browse files
Options

pincode layout

parent 0da28b71
Show whitespace changes
Inline Side-by-side
Showing with 38 additions and 17 deletions
static/css/main.css
View file @ f4ad973c
......@@ -12,3 +12,7 @@ input:focus{
td {
cursor: pointer;
}
input.input_margin{
margin-right: 6%;
}
static/js/pincode.js
View file @ f4ad973c
......@@ -16,18 +16,35 @@ let myKeyboard = new Keyboard({
});
let ary_input = [];
let index = 1
let index = 1;
function onChange(input) {
if ( ary_input.length > 6 ){
ary_input.pop();
}
console.log("Input changed", ary_input);
}
function onKeyPress(button) {
console.log("index : ", index);
n = "slot-"+index
document.querySelector('input[id="'+n+'"]').value = '1';
if ( String(button) == "{bksp}" && index > 1 ){
index= index - 1;
n = "slot-" + index;
document.querySelector('input[id="'+n+'"]').value = '';
ary_input.pop();
}else if( String(button) == "{bksp}" && index == 1){
console.log("back to the first pin code");
}else if (index < 7 ){
n = "slot-" + index;
document.querySelector('input[id="'+n+'"]').value = button;
index = index + 1;
ary_input.push(button)
ary_input.push(button);
}else{
console.log("index over 6");
}
document.querySelector('input[id="'+n+'"]').focus();
console.log("Button pressed", button);
}
templates/pincode.html
View file @ f4ad973c
......@@ -31,13 +31,13 @@
{% endblock head %}
{% block content%}
<body class="bg-light m-5">
<body class="container mx-auto bg-light m-5">
<h2 class="text-muted text-center m-5">PinCode Setup</h2>
<center>
<div class="col align-items-center m-5 col-8">
<div class="col-10 inline ">
<div class="row col mx-auto m-5 col-8">
<div class="col-sm">
{% for i in range(6) %}
<input type="password" class="form-control input" id="slot-{{loop.index}}" maxlength="1">
<input type="password" class="form-control input float-left col-sm-1 text-center input_margin" id="slot-{{loop.index}}" disabled="true" maxlength="1">
{% endfor %}
</div>
<div class="col-2 inline">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment