From 5a9322f00376d46fe72785facb953e75aa36b91f Mon Sep 17 00:00:00 2001 From: Hide_D Date: Wed, 20 Apr 2022 03:06:25 +0900 Subject: [PATCH] =?UTF-8?q?fix:=20=EC=A7=80=EB=8F=84=20=EA=B4=80=EB=A0=A8?= =?UTF-8?q?=20=ED=81=B4=EB=A6=AD=20=EB=AC=B4=ED=9A=A8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- hwe/ts/components/StaticMapTemplate.vue | 248 +----------------------- 1 file changed, 5 insertions(+), 243 deletions(-) diff --git a/hwe/ts/components/StaticMapTemplate.vue b/hwe/ts/components/StaticMapTemplate.vue index f50b183a..75d68b0b 100644 --- a/hwe/ts/components/StaticMapTemplate.vue +++ b/hwe/ts/components/StaticMapTemplate.vue @@ -456,8 +456,10 @@ function cityClick(city: MapCityParsed, $event: MouseEvent | TouchEvent): void { function clickOutside($event: MouseEvent): void { $event.preventDefault(); $event.stopPropagation(); - touchState.value = 0; - activatedCity.value = undefined; + if(touchState.value == 1) { + touchState.value = 0; + activatedCity.value = undefined; + } } function mouseenter(city: MapCityParsed, $event: MouseEvent): void { @@ -473,244 +475,4 @@ function mouseleave(city: MapCityParsed, $event: MouseEvent): void { touchState.value = 0; } } -/* -function setMouseWork(obj: MapCityDrawable) { - initTooltip($(drawTarget)); - - const $tooltip = $(drawTarget + " .city_tooltip"); - const $tooltip_city = $tooltip.find(".city_name"); - const $tooltip_nation = $tooltip.find(".nation_name"); - - const $objs = $(drawTarget + " .city_link"); - - const $map_body = $(drawTarget + " .map_body"); - - //터치스크린 탭 - - if (!option.neutralView && is_touch_device()) { - $objs.on("touchstart", function () { - if (window.sam_toggleSingleTap) { - return true; - } - const $this = $(this); - - const touchMode = $this.data("touchMode") as number; - 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 () { - if (window.sam_toggleSingleTap) { - return true; - } - const $this = $(this); - const position = $this.parent().position(); - $tooltip_city.html($this.data("text") as string); - - const nation_text = $this.data("nation") as string; - if (nation_text) { - $tooltip_nation.html(nation_text).show(); - } else { - $tooltip_nation.html("").hide(); - } - - const left = position.left; - const top = position.top; - - 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) { - return false; - } - - //xxx: touchend 다음 click 이벤트가 갈 수도 있고, 안 갈 수도 있다. - $this.data("touchMode", 0); - }); - - $map_body.on("touchend", function () { - if (window.sam_toggleSingleTap) { - return true; - } - //위의 touchend bind에 해당하지 않는 경우 -> 빈 지도 터치 - $tooltip.hide(); - }); - } - - //Mouse over 모드 작동 - - $map_body.on("mousemove", function (e) { - if ($(this).data("touchMode")) { - return true; - } - - const rect = this.getBoundingClientRect(); - const left = e.clientX - rect.left - this.clientLeft + this.scrollLeft; - const top = e.clientY - rect.top - this.clientTop + this.scrollTop; - - 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 () { - if ($map_body.data("touchMode")) { - return true; - } - - const $this = $(this); - - $tooltip_city.data("target", $this.data("id")); - $tooltip_city.html($this.data("text")); - const nation_text = $this.data("nation"); - if (nation_text) { - $tooltip_nation.html(nation_text).show(); - } else { - $tooltip_nation.html("").hide(); - } - - $tooltip.show(); - }); - - $objs.on("mouseleave", function () { - $tooltip.hide(); - }); - - $objs.on("click", function () { - //xxx: touchend 다음 click 이벤트가 갈 수도 있고, 안 갈 수도 있다. - const touchMode = $(this).data("touchMode") as number | undefined; - if (touchMode === undefined) { - return; - } - - if (touchMode === 1) { - return false; - } - }); - - return obj; -} - -function setCityClickable(obj: MapCityDrawable) { - obj.cityList.forEach(function (city) { - const $cityLink = $world_map.find(`.city_base_${city.id} .city_link`); - - if ("clickable" in city && city.clickable > 0) { - $cityLink.attr("href", stringFormat(hrefTemplate, city.id)); - } - - if (selectCallback) { - $cityLink.on("click", function (e) { - e.preventDefault(); - return selectCallback(city); - }); - } - }); - - return obj; -} - -async function reloadWorldMap(option: loadMapOption, drawTarget = ".world_map"): Promise { - const $world_map = $(drawTarget); - - const defaultOption: loadMapOption = { - isDetailMap: true, //복잡 지도, 단순 지도 - clickableAll: false, //어떤 경우든 클릭을 가능하게 함. 해당 동작의 동작 가능성 여부와는 별도. - selectCallback: undefined, //callback을 지정시 clickable과 관계 없이 해당 함수를 실행. - hrefTemplate: "#", //도시가 클릭가능할 경우 지정할 href값. {0}은 도시 id로 변환됨 - - //아래부터는 post query에 들어갈 녀석 - year: undefined, //year값, 연감등에 사용 - month: undefined, //month값, 연감등에 사용 - neutralView: false, //clickable, 소속 국가, 첩보 여부 등을 반환여부를 설정 - showMe: true, //반환 값에 본인이 위치한 도시 값을 반환하도록 설정. neutralView와 별개 - - callback: undefined, - - //기타 보조 값 - startYear: undefined, - }; - - const isDetailMap = props.isDetailMap ?? true; - const clickableAll = props.clickableAll ?? false; - const selectCallback = props.selectCallback; - const hrefTemplate = props.hrefTemplate; - - const cityPosition = window.getCityPosition(); - - const storedOldMapKey = `sam.${props.serverNick}.map`; - const storedStartYear = `sam.${props.serverNick}.startYear`; - //OBJ : startYear, year, month, cityList, nationList, spyList, shownByGeneralList, myCity - - const $hideCityNameBtn = $world_map.find(".map_toggle_cityname"); - if (localStorage.getItem("sam.hideMapCityName") == "yes") { - $world_map.addClass("hide_cityname"); - $hideCityNameBtn.addClass("active").attr("aria-pressed", "true"); - } - - $hideCityNameBtn.on("click", function () { - //이전 상태 확인 - const state = localStorage.getItem("sam.hideMapCityName") == "no"; - if (state) { - $world_map.addClass("hide_cityname"); - localStorage.setItem("sam.hideMapCityName", "yes"); - } else { - $world_map.removeClass("hide_cityname"); - localStorage.setItem("sam.hideMapCityName", "no"); - } - }); - - const $toggleSingleTapBtn = $world_map.find(".map_toggle_single_tap"); - if (localStorage.getItem("sam.toggleSingleTap") == "yes") { - window.sam_toggleSingleTap = true; - $toggleSingleTapBtn.addClass("active").attr("aria-pressed", "true"); - } else { - window.sam_toggleSingleTap = false; - } - - const $map_body = $(drawTarget + " .map_body"); - - $toggleSingleTapBtn.on("click", function () { - //이전 상태 확인 - const state = localStorage.getItem("sam.toggleSingleTap") == "no"; - if (state) { - $map_body.removeData("touchMode"); - localStorage.setItem("sam.toggleSingleTap", "yes"); - window.sam_toggleSingleTap = true; - } else { - localStorage.setItem("sam.toggleSingleTap", "no"); - window.sam_toggleSingleTap = false; - } - }); - - const computedResult = await convertCityObjs(rawObject) - .then(isDetailMap ? drawDetailWorldMap : drawBasicWorldMap) - .then(setMouseWork) - .then(setCityClickable); - - if (option.callback) { - option.callback(computedResult, rawObject); - } -} -*/ - - - + \ No newline at end of file