2020-2-capstone-design2 / 2014104149

Go to a project
Toggle navigation Toggle navigation pinning
Graduate
bbbd9ab5 1 parent 6e7fc1c6

Update HTML

Inline Side-by-side
Showing 2 changed files with 26 additions and 12 deletions
......@@ -2,10 +2,14 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Web Attendance System</title>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800&amp;subset=korean">
<style>body,h1,h2,h3,h4,h5,p {font-family: "Nanum+Gothic", sans-serif}</style>
<style>
#container {
margin: 0px auto;
margin: 15px auto;
border: 10px #333 solid;
}
#videoInput {
......@@ -184,9 +188,19 @@ function main()
</script>
</head>
<body onload="cv['onRuntimeInitialized']=()=>{ init(); };">
<div id="container">
<video autoplay="true" id="videoInput" style="display: none; object-fit: cover;"></video>
<canvas id="canvasOutput"></canvas>
<div class="w3-content" style="max-width:1400px">
<!-- Header -->
<header class="w3-container w3-center w3-padding-32">
<h1><b>얼굴 인식 출석 시스템</b></h1>
<p>Made by <span class="w3-tag">정해갑</span></p>
</header>
<div class="w3-row", style='text-align:center'>
<div id="container">
<video autoplay="true" id="videoInput" style="display: none; object-fit: cover;"></video>
<canvas id="canvasOutput"></canvas>
</div>
</div>
</div>
</body>
</html>
......
......@@ -6,10 +6,10 @@
<title>Web Attendance System Register</title>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800&amp;subset=korean">
<style>body,h1,h2,h3,h4,h5 {font-family: "Nanum+Gothic", sans-serif}</style>
<style>body,h1,h2,h3,h4,h5,p {font-family: "Nanum+Gothic", sans-serif}</style>
<style>
#container {
margin: 0px auto;
margin: 15px auto;
}
#videoInput {
background-color: #666;
......@@ -23,7 +23,7 @@
<script type='text/javascript' src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type='text/javascript'>
var b64encoded = '';
var streaming = true;
var streaming = false;
function init()
{
let video = document.getElementById('videoInput');
......@@ -173,11 +173,11 @@ function toggle_streaming()
streaming = !streaming;
if (streaming){
streamButton.value = "촬영중지";
change_notice("1초 후 얼굴을 촬영합니다");
change_notice("얼굴이 인식되면 얼굴을 촬영합니다");
}
else{
streamButton.value = "촬영시작";
change_notice("촬영이 중지되었습니다");
change_notice("촬영 시작 버튼을 누르면 인식된 얼굴을 촬영합니다");
}
main();
}
......@@ -230,9 +230,10 @@ and is wrapped around the whole page content, except for the footer in this exam
<h1><b>얼굴 등록</b></h1>
<p>Made by <span class="w3-tag">정해갑</span></p>
</header>
<div class="w3-row", style='text-align:center'>
<h2 id="notice"><b>1초 후 얼굴을 촬영합니다</b></h2>
<h2 id="notice"><b>촬영 시작 버튼을 누르면 인식된 얼굴을 촬영합니다</b></h2>
<input id="streamButton" type="button" onclick="toggle_streaming()" value="활영시작">
<div id="container">
<video autoplay="true" id="videoInput" style="display: none; object-fit:cover;"></video>
<canvas id="canvasOutput"></canvas>
......@@ -240,7 +241,6 @@ and is wrapped around the whole page content, except for the footer in this exam
<div>
학번: <input type="text" id="student_id"><br>
이름: <input type="text" id="student_name"><br><br>
<input id="streamButton" type="button" onclick="toggle_streaming()" value="활영중지">
<input id="sender" type="button" onclick="submit()" value="등록" disabled>
</div>
</div>
......