392 lines
13 KiB
HTML
392 lines
13 KiB
HTML
<style>
|
|
|
|
.nav-tabs li.disabled a {
|
|
pointer-events: none;
|
|
}
|
|
|
|
</style>
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
var maestroName = "";
|
|
var isAvailableID = false;
|
|
|
|
var password = "";
|
|
var email = "";
|
|
var accountType = 0;
|
|
var selectedAccountTypeValue = -1;
|
|
var selectedAccountTypeText = "";
|
|
|
|
var tabs = new Array();
|
|
var tabContents = new Array();
|
|
|
|
var accountValidator = new AccountValidator();
|
|
|
|
$(document).ready(function() {
|
|
tabs.push($("#input-info"));
|
|
tabs.push($("#check-info"));
|
|
tabs.push($("#registered-account"));
|
|
|
|
tabContents.push($("#input"));
|
|
tabContents.push($("#check"));
|
|
tabContents.push($("#registered"));
|
|
});
|
|
|
|
function checkMaestroID() {
|
|
maestroName = $("#maestro_name").val();
|
|
|
|
if(!accountValidator.isValidMaestroID(maestroName)) {
|
|
onErrorMaestroID(accountValidator.messageForInvalidMaestroID(maestroName));
|
|
return;
|
|
}
|
|
|
|
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
|
|
"./../server/maestro/check_id.php",
|
|
"maestro_name=" + maestroName,
|
|
|
|
(function(jsonData) {
|
|
isAvailableID = true;
|
|
var message = maestroName + " : 새로 등록할 수 있는 마에스트로 아이디입니다.";
|
|
showErrorMessage(message, "success");
|
|
|
|
// $("#password").focus();
|
|
}),
|
|
|
|
(function(errorMessage, errorCode) {
|
|
isAvailableID = false;
|
|
onErrorMaestroID(errorMessage);
|
|
})
|
|
|
|
);
|
|
}
|
|
|
|
function onErrorMaestroID(message) {
|
|
showErrorMessage(message, "error");
|
|
|
|
$("#maestro_name").val("");
|
|
$("#maestro_name").focus();
|
|
}
|
|
|
|
function onErrorMaestroPW(message) {
|
|
showErrorMessage(message, "error");
|
|
|
|
$("#password").val("");
|
|
$("#password").focus();
|
|
}
|
|
|
|
function checkData() {
|
|
maestroName = $("#maestro_name").val();
|
|
if(maestroName.length === 0) {
|
|
showErrorMessage("아이디를 입력해 주세요.", "error");
|
|
$("#maestro_name").focus();
|
|
return;
|
|
} else if(!isAvailableID) {
|
|
onErrorMaestroID("아이디 중복 확인을 해 주세요.", "error");
|
|
$("#check_id").focus();
|
|
return;
|
|
}
|
|
|
|
password = $("#password").val();
|
|
// console.log("password : " + password);
|
|
if(password.length === 0) {
|
|
showErrorMessage("암호를 입력해 주세요.", "error");
|
|
$("#password").focus();
|
|
return;
|
|
} else if(!accountValidator.isValidMaestroPW(password)) {
|
|
onErrorMaestroPW(accountValidator.messageForInvalidMaestroPW(password));
|
|
return;
|
|
}
|
|
|
|
email = $("#email").val();
|
|
if(email.length === 0) {
|
|
showErrorMessage("이메일을 입력해 주세요.", "error");
|
|
$("#email").focus();
|
|
return;
|
|
}
|
|
|
|
selectedAccountTypeValue = $("#account_type").val();
|
|
// selectedAccountTypeText = $("#account_type option:selected").text();
|
|
// console.log(selectedAccountTypeValue);
|
|
// console.log(selectedAccountTypeText);
|
|
|
|
var isCheckAcceptClauses = $("#check_accept_clauses").is(":checked");
|
|
if(!isCheckAcceptClauses) {
|
|
showErrorMessage("약관을 읽고, 위에 있는 체크 버튼을 눌러 주세요.", "error");
|
|
$("#check_accept_clauses").focus();
|
|
return;
|
|
}
|
|
|
|
var accountTypeNo = Number(selectedAccountTypeValue);
|
|
var playerCount = NumberUtil.numberWithCommas(accountTypePlayerCount(accountTypeNo)) + "명";
|
|
var price = NumberUtil.numberWithCommas(accountTypePrice(accountTypeNo)) + "원";
|
|
|
|
$(".maestro_name_data").text(maestroName);
|
|
$(".password_data").text(password);
|
|
$(".email_data").text(email);
|
|
$(".player_count").text(playerCount);
|
|
$(".price_account").text(price);
|
|
|
|
$("input[name=maestro_name_data]").val(maestroName);
|
|
$("input[name=password_data]").val(password);
|
|
$("input[name=email_data]").val(email);
|
|
$("input[name=player_count]").val(playerCount);
|
|
$("input[name=price_account]").val(price);
|
|
|
|
$("#input_data").css("display", "none");
|
|
$("#register_account").css("display", "block");
|
|
|
|
tabs[0].removeClass("text-primary active show");
|
|
tabs[0].addClass("text-secondary");
|
|
tabs[1].removeClass("text-secondary active show");
|
|
tabs[1].addClass("text-primary active show");
|
|
|
|
tabContents[0].removeClass("active");
|
|
tabContents[0].removeClass("show");
|
|
tabContents[1].addClass("active");
|
|
tabContents[1].addClass("show");
|
|
}
|
|
|
|
function register_account() {
|
|
$("#register_account").css("display", "none");
|
|
$("#banking_guide").css("display", "block");
|
|
|
|
tabs[1].removeClass("text-primary active show");
|
|
tabs[1].addClass("text-secondary");
|
|
tabs[2].removeClass("text-secondary active show");
|
|
tabs[2].addClass("text-primary active show");
|
|
|
|
tabContents[1].removeClass("active");
|
|
tabContents[1].removeClass("show");
|
|
tabContents[2].addClass("active");
|
|
tabContents[2].addClass("show");
|
|
|
|
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
|
|
"./../server/maestro/add_maestro.php",
|
|
"maestro_name=" + maestroName + "&password=" + password + "&email=" + email + "&account_type=" + selectedAccountTypeValue,
|
|
|
|
(function(jsonData) {
|
|
isAvailableID = true;
|
|
}),
|
|
|
|
(function(errorMessage, errorCode) {
|
|
isAvailableID = false;
|
|
|
|
if($("#error_message").length) {
|
|
showErrorMessage(errorMessage, "error");
|
|
}
|
|
|
|
$("#maestro_name").val("");
|
|
$("#maestro_name").focus();
|
|
})
|
|
|
|
);
|
|
}
|
|
|
|
$('#myTab a').on('click', function (e) {
|
|
e.preventDefault();
|
|
// $(this).tab('show')
|
|
})
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<div class="container">
|
|
|
|
<ul class="nav nav-tabs" id="myTab" role="tablist">
|
|
<li class="nav-item disabled">
|
|
<a class="nav-link text-primary active" id="input-info" data-toggle="tab" href="#input" role="tab" aria-controls="input" aria-selected="true">마에스트로 계정 신청</a>
|
|
</li>
|
|
|
|
<li class="nav-item disabled">
|
|
<a class="nav-link text-secondary" id="check-info" data-toggle="tab" href="#check" role="tab" aria-controls="check" aria-selected="false">신청 정보 확인</a>
|
|
</li>
|
|
|
|
<li class="nav-item disabled">
|
|
<a class="nav-link text-secondary" id="registered-account" data-toggle="tab" href="#registered" role="tab" aria-controls="registered" aria-selected="false">신청 완료</a>
|
|
</li>
|
|
</ul> <!-- 탭 -->
|
|
|
|
|
|
<div class="tab-content" id="myTabContent">
|
|
|
|
<div class="tab-pane fade show active" id="input" role="tabpanel" aria-labelledby="input-info">
|
|
|
|
<div class="px-5 py-4 my-3" style="background-color: #99ccff">
|
|
<h4 class="mb-4">마에스트로 계정 정보 입력</h4>
|
|
|
|
<div id="message_box">
|
|
</div>
|
|
|
|
<form class="mx-4">
|
|
<div class="form-group row">
|
|
<label for="maestro_name" class="col-sm-2 col-form-label">* 아이디</label>
|
|
<div class="col-sm-6">
|
|
<input type="text" class="form-control" id="maestro_name" placeholder="아이디 입력">
|
|
<small class="form-text text-muted">4~20 글자. 한글도 사용 가능합니다.</small>
|
|
</div>
|
|
<div class="col-sm-4">
|
|
<input type="button" id="id_ckeck" class="btn btn-outline-dark" value="중복 체크" onClick="checkMaestroID()">
|
|
<!-- <small id="id_ckeck_help" class="form-text text-muted">아이디 입력 후, [중복 체크] 버튼을 눌러주세요.</small> -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group row">
|
|
<label for="password" class="col-sm-2 col-form-label">* 암호</label>
|
|
<div class="col-sm-6">
|
|
<input type="text" class="form-control" id="password" placeholder="Password">
|
|
<small class="form-text text-muted">4~16 글자. 영문, 숫자만 사용 가능합니다.</small>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group row">
|
|
<label for="email" class="col-sm-2 col-form-label">* 이메일</label>
|
|
<div class="col-sm-6">
|
|
<input type="email" class="form-control" id="email" placeholder="name@example.com">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group row">
|
|
<label for="account_type" class="col-sm-2 col-form-label">* 학생 수</label>
|
|
<div class="col-sm-6">
|
|
<select id="account_type" class="form-control">
|
|
<option value="1" selected>20명 (1만원)</option>
|
|
<option value="2">50명 (2만원)</option>
|
|
<option value="3">100명 (3만원)</option>
|
|
<option value="4">500명 (4만원)</option>
|
|
<option value="5">1,000명 (5만원)</option>
|
|
</select>
|
|
<small class="form-text text-muted">계정 활성화 날짜로부터 1년동안 유효합니다.</small>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group form-check">
|
|
<input type="checkbox" class="form-check-input" id="check_accept_clauses">
|
|
<label class="form-check-label" for="check_accept_clauses">아래 주요 약관을 읽었으며, 모든 내용에 동의합니다.</label>
|
|
</div>
|
|
|
|
<button type="button" class="btn btn-primary btn-block btn-lg" onClick="checkData()">등록 신청</button>
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<div class="px-5 py-4 my-3" style="background-color: #ffdddd">
|
|
<h4>약관 주요 내용 요약</h4>
|
|
|
|
<p style="text-align: right;">마지막 갱신 : 2018년 6월 26일</p>
|
|
|
|
<ul>
|
|
<li>결제는 계좌 이체(송금)으로만 가능합니다. 신용카드 결제는 준비되지 않았습니다.</li>
|
|
<li>서버가 불안정할 수 있습니다. 문제 발생시 메일로 알려주시면 최대한 빨리 정상화 하겠습니다.</li>
|
|
<li>결제후 1년이 지나면 마에스트로 계정과 학생들의 계정이 비활성화 됩니다.</li>
|
|
<li>비활성화 되기 전에 연장 결제 해주시면, 남은 기간도 함께 연장됩니다.</li>
|
|
<li>비활성화된 계정은, 6개월후에 삭제됩니다. 마에스트로 계정 및 학생들의 계정 정보 모두가 사라집니다.</li>
|
|
<li>서비스 업그레이드는 가능합니다. 업그레이드한 날부터 1년간 업그레이드 서비스가 시작됩니다.</li>
|
|
</ul>
|
|
|
|
<button class="btn btn-danger btn-block btn-lg">전체 약관 읽기</button>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="tab-pane fade" id="check" role="tabpanel" aria-labelledby="check-info">
|
|
|
|
<div class="px-5 py-4 my-3" style="background-color: #99ccff">
|
|
<h4 class="mb-4">신청 정보 확인</h4>
|
|
|
|
<form class="mx-4">
|
|
<div class="row">
|
|
<label class="col-sm-2 col-form-label">* 아이디</label>
|
|
<label class="col-sm-9 col-form-label"><span class="maestro_name_data text-primary font-weight-bold">???</span></label>
|
|
</div>
|
|
|
|
<!--
|
|
<div class="row">
|
|
<label class="col-sm-2 col-form-label">* 암호</label>
|
|
<label class="col-sm-9 col-form-label"><span class="password_data">???</span></label>
|
|
</div>
|
|
-->
|
|
|
|
<div class="row">
|
|
<label class="col-sm-2 col-form-label">* 이메일</label>
|
|
<label class="col-sm-9 col-form-label"><span class="email_data text-primary">???</span></label>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<label class="col-sm-2 col-form-label">* 학생 수</label>
|
|
<label class="col-sm-9 col-form-label"><span class="player_count text-primary">???</span> (<span class="price_account text-primary">???</span> / 1년)</label>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
<div class="mb-4">
|
|
입력하신 내용이 모두 맞는지 확인해주세요.<br/>
|
|
</div>
|
|
|
|
<button class="btn btn-primary btn-block btn-lg" onClick="register_account()">계정 등록</button>
|
|
</div>
|
|
|
|
</div> <!-- 신청 정보 확인 -->
|
|
|
|
|
|
|
|
<div class="tab-pane fade" id="registered" role="tabpanel" aria-labelledby="registered-account">
|
|
|
|
<div class="px-5 py-4 my-3" style="background-color: #99ccff">
|
|
<h4 class="mb-4">신청 완료</h4>
|
|
|
|
<p>마에스트로 아이디 <span class="maestro_name_data text-primary font-weight-bold">????</span> 가 신청되었습니다.</p>
|
|
|
|
<ul>
|
|
<li>지금 보고 계신 내용을 등록하신 <span class="email_data text-primary font-weight-bold">????</span> 메일로 보냈습니다.<br/>
|
|
그런데 네이버/다음 메일 등에서 [초코 마에] 메일이 [스팸 메일함]로 들어가고 있네요.</li>
|
|
<li><span class="font-weight-bold text-danger">번거로우시겠지만 네이버/다음 메일의 [스팸 메일함]에서 해당 메일을 [스팸 해제] 처리 부탁드립니다.</span><br/>
|
|
([계정 등록 알림], [계정 유효기간 종료 예고] 등의 메일이 이후에 발송될 예정입니다)</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="px-5 py-4 my-3" style="background-color: #ffce54">
|
|
<h4 class="mb-4">입금 계좌</h4>
|
|
|
|
<form class="mx-4">
|
|
<div class="row">
|
|
<label class="col-sm-3 col-form-label">* 카카오뱅크</label>
|
|
<label class="col-sm-9 col-form-label">3333-04-4316912 (예금주 : 박지상)</label>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<label class="col-sm-3 col-form-label">* 금액</label>
|
|
<label class="col-sm-9 col-form-label"><span class="price_account">원</span></label>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<label class="col-sm-3 col-form-label">* 송금자명</label>
|
|
<div class="col-sm-9">
|
|
<label class="col-form-label"><span class="maestro_name_data text-primary font-weight-bold"></span> (신청하신 마에스트로 아이디)</label>
|
|
<small class="form-text text-muted">빠른 입금 확인과 계정 활성화를 위해, 송금자명을 아이디로 입력 부탁드립니다.</small>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<div class="px-5 py-4 my-3" style="background-color: #ddffff">
|
|
<h4>계정 활성화 안내</h4>
|
|
|
|
<ul>
|
|
<li>입금 내역이 확인되는대로 마에스트로 아이디를 활성화 해드리겠습니다.</li>
|
|
<li>현재 수작업으로 확인하고 계정을 활성화하고 있어서 시간이 조금 걸리고 있습니다. 양해 부탁드립니다.</li>
|
|
<li>마에스트로 계정이 활성화되는대로 즉시 알림 메일을 드리겠습니다.</li>
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div> <!-- 신청 완료 -->
|
|
|
|
</div> <!-- 탭 내용 -->
|
|
|
|
</div> <!-- container --> |