지도 복귀 링크과 경로 마커 정리
This commit is contained in:
+48
-50
@@ -477,6 +477,7 @@ const PLAYBACK_MIN_VISIBLE_STEPS = 80;
|
||||
const PLAYBACK_TICK_MS = 160;
|
||||
|
||||
const FALLBACK_BACK_TARGET = 'https://chaegeon.com/';
|
||||
const BACK_HISTORY_KEY = 'chaegeon.backHistory.v1';
|
||||
const BACK_LINK_PATH_TITLE = {
|
||||
'/': '채건닷컴',
|
||||
'/home': '홈',
|
||||
@@ -556,16 +557,52 @@ function titleFromBackUrl(url) {
|
||||
return BACK_LINK_PATH_TITLE[parsed.pathname.replace(/\/$/, '') || '/'] || cleanPageTitle(parsed.pathname.split('/').filter(Boolean).pop() || '');
|
||||
}
|
||||
|
||||
function backPageKey(url) {
|
||||
const parsed = sameSiteUrl(url);
|
||||
if (!parsed) return '';
|
||||
const pathname = parsed.pathname.replace(/\/+$/, '') || '/';
|
||||
return `${parsed.hostname.replace(/^www\./, '')}${pathname}`;
|
||||
}
|
||||
|
||||
function rememberBackHistory() {
|
||||
try {
|
||||
const current = new URL(location.href);
|
||||
const list = JSON.parse(sessionStorage.getItem(BACK_HISTORY_KEY) || '[]')
|
||||
.filter(item => item && item.href && item.key);
|
||||
const entry = { href: current.href, key: backPageKey(current.href), time: Date.now() };
|
||||
const last = list[list.length - 1];
|
||||
const next = last && last.href === entry.href ? list : [...list, entry];
|
||||
sessionStorage.setItem(BACK_HISTORY_KEY, JSON.stringify(next.slice(-20)));
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
function storedBackTarget(currentKey) {
|
||||
try {
|
||||
const list = JSON.parse(sessionStorage.getItem(BACK_HISTORY_KEY) || '[]');
|
||||
for (let i = list.length - 1; i >= 0; i--) {
|
||||
const item = list[i];
|
||||
if (item?.href && item.key && item.key !== currentKey && sameSiteUrl(item.href)) {
|
||||
return item.href;
|
||||
}
|
||||
}
|
||||
} catch (e) {}
|
||||
return '';
|
||||
}
|
||||
|
||||
async function resolveBackTarget() {
|
||||
const ref = sameSiteUrl(document.referrer || '');
|
||||
const current = new URL(location.href);
|
||||
const target = ref && ref.href !== current.href ? ref.href : FALLBACK_BACK_TARGET;
|
||||
const currentKey = backPageKey(current.href);
|
||||
rememberBackHistory();
|
||||
const refIsDifferentPage = ref && backPageKey(ref.href) !== currentKey;
|
||||
const target = refIsDifferentPage ? ref.href : (storedBackTarget(currentKey) || FALLBACK_BACK_TARGET);
|
||||
const knownTitle = titleFromBackUrl(target);
|
||||
let title = knownTitle;
|
||||
const targetUrl = sameSiteUrl(target);
|
||||
|
||||
if (!knownTitle && ref && ref.origin === location.origin) {
|
||||
if (!knownTitle && targetUrl && targetUrl.origin === location.origin) {
|
||||
try {
|
||||
const res = await fetch(ref.href, { credentials: 'same-origin', cache: 'force-cache' });
|
||||
const res = await fetch(targetUrl.href, { credentials: 'same-origin', cache: 'force-cache' });
|
||||
if (res.ok) {
|
||||
const html = await res.text();
|
||||
const doc = new DOMParser().parseFromString(html, 'text/html');
|
||||
@@ -2300,47 +2337,14 @@ function renderHistoryPoints(rawPoints) {
|
||||
mapState.stayMarkers.forEach(marker => marker.setMap(null));
|
||||
mapState.stayMarkers = [];
|
||||
}
|
||||
if (mapState.historyStartMarker) mapState.historyStartMarker.setMap(null);
|
||||
if (mapState.historyEndMarker) mapState.historyEndMarker.setMap(null);
|
||||
|
||||
const makeMarker = (pos, type = 'point') => {
|
||||
const isEndpoint = type === 'start' || type === 'end';
|
||||
const color = type === 'start' ? '#34C759' : (type === 'end' ? '#FF3B30' : '#007AFF');
|
||||
const label = type === 'start' ? (langCode === 'ko' ? '시작' : 'Start') : (type === 'end' ? (langCode === 'ko' ? '종료' : 'End') : '');
|
||||
const marker = new naver.maps.Marker({
|
||||
position: pos.latlng,
|
||||
map: mapState.map,
|
||||
zIndex: isEndpoint ? 90 : 50,
|
||||
icon: {
|
||||
content: `<div class="history-marker history-marker-${type}" style="--marker-color:${color}">${label}</div>`,
|
||||
anchor: new naver.maps.Point(isEndpoint ? 24 : 8, isEndpoint ? 14 : 8)
|
||||
}
|
||||
});
|
||||
marker.userTime = pos.time;
|
||||
marker.infoWindow = new naver.maps.InfoWindow({
|
||||
content: buildHistoryInfoContent(pos, type, label)
|
||||
});
|
||||
naver.maps.Event.addListener(marker, "click", () => {
|
||||
if (mapState.openInfoWindow && mapState.openInfoWindow !== marker.infoWindow) {
|
||||
mapState.openInfoWindow.close();
|
||||
}
|
||||
if (marker.infoWindow.getMap()) {
|
||||
marker.infoWindow.close();
|
||||
mapState.openInfoWindow = null;
|
||||
} else {
|
||||
marker.infoWindow.open(mapState.map, marker);
|
||||
mapState.openInfoWindow = marker.infoWindow;
|
||||
const idx = mapState.historyPoints.findIndex(item => item.time === pos.time && item.lat === pos.lat && item.lng === pos.lng);
|
||||
if (idx >= 0) moveSelectedHistoryPoint(idx, false);
|
||||
}
|
||||
});
|
||||
return marker;
|
||||
};
|
||||
|
||||
const first = points[0];
|
||||
const last = points.at(-1);
|
||||
mapState.historyStartMarker = makeMarker(first, 'start');
|
||||
mapState.historyEndMarker = makeMarker(last, 'end');
|
||||
if (mapState.historyStartMarker) {
|
||||
mapState.historyStartMarker.setMap(null);
|
||||
mapState.historyStartMarker = null;
|
||||
}
|
||||
if (mapState.historyEndMarker) {
|
||||
mapState.historyEndMarker.setMap(null);
|
||||
mapState.historyEndMarker = null;
|
||||
}
|
||||
|
||||
mapState.stayPoints.forEach(stay => {
|
||||
const marker = new naver.maps.Marker({
|
||||
@@ -2370,12 +2374,6 @@ function renderHistoryPoints(rawPoints) {
|
||||
mapState.historyBoundsFitted = true;
|
||||
}
|
||||
|
||||
if (!_overrideRange && !keepPlaybackIndex && !mapState.initialInfoOpened && mapState.historyEndMarker?.infoWindow) {
|
||||
mapState.historyEndMarker.infoWindow.open(mapState.map, mapState.historyEndMarker);
|
||||
mapState.openInfoWindow = mapState.historyEndMarker.infoWindow;
|
||||
mapState.initialInfoOpened = true;
|
||||
}
|
||||
|
||||
if (!mapState.mapClickHandlerAdded) {
|
||||
naver.maps.Event.addListener(mapState.map, "click", () => {
|
||||
if (mapState.openInfoWindow) {
|
||||
|
||||
Reference in New Issue
Block a user