Fix: bootstrap - add player

This commit is contained in:
2018-07-27 19:13:26 +09:00
parent 011986f4e0
commit 341bb5afae
2 changed files with 207 additions and 53 deletions
+198 -44
View File
@@ -12,33 +12,29 @@ $(document).ready(function() {
});
function addPlayer() {
let playerName = $("#add_player_name").val();
let enterCode = $("#add_player_enter_code").val();
let playerName = $("#player_name").val();
let enterCode = $("#entercode").val();
if(playerName.length === 0) {
// $("#add_player_notice").val("학생 이름을 입력하세요.");
$("#error_message").text("학생 이름을 입력하세요.");
$("#add_player_name").focus();
onErrorPlayerName("학생 이름을 입력하세요.");
return;
} else if(enterCode.length === 0) {
// $("#add_player_notice").val("엔터 코드를 입력하세요.");
$("#error_message").text("입장 번호를 입력하세요.");
$("#add_player_enter_code").focus();
onErrorPlayerPW("입장번호를 입력하세요.");
return;
}
if(maestroInfo.getRegisteredPlayerCount() >= maestroInfo.getMaxPlayerCount()) {
$("#error_message").text("학생을 더 이상 추가할 수 없습니다. (더 많은 학생수로 업그레이드 하세요)");
showErrorMessage("학생을 더 이상 추가할 수 없습니다. (더 많은 학생수로 업그레이드 하세요)", "error");
return;
}
if(!accountValidator.isValidPlayerID(playerName)) {
console.log("Error - playerName : " + playerName);
onErrorPlayerID(accountValidator.messageForInvalidPlayerID(playerName));
// console.log("Error - playerName : " + playerName);
onErrorPlayerName(accountValidator.messageForInvalidPlayerID(playerName));
return;
} else if(!accountValidator.isValidPlayerPW(enterCode)) {
console.log("Error - enterCode : " + enterCode);
// console.log("Error - enterCode : " + enterCode);
onErrorPlayerPW(accountValidator.messageForInvalidPlayerPW(enterCode));
return;
}
@@ -54,30 +50,24 @@ function addPlayer() {
},
(errorMessage, errorCode) => {
if($("#error_message").length) {
$("#error_message").text(errorMessage);
}
showErrorMessage(errorMessage, "error");
}
);
}
function onErrorPlayerID(message) {
if($("#error_message").length) {
$("#error_message").text(message);
}
function onErrorPlayerName(message) {
showErrorMessage(message, "error");
$("#maestro_name").val("");
$("#maestro_name").focus();
$("#player_name").val("");
$("#player_name").focus();
}
function onErrorPlayerPW(message) {
if($("#error_message").length) {
$("#error_message").text(message);
}
showErrorMessage(message, "error");
$("#password").val("");
$("#password").focus();
$("#entercode").val("");
$("#entercode").focus();
}
@@ -85,6 +75,187 @@ function onErrorPlayerPW(message) {
<div class="row mx-1">
<div class="col mt-3">
<div id="message_box"></div>
</div>
</div>
<div class="row mx-1">
<div class="col-5">
<h5>학생 추가</h5>
<form class="mx-2">
<div class="form-group row">
<label for="player_name" class="col-sm-3 col-form-label">이름</label>
<div class="col-sm-9">
<input type="text" class="form-control col-sm-9" id="player_name" placeholder="이름 입력">
<small class="form-text text-muted">1~8 글자 / [ 한글,영문,숫자,-,_ ]</small>
</div>
</div>
<div class="form-group row">
<label for="entercode" class="col-sm-3 col-form-label">입장번호</label>
<div class="col-sm-9">
<input type="text" class="form-control col-sm-9" id="entercode" placeholder="입장 번호 입력">
<small class="form-text text-muted">4~6자리의 숫자</small>
<button type="button" class="col-sm-7 btn btn-primary btn-lg mt-3" onClick="addPlayer()">추가</button>
</div>
</div>
</form>
<!--
<div class="divider"></div>
<h5 class="mt-5">학생 단체 등록</h5>
<form class="mx-2">
<div class="form-group row">
<div class="col">
<textarea class="form-control" id="exceldata" placeholder="학생 이름 | 입장번호 엑셀 데이터를 붙여넣기"></textarea>
<small class="form-text text-muted">엑셀에서 복사한 학생의 이름/입장번호 목록을 붙여넣기</small>
</div>
</div>
<div class="form-group row justify-content-center">
<div class="col-sm-6">
<button type="button" class="btn btn-primary btn-lg disabled" onClick="addPlayer()">단체 목록 추가</button>
</div>
</div>
</form>
<div class="divider"></div>
<h5 class="mt-5">학생 전체 삭제</h5>
<div class="mx-2 mb-2">등록된 모든 학생들의 정보를 삭제합니다.</div>
<div class="row justify-content-center">
<div class="col-sm offset-md-3">
<button type="button" class="btn btn-danger btn-lg disabled" onClick="addPlayer()">전체 삭제</button>
</div>
</div>
-->
</div> <!-- 학생 추가 -->
<div class="col-7" style="background-color: #ffce54">
<h5>학생 목록</h5>
<div id="player_list_result_contents">
<ul id="add_player_list" class="player_list">
<li>
<span class="player_name">이름</span>
<span class="player_entercode">입장 코드</span>
<input type='button' value='전체 삭제' onClick="deletePlayer('all')">
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name" value="test">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name" value="test">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
<li>
<span class="player_id"></span>
<input type='text' class="player_name">
<input type='text' class="player_entercode">
<input type='button' class="player_edit" value='수정'>
<input type='button' class="player_delete" value='삭제'>
</li>
</ul>
</div>
<nav aria-label="Page navigation example">
<ul class="pagination justify-content-center">
<li class="page-item disabled">
<a class="page-link" href="#" tabindex="-1">Previous</a>
</li>
<li class="page-item"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item">
<a class="page-link" href="#">Next</a>
</li>
</ul>
</nav>
<div id="add_player_list_navigator" class="player_list_navigator">
<span><a onClick="onClickPlayerListPage(this, 'first')"></a></span>
<span><a onClick="onClickPlayerListPage(this, 'prev')"> </a></span>
<span id="page_no_area"></span>
<span><a onClick="onClickPlayerListPage(this, 'next')"> </a></span>
<span><a onClick="onClickPlayerListPage(this, 'last')"></a></span>
</div>
</div>
</div> <!-- 학생 목록 -->
<!--
<div>
<span id="error_message">
학생 이름 : (한글) 10글자, (영문) 20글자까지 입력 가능<br/>
@@ -105,24 +276,6 @@ function onErrorPlayerPW(message) {
<input type='button' value="추가"" onClick="addPlayer()" >
</div>
<!--
<h3>단체 추가</h3>
<form action="/action_page.php" method="get" id="add_players">
<textarea>
엑셀에서 아래와 같이 셀에 입력한 후에 복사하고 붙여넣기
학생 이름 | 입장 코드
학생 이름 | 입장 코드
...
</textarea>
<button type="submit" form="add_players">추가</button>
</form>
<textarea>
학생 이름 : (한글) 10글자, (영문) 20글자까지 입력 가능
입장 코드 : 숫자 1~6자리 수
</textarea>
-->
</span>
<span id="search_result">
@@ -217,3 +370,4 @@ function onErrorPlayerPW(message) {
</span>
</div>
-->
+8 -8
View File
@@ -42,38 +42,38 @@ function onChangePlayerCount() {
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="player_list_tab" data-toggle="tab" href="#player_list_content" role="tab" aria-controls="player_list_content" aria-selected="true">학생 목록</a>
<a class="nav-link active" id="add-tab" data-toggle="tab" href="#add" role="tab" aria-controls="add" aria-selected="true">학생 목록</a>
</li>
<li class="nav-item">
<a class="nav-link" id="search_player_tab" data-toggle="tab" href="#search_player_content" role="tab" aria-controls="search_player_content" aria-selected="false">학생 검색</a>
<a class="nav-link" id="search-tab" data-toggle="tab" href="#search" role="tab" aria-controls="search" aria-selected="false">학생 검색</a>
</li>
<li class="nav-item">
<a class="nav-link" id="activate-mouse_tab" data-toggle="tab" href="#activate_mouse_content" role="tab" aria-controls="activate_mouse_content" aria-selected="false">마우스 앱 활성화</a>
<a class="nav-link" id="mouse-tab" data-toggle="tab" href="#mouse" role="tab" aria-controls="mouse" aria-selected="false">마우스 앱 활성화</a>
</li>
<li class="nav-item">
<a class="nav-link" id="activate-typing_tab" data-toggle="tab" href="#activate_typing_content" role="tab" aria-controls="activate_typing_content-typing_content" aria-selected="false">타자 앱 활성화</a>
<a class="nav-link" id="typing-tab" data-toggle="tab" href="#typing" role="tab" aria-controls="typing" aria-selected="false">타자 앱 활성화</a>
</li>
</ul> <!---->
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="player_list_content" role="tabpanel" aria-labelledby="player_list_tab">
<div class="tab-pane fade show active" id="add" role="tabpanel" aria-labelledby="add-tab">
<div id="section_add_player"></div>
</div>
<div class="tab-pane fade" id="search_player_content" role="tabpanel" aria-labelledby="search_player_tab">
<div class="tab-pane fade" id="search" role="tabpanel" aria-labelledby="search-tab">
<div id="section_search_player" class="hide"></div>
</div>
<div class="tab-pane fade" id="activate_mouse_content" role="tabpanel" aria-labelledby="activate-mouse_tab">
<div class="tab-pane fade" id="mouse" role="tabpanel" aria-labelledby="mouse-tab">
<div id="mouse_app_list" class="hide"></div>
</div>
<div class="tab-pane fade" id="activate_typing_content" role="tabpanel" aria-labelledby="activate-typing_tab">
<div class="tab-pane fade" id="typing" role="tabpanel" aria-labelledby="typing-tab">
<div id="typing_app_list" class="hide"></div>
</div>