Added time and switch font

This commit is contained in:
Aaron Lee 2021-09-18 22:04:31 +08:00
parent 47ce23ca18
commit 64aa07625e
7 changed files with 106 additions and 61 deletions

View file

@ -1,3 +1,10 @@
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC&display=swap');
body {
font-family: "Lato", "Noto Sans TC", "Microsoft JhengHei", "sans-serif";
}
div.col .row .col { div.col .row .col {
border: 1px solid black; border: 1px solid black;
} }
@ -99,7 +106,7 @@ input[type="checkbox"].late:checked {
background: rgb(15, 184, 0); background: rgb(15, 184, 0);
} }
input[type="checkbox"].late:checked:after { input[type="checkbox"].late:checked:after {
content: "φ"; content: "𝜑";
color: #fff; color: #fff;
position: absolute; position: absolute;
left: 50%; left: 50%;
@ -118,4 +125,16 @@ input[type="checkbox"].late:checked:after {
button.logout { button.logout {
margin-left: 0 !important; margin-left: 0 !important;
}
div.showTime {
z-index: 1;
position:fixed;
padding: 10px;
font-size: 1.2em;
bottom:1em;
right:1em;
border:1px solid black;
color:rgb(77, 77, 77);
background:rgb(179, 255, 169);
} }

20
static/time.js Normal file
View file

@ -0,0 +1,20 @@
(function () {
function checkTime(i) {
return (i < 10) ? "0" + i : i;
}
function startTime() {
var today = new Date(),
y = today.getFullYear(),
mm = checkTime(today.getMonth() + 1),
d = checkTime(today.getDate()),
h = checkTime(today.getHours()),
m = checkTime(today.getMinutes()),
s = checkTime(today.getSeconds());
document.getElementById('showTime').innerHTML = y + "/" + mm + "/" + d + " " + h + ":" + m + ":" + s;
t = setTimeout(function () {
startTime()
}, 500);
}
startTime();
})();

View file

@ -23,6 +23,7 @@
</head> </head>
<body> <body>
<div class="showTime">Current Time: <span id="showTime"></span></div>
<div class="container"> <div class="container">
<h1 class="margin-top">Admin View | 管理頁面</h1> <h1 class="margin-top">Admin View | 管理頁面</h1>
<h2 class="margin-top">{{homeroomCode[0]}} {{homeroomCode[1]}}</h2> <h2 class="margin-top">{{homeroomCode[0]}} {{homeroomCode[1]}}</h2>
@ -64,21 +65,13 @@
<div class="col"> <div class="col">
<div class="sticky-top" style="background-color: white;"> <div class="sticky-top" style="background-color: white;">
<div class="row title"> <div class="row title">
<div class="col">HR</div> <div class="col">班級</div>
<div class="col">Number</div> <div class="col">座號</div>
<div class="col">Name</div> <div class="col">姓名</div>
<div class="col">Eng Name</div> <div class="col">英文姓名</div>
<div class="col">Morning</div> {% for p in periods %}
<div class="col">1</div> <div class="col">{{p}}</div>
<div class="col">2</div> {% endfor %}
<div class="col">3</div>
<div class="col">4</div>
<div class="col">Nap</div>
<div class="col">5</div>
<div class="col">6</div>
<div class="col">7</div>
<div class="col">8</div>
<div class="col">9</div>
</div> </div>
<div class="row title"> <div class="row title">
<div class="col"></div> <div class="col"></div>
@ -107,34 +100,40 @@
<div class="col">{{ homeroomData[i]['name'] }}</div> <div class="col">{{ homeroomData[i]['name'] }}</div>
<div class="col">{{ homeroomData[i]['eng_name'] }}</div> <div class="col">{{ homeroomData[i]['eng_name'] }}</div>
{% for j in periods %} {% for j in periods %}
{% if 'signature' in absData[currDate][j] %} <div class="col" {% if currPeriod==j %} style="background-color: #ffdf81;" {% endif %}>
{% if i in absData[currDate][j] %} {% if 'signature' in absData[currDate][j] %}
<div class="col"> {% if i in absData[currDate][j] %}
{% if absData[currDate][j][i] == 1 %}
<p class="highlightAbs n-2">X</p> <p class="highlightAbs n-2">X</p>
</div> {% else %}
{% else %} <p class="highlightAbs n-3">𝜑</p>
{% if absData[currDate][j]['name'] != 'GP' %} {% endif %}
<div class="col"> {% else %}
{% if absData[currDate][j]['name'] != 'GP' %}
<p class="highlightAbs n-1">V</p> <p class="highlightAbs n-1">V</p>
</div> {% else %}
{% else %} {% if (homeroomData[i]['GP_Class'][absData[currDate][j]['teacher']] in
{% if (homeroomData[i]['GP_Class'][absData[currDate][j]['teacher']] in absData[currDate][j]['signature'])%}
absData[currDate][j]['signature'])%}
<div class="col">
<p class="highlightAbs n-1">V</p> <p class="highlightAbs n-1">V</p>
</div> {% else %}
{% else %}
<div class="col">
<p class="highlightAbs n-2"></p> <p class="highlightAbs n-2"></p>
</div> {% endif %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% endif %} {% elif absData[currDate][j]['name'] == 'GP' %}
{% else %}
<div class="col">
<p class="highlightAbs"></p> <p class="highlightAbs"></p>
{% else %}
{% if 'confirm' in absData[currDate] %}
<p class="highlightAbs"></p>
{% else %}
<input type="checkbox" class="tobeform 2^{{j}}^{{i}} late" id="late^{{j}}^{{i}}"
onchange="unCheckAbs('{{j}}^{{i}}')">
<input type="checkbox" class="tobeform 1^{{j}}^{{i}} absent" id="absent^{{j}}^{{i}}"
onchange="unCheckLate('{{j}}^{{i}}')">
{% endif %}
<!-- <input type="checkbox" class="tobeform {{j}}^{{i}}"> -->
{% endif %}
</div> </div>
{% endif %}
{% endfor %} {% endfor %}
</div> </div>
{% endfor %} {% endfor %}
@ -247,6 +246,7 @@
document.getElementById('hrSelForm').submit(); document.getElementById('hrSelForm').submit();
} }
</script> </script>
<script src="/static/time.js"></script>
</body> </body>
</html> </html>

View file

@ -23,6 +23,7 @@
</head> </head>
<body> <body>
<div class="showTime">Current Time: <span id="showTime"></span></div>
<div class="container"> <div class="container">
<h1 class="margin-top">Group Class View | 分組課頁面</h1> <h1 class="margin-top">Group Class View | 分組課頁面</h1>
<h2 class="margin-top">{{cclass['category']}}: {{cclass['class_id']}}: {{cclass['name']}}</h2> <h2 class="margin-top">{{cclass['category']}}: {{cclass['class_id']}}: {{cclass['name']}}</h2>
@ -47,12 +48,12 @@
<input type="hidden" class="signatureData" name="signatureData" value=""> <input type="hidden" class="signatureData" name="signatureData" value="">
<div class="col" style="margin-top: 30px;"> <div class="col" style="margin-top: 30px;">
<div class="row title sticky-top" style="background-color: white"> <div class="row title sticky-top" style="background-color: white">
<div class="col">Grade</div> <div class="col">Grade 年級</div>
<div class="col">Class Code</div> <div class="col">Class 班級</div>
<div class="col">Number</div> <div class="col">Number 座號</div>
<div class="col">Name</div> <div class="col">Name 姓名</div>
<div class="col">Eng Name</div> <div class="col">English Name 英文名</div>
<div class="col">Period {{i}}</div> <div class="col">Period {{i}} | 第 {{i}} 節</div>
</div> </div>
{% if data != None %} {% if data != None %}
{% for grade in absData[i] %} {% for grade in absData[i] %}
@ -73,7 +74,7 @@
</div> </div>
{% elif absData[i][grade][homeroom][student]['absent'] == 2 %} {% elif absData[i][grade][homeroom][student]['absent'] == 2 %}
<div class="col"> <div class="col">
<p class="highlightAbs n-3">φ</p> <p class="highlightAbs n-3">𝜑</p>
</div> </div>
{% else %} {% else %}
<div class="col"> <div class="col">
@ -109,20 +110,20 @@
{% else %} {% else %}
<button class="btn btn-primary margin-bottom viewSignatureBtn" type="button" <button class="btn btn-primary margin-bottom viewSignatureBtn" type="button"
onclick="viewSignature('{{i}}')"> onclick="viewSignature('{{i}}')">
↑ Confirmed, Sign (Period {{i}}) ↑</button> ↑ Confirm 確認 (Period {{i}}) ↑</button>
{% endif %} {% endif %}
<div class="signDiv" id="sign^{{i}}" hidden="hidden"> <div class="signDiv" id="sign^{{i}}" hidden="hidden">
<div class="alert alert-warning" id="allPresentWarning" role="alert" hidden="hidden"> <div class="alert alert-warning margin-top" id="allPresentWarning" role="alert" hidden="hidden">
<h4 class="alert-heading">請確認是否全班全到Please check if everyone is present!</h4> <h4 class="alert-heading">請確認是否全班全到Please check if everyone is present!</h4>
</div> </div>
<h3>Please Sign Below</h3> <h3 class="margin-top">Please Sign Below 請在下方簽名</h3>
<div class="forSign"><canvas id="signature_pad^{{i}}"></canvas></div> <div class="forSign"><canvas id="signature_pad^{{i}}"></canvas></div>
<h3>Notes 備註欄</h3> <h3 class="margin-top">Notes 備註欄</h3>
<input class="form-control" name="notes" id="subjectNotes^{{i}}" placeholder="Enter Notes 請輸入備註" <input class="form-control" name="notes" id="subjectNotes^{{i}}" placeholder="Enter Notes 請輸入備註"
style="width: 80%; margin-left: 10%;"> style="width: 80%; margin-left: 10%;">
<button class="btn btn-secondary" type="button" onclick="signaturePad.clear()">Clear <button class="btn btn-secondary margin-top" type="button" onclick="signaturePad.clear()">Clear
Signature</button><button class="btn btn-primary" type="button" Signature 清除簽名</button><button class="btn btn-primary margin-top" type="button"
onclick="submitForm()">Submit</button> onclick="submitForm()">Submit 提交</button>
</div> </div>
</div> </div>
</form> </form>
@ -202,6 +203,7 @@
document.getElementById('dateSelForm').submit(); document.getElementById('dateSelForm').submit();
} }
</script> </script>
<script src="/static/time.js"></script>
</body> </body>
</html> </html>

