From 526fa11c20722c297287af9d14fd8e1eefe0dff8 Mon Sep 17 00:00:00 2001 From: hide_d Date: Sun, 28 Nov 2021 19:24:31 +0900 Subject: [PATCH] =?UTF-8?q?fix:=20500px=20=EC=A7=80=EB=8F=84=EB=AA=A8?= =?UTF-8?q?=EB=93=9C=EC=97=90=EC=84=9C=20tooltip=20=EC=9C=84=EC=B9=98=20?= =?UTF-8?q?=EC=A1=B0=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- hwe/css/map.css | 5 ++++ hwe/templates/map.php | 4 ++-- hwe/ts/map.ts | 54 ++++++++++++++++++++++++++++--------------- 3 files changed, 42 insertions(+), 21 deletions(-) diff --git a/hwe/css/map.css b/hwe/css/map.css index 7ff54243..94085c21 100644 --- a/hwe/css/map.css +++ b/hwe/css/map.css @@ -493,4 +493,9 @@ .map_basic .city_base .city_state.city_state_good{ background-color:blue; +} + +.btn.btn-minimum{ + padding-top: 1px; + padding-bottom: 1px; } \ No newline at end of file diff --git a/hwe/templates/map.php b/hwe/templates/map.php index d5e8a202..b446f6ee 100644 --- a/hwe/templates/map.php +++ b/hwe/templates/map.php @@ -9,10 +9,10 @@
-
-
diff --git a/hwe/ts/map.ts b/hwe/ts/map.ts index 15524be3..1fca27a5 100644 --- a/hwe/ts/map.ts +++ b/hwe/ts/map.ts @@ -18,7 +18,7 @@ declare global { interface Window { sam_toggleSingleTap?: boolean, getCityPosition: () => CityPositionMap; - formatCityInfo: (city: MapCityParsedRaw)=>MapCityParsedRegionLevelText + formatCityInfo: (city: MapCityParsedRaw) => MapCityParsedRegionLevelText } } @@ -323,7 +323,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world }; } - function mergeNationInfo(city: MapCityParsedName):MapCityParsedNation{ + function mergeNationInfo(city: MapCityParsedName): MapCityParsedNation { //nationID 값으로 isCapital, color, nation을 통합 const nationID = city.nationID; @@ -343,7 +343,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world }; } - function mergeClickable(city:MapCityParsedNation): MapCityParsedClickable { + function mergeClickable(city: MapCityParsedNation): MapCityParsedClickable { //clickable = (defaultCity << 4 ) | (remainSpy << 3) | (ourCity << 2) | (shownByGeneral << 1) | clickableAll const id = city.id; const nationID = city.nationID; @@ -436,7 +436,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world }); - if(myCity){ + if (myCity) { $world_map.find(`.city_base_${myCity} .city_filler`).addClass('my_city'); } @@ -444,7 +444,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world return obj; } - function drawBasicWorldMap(obj:MapCityDrawable) { + function drawBasicWorldMap(obj: MapCityDrawable) { const $map_body = $(`${drawTarget} .map_body`); @@ -496,7 +496,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world $map_body.append($cityObj); }); - if(myCity){ + if (myCity) { $world_map.find(`.city_base_${myCity} .city_filler`).addClass('my_city'); } @@ -504,7 +504,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world return obj; } - function setMouseWork(obj:MapCityDrawable) { + function setMouseWork(obj: MapCityDrawable) { const $tooltip = $(drawTarget + ' .city_tooltip'); const $tooltip_city = $tooltip.find('.city_name'); const $tooltip_nation = $tooltip.find('.nation_name'); @@ -537,7 +537,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world }); - $objs.on('touchend', function () { + $objs.on('touchend', function (e) { if (window.sam_toggleSingleTap) { return true; } @@ -555,7 +555,14 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world const left = position.left; const top = position.top; - $tooltip.css({ 'top': top + 45, 'left': left + 35 }).show(); + const tooltipWidth = unwrap($tooltip.width()); + + if (left + tooltipWidth + 35 > window.innerWidth) { + $tooltip.css({ 'top': top + 45, 'left': left - tooltipWidth - 10 }).show(); + } + else { + $tooltip.css({ 'top': top + 45, 'left': left + 35 }).show(); + } const touchMode = $this.data('touchMode') as number; if (touchMode <= 1) { @@ -587,7 +594,16 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world const left = (e.clientX - rect.left - this.clientLeft + this.scrollLeft); const top = (e.clientY - rect.top - this.clientTop + this.scrollTop); - $tooltip.css({ 'top': top + 30, 'left': left + 10 }); + const tooltipWidth = unwrap($tooltip.width()); + + if (e.clientX + rect.left + tooltipWidth + 10 > window.innerWidth) { + $tooltip.css({ 'top': top + 30, 'left': left - tooltipWidth - 10 }); + } + else { + $tooltip.css({ 'top': top + 30, 'left': left + 10 }); + } + + }); $objs.on('mouseenter', function () { @@ -615,7 +631,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world $objs.on('click', function () { //xxx: touchend 다음 click 이벤트가 갈 수도 있고, 안 갈 수도 있다. - const touchMode = $(this).data('touchMode') as number|undefined; + const touchMode = $(this).data('touchMode') as number | undefined; if (touchMode === undefined) { return; } @@ -629,7 +645,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world return obj; } - function setCityClickable(obj:MapCityDrawable) { + function setCityClickable(obj: MapCityDrawable) { obj.cityList.forEach(function (city) { const $cityLink = $world_map.find(`.city_base_${city.id} .city_link`); @@ -734,7 +750,7 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world if ($world_map.hasClass('draw_required')) { if (useCachedMap) { //일단 불러옴 - await (async ()=>{ + await (async () => { const rawStoredMap = localStorage.getItem(storedOldMapKey); if (!rawStoredMap) { return; @@ -745,14 +761,14 @@ export async function reloadWorldMap(option: loadMapOption, drawTarget = '.world } await setMapBackground(storedMap) - .then(convertCityObjs) - .then(isDetailMap?drawDetailWorldMap:drawBasicWorldMap) - .then(setMouseWork) - .then(setCityClickable) - .then(saveCityInfo); + .then(convertCityObjs) + .then(isDetailMap ? drawDetailWorldMap : drawBasicWorldMap) + .then(setMouseWork) + .then(setCityClickable) + .then(saveCityInfo); })(); } else if (option.year && option.month) { - const rawStartYear = localStorage.getItem(storedStartYear) as string|undefined; + const rawStartYear = localStorage.getItem(storedStartYear) as string | undefined; let startYear: number; if (rawStartYear) { startYear = JSON.parse(rawStartYear);