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-01 00:40:40 +09:00
parent 402910ba78 fd8ab0e4b0
commit 45ae19d74b
5 changed files with 330 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tmp_map/goCity.php
+2
View File
@@ -0,0 +1,2 @@
goCity.php, cityId is <?=$_GET['id']?>
tmp_map/map.css
+144 -25
View File
@@ -100,11 +100,22 @@
height:12px;
}
.world_map .my_city{
border:solid 0.02em red;/* Always 1px :) */
outline:dotted 3px red;
.world_map.map_detail .my_city{
border:solid 1px red;
outline:dotted 4px red;
}
.world_map.map_detail .city_filler{
position:absolute;
width:100%;
height:100%;
left:-1px;
top:-1px;
background:transparent;
}
.city_base{
position:absolute;
width:40px;
@@ -209,7 +220,7 @@
}
/*
.city_base.city_level_{0} .city_img{
.map_detail .city_base.city_level_{0} .city_img{
//$img = loadImg('/images/cast_{0}.gif');
//$parent = cssSelect('.city_base');
width: $img.width;
@@ -218,120 +229,122 @@
top: ($parent.height - $img.height)/2;
}
*/
.city_base.city_level_1 .city_img{
.map_detail .city_base.city_level_1 .city_img{
width:16px;
height:15px;
left:12px;
top:7.5px;
}
.city_base.city_level_2 .city_img{
.map_detail .city_base.city_level_2 .city_img{
width:20px;
height:14px;
left:10px;
top:8px;
}
.city_base.city_level_3 .city_img{
.map_detail .city_base.city_level_3 .city_img{
width:14px;
height:14px;
left:13px;
top:8px;
}
.city_base.city_level_4 .city_img{
.map_detail .city_base.city_level_4 .city_img{
width:20px;
height:15px;
left:10px;
top:7.5px;
}
.city_base.city_level_5 .city_img{
.map_detail .city_base.city_level_5 .city_img{
width:24px;
height:16px;
left:8px;
top:7px;
}
.city_base.city_level_6 .city_img{
.map_detail .city_base.city_level_6 .city_img{
width:26px;
height:18px;
left:7px;
top:6px;
}
.city_base.city_level_7 .city_img{
.map_detail .city_base.city_level_7 .city_img{
width:28px;
height:20px;
left:6px;
top:5px;
}
.city_base.city_level_8 .city_img{
.map_detail .city_base.city_level_8 .city_img{
width:32px;
height:24px;
left:4px;
top:3px;
}
.city_base .city_state{
.map_detail .city_base .city_state{
position: absolute;
top:5px; /*TODO:도시 레벨 별로 다르게 위치 설정해볼 것*/
left:0;
}
.city_base .city_flag{
.map_detail .city_base .city_flag{
position: absolute;
width:12px;
height:12px;
}
.city_base .city_flag > img{
.map_detail .city_base .city_flag > img{
width:12px;
height:12px;
}
.city_base.city_level_1 .city_flag{
.map_detail .city_base.city_level_1 .city_flag{
right:-8px;
top:-4px;
}
.city_base.city_level_2 .city_flag{
.map_detail .city_base.city_level_2 .city_flag{
right:-8px;
top:-4px;
}
.city_base.city_level_3 .city_flag{
.map_detail .city_base.city_level_3 .city_flag{
right:-8px;
top:-4px;
}
.city_base.city_level_4 .city_flag{
.map_detail .city_base.city_level_4 .city_flag{
right:-6px;
top:-3px;
}
.city_base.city_level_5 .city_flag{
.map_detail .city_base.city_level_5 .city_flag{
right:-6px;
top:-4px;
}
.city_base.city_level_6 .city_flag{
.map_detail .city_base.city_level_6 .city_flag{
right:-6px;
top:-4px;
}
.city_base.city_level_7 .city_flag{
.map_detail .city_base.city_level_7 .city_flag{
right:-6px;
top:-4px;
}
.city_base.city_level_8 .city_flag{
.map_detail .city_base.city_level_8 .city_flag{
right:-6px;
top:-3px;
}
.city_base .city_flag .city_capital{
.map_detail .city_base .city_flag .city_capital{
position: absolute;
width:10px;
height:10px;
@@ -339,7 +352,113 @@
right:-1px;
}
.city_base .city_flag .city_capital > img{
.map_detail .city_base .city_flag .city_capital > img{
width:10px;
height:10px;
}
/* Basic */
.world_map.map_basic .city_filler{
position:absolute;
width:100%;
height:100%;
left:0;
top:0;
background:transparent;
}
.world_map.map_basic .my_city{
outline:dotted 4px red;
}
.map_basic .city_base .city_img{
background-color:white;
}
.map_basic .city_base.city_level_1 .city_img{
width:12px;
height:12px;
left:14px;
top:9px;
}
.map_basic .city_base.city_level_2 .city_img{
width:12px;
height:12px;
left:14px;
top:9px;
}
.map_basic .city_base.city_level_3 .city_img{
width:14px;
height:14px;
left:13px;
top:8px;
}
.map_basic .city_base.city_level_4 .city_img{
width:16px;
height:14px;
left:12px;
top:8px;
}
.map_basic .city_base.city_level_5 .city_img{
width:18px;
height:16px;
left:11px;
top:7px;
}
.map_basic .city_base.city_level_6 .city_img{
width:20px;
height:16px;
left:10px;
top:7px;
}
.map_basic .city_base.city_level_7 .city_img{
width:22px;
height:18px;
left:9px;
top:6px;
}
.map_basic .city_base.city_level_8 .city_img{
width:24px;
height:18px;
left:8px;
top:6px;
}
.map_basic .city_base .city_capital{
position: absolute;
width:5px;
height:5px;
top:-2px;
right:-2px;
background-color:yellow;
}
.map_basic .city_base .city_state{
position: absolute;
width:10px;
height:10px;
top:-2px;
left:-4px;
background-color:white;
}
.map_basic .city_base .city_state.city_state_war{
background-color:red;
}
.map_basic .city_base .city_state.city_state_bad{
background-color:orange;
}
.map_basic .city_base .city_state.city_state_good{
background-color:blue;
}
tmp_map/map.html
+36 -1
View File
@@ -10,9 +10,44 @@
<link href="../twe/css/normalize.css" rel="stylesheet">
<link href="../twe/css/common.css" rel="stylesheet">
<link href="map.css" rel="stylesheet">
<script>
function getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split('&');
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split('=');
if (decodeURIComponent(pair[0]) == variable) {
return decodeURIComponent(pair[1]);
}
}
return null;
}
var isDetailMap = getQueryVariable('detail');
var clickableAll = false;
if(isDetailMap === null){
isDetailMap = true;
}
else{
isDetailMap = (isDetailMap != '0');
}
$(function(){
function tmp(a){
console.log(a.text);
//return false;
}
reloadWorldMap(isDetailMap, clickableAll, tmp, 'goCity.php?id={0}');
});
</script>
</head>
<body style="background-color:black;">
<div class="world_map map_detail">
<div class="world_map">
<div class="map_title">
<span class="map_title_text">
</span>
tmp_map/map.js
+145 -12
View File
@@ -14,7 +14,7 @@ function reloadWorldMap(isDetailMap, clickableAll, selectCallback, hrefTemplate)
var cityPosition = getCityPosition();
//OBJ : startYear, year, month, cityList, nationList, spyList, ourCityList, shownByGeneralList, myCity
//OBJ : startYear, year, month, cityList, nationList, spyList, shownByGeneralList, myCity
var $world_map = $('.world_map');
function setMapBackground(obj){
@@ -22,6 +22,12 @@ function reloadWorldMap(isDetailMap, clickableAll, selectCallback, hrefTemplate)
var year = obj.year;
var month = obj.month;
if(isDetailMap){
$world_map.addClass('map_detail').removeClass('map_basic');
}
else{
$world_map.addClass('map_basic').removeClass('map_detail');
}
var $map_title = $('.map_title_text');
if(year < startYear + 1){
@@ -159,7 +165,6 @@ function reloadWorldMap(isDetailMap, clickableAll, selectCallback, hrefTemplate)
city.nation = nationObj.name;
city.color = nationObj.color;
city.isCapital = (nationObj.capital == city.id);
console.log(city.id, nationObj.capital, city.isCapital);
return city;
}
@@ -225,7 +230,7 @@ function reloadWorldMap(isDetailMap, clickableAll, selectCallback, hrefTemplate)
$linkObj.data({'text':city.text,'nation':city.nation,'id':city.id});
$cityObj.append($linkObj);
var $imgObj = $('<div class="city_img"><img src="/images/cast_{0}.gif"></div>'.format(city.level));
var $imgObj = $('<div class="city_img"><img src="/images/cast_{0}.gif"><div class="city_filler"></div></div>'.format(city.level));
$linkObj.append($imgObj);
@@ -244,18 +249,72 @@ function reloadWorldMap(isDetailMap, clickableAll, selectCallback, hrefTemplate)
}
$imgObj.append($flagObj);
}
$map_body.append($cityObj);
});
$world_map.find('.city_base_{0} .city_filler'.format(myCity)).addClass('my_city');
return obj;
}
function drawBasicWorldMap(obj){
var $map_body = $('.world_map .map_body');
var cityList = obj.cityList;
var myCity = obj.myCity;
cityList.forEach(function(city){
var id = city.id;
$('.city_base_{0}'.format(id)).detach();
//이전 도시는 지운다.
var $cityObj = $('<div class="city_base city_base_{0}"></div>'.format(id));
$cityObj.addClass('city_level_{0}'.format(city.level));
$cityObj.data('obj', city).css({'left':city.x-20,'top':city.y-15});
var $linkObj = $('<a class="city_link"></a>');
$linkObj.data({'text':city.text,'nation':city.nation,'id':city.id});
$cityObj.append($linkObj);
var $imgObj = $('<div class="city_img"><div class="city_filler"></div></div>');
if('color' in city && city.color !== null){
$imgObj.css({'background-color':city.color});
}
$linkObj.append($imgObj);
if(city.state > 0){
var state_text = 'wrong';
if(city.state < 10){
state_text = 'good';
}
else if(city.state < 40){
state_text = 'bad';
}
else if(city.state < 50){
state_text = 'war';
}
var $stateObj = $('<div class="city_state city_state_{0}"></div>'.format(state_text));
$imgObj.append($stateObj);
}
//단순 표기에서는 깃발 여부가 없음
if(city.isCapital){
var $capitalObj = $('<div class="city_capital"></div>');
$imgObj.append($capitalObj);
}
$map_body.append($cityObj);
});
$world_map.find('.city_base_{0} .city_filler'.format(myCity)).addClass('my_city');
return obj;
}
@@ -268,24 +327,95 @@ function reloadWorldMap(isDetailMap, clickableAll, selectCallback, hrefTemplate)
var $map_body = $('.world_map .map_body');
//터치스크린 탭
$objs.on('touchstart', function(e){
var $this = $(this);
var touchMode = $this.data('touchMode');
if($tooltip_city.data('target') != $this.data('id')){
$this.data('touchMode', 1);
}
else if(touchMode === undefined){
$this.data('touchMode', 1);
}
else{
$this.data('touchMode', touchMode + 1);
}
$map_body.data('touchMode', 1);
$tooltip_city.data('target', $this.data('id'));
});
$objs.on('touchend', function(e){
var $this = $(this);
var position = $this.parent().position();
$tooltip_city.html($this.data('text'));
$tooltip_nation.html($this.data('nation'));
$tooltip.css({'top': position.top + 25, 'left': position.left + 35}).show();
var touchMode = $this.data('touchMode');
if(touchMode <= 1){
return false;
}
//xxx: touchend 다음 click 이벤트가 갈 수도 있고, 안 갈 수도 있다.
$this.data('touchMode', 0);
});
$map_body.on('touchend',function(e){
//위의 touchend bind에 해당하지 않는 경우 -> 빈 지도 터치
$tooltip.hide();
});
//Mouse over 모드 작동
$map_body.on('mousemove', function(e){
if($(this).data('touchMode')){
return true;
}
$map_body.mousemove(function(e){
var parentOffset = $map_body.offset();
var relX = e.pageX - parentOffset.left;
var relY = e.pageY - parentOffset.top;
$tooltip.css({'top': relY + 10, 'left': relX + 10});
});
$objs.hover(function(event){
var $city = $(this);
$tooltip_city.html($city.data('text'));
$tooltip_nation.html($city.data('nation'));
$objs.on('mouseenter', function(e){
if($map_body.data('touchMode')){
return true;
}
var $this = $(this);
$tooltip_city.data('target', $this.data('id'));
$tooltip_city.html($this.data('text'));
$tooltip_nation.html($this.data('nation'));
$tooltip.show();
},function(event){
});
$objs.on('mouseleave', function(event){
$tooltip.hide();
});
$objs.on('click', function(e){
//xxx: touchend 다음 click 이벤트가 갈 수도 있고, 안 갈 수도 있다.
var touchMode = $(this).data('touchMode');
if(touchMode === undefined){
return;
}
if(touchMode === 1){
return false;
}
});
return obj;
}
@@ -330,6 +460,7 @@ function reloadWorldMap(isDetailMap, clickableAll, selectCallback, hrefTemplate)
.then(saveCityInfo);
}
<<<<<<< HEAD
$(function(){
var isDetailMap = true;
@@ -341,4 +472,6 @@ $(function(){
}
reloadWorldMap(isDetailMap, clickableAll, tmp, 'goCity.php?id={0}');
});
});
=======
>>>>>>> fd8ab0e4b0165b8ea13b39705ea58b0b76d4f7e9
tmp_map/result.json
+3 -3
View File
@@ -16,7 +16,7 @@
[10, 7, 0, 0, 2, 1],
[11, 7, 0, 0, 2, 1],
[12, 7, 0, 0, 2, 1],
[13, 7, 0, 1, 6, 1],
[13, 7, 43, 1, 6, 1],
[14, 7, 0, 1, 6, 0],
[15, 7, 0, 1, 7, 1],
[16, 7, 0, 1, 8, 1],
@@ -105,7 +105,7 @@
[3,"오","#ff0000",89]
],
"spyList":[133, 892],
"shownByGeneralList":[65,33,73],
"myCity":83,
"shownByGeneralList":[3, 65,33,73],
"myCity":3,
"myNation":2
}