devsam/core
3
6
Fork 1
Code Issues 60 Pull Requests Releases 1 Wiki Activity

새메시지, 출력 방식 수정

Browse Source
This commit is contained in:
Hide_D
2018-02-12 21:41:11 +09:00
parent 63be06c98f
commit e864af0b6d
4 changed files with 109 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tmp_msg/msg.css
+62 -5
View File
@@ -17,22 +17,22 @@
width:100%; width:100%;
border:groove 0.1em; border:groove 0.1em;
height:64px; height:64px;
font-size:13px; font-size:12px;
word-break:break-all; word-break:break-all;
color:white; color:white;
} }
.msg_plate_private{ .msg_plate_private{
background-color:#cc6600; background-color:#5d1e1a;
} }
.msg_plate_public{ .msg_plate_public{
background-color:#000055; background-color:#141c65;
} }
.msg_plate_national, .msg_plate_diplomacy{ .msg_plate_national, .msg_plate_diplomacy{
background-color:#336600; background-color:#00582c;
} }
@@ -50,12 +50,69 @@
.msg_header{ .msg_header{
font-weight: bold; font-weight: bold;
margin-bottom:3px;
color:white;
} }
#msg_input{ #msg_input{
color:white; color:white;
background-color:black; background-color:black;
font-size:13px; font-size:12px;
width:720px; width:720px;
height:15px; height:15px;
}
#mailbox_list{
color:white;
background-color:black;
font-size:12px;
}
.board_header{
color:white;
border:groove 0.1em;
}
.board_side{
width:50%;
float:left;
}
.msg_body{
padding-left:64px;
}
.msg_target{
margin:2px 2px 0 2px;
padding:2px 3px;
display:inline-block;
box-shadow: 2px 2px black;
border-radius: 3px;
}
.public_message .msg_target{
box-shadow: 2px 2px darkslategrey;
}
.msg_target.msg_bright{
color:black;
}
.msg_target.msg_dark{
color:white;
}
.msg_from_to{
display:inline-block;
}
.msg_content{
margin-left:10px;
margin-right:5px;
}
.msg_prompt{
text-align:right;
margin-top:5px;
margin-right:5px;
} }
tmp_msg/msg.html
+10 -3
View File
@@ -19,25 +19,32 @@
<body style="background-color: black;"> <body style="background-color: black;">
<div id="container"> <div id="container">
<div class="message_input_form bg0"> <div class="message_input_form bg0">
<select> <select id="mailbox_list" size="1">
<select name="genlist" size="1" style="color:white;background-color:black;font-size:13">
</select> </select>
<input type="textarea" id="msg_input" maxlength="99"> <input type="textarea" id="msg_input" maxlength="99">
<button>서신전달&amp;갱신</button> <button>서신전달&amp;갱신</button>
</div> </div>
<div id="message_board"> <div id="message_board">
<div class="float_left"> <div class="board_side">
<div class="board_header bg0">전체 메시지(최고99자)</div>
<section class="public_message"> <section class="public_message">
</section> </section>
<div class="board_header bg0">개인 메시지(최고99자)</div>
<section class="private_message"> <section class="private_message">
</section> </section>
</div> </div>
<div class="float_left"> <div class="board_side">
<section class="diplomacy_message"> <section class="diplomacy_message">
</section> </section>
<div class="board_header bg0">국가 메시지(최고99자)</div>
<section class="national_message"> <section class="national_message">
</section> </section>
tmp_msg/msg.js
+23
View File
@@ -1,5 +1,25 @@
function hexToRgb(hex) {
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
}
function isBrightColor(color){
color = hexToRgb(color);
if ((color.r*0.299 + color.g*0.587 + color.b*0.114) > 186){
return true;
}
else{
return false;
}
}
var messageTemplate = ''; var messageTemplate = '';
var refreshMsg = (function(){ var refreshMsg = (function(){
@@ -49,6 +69,9 @@ var refreshMsg = (function(){
msg.dest.nation = '재야'; msg.dest.nation = '재야';
msg.dest.color = '#ffffff'; msg.dest.color = '#ffffff';
} }
msg.src.colorType = isBrightColor(msg.src.color)?'bright':'dark';
msg.dest.colorType = isBrightColor(msg.dest.color)?'bright':'dark';
}); });
}); });
return obj; return obj;
tmp_msg/tmp_template.html
+14 -20
View File
@@ -12,34 +12,28 @@
<div class="msg_body"> <div class="msg_body">
<div class="msg_header"> <div class="msg_header">
<%if(msgType == 'private') {%> <%if(msgType == 'private') {%>
<span>[</span> <span class="msg_target msg_<%src.colorType%>" style="background-color:<%src.color%>;"><%e(src.name)%>:<%e(src.nation)%></span
<span style="color:<%src.color%>"><%e(src.name)%>:<%e(src.nation)%></span> ><span class="msg_from_to">▶</span
▶ ><span class="msg_target msg_<%dest.colorType%>" style="background-color:<%dest.color%>;"><%e(dest.name)%>:<%e(dest.nation)%></span>
<span style="color:<%dest.color%>"><%e(dest.name)%>:<%e(dest.nation)%></span>
]
<%} else if(msgType == 'national' && src.nation_id == dest.nation_id){%> <%} else if(msgType == 'national' && src.nation_id == dest.nation_id){%>
[ <span class="msg_target msg_<%src.colorType%>" style="background-color:<%src.color%>;"><%e(src.name)%>:<%e(src.nation)%></span>
<span style="color:<%src.color%>"><%e(src.name)%>:<%e(src.nation)%></span>
]
<%} else if(msgType == 'national' || msgType == 'diplomacy'){%> <%} else if(msgType == 'national' || msgType == 'diplomacy'){%>
[ <span class="msg_target msg_<%src.colorType%>" style="background-color:<%src.color%>;"><%e(src.name)%>:<%e(src.nation)%></span
<span style="color:<%src.color%>"><%e(src.name)%>:<%e(src.nation)%></span> ><span class="msg_from_to">▶</span
▶ ><span class="msg_target msg_<%dest.colorType%>" style="background-color:<%dest.color%>;"><%e(dest.nation)%></span>
<span style="color:<%dest.color%>"><%e(dest.nation)%></span>
]
<%} else {%> <%} else {%>
[ <span class="msg_target msg_<%src.colorType%>" style="background-color:<%src.color%>;"><%e(src.name)%>:<%e(src.nation)%></span>
<span style="color:<%src.color%>"><%e(src.name)%>:<%e(src.nation)%></span>
]
<%} %> <%} %>
<span class="msg_time">&lt;<%e(time)%>&gt;</span> <span class="msg_time">&lt;<%e(time)%>&gt;</span>
</div> </div>
<%e(text)%> <div class="msg_content">
<%e(text)%>
</div>
<%if(this.option){ console.log('HasOption!!'); %> <%if(this.option){ console.log('HasOption!!'); %>
<div> <div class="msg_prompt">
<button class="prompt_yes btn_prompt">수락</button><button class="prompt_no btn_prompt">거절</button> <button class="prompt_yes btn_prompt">수락</button> <button class="prompt_no btn_prompt">거절</button>
</div> </div>
<%} %> <%} %>
</div> </div>
</div> </div>