View file

@ -24,6 +24,7 @@
</head> </head>
<body> <body>
<div class="showTime">Current Time: <span id="showTime"></span></div>
<div class="container"> <div class="container">
<h1 class="margin-top">Homeroom View | 班級主頁</h1> <h1 class="margin-top">Homeroom View | 班級主頁</h1>
<h2 class="margin-top">{{homeroomCode[0]}}{{homeroomCode[1]}}</h2> <h2 class="margin-top">{{homeroomCode[0]}}{{homeroomCode[1]}}</h2>
@ -90,7 +91,7 @@
{% if absData[currDate][j][i] == 1 %} {% if absData[currDate][j][i] == 1 %}
<p class="highlightAbs n-2">X</p> <p class="highlightAbs n-2">X</p>
{% else %} {% else %}
<p class="highlightAbs n-3">φ</p> <p class="highlightAbs n-3">𝜑</p>
{% endif %} {% endif %}
{% else %} {% else %}
{% if absData[currDate][j]['name'] != 'GP' %} {% if absData[currDate][j]['name'] != 'GP' %}
@ -155,19 +156,20 @@
{% endif %} {% endif %}
<div id="finalCheck" hidden="hidden"> <div id="finalCheck" hidden="hidden">
<!-- show warning --> <!-- show warning -->
<div class="alert alert-warning" id="allPresentWarning" role="alert" hidden="hidden"> <div class="alert alert-warning margin-top" id="allPresentWarning" role="alert" hidden="hidden">
<h4 class="alert-heading">請確認是否全班全到Please check if everyone is present!</h4> <h4 class="alert-heading">請確認是否全班全到Please check if everyone is present!</h4>
</div> </div>
<h3>Please Sign Below 請在下簽名<br> <h3 class="margin-top">Please Sign Below 請在下簽名<br>
Period: <span id="showSignPeriod"></span> <br> Period: <span id="showSignPeriod"></span> <br>
Subject: <span id="showSignSubjectName"></span> Subject: <span id="showSignSubjectName"></span>
</h3> </h3>
<div class="forSign"><canvas id="signature_pad"></canvas></div> <div class="forSign"><canvas id="signature_pad"></canvas></div>
<h3>Notes 備註欄</h3> <h3 class="margin-top">Notes 備註欄</h3>
<input type="textarea" class="form-control" name="notes" id="subjectNotes" <input type="textarea" class="form-control" name="notes" id="subjectNotes"
placeholder="Enter Notes 請輸入備註" style="width: 80%; margin-left: 10%;" row="3"> placeholder="Enter Notes 請輸入備註" style="width: 80%; margin-left: 10%;" row="3">
<button class="btn btn-secondary" type="button" onclick="signaturePad.clear()">Clear Signature</button> <button class="btn btn-secondary margin-top" type="button" onclick="signaturePad.clear()">Clear
<button class="btn btn-primary" type="button" onclick="submitForm()">Submit</button> Signature 清除簽名</button>
<button class="btn btn-primary margin-top" type="button" onclick="submitForm()">Submit 提交</button>
</div> </div>
{% for c in range(periods|length + 1) %} {% for c in range(periods|length + 1) %}
{% if c % 4 == 0 %} {% if c % 4 == 0 %}
@ -308,6 +310,7 @@
document.getElementById('absent^' + string).checked = false; document.getElementById('absent^' + string).checked = false;
} }
</script> </script>
<script src="/static/time.js"></script>
</body> </body>
</html> </html>

View file

@ -22,7 +22,7 @@
</head> </head>
<body> <body>
<!-- login form center --> <div class="showTime">Current Time: <span id="showTime"></span></div>
<div class="container"> <div class="container">
<h1 class="margin-top margin-bottom">Attendance 點名系統 (β) | Login 登入</h1> <h1 class="margin-top margin-bottom">Attendance 點名系統 (β) | Login 登入</h1>
<div class="row"> <div class="row">
@ -73,6 +73,7 @@
$('#loading').show(); $('#loading').show();
} }
</script> </script>
<script src="/static/time.js"></script>
</body> </body>
</html> </html>

View file

@ -22,7 +22,7 @@
</head> </head>
<body> <body>
<!-- csv form center --> <div class="showTime">Current Time: <span id="showTime"></span></div>
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col"></div> <div class="col"></div>
@ -84,7 +84,7 @@
$('#loading').show(); $('#loading').show();
} }
</script> </script>
<!-- end csv form center --> <script src="/static/time.js"></script>
</body> </body>
</html> </html>