Add: help - contents

src/web/module/maestro_section_app_setting.html

@@ -0,0 +1,122 @@
+<script type="text/javascript">
+
+
+$(document).ready(function() {
+	$("#timer_short_url").html(
+		"<span class='text-secondary'>자격증 타이머 앱 <span class='font-weight-bold'>바로 실행 URL</span> :</span><br/>"
+		+ "http://www.chocomae.com/timer/" + maestroInfo.maestroName
+	);
+
+	/*
+	$("#entercode").keydown(function(key) {
+		if(key.keyCode == 13) {
+			editPassword();
+		}
+	});
+	*/
+
+	// load maestro timer password and show it
+	sendRequestServer(	//url, sendParams, onSuccess, onFail, isDebugMode);
+		"./../server/license_timer/get_license_maestro_password.php",
+		"MaestroID=" + maestroID,
+
+		(function(jsonData) {
+			// showErrorMessage(playerName + " : 학생 데이터가 추가되었습니다", "success");
+			$("#password").val(jsonData.maestroPassword);
+		}),
+
+		(function(errorMessage, errorCode) {
+			showErrorMessage(errorMessage, "error");
+		})
+
+	);
+
+});
+
+
+function editPassword() {
+	var password = $("#password").val();
+
+	var maestroAccountType = maestroInfo.accountType;
+	if(maestroAccountType == 101) {
+		onErrorPassword("죄송합니다. 체험 마에스트로 계정은 비밀번호를 바꿀 수 없습니다.");
+		$("#password").val(1111);
+		return;
+	}
+
+	if(password.length === 0) {
+		onErrorPassword("자격증 타이머의 비밀번호를 입력하세요.");
+		return;
+	}
+
+	if(!accountValidator.isValidLicenseTimerPassword(password)) {
+		// console.log("Error - playerName : " + playerName);
+		onErrorPassword(accountValidator.messageForInvalidLicenseTimerPassword(password));
+		return;
+	}
+
+	sendRequestServer(	//url, sendParams, onSuccess, onFail, isDebugMode);
+		"./../server/license_timer/update_license_maestro_password.php",
+		"MaestroID=" + maestroID + "&Password=" + password,
+
+		(function(jsonData) {
+			// console.log(jsonData);
+			showErrorMessage("자격증 타이머 비밀번호가 " + jsonData.maestroPassword + "로 변경되었습니다", "success");
+		}),
+
+		(function(errorMessage, errorCode) {
+			showErrorMessage(errorMessage, "error");
+		})
+
+	);
+}
+
+function onErrorPassword(message) {
+	showErrorMessage(message, "error");
+
+	$("#password").select();
+	$("#password").focus();
+}
+
+
+</script>
+
+
+
+<div class="row mx-1">
+
+	<div class="col-5">
+		<h5 class="my-3">자격증 타이머</h5>
+
+		<!--
+		<div class="input-group mb-3">
+			<div class="input-group-prepend">
+				<span class="input-group-text" id="timer-password">비밀번호</span>
+			</div>
+			<input type="text" class="form-control" placeholder="새로운 비밀번호 입력" aria-label="timer password" aria-describedby="submit-password">
+			<div class="input-group-append">
+				<button class="btn btn-primary" type="button" id="submit-password" onClick="updatePassword()">수정</button>
+			</div>
+		</div>
+		<small class="form-text text-muted">1~8 글자 / [ 한글,영문,숫자,-,_ ]</small>
+		-->
+
+		<div id="timer_short_url" class="col-sm pr-0 my-auto"></div>
+		<br/>
+
+		<form class="mx-2">
+
+			<div class="form-group row">
+				<label for="password" class="col-sm-3 col-form-label">비밀번호</label>
+				<div class="col-sm-9">
+					<input type="text" class="form-control col-sm-9" id="password" placeholder="새로운 비밀번호 입력">
+					<small class="form-text text-muted">2~8자리의 숫자</small>
+					<button type="button" class="col-sm-7 btn btn-primary btn-lg mt-3" onClick="editPassword()">수정</button>
+				</div>
+			</div>
+
+		</form>
+		<br/>
+		<br/>
+
+</div>

src/web/module/maestro_section_help.html

