지도 복귀 링크과 경로 마커 정리

This commit is contained in:
seo
2026-07-12 06:34:00 +09:00
parent b34cd5e17f
commit 6302030d4d
2 changed files with 51 additions and 53 deletions
+48 -50
View File
@@ -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) {