Showing
1 changed file
with
29 additions
and
12 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'; |
19 | - let utils = new Utils('errorMessage'); | 18 | + let faceCascadeURL = "{{url_for('static', filename='js/haarcascade_frontalface_default.xml')}}"; |
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