@@ -33,20 +33,20 @@ function showModal(contentFileName) {
 
 <!-- shortcut -->
 <div class="card bg-light">
-	<h5 class="card-header">초코마에 바로가기</h5>
+	<h5 class="card-header">초코마에 바로 가기</h5>
 	<div class="card-body">
 		<p class="card-text">
 
 
 			<div class="row mx-1">
 				<div class="col-12">
-					<h5 class="mb-2">바로가기</h5>
+					<h5 class="mb-2">바로 가기</h5>
 				</div> <!-- col -->
 			</div> <!-- row -->
 
 			<div class="row mx-4">
 				<div class="col-3">
-					<label class="lead"> 바로가기 주소</label>
+					<label class="lead"> 바로 가기 주소</label>
 				</div>
 				<div class="col-9">
 
@@ -69,7 +69,7 @@ function showModal(contentFileName) {
 
 			<div class="row mx-4">
 				<div class="col-3">
-					<label class="lead"> 바로가기 등록 방법</label>
+					<label class="lead"> 바로 가기 등록 방법</label>
 				</div>
 				<div class="col-9">
 
@@ -83,4 +83,168 @@ function showModal(contentFileName) {
 
 		</p> <!-- card teext -->
 	</div>	<!-- card body -->
-</div>	<!-- card -->
+</div>	<!-- card -->
+<br/>
+
+
+<!-- account setting -->
+<div class="card bg-light">
+	<h5 class="card-header">계정 정보 수정</h5>
+	<div class="card-body">
+		<p class="card-text">
+
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">아이디, 이메일, 암호 변경 가능</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li>화면 상단 오른쪽의 <kbd>계정 정보 수정</kbd> 버튼을 눌러주세요.</li>
+				<li>아이디는 언제든지 자유롭게 바꾸실 수 있습니다. <span class="text-muted">(<span class="text-primary">한글</span>도 사용 가능)</span></li>
+				<li>아이디를 바꾸셨으면, 기존에 등록했던 바로 가기 아이콘과 즐겨찾기 주소도 함께 변경해주세요.</li>
+			</ul>
+
+		</p> <!-- card teext -->
+	</div>	<!-- card body -->
+</div>	<!-- card -->
+<br/>
+
+
+<!-- account upgrade -->
+<div class="card bg-light">
+	<h5 class="card-header">계정 업그레이드</h5>
+	<div class="card-body">
+		<p class="card-text">
+
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">업그레이드 가능, 다운그레이드 불가능</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li>화면 상단 오른쪽의 <kbd>업그레이드</kbd> 버튼을 눌러주세요.</li>
+				<li>모든 요금제의 기능은 동일합니다. 요금제에 따라 최대 등록 학생수만 늘어납니다.</li>
+				<li>기존 요금제의 남은 유효 기간과 상관 없이, 업그레이드 날짜로부터 다시 1년동안 사용하실 수 있습니다.</li>
+				<li>
+					높은 요금제로 올릴 수는 있지만, 낮은 요금제로 내릴 수는 없습니다.<br/>
+					<span class="text-muted">(현재 계정을 취소하여 남은 기간만큼 환불받고, 새로운 계정을 신청하세요)</span>
+				</li>
+			</ul>
+
+		</p> <!-- card teext -->
+	</div>	<!-- card body -->
+</div>	<!-- card -->
+<br/>
+
+
+<!-- player management -->
+<div class="card bg-light">
+	<h5 class="card-header">학생 목록 관리</h5>
+	<div class="card-body">
+		<p class="card-text">
+
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">학생 추가</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li>학생 이름과 입장번호를 입력합니다.</li>
+				<li class="text-danger">
+					단체 명단을 한꺼번에 등록하는 기능은 아직 준비하지 못했습니다.
+					<ul class="text-dark">
+						<li>당장은 학생 한명 한명 수작업으로 등록해야 하는 상황입니다.</li>
+						<li>
+							명단이 너무 많을 경우 아래 방법을 사용하시면 입력 작업을 줄일 수 있습니다.
+							<ol>
+								<li>(선생님) 입장번호를 통일해서 모든 학생의 이름을 등록</li>
+								<li>(학생) 이름과 초기 입장번호로 로그인</li>
+								<li>(학생) 설정 화면에 들어가서 학생 스스로 입장번호를 변경</li>
+							</ol>
+						</li>
+					</ul>
+				</li>
+				<li class="text-success">같은 이름이지만 입장번호가 다를 경우, 중복 이름으로 학생 계정을 등록하실 수 있습니다.</li>
+				<li class="text-danger">이름과 입장번호가 모두 같으면, 학생 계정을 등록할 수 없습니다.</li>
+			</ul>
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">학생 입장번호 변경 설정</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li>
+					학생 입장번호 변경 설정을 활성화하면, 학생들이 로그인 한 뒤 나오는 메뉴 화면 상단 우측에 <kbd>설정</kbd> 버튼이 나타납니다.<br/>
+					설정 화면에 들어가서 학생 스스로 입장번호를 변경할 수 있게 됩니다.
+				</li>
+				<li>학생 입장번호 변경 설정을 비활성화 하면, 학생들의 화면에서 <kbd>설정</kbd> 버튼이 샤라집니다.</li>
+			</ul>
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">학생 삭제</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li class="text-danger">학생 계정을 삭제하면, 해당 학생의 기록과 순위 정보도 모두 함께 삭제됩니다.</li>
+			</ul>
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">학생 검색</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li>학생 이름으로만 검색이 가능합니다.</li>
+				<li>검색 결과 목록 화면에서 바로 학생 정보 수정을 하실 수 있습니다.</li>
+			</ul>
+
+		</p> <!-- card teext -->
+	</div>	<!-- card body -->
+</div>	<!-- card -->
+<br/>
+
+
+<!-- app management -->
+<div class="card bg-light">
+	<h5 class="card-header">앱 관리</h5>
+	<div class="card-body">
+		<p class="card-text">
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">앱 활성화</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li>
+					유료 결제 계정 전용 앱들도 활성화시켜서 사용하실 수 있습니다. <span class="text-muted">(미사일 피하기, 단어 비행접시 등)</span>
+				</li>
+				<li class="text-danger">전체 활성화 / 전체 비활성화 기능은 아직 준비하지 못했습니다.</li>
+			</ul>
+
+			<div class="row mx-1">
+				<div class="col-12">
+					<h5 class="mb-2">앱 설정</h5>
+				</div> <!-- col -->
+			</div> <!-- row -->
+
+			<ul>
+				<li>자격증 타이머 점수 기록시, 학생들이 장난으로 입력하지 못하도록 <span class="text-muted">(점수 입력)</span> 비밀번호를 설정하세요.</li>
+			</ul>
+
+		</p> <!-- card teext -->
+	</div>	<!-- card body -->
+</div>	<!-- card -->
+<br/>

src/web/module/maestro_section_main.html

@@ -13,7 +13,7 @@ $(document).ready(function() {
 	$("#section_app_activation").load("./../module/maestro_section_app_activation.html");
 	// $("#mouse_app_list").load("./../module/maestro_section_mouse_app.html");
 	// $("#typing_app_list").load("./../module/maestro_section_typing_app.html");
-	$("#section_timer").load("./../module/maestro_section_timer.html");
+	$("#section_app_setting").load("./../module/maestro_section_app_setting.html");
 	$("#help").load("./../module/maestro_section_help.html");
 
 	maestroInfo.loadMaestroInfo(onLoadSuccessMaestroInfo, onLoadFailMaestroInfo);
@@ -202,7 +202,7 @@ function deactivateApp(appID) {
 		</li>
 -->
 		<li class="nav-item">
-			<a class="nav-link" id="timer-tab" data-toggle="tab" href="#timer" role="tab" aria-controls="timer" aria-selected="false">자격증 타이머</a>
+			<a class="nav-link" id="app-setting-tab" data-toggle="tab" href="#app-setting" role="tab" aria-controls="app-setting" aria-selected="false">앱 설정</a>
 		</li>
 
 		<li class="nav-item">
@@ -213,7 +213,7 @@ function deactivateApp(appID) {
 	<div class="tab-content" id="myTabContent">
 
 		<!-- <div class="tab-pane fade show active mt-3" id="add" role="tabpanel" aria-labelledby="add-tab"> -->
-		<div class="tab-pane fade mt-3" id="add" role="tabpanel" aria-labelledby="add-tab">
+		<div class="tab-pane fade show active mt-3" id="add" role="tabpanel" aria-labelledby="add-tab">
 			<div id="section_add_player"></div>
 		</div>
 
@@ -234,11 +234,11 @@ function deactivateApp(appID) {
 			<div id="typing_app_list"></div>
 		</div>
 -->
-		<div class="tab-pane fade mt-3" id="timer" role="tabpanel" aria-labelledby="timer-tab">
+		<div class="tab-pane fade mt-3" id="app-setting" role="tabpanel" aria-labelledby="app-setting-tab">
-			<div id="section_timer"></div>
+			<div id="section_app_setting"></div>
 		</div>
 
-		<div class="tab-pane fade show active mt-3" id="help" role="tabpanel" aria-labelledby="help">
+		<div class="tab-pane fade mt-3" id="help" role="tabpanel" aria-labelledby="help">
 			<div id="section_help"></div>
 		</div>
 

src/web/popup/maestro_register_favorite.html

@@ -1,4 +1,15 @@
-<div class="modal-header">
+<script type="text/javascript">
+
+
+$(document).ready(function() {
+	$('.shortcut_icon_maestro_id').append(maestroInfo.maestroName);
+});
+
+
+</script>
+
+
+<div class="modal-header">
 	<h5 class="modal-title" id="contractModalLabel">웹브라우저 즐겨찾기 등록</h5>
 	<button type="button" class="close" data-dismiss="modal" aria-label="Close">
 		<span aria-hidden="true">&times;</span>
@@ -6,20 +17,92 @@
 </div>
 
 <div class="modal-body">
+
 	<div class="card">
-		<div class="card-header">
+		<h5 class="card-header bg-dark text-white">바로 가기 주소</h5>
-			IE(인터넷 익스플로러) 10 이상에서만 사용 가능
+		<div class="card-body">
-		</div>
+			<table class="table table-sm table-borderless">
-		<div class="card-body bg-white">
+				<tbody>
-			<h5 class="card-title text-danger">IE9 이하의 실행 환경이라면, 유료 계정 등록을 절대로 하지 말아주세요.</h5>
+					<tr>
-			<p class="card-text">
+						<td scope="row">학생 로그인 화면</td>
-				<ul>
+						<td>http://www.chocomae.com/<span class="text-danger">login</span>/<span class="shortcut_icon_maestro_id"></span></td>
-					<li>IE9 버전 이하에서 화면이 깨져 보입니다.</li>
+					</tr>
-					<li>IE9 버전에서도 실행이 안됩니다.</li>
+					<tr>
-					<li>크롬, 파이어폭스, 사파리등 IE외의 브라우저에서는 잘 됩니다.</li>
+						<td scope="row">타이머 로그인 화면</td>
-				</ul>
+						<td>http://www.chocomae.com/<span class="text-primary">timer</span>/<span class="shortcut_icon_maestro_id"></span></td>
-			</p>
+					</tr>
+				</tbody>
+			</table>
 		</div>
 	</div>
 	<br/>
+
+	<div class="card">
+		<h5 class="card-header bg-success text-white">브라우저별 즐겨찾기 등록</h5>
+		<div class="card-body">
+			<h5 class="card-title">Chrome</h5>
+			<p class="card-text">
+				<ol>
+					<li>
+						등록 : 주소창 오른쪽에 있는 ★ 클릭
+						​<picture>
+							<source srcset="./../../../resources/image/help/chrome_favorite_add.png" type="image/svg+xml">
+							<img src="./../../../resources/image/help/chrome_favorite_add.png" class="img-fluid img-thumbnail" alt="즐겨찾기 등록">
+						</picture>
+					</li>
+					<li>
+						수정 : 로그인, 타이머 앱 주소로 변경
+						​<picture>
+							<source srcset="./../../../resources/image/help/chrome_favorite_edit.png" type="image/svg+xml">
+							<img src="./../../../resources/image/help/chrome_favorite_edit.png" class="img-fluid img-thumbnail" alt="즐겨찾기 등록">
+						</picture>
+					</li>
+				</ol>
+			</p>
+
+			<h5 class="card-title">IE11</h5>
+			<p class="card-text">
+				<ol>
+					<li>
+						등록 : 주소창 오른쪽 ★ 클릭
+						​<picture>
+							<source srcset="./../../../resources/image/help/ie11_favorite_add.png" type="image/svg+xml">
+							<img src="./../../../resources/image/help/ie11_favorite_add.png" class="img-fluid img-thumbnail" alt="즐겨찾기 등록">
+						</picture>
+					</li>
+					<li>
+						수정 : 로그인, 타이머 앱 주소로 변경
+						​<picture>
+							<source srcset="./../../../resources/image/help/ie11_favorite_edit.png" type="image/svg+xml">
+							<img src="./../../../resources/image/help/ie11_favorite_edit.png" class="img-fluid img-thumbnail" alt="즐겨찾기 등록">
+						</picture>
+					</li>
+				</ol>
+			</p>
+
+			<h5 class="card-title">Edge</h5>
+			<p class="card-text">
+				<ol>
+					<li>
+						등록 : 주소창 오른쪽에 있는 ★ 클릭
+						​<picture>
+							<source srcset="./../../../resources/image/help/edge_favorite_add.png" type="image/svg+xml">
+							<img src="./../../../resources/image/help/edge_favorite_add.png" class="img-fluid img-thumbnail" alt="즐겨찾기 등록">
+						</picture>
+					</li>
+					<li>
+						수정 : 로그인, 타이머 앱 주소로 변경
+						​<picture>
+							<source srcset="./../../../resources/image/help/edge_favorite_edit.png" type="image/svg+xml">
+							<img src="./../../../resources/image/help/edge_favorite_edit.png" class="img-fluid img-thumbnail" alt="즐겨찾기 등록">
+						</picture>
+					</li>
+				</ol>
+			</p>
+
+
+		</div>
+	</div>
+	<br/>
+
 </div>	<!-- modal-body -->