MikletNg · September 28, 2017 15:28
diff --git a/ive-calc-web.html b/ive-calc-web.html
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>IVE出席率及缺席率計算器</title> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" integrity="sha256-NuCn4IvuZXdBaFKJOAcsU2Q3ZpwbdFisd5dux4jkQ5w=" crossorigin="anonymous"/> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha256-916EbMg70RQy9LHiGkXzG8hSg9EdNy97GazNG/aiY1w=" crossorigin="anonymous"/> <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha256-U5ZEeKfGNOja007MMD3YBI0A3OSZOQbeG6z2f2Y0hu8=" crossorigin="anonymous"></script> <style>@charset "utf-8";@import url(http://fonts.googleapis.com/earlyaccess/notosanstc.css);@import url(https://fonts.googleapis.com/css?family=Source+Code+Pro:400,200);.vertical-center,.wrapper{min-height:100vh;height:auto}.footer-nav,ol,ul{list-style:none}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,header,hgroup,html,i,iframe,img,ins,kbd,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;font-family:'Noto Sans TC',sans-serif}#footer-text,.source_code_content{font-family:'Source Code Pro',Noto Sans TC,Noto Sans SC!important}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}.vertical-center{display:flex;align-items:center;justify-content:center}.result_content{min-height:100%;padding:10px 30px;text-align:left;display:flex;justify-content:baseline}textarea{resize:none}.box_btn{border-top-left-radius:0;border-top-right-radius:0;border-top:none;padding-top:12px;padding-bottom:12px}.box_upper{border-bottom-left-radius:0;border-bottom-right-radius:0;z-index:-1}.footer-nav{height:35px;max-width:100%;background-color:#fff;font-size:14px}#footer-text{margin-top:10.5px;margin-bottom:0;float:right}.fa-loading{min-width:100%!important;font-size:8vw}#tt_time_input{max-height:20px;max-width:12%;padding:6px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.modal-body{font-size:14px;line-height:180%}</style> <script>function textarea_clear(){confirm("確認清空所有文本?")&&(document.getElementById("textarea").value="",$(".result_content").html(""))}function time_convert(e){var t=Math.round(Math.floor(e/60)),n=Math.round(e%60);return 0!==n?t+"小時"+n+"分鐘":t+"小時"}function calculate(e,t){document.getElementById("table_holder").innerHTML=t;var n=[],r=[];$("#table_holder table.hkvtcsp_wording th").each(function(e,t){r[e]=$(t).text()}),$("#table_holder table.hkvtcsp_wording tr").has("td").each(function(){var e={};$("td",$(this)).each(function(t,n){e[r[t]]=$(n).text()}),n.push(e)});var o,a,c=0,i=0,s=0,l=0,u=0,b=0,d=0;for(d=0;d<n.length;d++){var h=n[d]["課堂時間"].split("-");switch(n[d][""]){case"Present":c++;break;case"Late":s++;break;case"Absent":i++}var v=n[d]["出席時間"],m=new Date,_=h[0].split(":");m.setHours(_[0],_[1]);var f=new Date,g=h[1].split(":");f.setHours(g[0],g[1]);var x=new Date;"-"!=v?(v=v.split(":"),x.setHours(v[0],v[1]),x>m.setMinutes(m.getMinutes()+10)?(m.setHours(_[0],_[1]),o=(f-x)/1e3/60,a=(x-m)/1e3/60):(m.setHours(_[0],_[1]),o=(f-m)/1e3/60,a=0)):(o=0,a=(f-m)/1e3/60),l+=(f-m)/1e3/60,u+=o,b+=a}var p;p=60*e*.3>=b?time_convert(p=60*e*.3-b):"-/-",document.getElementById("content_container").innerHTML="<b>計算結果 :</b><br><br>總時數 : "+e+"小時\n<br>已上課堂時數 : "+time_convert(l)+"<br><br>總出席時數 : "+time_convert(u)+"<br>出席率 : "+(u/(60*e)*100).toFixed(2)+"%<br><br>總缺席時數 : "+time_convert(b)+"\n<br>缺席率 : "+(b/(60*e)*100).toFixed(2)+"%<br><br>每小時缺席率 : "+(60/(60*e)*100).toFixed(2)+"%<br>剩餘可缺席時數 : "+p,console.log(document.getElementById("content_container").innerText)}</script></head><body> <div class="modal fade" id="myModal" role="dialog"> <div class="modal-dialog modal-sm"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">教學</h4> </div><div class="modal-body"> <p>1.去往 <span class="label label-default"><a href="https://myportal.vtc.edu.hk" target="_blank" style="color:white">myportal</a></span> 查看出席記錄，並選擇要計算的科目</p><p>2.按 <kbd><kbd> Ctrl </kbd><kbd> + </kbd><kbd> Shift </kbd><kbd> + </kbd><kbd>C</kbd></kbd> </p><p>3.按 <kbd><kbd> Ctrl </kbd><kbd> + </kbd><kbd> F </kbd></kbd> </p><p>4.搜索 <code>&nbsp;table.hkvtcsp_wording&nbsp;</code></p><p>5.複製所搜尋到的 table (Copy>Copy Element)</p><p>6.回到本網貼上，輸入該科目的總時數</p></div><div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">關閉</button> </div></div></div></div><div class="wrapper"> <div class="container"> <div class="vertical-center"> <form class="form-inline"> <div class="form-group"> <div class="input-group" style="width:100%"> <textarea id="textarea" class="form-control source_code_content box_upper" rows="25" cols="80" placeholder="Paste the source code here..." requird></textarea> <span id="content_container" class="input-group-addon box_upper" style="width:25%;"> <div class="result_content"></div></span> </div><div class="btn-group btn-group-justified" role="group"> <div class="btn-group" role="group"> <button type="button" class="btn btn-default box_btn" onclick="calculate(document.getElementById('tt_time_input').value,document.getElementById('textarea').value)" style="border-right:none"> <div class="form-group"> <i class="fa fa-check" aria-hidden="true"></i>&nbsp;遞交&nbsp;(總時數<input type="number" class="form-control" id="tt_time_input"/>小時) </div></button> </div><div class="btn-group" role="group"> <button type="button" class="btn btn-default box_btn" onclick="textarea_clear()"><i class="fa fa-trash-o" aria-hidden="true"></i>&nbsp;清空</button> </div></div></div></form> </div></div></div><div class="navbar-fixed-top"> <nav class="footer-nav"> <div class="container"><span id="footer-text" class="navbar-text"><button type="button" class="btn btn-info btn-xs" data-toggle="modal" data-target="#myModal">教學</button>&nbsp&nbsp<i class="fa fa-code"></i>&nbsp;By Miklet with&nbsp;<i class="fa fa-heart" style="color:#900"></i></span> </div></nav> </div><div id="table_holder" style="display: none"></div></body></html>