265 lines
12 KiB
HTML
265 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
|
|
<meta charset="UTF-8">
|
|
|
|
<title>타이머 | 초코마에</title>
|
|
<meta name="description" CONTENT="타이머 - 자격증 시험용 타이머 앱 | 초코마에 ‧ Timer - timer app for license test | ChocoMae">
|
|
|
|
<!-- Global site tag (gtag.js) - Google Analytics -->
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=G-9TDS96SGFE"></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
|
|
gtag('config', 'G-9TDS96SGFE');
|
|
</script>
|
|
|
|
|
|
<link rel="icon" href="/mouse_typing/resources/image/icon/favicon.ico" type="image/x-icon" />
|
|
<link rel="shortcut icon" href="/mouse_typing/resources/image/icon/favicon.ico" type="image/x-icon" />
|
|
|
|
<link href="../../../resources/font/open-iconic-master/font/css/open-iconic-bootstrap.css" rel="stylesheet">
|
|
<link href="../../../resources/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
|
|
|
<script type="text/javascript" src="./../../../resources/jquery/jquery-3.3.1.min.js"></script>
|
|
<script src="../../../resources/js/phaser.min.js"></script>
|
|
<script type="text/javascript" src="../../util/phaser-input-master/build/phaser-input.min.js"></script>
|
|
|
|
<!-- global source files -->
|
|
<script src="../../game/lib/session_storage_manager.js"></script>
|
|
<script src="../../game/lib/global/global_variables.js"></script>
|
|
|
|
<!-- library source files -->
|
|
<script src="../../game/lib/util/number_util.js"></script>
|
|
<script src="../../game/lib/util/string_util.js"></script>
|
|
<script src="../../game/lib/util/record_util.js"></script>
|
|
<script src="../../game/lib/util/date_util.js"></script>
|
|
|
|
<script src="../../game/lib/text/input_type_text.js"></script>
|
|
<script src="../../game/lib/text/screen_top_ui.js"></script>
|
|
<script src="../../game/lib/text/screen_bottom_ui.js"></script>
|
|
|
|
<script src="../../game/lib/sprite/sprite_icon_timer.js"></script>
|
|
<script src="../../game/lib/keyboard_shortcut.js"></script>
|
|
<script src="../../game/lib/button/round_rect_button.js"></script>
|
|
<script src="../../game/lib/button/home_button.js"></script>
|
|
<script src="../../game/lib/button/back_button.js"></script>
|
|
<script src="../../game/lib/button/fullscreen_button.js"></script>
|
|
<script src="../../game/lib/button/game_app_button.js"></script>
|
|
<script src="../../game/lib/db_connect_manager.js"></script>
|
|
|
|
|
|
<!-- license company and subject list : data files -->
|
|
<script src="../../game/license_timer/license_data/company_subject.js"></script>
|
|
|
|
<!-- game : source files -->
|
|
<script src="../../game/license_timer/license_data_manager.js"></script>
|
|
<script src="../../game/license_timer/loading.js"></script>
|
|
<script src="../../game/license_timer/login.js"></script>
|
|
<script src="../../game/license_timer/timer.js"></script>
|
|
<script src="../../game/license_timer/chart.js"></script>
|
|
<script src="../../game/license_timer/input_score.js"></script>
|
|
<script src="../../game/license_timer/license_timer.js"></script>
|
|
<script src="../../game/license_timer/main.js"></script>
|
|
|
|
|
|
<style>
|
|
body{
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
canvas{
|
|
margin: 0 auto;
|
|
}
|
|
</style>
|
|
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
$('#client_refresh').load("./../module/client_refresh.html");
|
|
});
|
|
</script>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div id="LicenseTimer" style="text-align:center;"></div>
|
|
<div id="client_refresh"></div>
|
|
|
|
<script type="text/javascript">
|
|
var timeOutEventID;
|
|
|
|
function ShowNotifyTimeOver(timeLeft) {
|
|
if("Notification" in window) {
|
|
if(Notification) { // prepared browser for using Notification
|
|
if(Notification.permission === "granted") {
|
|
// console.log("Notification - grated");
|
|
AddNotifyEventByNotification(timeLeft);
|
|
return;
|
|
}
|
|
|
|
Notification.requestPermission(function (result) {
|
|
// console.log("result : " + result);
|
|
Notification.permission = result;
|
|
|
|
if(result === "granted") {
|
|
// console.log("Notification - grated : " + result);
|
|
AddNotifyEventByNotification(timeLeft);
|
|
return;
|
|
}
|
|
|
|
// console.log("Notification - not grated : " + result);
|
|
AddNotifyEventByAlert(timeLeft);
|
|
});
|
|
} else { // not prepared browser for using Notification
|
|
// console.log("no notification - !Notification");
|
|
AddNotifyEventByAlert(timeLeft);
|
|
}
|
|
} else { // not prepared browser for using Notification - IE
|
|
// console.log("no notification - Notification in window");
|
|
AddNotifyEventByAlert(timeLeft);
|
|
}
|
|
}
|
|
|
|
function AddNotifyEventByNotification(timeLeft) {
|
|
// console.log("AddNotifyEventByNotification : " + timeLeft);
|
|
timeOutEventID = setTimeout(function() {
|
|
var options = {
|
|
icon: "../../../resources/image/icon/banner_chocomae_128x128.png",
|
|
body: "!!! 시험 시간 종료 !!!\n작업을 중단하고 선생님을 불러주세요.",
|
|
}
|
|
var notification = new Notification("자격증 타이머 | 초코마에", options);
|
|
|
|
//알림 후 5초 뒤,
|
|
setTimeout(function () {
|
|
//얼람 메시지 닫기
|
|
notification.close();
|
|
}, 5000);
|
|
}, timeLeft);
|
|
}
|
|
|
|
function AddNotifyEventByAlert(timeLeft) {
|
|
// console.log("AddNotifyEventByAlert : " + timeLeft);
|
|
timeOutEventID = setTimeout(function() {
|
|
alert("!!! 시험 시간 종료 !!!\n작업을 중단하고 선생님을 불러주세요.");
|
|
}, timeLeft);
|
|
}
|
|
|
|
|
|
function CancelNotifyTimeOver() {
|
|
// console.log("CancelNotifyTimeOver");
|
|
clearTimeout(timeOutEventID);
|
|
}
|
|
|
|
function RemoveNotifyEventyByNotification() {
|
|
// console.log("RemoveNotifyEventyByNotification");
|
|
clearTimeout(timeOutEventID);
|
|
}
|
|
|
|
function RemoveNotifyEventyByAlert() {
|
|
// console.log("RemoveNotifyEventyByAlert");
|
|
clearTimeout(timeOutEventID);
|
|
}
|
|
</script>
|
|
|
|
<div class="container py-3">
|
|
|
|
<div class="jumbotron py-4" style="background-color: #ffce54">
|
|
<h1 class="display-5">점수 저장<span class="h4"> (유료 마에스트로 전용 서비스)</span></h1>
|
|
<p class="lead">점수 저장에 앞서 반드시 학생이 준비하는 <span class="text-primary">시험 과목</span>을 <span class="text-primary">버튼에서 선택</span> 또는 <span class="text-primary">직접 입력</span>해주세요.</p>
|
|
<hr class="my-4">
|
|
<ul>
|
|
<li class="mb-2">[ 과목 ] 버튼을 눌러서 학생이 준비하는 시험을 선택해 주세요.<br/>
|
|
<span class="text-black-50">([ 과목 ] 버튼을 눌러서 작업하는 경우, 점수를 저장시 "등급" 도 함께 표시됩니다)</span></li>
|
|
<li class="mb-2">만일 [ 과목 ] 버튼에 시험이 등록되어 있지 않으면, 과목 입력창에 직접 입력하시면 됩니다.<br/>
|
|
<span class="text-black-50">(과목 추가를 희망하시는 분은 support+chocomae@jinaju.com로 연락주세요)</span></li>
|
|
<li class="mb-2">[ 마에 비밀번호 ]는 마에스트로 계정 로그인 하신 후, [ 자격증 타이머 ] 탭에서 설정하실 수 있습니다.<br/></li>
|
|
<li class="mb-2">체험 버전에서는 마에 비밀번호가 1111로 세팅되어 있습니다.<br/>
|
|
<span class="text-black-50">(체험 버전에 등록된 기록은 수시로 삭제됩니다)</span></li>
|
|
</ul>
|
|
<!-- <a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a> -->
|
|
</div>
|
|
|
|
<div class="jumbotron py-4" style="background-color: #99ccff">
|
|
<h1 class="display-5">타이머 기능</h1>
|
|
<p class="lead">시험 문제 풀이를 시작하면서 시작 버튼( <span class="oi oi-media-play" title="icon media-play" aria-hidden="true"></span> )을 눌러주세요. <span class="text-primary">다음에 이어하려면 반드시 일시 정지 버튼( <span class="oi oi-media-pause" title="icon media-pause" aria-hidden="true"></span> )을 눌러서 멈춰주세요.</span></p>
|
|
<hr class="my-4">
|
|
<ul>
|
|
<li class="mb-2">[ 리셋 버튼( <span class="oi oi-reload" title="icon reload" aria-hidden="true"></span> ) ]을 누른 뒤, 시험 시간을 설정하세요. (과목 버튼으로 과목을 선택한 경우, 해당 시험 시간으로 자동 설정됩니다)</li>
|
|
<li class="mb-2">[ 시작 버튼( <span class="oi oi-media-play" title="icon media-play" aria-hidden="true"></span> ) ]을 눌러서 타이머를 작동시키세요.</li>
|
|
<li class="mb-2">[ 일시 정지 버튼( <span class="oi oi-media-pause" title="icon media-pause" aria-hidden="true"></span> ) ]을 누르면 남은 시간을 재조정할 수 있습니다.</li>
|
|
</ul>
|
|
<!-- <a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a> -->
|
|
<br/>
|
|
|
|
<h1 class="display-5">타이머 알람</h1>
|
|
<p class="lead">타이머 앱을 사용하실 때에는, IE보다는 <span class="text-primary">Edge나 다른 브라우저의 사용을 권장</span>합니다.<br/>
|
|
<hr class="my-4">
|
|
<table class="table text-center">
|
|
<thead class="thead-light">
|
|
<tr>
|
|
<th class="align-middle" scope="col">#</th>
|
|
<th class="align-middle" scope="col">IE (MS)</th>
|
|
<th class="align-middle" scope="col">Edge (MS)</th>
|
|
<th class="align-middle" scope="col">Chrome (구글)</th>
|
|
<th class="align-middle" scope="col">Firefox, Safari, etc</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<th scope="row">Notification 알림</th>
|
|
<td class="align-middle text-danger">X</td>
|
|
<td class="align-middle text-primary">O</td>
|
|
<td class="align-middle text-primary">O</td>
|
|
<td class="align-middle text-primary">O</td>
|
|
</tr>
|
|
<tr>
|
|
<th scope="row">(Alert 팝업창)<br/>타이머 웹브라우저 실행중일 때</th>
|
|
<td class="align-middle">IE 실행중이면, Alert 팝업창</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
</tr>
|
|
<tr>
|
|
<th scope="row">(Alert 팝업창)<br/>다른 프로그램으로 작업중일 때</th>
|
|
<td class="align-middle text-danger">X</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
</tr>
|
|
<tr>
|
|
<th scope="row">(Alert 팝업창)<br/>타이머 웹브라우저가 최소화 상태일 때</th>
|
|
<td class="align-middle text-danger">X</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
<td class="align-middle text-primary">Notification 알림</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<ul>
|
|
<li class="mb-2">IE로 실행하실 경우, 학생이 수시로 타이머 앱을 확인해야 합니다.<br/>
|
|
</ul>
|
|
<br/>
|
|
|
|
<h1 class="display-5">Notification 알림</h1>
|
|
<p class="lead">웹 페이지에서 이벤트가 발생했을 때, 웹 브라우저가 표시해주는 팝업창입니다.</p>
|
|
<img src="./../../../resources/image/web/notification.png" class="img-thumbnail" alt="Notification 알림">
|
|
<hr class="my-4">
|
|
<ul>
|
|
<li class="mb-2">시작 버튼( <span class="oi oi-media-play" title="icon media-play" aria-hidden="true"></span> ) 최초 실행시 <span class="font-italic">" chocomae.com에서 알림을 표시하도록 할까요? "</span> 라고 물어보는 팝업창이 실행됩니다.<br/>
|
|
<li class="mb-2">[ 예 ] 를 누르면 Notification 알림이 실행됩니다.</li>
|
|
<li class="mb-2">[ 아니오 ] 를 누르면 Notification 알림이 무시되어 보이지 않게 됩니다.</li>
|
|
<li class="mb-2">Notification 알림 무시 설정을 취소하고 싶을 때에는, [ 브라우저 설정 > 고급 설정 > 웹 사이트 사용 권한 ] 화면에 가서 chocomae.com 사이트 항목을 제거해 주세요.</li>
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</body>
|
|
</html> |