jisangs/chocomae
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: player list navigator

Browse Source
This commit is contained in:
Jisang Park
2018-07-28 17:09:45 +09:00
parent 5ef974206e
commit 7c9439133d
7 changed files with 115 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/web/js/maestro_main.js
+6 -5
View File
@@ -5,6 +5,7 @@ let mouseAppList;
let typingAppList; let typingAppList;
/*
function tabClicked(tabNo) { function tabClicked(tabNo) {
// hide and show tab // hide and show tab
for(let i = 0; i < 4; i++) { for(let i = 0; i < 4; i++) {
@@ -48,16 +49,16 @@ function tabClicked(tabNo) {
break; break;
} }
} }
*/
function onClickPageNo(item, pageNo) {
function onClickPlayerListPage(item, pageNo) {
let tagDiv = $(item).closest("div"); let tagDiv = $(item).closest("div");
// console.log(tagDiv);
let tagDivIDName = tagDiv.prop("id"); let tagDivIDName = tagDiv.prop("id");
// console.log(tagDivIDName); // console.log(tagDivIDName);
if(tagDivIDName === "add_player_list_navigator") if(tagDivIDName === "add_player_list_navigator")
addPlayerListManager.onClickPlayerListPage(pageNo); addPlayerListManager.onClickPageNo(pageNo);
else if(tagDivIDName === "search_player_list_navigator") else if(tagDivIDName === "search_player_list_navigator")
searchPlayerListManager.onClickPlayerListPage(pageNo); searchPlayerListManager.onClickPageNo(pageNo);
} }
src/web/js/player_list.js
+4 -4
View File
@@ -16,6 +16,7 @@ class PlayerList {
let self = this; let self = this;
this.playerListManager = playerListManager; this.playerListManager = playerListManager;
// console.log(tagDiv); // console.log(tagDiv);
// console.log(playerListManager);
this.playerCount = 0; this.playerCount = 0;
this.activePageNo = 1; this.activePageNo = 1;
@@ -54,18 +55,17 @@ class PlayerList {
// }) // })
$(id_list[i].editButton).click(function() { // console.log(id_list[i].editButton);
$(this.listRows[i].editButton).click(function() {
playerListManager.editPlayer(this); playerListManager.editPlayer(this);
}) })
$(id_list[i].deleteButton).click(function() { $(this.listRows[i].deleteButton).click(function() {
playerListManager.deletePlayer(this); playerListManager.deletePlayer(this);
}) })
// console.log(this.listRows[i]); // console.log(this.listRows[i]);
// console.log(this.listRows[i].playerName.val()); // console.log(this.listRows[i].playerName.val());
} }
console.log("this.listRows : " + this.listRows.length);
} }
disableItem(item) { disableItem(item) {
src/web/js/player_list_manager.js
+37 -51
View File
@@ -4,14 +4,17 @@
let self = this; let self = this;
this.docList = docList; this.docList = docList;
this.docNav = docNav; this.docNav = docNav;
this.playerListID = $(docList).attr("id");
this.list = new PlayerList(this.docList, this); this.list = new PlayerList(this.docList, this);
this.list.updatePlayerList(null); this.list.updatePlayerList(null);
this.listNavigator = new PlayerListNavigator(this.docNav); this.listNavigator = new PlayerListNavigator(this, this.list, this.docNav);
this.playerCount = 0; this.playerCount = 0;
this.activePageNo = 1; this.activePageNo = 1;
this.lastPageNo = 0; this.lastPageNo = 0;
this.searchPlayerName = "";
} }
@@ -98,17 +101,18 @@
setupSearchPlayerList(playerName) { setupSearchPlayerList(playerName) {
let self = this; let self = this;
this.searchPlayerName = playerName;
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode); sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
"./../server/player/search_player_count.php", "./../server/player/search_player_count.php",
"maestro_id=" + maestroID + "&player_name=" + playerName, "maestro_id=" + maestroID + "&player_name=" + this.searchPlayerName,
(jsonData) => { (jsonData) => {
self.playerCount = jsonData["playerCount"]; self.playerCount = jsonData["playerCount"];
self.lastPageNo = Math.ceil( (self.playerCount + 1) / 10 ); self.lastPageNo = Math.ceil( (self.playerCount + 1) / 10 );
self.activePageNo = 1; self.activePageNo = 1;
self.updateSearchPlayerListPage(playerName, 1); self.updateSearchPlayerListPage(this.searchPlayerName, 1);
}, },
(errorMessage, errorCode) => { (errorMessage, errorCode) => {
@@ -148,66 +152,39 @@
} }
onClickPlayerListPage(pageNo) {
let self = this;
switch(pageNo) {
case "first":
this.activePageNo = 1;
self.loadAddPlayerListPage(self.activePageNo);
return;
case "prev":
if(this.activePageNo > 1)
this.activePageNo -= 1;
self.loadAddPlayerListPage(self.activePageNo);
return;
case "next":
if(this.activePageNo < this.lastPageNo)
this.activePageNo += 1;
self.loadAddPlayerListPage(self.activePageNo);
return;
case "last":
this.loadAddPlayerListPage(this.lastPageNo);
return;
}
this.activePageNo = pageNo;
self.loadAddPlayerListPage(self.activePageNo);
}
editPlayer(inputButton) { editPlayer(inputButton) {
let self = this; let self = this;
// console.log(inputButton); console.log(inputButton);
let clickedObjectID = this.getClickedObjectID(inputButton); // let clickedObjectID = this.getClickedObjectID(inputButton);
let id = $(inputButton).siblings(".player_id"); let id = $(inputButton).siblings(".player_id");
let playerID = id.text(); let playerID = id.text();
// console.log(playerID); console.log(playerID);
let name = $(inputButton).siblings(".player_name"); let name = $(inputButton).siblings(".player_name");
let playerName = name.val(); let playerName = name.val();
// console.log(playerName); console.log(playerName);
let enterCode = $(inputButton).siblings(".player_entercode"); let enterCode = $(inputButton).siblings(".player_entercode");
let playerEnterCode = enterCode.val(); let playerEnterCode = enterCode.val();
// console.log(playerEnterCode); console.log(playerEnterCode);
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode); sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
"./../server/player/edit_player.php", "./../server/player/edit_player.php",
"maestro_id=" + maestroID + "&player_id=" + playerID + "&player_name=" + playerName + "&enter_code=" + playerEnterCode, "maestro_id=" + maestroID + "&player_id=" + playerID + "&player_name=" + playerName + "&enter_code=" + playerEnterCode,
(jsonData) => { (jsonData) => {
if(clickedObjectID === "add_player_list") { console.log(jsonData);
if(this.playerListID === "add_player_list") {
self.setupAddPlayerList(); self.setupAddPlayerList();
} else if(clickedObjectID === "search_player_list") { } else if(this.playerListID === "search_player_list") {
let playerName = $("#search_name").val(); // let playerName = $("#search_name").val();
self.setupSearchPlayerList(playerName); self.setupSearchPlayerList(this.searchPlayerName);
} }
showErrorMessage("학생 데이터가 [ " + playerName + " / " + playerEnterCode + " ] 으로 변경되었습니다.", "success");
}, },
(errorMessage, errorCode) => { (errorMessage, errorCode) => {
@@ -225,7 +202,11 @@
let id = $(inputButton).siblings(".player_id"); let id = $(inputButton).siblings(".player_id");
let playerID = id.text(); let playerID = id.text();
let clickedObjectID = this.getClickedObjectID(inputButton); let name = $(inputButton).siblings(".player_name");
let playerName = name.val();
console.log(playerName);
// let clickedObjectID = this.getClickedObjectID(inputButton);
if(playerID === null || playerID === "") if(playerID === null || playerID === "")
return; return;
@@ -235,12 +216,13 @@
"maestro_id=" + maestroID + "&player_id=" + playerID, "maestro_id=" + maestroID + "&player_id=" + playerID,
(jsonData) => { (jsonData) => {
if(clickedObjectID === "add_player_list") { if(this.playerListID === "add_player_list") {
self.setupAddPlayerList(); self.setupAddPlayerList();
} else if(clickedObjectID === "search_player_list") { } else if(this.playerListID === "search_player_list") {
let playerName = $("#search_name").val(); // let searchPlayerName = $("#search_name").val();
self.setupSearchPlayerList(playerName); self.setupSearchPlayerList(searchPlayerName);
} }
showErrorMessage("[ " + playerName + "] 학생 데이터가 삭제되었습니다.", "success");
onChangePlayerCount(); onChangePlayerCount();
}, },
@@ -254,11 +236,15 @@
); );
} }
getClickedObjectID(clickedObject) { onClickPageNo(pageNo) {
let tagDiv = $(clickedObject).closest(".player_list"); let self = this;
let tagDivID = tagDiv.prop("id");
// console.log(tagDivIDName); self.activePageNo = pageNo;
if(this.playerListID === "add_player_list") {
self.updateAddPlayerListPage(self.activePageNo);
} else if(this.playerListID === "search_player_list") {
self.updateSearchPlayerListPage(this.searchPlayerName, self.activePageNo);
}
return tagDivID;
} }
} }
src/web/js/player_list_navigator.js
+27 -8
View File
@@ -1,7 +1,9 @@
class PlayerListNavigator { class PlayerListNavigator {
constructor(pageNoArea) { constructor(playerListManager, playerList, pageNoArea) {
let self = this; let self = this;
this.playerListManager = playerListManager;
this.playerList = playerList;
this.pageNoArea = pageNoArea; this.pageNoArea = pageNoArea;
// console.log(parent); // console.log(parent);
@@ -18,37 +20,54 @@
for(let pageNo = 1; pageNo < this.lastPageNo + 1; pageNo++) { for(let pageNo = 1; pageNo < this.lastPageNo + 1; pageNo++) {
$(this.pageNoArea).append( $(this.pageNoArea).append(
"<a onClick='onClickPlayerListPage(this, " + pageNo + ")'> " + pageNo + " </a>" "<a onClick='onClickPageNo(this, " + pageNo + ")'> " + pageNo + " </a>"
); );
/*
let aTag = $(this.pageNoArea).append(
"<a> " + pageNo + " </a>"
);
aTag.click(
this.onClickPageNo(pageNo)
);
*/
} }
} }
onClickPlayerListPage(pageNo) { onClickPageNo(pageNo) {
switch(pageNo) { switch(pageNo) {
case "first": case "first":
this.activePageNo = 1; this.activePageNo = 1;
this.playerList.loadPlayerListPage(this.activePageNo); // this.playerList.loadPlayerListPage(this.activePageNo);
this.playerListManager.onClickPageNo(this.activePageNo);
return; return;
case "prev": case "prev":
if(this.activePageNo > 1) if(this.activePageNo > 1)
this.activePageNo -= 1; this.activePageNo -= 1;
this.playerList.loadPlayerListPage(this.activePageNo); // this.playerList.loadPlayerListPage(this.activePageNo);
this.playerListManager.onClickPageNo(this.activePageNo);
return; return;
case "next": case "next":
if(this.activePageNo < this.lastPageNo) if(this.activePageNo < this.lastPageNo)
this.activePageNo += 1; this.activePageNo += 1;
this.playerList.loadPlayerListPage(this.activePageNo); // this.playerList.loadPlayerListPage(this.activePageNo);
this.playerListManager.onClickPageNo(this.activePageNo);
return; return;
case "last": case "last":
this.playerList.loadPlayerListPage(this.lastPageNo); // this.playerList.loadPlayerListPage(this.lastPageNo);
this.activePageNo = this.lastPageNo;
this.playerListManager.onClickPageNo(this.activePageNo);
return; return;
default:
this.activePageNo = pageNo;
} }
this.activePageNo = pageNo; this.activePageNo = pageNo;
this.playerList.loadPlayerListPage(this.activePageNo); // this.playerList.loadPlayerListPage(this.activePageNo);
this.playerListManager.onClickPageNo(this.activePageNo);
} }
} }
src/web/module/maestro_section_add_player.html
+23 -23
View File
@@ -76,7 +76,7 @@ function onErrorPlayerPW(message) {
<div class="row mx-1"> <div class="row mx-1">
<div class="col mt-3"> <div class="col">
<div id="message_box"></div> <div id="message_box"></div>
</div> </div>
</div> </div>
@@ -85,7 +85,7 @@ function onErrorPlayerPW(message) {
<div class="row mx-1"> <div class="row mx-1">
<div class="col-5"> <div class="col-5">
<h5>학생 추가</h5> <h5 class="my-3">학생 추가</h5>
<form class="mx-2"> <form class="mx-2">
<div class="form-group row"> <div class="form-group row">
@@ -145,20 +145,20 @@ function onErrorPlayerPW(message) {
<div class="col-7" style="background-color: #ffce54"> <div class="col-7" style="background-color: #ffce54">
<h5>학생 목록</h5> <h5 class="my-3">학생 목록</h5>
<div id="player_list_result_contents"> <div id="player_list_result_contents">
<form id="add_player_list"> <form id="add_player_list">
<div class="form-group row mx-2"> <div class="form-group row mx-2 mb-0 font-weight-bold">
<label class="col-form-label text-center d-none">ID</label> <label class="col-form-label d-none">ID</label>
<label class="col-form-label text-center col-sm">이름</label> <label class="col-form-label col-sm">이 름</label>
<label class="col-form-label text-center col-sm">입장번호</label> <label class="col-form-label col-sm">입장 번호</label>
<label class="col-form-label text-center col-sm-1"></label> <label class="col-form-label col-sm-1"></label>
<label class="col-form-label text-center col-sm-1"></label> <label class="col-form-label col-sm-1"></label>
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test1"> <input type="text" class="player_id d-none" value="test1">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -166,7 +166,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test2"> <input type="text" class="player_id d-none" value="test2">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -174,7 +174,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test3"> <input type="text" class="player_id d-none" value="test3">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -182,7 +182,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test4"> <input type="text" class="player_id d-none" value="test4">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -190,7 +190,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test5"> <input type="text" class="player_id d-none" value="test5">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -198,7 +198,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test6"> <input type="text" class="player_id d-none" value="test6">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -206,7 +206,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test7"> <input type="text" class="player_id d-none" value="test7">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -214,7 +214,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test8"> <input type="text" class="player_id d-none" value="test8">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -222,7 +222,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test9"> <input type="text" class="player_id d-none" value="test9">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -230,7 +230,7 @@ function onErrorPlayerPW(message) {
<input type="button" class="player_delete col-sm-1" value="-"> <input type="button" class="player_delete col-sm-1" value="-">
</div> </div>
<div class="form-group player-list row mx-2"> <div class="form-group player-list row mx-2 mb-1">
<input type="text" class="player_id d-none" value="test10"> <input type="text" class="player_id d-none" value="test10">
<input type="text" class="player_name col-sm" value="test"> <input type="text" class="player_name col-sm" value="test">
<input type="text" class="player_entercode col-sm" value="test"> <input type="text" class="player_entercode col-sm" value="test">
@@ -564,11 +564,11 @@ function onErrorPlayerPW(message) {
</nav> </nav>
<div id="add_player_list_navigator" class="player_list_navigator"> <div id="add_player_list_navigator" class="player_list_navigator">
<span><a onClick="onClickPlayerListPage(this, 'first')"> ≪ </a></span> <span><a onClick="onClickPageNo(this, 'first')"> ≪ </a></span>
<span><a onClick="onClickPlayerListPage(this, 'prev')"> ＜ </a></span> <span><a onClick="onClickPageNo(this, 'prev')"> ＜ </a></span>
<span id="page_no_area"></span> <span id="page_no_area"></span>
<span><a onClick="onClickPlayerListPage(this, 'next')"> ＞ </a></span> <span><a onClick="onClickPageNo(this, 'next')"> ＞ </a></span>
<span><a onClick="onClickPlayerListPage(this, 'last')"> ≫ </a></span> <span><a onClick="onClickPageNo(this, 'last')"> ≫ </a></span>
</div> </div>
</div> </div>
src/web/module/maestro_section_main.html
+5 -20
View File
@@ -32,7 +32,7 @@ function onChangePlayerCount() {
<div class="container"> <div class="container">
<div class="row bg-primary py-3 my-1"> <div class="row bg-primary py-3 mx-1 my-2">
<div id="maestro_info_id" class="col-3">마에스트로 계정 이름</div> <div id="maestro_info_id" class="col-3">마에스트로 계정 이름</div>
<div id="maestro_info_player_count" class="col-2">학생수 ? / ?</div> <div id="maestro_info_player_count" class="col-2">학생수 ? / ?</div>
<div id="maestro_info_upgrade" class="col-4">업그레이드 버튼</div> <div id="maestro_info_upgrade" class="col-4">업그레이드 버튼</div>
@@ -61,35 +61,20 @@ function onChangePlayerCount() {
<div class="tab-content" id="myTabContent"> <div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="add" role="tabpanel" aria-labelledby="add-tab"> <div class="tab-pane fade show active my-3" id="add" role="tabpanel" aria-labelledby="add-tab">
<div id="section_add_player"></div> <div id="section_add_player"></div>
</div> </div>
<div class="tab-pane fade" id="search" role="tabpanel" aria-labelledby="search-tab"> <div class="tab-pane fade my-3" id="search" role="tabpanel" aria-labelledby="search-tab">
<div id="section_search_player" class="hide"></div> <div id="section_search_player" class="hide"></div>
</div> </div>
<div class="tab-pane fade" id="mouse" role="tabpanel" aria-labelledby="mouse-tab"> <div class="tab-pane fade my-3" id="mouse" role="tabpanel" aria-labelledby="mouse-tab">
<div id="mouse_app_list" class="hide"></div> <div id="mouse_app_list" class="hide"></div>
</div> </div>
<div class="tab-pane fade" id="typing" role="tabpanel" aria-labelledby="typing-tab"> <div class="tab-pane fade my-3" id="typing" role="tabpanel" aria-labelledby="typing-tab">
<div id="typing_app_list" class="hide"></div> <div id="typing_app_list" class="hide"></div>
</div> </div>
<!--
<div id="section_add_player">
</div>
<div id="section_search_player" class="hide">
</div>
<div id="mouse_app_list" class="hide">
</div>
<div id="typing_app_list" class="hide">
</div>
-->
</div> <!-- container --> </div> <!-- container -->
src/web/module/maestro_section_search.html
+12 -4
View File
@@ -22,6 +22,14 @@ function searchPlayer() {
</script> </script>
<div class="row mx-1">
<div class="col">
<div id="message_box"></div>
</div>
</div>
<span id="search_player_name"> <span id="search_player_name">
<h1>검색</h1> <h1>검색</h1>
@@ -255,11 +263,11 @@ function searchPlayer() {
<div id="search_player_list_navigator" class="player_list_navigator"> <div id="search_player_list_navigator" class="player_list_navigator">
<span><a onClick="onClickPlayerListPage('first')"> ≪ </a></span> <span><a onClick="onClickPageNo(this, 'first')"> ≪ </a></span>
<span><a onClick="onClickPlayerListPage('prev')"> ＜ </a></span> <span><a onClick="onClickPageNo(this, 'prev')"> ＜ </a></span>
<span id="page_no_area"></span> <span id="page_no_area"></span>
<span><a onClick="onClickPlayerListPage('next')"> ＞ </a></span> <span><a onClick="onClickPageNo(this, 'next')"> ＞ </a></span>
<span><a onClick="onClickPlayerListPage('last')"> ≫ </a></span> <span><a onClick="onClickPageNo(this, 'last')"> ≫ </a></span>
</div> </div>
</span> </span>