Showing
1 changed file
with
28 additions
and
11 deletions
| 1 | <!doctype html> | 1 | <!doctype html> |
| 2 | -<title>Web Attendance System Register</title> | 2 | +<head> |
| 3 | <meta charset="UTF-8"> | 3 | <meta charset="UTF-8"> |
| 4 | <meta name="viewport" content="width=device-width, initial-scale=1"> | 4 | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| 5 | +<title>Web Attendance System Register</title> | ||
| 5 | <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> | 6 | <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> |
| 6 | <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800&subset=korean"> | 7 | <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800&subset=korean"> |
| 7 | -<style> | 8 | +<style>body,h1,h2,h3,h4,h5 {font-family: "Nanum+Gothic", sans-serif}</style> |
| 8 | -body,h1,h2,h3,h4,h5 {font-family: "Nanum+Gothic", sans-serif} | ||
| 9 | -</style> | ||
| 10 | <script type='text/javascript' src="{{url_for('static', filename='js/opencv.js')}}"></script> | 9 | <script type='text/javascript' src="{{url_for('static', filename='js/opencv.js')}}"></script> |
| 11 | <script type='text/javascript' src="{{url_for('static', filename='js/utils.js')}}"></script> | 10 | <script type='text/javascript' src="{{url_for('static', filename='js/utils.js')}}"></script> |
| 12 | <script type='text/javascript' src="https://code.jquery.com/jquery-1.12.4.min.js"></script> | 11 | <script type='text/javascript' src="https://code.jquery.com/jquery-1.12.4.min.js"></script> |
| ... | @@ -14,16 +13,19 @@ body,h1,h2,h3,h4,h5 {font-family: "Nanum+Gothic", sans-serif} | ... | @@ -14,16 +13,19 @@ body,h1,h2,h3,h4,h5 {font-family: "Nanum+Gothic", sans-serif} |
| 14 | let tempCanvas = document.createElement("canvas"); | 13 | let tempCanvas = document.createElement("canvas"); |
| 15 | function load_cascade() | 14 | function load_cascade() |
| 16 | { | 15 | { |
| 17 | - let faceCascadeFile = 'haarcascade_frontalface_default.xml' | 16 | + alert("shibal"); |
| 18 | - let faceCascadeURL = "{{url_for('static', filename='js/haarcascade_frontalface_default.xml')}}" | 17 | + let faceCascadeFile = 'haarcascade_frontalface_default.xml'; |
| 18 | + let faceCascadeURL = "{{url_for('static', filename='js/haarcascade_frontalface_default.xml')}}"; | ||
| 19 | let utils = new Utils('errorMessage'); | 19 | let utils = new Utils('errorMessage'); |
| 20 | utils.createFileFromUrl(faceCascadeFile, faceCascadeURL, () => { | 20 | utils.createFileFromUrl(faceCascadeFile, faceCascadeURL, () => { |
| 21 | - activate() | 21 | + alert("shibal"); |
| 22 | + activate(); | ||
| 22 | }); | 23 | }); |
| 23 | } | 24 | } |
| 24 | function activate() | 25 | function activate() |
| 25 | { | 26 | { |
| 26 | - document.getElementById("myFile").disabled = false; | 27 | + let fileloader = document.getElementById("fileloader"); |
| 28 | + fileloader.disabled = false; | ||
| 27 | } | 29 | } |
| 28 | 30 | ||
| 29 | function detect_face() | 31 | function detect_face() |
| ... | @@ -51,7 +53,8 @@ function detect_face() | ... | @@ -51,7 +53,8 @@ function detect_face() |
| 51 | } | 53 | } |
| 52 | if (faces.size() == 1) | 54 | if (faces.size() == 1) |
| 53 | { | 55 | { |
| 54 | - document.getElementById("sender").disabled = false; | 56 | + let sender = document.getElementById("sender"); |
| 57 | + sender.disabled = false; | ||
| 55 | } | 58 | } |
| 56 | else if (faces.size() == 0) | 59 | else if (faces.size() == 0) |
| 57 | { | 60 | { |
| ... | @@ -86,10 +89,22 @@ function submit() | ... | @@ -86,10 +89,22 @@ function submit() |
| 86 | }) | 89 | }) |
| 87 | } | 90 | } |
| 88 | 91 | ||
| 92 | +var loadFile = function(event) { | ||
| 93 | + var reader = new FileReader(); | ||
| 94 | + reader.readAsDataURL(event.target.files[0]); | ||
| 95 | + output.onload = function() { | ||
| 96 | + var output = document.getElementById('imagefile'); | ||
| 97 | + output.src = URL.createObjectURL(event.target.files[0]); | ||
| 98 | + detect_face() | ||
| 99 | + } | ||
| 100 | + }; | ||
| 101 | + | ||
| 89 | </script> | 102 | </script> |
| 103 | +</head> | ||
| 90 | <body class="w3-light-grey" onload="cv['onRuntimeInitialized']=()=>{ load_cascade() }"> | 104 | <body class="w3-light-grey" onload="cv['onRuntimeInitialized']=()=>{ load_cascade() }"> |
| 91 | <!-- w3-content defines a container for fixed size centered content, | 105 | <!-- w3-content defines a container for fixed size centered content, |
| 92 | and is wrapped around the whole page content, except for the footer in this example --> | 106 | and is wrapped around the whole page content, except for the footer in this example --> |
| 107 | + | ||
| 93 | <div class="w3-content" style="max-width:1400px"> | 108 | <div class="w3-content" style="max-width:1400px"> |
| 94 | 109 | ||
| 95 | <!-- Header --> | 110 | <!-- Header --> |
| ... | @@ -103,13 +118,14 @@ and is wrapped around the whole page content, except for the footer in this exam | ... | @@ -103,13 +118,14 @@ and is wrapped around the whole page content, except for the footer in this exam |
| 103 | <div> | 118 | <div> |
| 104 | 학번: <input type="text" name="student_id"><br> | 119 | 학번: <input type="text" name="student_id"><br> |
| 105 | 이름: <input type="text" name="student_name"><br><br> | 120 | 이름: <input type="text" name="student_name"><br><br> |
| 106 | - <input type="file" name="file" onchange="loadFile(event)" autocomplete="off" accept="image/jpeg" required disabled> | 121 | + <input type="file" id="fileloader" name="file" onchange="loadFile(event)" autocomplete="off" accept="image/jpeg" required disabled> |
| 107 | <div> | 122 | <div> |
| 108 | <img id="imagefile" style="display:none;"> | 123 | <img id="imagefile" style="display:none;"> |
| 109 | <canvas id="preview"></canvas> | 124 | <canvas id="preview"></canvas> |
| 110 | </div> | 125 | </div> |
| 111 | <input id="sender" type="button" onclick="submit" value="등록" disabled> | 126 | <input id="sender" type="button" onclick="submit" value="등록" disabled> |
| 112 | </div> | 127 | </div> |
| 128 | +</div> | ||
| 113 | <script> | 129 | <script> |
| 114 | var loadFile = function(event) { | 130 | var loadFile = function(event) { |
| 115 | var reader = new FileReader(); | 131 | var reader = new FileReader(); |
| ... | @@ -121,5 +137,6 @@ and is wrapped around the whole page content, except for the footer in this exam | ... | @@ -121,5 +137,6 @@ and is wrapped around the whole page content, except for the footer in this exam |
| 121 | } | 137 | } |
| 122 | }; | 138 | }; |
| 123 | </script> | 139 | </script> |
| 124 | -</div> | 140 | +</body> |
| 141 | +</html> | ||
| 125 | 142 | ... | ... |
-
Please register or login to post a comment