새 서버 선택 페이지 중 '장수 선택', '장수 생성', '입장' 레이아웃을 구현

This commit is contained in:
2018-03-17 07:27:13 +09:00
parent ac28032032
commit 135254402d
5 changed files with 107 additions and 24 deletions
+8
View File
@@ -57,6 +57,14 @@ input {
}
*/
button.with_skin {
width: 100px; height: 18px;
background-color: black; color: white;
font-family: '맑은 고딕';
font-size: 13px;
line-height: 110%;
}
input.with_skin {
width: 100px; height: 18px;
background-color: black; color: white;
+79 -12
View File
@@ -1,26 +1,45 @@
var serverListTemplate = "\
<tr class='server_item bg0' data-server='<%name%>'>\
<tr class='server_item bg0 server_name_<%name%>' data-server='<%name%>'>\
<td class='server_name'>\
<span style='font-weight:bold;font-size:1.4em;color:<%color%>'><%korName%>섭</span>\
<span style='font-weight:bold;font-size:1.4em;color:<%color%>'><%korName%>섭</span><br>\
<span class='n_country'></span>\
</td>\
<td colspan='3' class='server_down'>- 폐 쇄 중 -</td>\
<td colspan='4' class='server_down'>- 폐 쇄 중 -</td>\
</tr>\
";
var serverTextInfo = "\
<td>\
서기 <%year%>년 <%month%>월 (<span style='color:orange;'><%scenario%></span>)<br>\
유저 : <%userCnt%> / <%maxUserCnt%>명 <span style='color:cyan;'>NPC : <%npcCnt%>명</span> (<span style='color:limegreen;'><%turnTerm%></span>)\
</td>\
";
var serverFullTemplate = "\
<div class='Entrance_ServerListBlock'>- 장수 등록 마감 -</div>\
<td colspan='4' class='Entrance_ServerListBlock'>- 장수 등록 마감 -</td>\
";
var serverCreateAndSelectTemplate = "\
<div class='Entrance_ServerListNoRegister'>- 미 등 록 -</div>\
<input class='general_select' type='button' value='장수선택'>\
<input class='general_create' type='button' value='장수생성'>\
<td colspan='2' class='Entrance_ServerListNoRegister'>- 미 등 록 -</td>\
<td class='server_list_btn'>\
<a href='<%serverPath%>/select_npc.php'><button class='general_select with_skin'>장수선택</button></a>\
<a href='<%serverPath%>/join.php'><button class='general_create with_skin'>장수생성</button></a>\
</td>\
";
var serverCreateTemplate = "\
<div class='Entrance_ServerListNoRegister'>- 미 등 록 -</div>\
<input class='general_create' type='button' value='장수생성'>\
<td colspan='2' class='Entrance_ServerListNoRegister'>- 미 등 록 -</div>\
<td class='server_list_btn'>\
<a href='<%serverPath%>/join.php'><button class='general_create with_skin'>장수생성</button></a>\
</td>\
";
var serverLoginTemplate = "\
<td><%picture%></td>\
<td><%name%></td>\
<td class='server_list_btn'>\
<a href='<%serverPath%>/'><button class='general_login with_skin'>입장</button></a>\
</td>\
";
function Entrance_Import() {
@@ -62,14 +81,62 @@ function Entrance_UpdateServer() {
function Entrance_drawServerList(serverInfos){
var $serverList = $('#server_list');
$.each(serverInfos, function(idx, serverInfo){
var serverHtml = TemplateEngine(serverListTemplate, serverInfo);
$serverList.append(serverHtml);
var $serverHtml = $(TemplateEngine(serverListTemplate, serverInfo));
$serverList.append($serverHtml);
if(!serverInfo.enable){
return true;
}
$.getJSON('../'+serverInfo.name+'/j_server_basic_info.php',{}, function(result){
var serverPath = '../'+serverInfo.name;
$.getJSON('../'+serverInfo.name+'/j_server_basic_info.php',{}, function(result){
console.log(result);
console.log(result.game);
if(!result.game){
return;
}
var game= result.game;
//TODO: 서버 폐쇄 방식을 새롭게 변경
$serverHtml.find('.server_down').detach();
if(game.isUnited == 2){
$serverHtml.find('.n_country').html('§천하통일§');
}
else{
$serverHtml.find('.n_country').html('<{0}국 경쟁중>'.format(game.nationCnt));
}
$serverHtml.append(
TemplateEngine(serverTextInfo, game)
);
if(game.me){
var me = game.me;
me.serverPath = serverPath;
$serverHtml.append(
TemplateEngine(serverLoginTemplate, me)
);
}
else if(game.userCnt >= game.maxUserCnt){
$serverHtml.append(
TemplateEngine(serverFullTemplate, {})
);
}
else if(game.npcMode == 1){
$serverHtml.append(
TemplateEngine(serverCreateAndSelectTemplate, {serverPath:serverPath})
).addClass('server_create_and_select');
}
else{
$serverHtml.append(
TemplateEngine(serverCreateTemplate, {serverPath:serverPath})
);
}
});
});
}
+9 -9
View File
@@ -22,17 +22,23 @@
height:64px;
}
.server_create_and_select .general_create,
.server_create_and_select .general_select {
#server_list .server_create_and_select .general_create,
#server_list .server_create_and_select .general_select {
width: 120px; height: 32px;
float: left;
}
.GeneralCreate {
#server_list .general_create,
#server_list .general_login {
width: 120px; height: 64px;
float: left;
}
.server_list_btn{
border:0;
margin:0;
padding:0;
}
#user_info {
margin-top:20px;
@@ -153,12 +159,6 @@
line-height: 64px;
}
.Entrance_ServerListNoRegister {
width: 178px; height: 64px;
float: left;
line-height: 64px;
}
.Entrance_ServerListCharacter {
width: 64px; height: 64px;
float: left;
+10 -3
View File
@@ -63,12 +63,19 @@ if($member['GRADE'] >= 6) {
<?php /*XXX:div라지만 누가봐도 표면 그냥 table인게 낫지 않겠음?*/ ?>
<table id="server_list_table">
<caption class="bg2 section_title with_border">서 버 선 택</caption>
<colgroup>
<col style="width:100px;" />
<col style="width:400px;" />
<col style="width:64px;" />
<col/>
<col style="width:120px;" />
</colgroup>
<thead>
<tr>
<th class="bg1" style="width:100px;">서 버</th>
<th class="bg1">서 버</th>
<th class="bg1">정 보</th>
<th class="bg1" style="width:180px;">캐 릭 터</th>
<th class="bg1" style="width:120px;">선 택</th>
<th class="bg1" colspan="2">캐 릭 터</th>
<th class="bg1">선 택</th>
</tr>
</thead>
<tbody id="server_list">
+1
View File
@@ -67,6 +67,7 @@ $game['turnTerm'] = getTurnTerm($game['turnTerm']);
$game['scenario'] = getScenarioName($game['scenario']);
$game['userCnt'] = $genCnt;
$game['npcCnt'] = $npcCnt;
$game['nationCnt'] = $nationCnt;
$generalID = getGeneralID(false, false);
$userGrade = getUserGrade();