⚠️

크루즈 정보를 찾을 수 없습니다

'; return; } const shipSlug = urlShip || (typeof holiday.ship === 'string' ? holiday.ship.split('/ships/')[1]?.replace('.json', '') : null); // ③ 즉시 렌더 — 로컬 한국어 타이틀 우선 적용 if (localCruise?.title) holiday._koreanTitle = localCruise.title; if (localCruise?.portRoute) holiday._portRouteKo = localCruise.portRoute; // 로컬 JSON 가격 병합: Widgety API에 가격 없을 때 로컬 데이터로 보완 if (localCruise && (!holiday.headline_prices?.cruise?.double || !holiday.headline_prices?.cruise?.double?.from_inside)) { if (!holiday.headline_prices) holiday.headline_prices = {}; if (!holiday.headline_prices.cruise) holiday.headline_prices.cruise = {}; const lc = localCruise; // 기존 Widgety 데이터 유지, 없는 필드만 로컬로 채움 holiday.headline_prices.cruise = { inside: lc.priceInside ? { amount: lc.priceInside } : (holiday.headline_prices.cruise.inside || null), outside: lc.priceOutside ? { amount: lc.priceOutside } : (holiday.headline_prices.cruise.outside || null), balcony: lc.priceBalcony ? { amount: lc.priceBalcony } : (holiday.headline_prices.cruise.balcony || null), suite: lc.priceSuite ? { amount: lc.priceSuite } : (holiday.headline_prices.cruise.suite || null), ...holiday.headline_prices.cruise, // Widgety 원본 유지 (double 등) }; } renderFromAPI(holiday, null, null); renderItinerary(holiday); renderPricing(holiday, null); initAllSliders(); initDaySliders(); // ④ shipLive 백그라운드 완료 후 선박 섹션만 업데이트 const livePromise = shipLivePromise || (shipSlug ? API.getShipLive(shipSlug) : null); if (livePromise) { livePromise.then(shipLive => { if (!shipLive) return; const cruiseProxy = { shipTitle: holiday.ship_title || '', shipTitleKo: (typeof Translations !== 'undefined' ? Translations.shipName?.(holiday.ship_title || '') : '') || holiday.ship_title || '', operator: holiday.operator_title || '', }; const liveDetail = normalizeShipLive(shipLive); updateShipSection(cruiseProxy, {}, null, liveDetail); }).catch(() => {}); } } catch (e) { console.error('API fetch failed:', e); content.innerHTML = '

⚠️

데이터를 불러올 수 없습니다

'; } } // 객실 카테고리 분류 (스위트→발코니→오션뷰→내측 순) function categorizeCabins(accommodations) { const CATS = [ { id: 'suite', label: '👑 스위트', test: n => /suite|penthouse|villa|loft|grand|sky suite|owner/i.test(n) }, { id: 'balcony', label: '🌅 발코니', test: n => /balcony|veranda|terrace/i.test(n) }, { id: 'oceanview', label: '🪟 오션뷰', test: n => /ocean.?view|sea.?view|outside|window|ocean.?front/i.test(n) }, { id: 'inside', label: '🚪 내측', test: () => true }, // 기본값 ]; const buckets = Object.fromEntries(CATS.map(c => [c.id, []])); for (const a of accommodations) { const n = a.name || ''; const cat = CATS.find(c => c.test(n)); if (cat) buckets[cat.id].push(a); } return CATS.map(c => ({ ...c, items: buckets[c.id] })).filter(c => c.items.length > 0); } // 라이브 API 데이터 → detail 포맷으로 정규화 function normalizeShipLive(sl) { if (!sl) return null; const cleanText = t => (t||'').replace(/<[^>]*>/g,' ').replace(/\s+/g,' ').trim(); const mapItems = (arr, limit = 30) => (arr || []).slice(0, limit).map(item => { const rawName = item.name || ''; const koName = Translations.facilityNameSmart(rawName); const rawDesc = cleanText(item.description || '').slice(0, 150); const koDesc = Translations.facilityKo[rawName]?.desc || Translations.koOnly(rawDesc) || ''; const koDetail = Translations.facilityKo[rawName]?.detail || ''; const koTags = Translations.facilityKo[rawName]?.tags || []; return { name: koName, image: item.images?.[0]?.href || '', desc: koDesc, detail: koDetail, tags: koTags }; }); const rawTeaser = cleanText(sl.teaser || ''); const koTeaser = Translations.koOnly(rawTeaser) || ''; return { dining: mapItems(sl.dining_options, 20), entertainment: mapItems(sl.entertainment_types, 30), health: mapItems(sl.health_fitness_types, 20), kids: mapItems(sl.kid_teen_types, 15), deckplans: mapItems(sl.deckplans, 20), accommodations: mapItems(sl.accomodation_types, 24), facts: sl.ship_facts || {}, coverImage: sl.cover_image_href || sl.profile_image_href || '', teaser: koTeaser, }; } // 선박 섹션 라이브 업데이트 function updateShipSection(c, ship, detail, liveDetail) { const section = document.getElementById('ship-detail-section'); if (!section) return; // 라이브 데이터가 더 풍부하면 교체 const data = liveDetail || detail; if (!data) return; // facts 우선순위: liveDetail.facts > localShip const facts = liveDetail?.facts || {}; const mergedShip = { ...ship, launchYear: facts.launch_year || ship.launchYear, grossTonnage: facts.gross_tonnage || ship.grossTonnage, capacity: facts.capacity || ship.capacity, crewCount: facts.crew_count || ship.crewCount, length: facts.length || ship.length, width: facts.width || ship.width, deckCount: facts.deck_count || ship.deckCount, cabinCount: facts.cabin_count || ship.cabinCount, }; const newHtml = renderShipSection(c, mergedShip, detail, liveDetail); section.outerHTML = newHtml; initAllSliders(); } function renderPage(c, ship, detail, holiday) { window._cruiseData = c; const nights = c.nights; const fromPrice = c.priceBalcony || c.priceOutside || c.priceInside; const priceStr = fromPrice ? API.formatPrice(fromPrice, c.currency) : '문의'; const countries = (c.countriesKo || []).join(', ') || (c.countries || []).join(', '); document.title = `${c.title} - 크루즈링크`; // Dynamic OG tags for SEO const ref = new URLSearchParams(location.search).get('ref') || ''; document.getElementById('ogTitle')?.setAttribute('content', `${c.title} - 크루즈링크`); document.getElementById('ogDesc')?.setAttribute('content', `${c.portRoute || ''} · ${c.nights || ''}박 · ${c.operator || ''} · $${c.priceInside || ''}~`); document.getElementById('ogImage')?.setAttribute('content', c.image || ''); document.getElementById('ogUrl')?.setAttribute('content', `https://www.cruiselink.co.kr/cruise-view/?ref=${ref}`); document.getElementById('canonicalTag')?.setAttribute('href', `https://www.cruiselink.co.kr/cruise-view/?ref=${ref}`); // Dynamic meta description const descText = `${c.title} — ${c.portRoute || ''} · ${c.nights || ''}박 ${(c.nights||0)+1}일 · ${c.operator || ''} · ${c.priceInside ? (c.currency==='USD'?'$':c.currency)+c.priceInside+'~' : '문의'}. 크루즈링크에서 예약하세요.`; document.getElementById('metaDesc')?.setAttribute('content', descText.slice(0,160)); document.getElementById('twTitle')?.setAttribute('content', `${c.title} - 크루즈링크`); document.getElementById('twDesc')?.setAttribute('content', descText.slice(0,160)); document.getElementById('twImage')?.setAttribute('content', c.image || ''); // TouristTrip / Offer Schema (JSON-LD, injected dynamically) const existingSchema = document.getElementById('cruiseSchema'); if (existingSchema) existingSchema.remove(); const schemaFromPrice = c.priceInside || c.priceOutside || c.priceBalcony; const schemaData = { "@context": "https://schema.org", "@type": "TouristTrip", "name": c.title, "description": descText.slice(0, 300), "image": c.image || '', "url": `https://www.cruiselink.co.kr/cruise-view/?ref=${ref}`, "touristType": "크루즈 여행", "itinerary": { "@type": "ItemList", "name": c.portRoute || '', "numberOfItems": c.nights || 0 }, "provider": { "@type": "TravelAgency", "name": "크루즈링크", "url": "https://www.cruiselink.co.kr" }, "offers": schemaFromPrice ? { "@type": "Offer", "price": schemaFromPrice, "priceCurrency": c.currency || "USD", "availability": "https://schema.org/InStock", "url": `https://www.cruiselink.co.kr/cruise-view/?ref=${ref}` } : undefined, "startDate": c.dateFrom || '', "endDate": c.dateTo || '' }; // Remove undefined fields Object.keys(schemaData).forEach(k => schemaData[k] === undefined && delete schemaData[k]); const schemaEl = document.createElement('script'); schemaEl.id = 'cruiseSchema'; schemaEl.type = 'application/ld+json'; schemaEl.textContent = JSON.stringify(schemaData); document.head.appendChild(schemaEl); let html = ''; // === HERO === html += `

${Translations.operatorName(c.operator)} · ${c.shipTitleKo || Translations.shipName(c.shipTitle)}

🚢 ${c.title}

📅 ${API.formatDateKo(c.dateFrom)} ~ ${(() => { const df = c.dateFrom||''; if(!df) return ''; const parts=df.slice(0,10).split('-').map(Number); const d=new Date(parts[0],parts[1]-1,parts[2]); d.setDate(d.getDate()+(c.nights||0)); return API.formatDateKo(`${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`); })()} 🌙 ${nights}박 ${nights+1}일 🚢 ${c.shipTitleKo || Translations.shipName(c.shipTitle)} 🌏 ${countries}

${(c.hashtags||[]).slice(0,6).map(t => { if (!/[\uAC00-\uD7A3]/.test(t) && t.startsWith('#')) { const raw = t.slice(1); const ship = Translations.shipName(raw); if (ship !== raw) return `#${ship}`; const port = Translations.portName(raw); if (port !== raw) return `#${port}`; return ''; } return `${t}`; }).filter(Boolean).join('')}

${priceStr} /1인

💬 카카오톡 상담

`; // === MAIN SHIP IMAGE === if (ship.coverImage) { html += `

`; } // === INFO BAR === html += `

🚢 선박

${c.shipTitleKo || Translations.shipName(c.shipTitle)}

🌙 기간

${nights}박 ${nights+1}일

🚪 출발/도착

${Translations.portName(c.startsAt?.nameKo || c.startsAt?.name || '')} → ${Translations.portName(c.endsAt?.nameKo || c.endsAt?.name || '')}

💰 요금

${priceStr} /1인

`; // === ITINERARY PLACEHOLDER === html += `

🗓️ 상세 일정

일정 데이터를 불러오는 중...

`; // === SHIP INFO === html += renderShipSection(c, ship, detail); // === PRICING PLACEHOLDER === html += `

`; // === INCLUDE/EXCLUDE === html += `

📋 포함 / 불포함 사항

✅ 포함 사항

객실 숙박
메인 레스토랑 & 뷔페 식사 (조식·중식·석식)
선상 엔터테인먼트 (쇼, 공연, 수영장)
피트니스 센터
키즈 & 틴즈 클럽 프로그램
객실 룸서비스 (기본)
기항지 셔틀버스 (일부)

❌ 불포함 사항

항공편
스페셜티 레스토랑
주류 및 음료 패키지
기항지 관광 (Shore Excursion)
스파 & 뷰티 트리트먼트
Wi-Fi 인터넷 패키지
세탁 서비스
여행자 보험

`; // === CTA === html += `

이 크루즈가 마음에 드셨나요?

크루즈링크 전문 상담원이 최적의 객실과 가격을 안내해드립니다.

💬 카카오톡 상담

`; content.innerHTML = html; // 찜하기 버튼 초기 상태 setTimeout(() => updateWishBtn(c.ref || new URLSearchParams(location.search).get('ref')), 50); } function renderShipSection(c, ship, detail, liveDetail = null) { // 시설 데이터: detail(로컬) 우선, 없으면 liveDetail(라이브 API) const facilityData = (detail?.dining?.length || detail?.entertainment?.length || detail?.deckplans?.length) ? detail : liveDetail; const shipName = c.shipTitleKo || c.shipTitle; const facts = liveDetail?.facts || {}; // spec 값: liveDetail.facts 우선 → 로컬 ship 폴백 const launchYear = facts.launch_year || ship?.launchYear; const grossTonnage = facts.gross_tonnage || ship?.grossTonnage; const capacity = facts.capacity || ship?.capacity; const crewCount = facts.crew_count || ship?.crewCount; const length = facts.length || ship?.length; const width = facts.width || ship?.width; const deckCount = facts.deck_count || ship?.deckCount; const cabinCount = facts.cabin_count || ship?.cabinCount; // teaser: liveDetail.teaser 우선 → Translations 폴백 const teaser = liveDetail?.teaser || Translations.shipTeaser(c.shipTitle, c.shipTitleKo, c.operator, ship?.shipClass, capacity, launchYear) || ''; let html = `

🚢 ${shipName} 소개

${teaser ? `

${teaser}

` : ''}

`; const specs = [ ['취항연도', launchYear || '-'], ['총톤수', grossTonnage ? Number(grossTonnage).toLocaleString() + 't' : '-'], ['최대정원', capacity ? Number(capacity).toLocaleString() + '명' : '-'], ['승무원', crewCount ? Number(crewCount).toLocaleString() + '명' : '-'], ['전장', length ? length + 'm' : '-'], ['전폭', width ? width + 'm' : '-'], ['데크', deckCount ? deckCount + '개' : '-'], ['객실', cabinCount ? Number(cabinCount).toLocaleString() + '실' : '-'], ]; specs.forEach(([label, value]) => { html += `

${value}

${label}

`; }); html += `

`; // ── 시설 탭 (다이닝 / 엔터테인먼트 / 스파 / 키즈 / 덱플랜) ── if (facilityData) { const tabs = []; if (facilityData.dining?.length) tabs.push({id:'dining', label:`🍽️ 다이닝 (${facilityData.dining.length})`, items: facilityData.dining}); if (facilityData.entertainment?.length) tabs.push({id:'ent', label:`🎭 엔터테인먼트 (${facilityData.entertainment.length})`, items: facilityData.entertainment}); if (facilityData.health?.length) tabs.push({id:'health', label:`💆 스파·피트니스 (${facilityData.health.length})`, items: facilityData.health}); if (facilityData.kids?.length) tabs.push({id:'kids', label:`👶 키즈 (${facilityData.kids.length})`, items: facilityData.kids}); if (facilityData.deckplans?.length) tabs.push({id:'decks', label:`📐 덱플랜 (${facilityData.deckplans.length})`, items: facilityData.deckplans}); if (tabs.length) { html += `

`; html += `

`; tabs.forEach((t, i) => { html += ``; }); html += `

`; tabs.forEach((t, i) => { const sliderId = 'slider-' + t.id; const items = t.items.slice(0, t.id === 'decks' ? 30 : 20); html += `

`; html += `

`; items.forEach(item => { // item.name은 normalizeShipLive에서 이미 한글화됨 const name = item.name; const desc = item.desc || ''; const detail = item.detail || ''; const tags = item.tags || []; html += `

`; if (item.image) html += ` ${name}

`; html += `

${name}

`; if (tags.length) html += `

${tags.map(t=>`${t}`).join('')}

`; if (detail) html += `

${detail}

`; else if (desc) html += `

${desc}

`; html += `

`; }); html += `

`; if (items.length > 1) { html += ``; html += `

${items.map((_, idx) => ``).join('')}

`; } html += `

`; }); html += `

`; } // ── 객실 타입 (카테고리별 행 슬라이더) ── if (facilityData.accommodations?.length) { const cabinCats = categorizeCabins(facilityData.accommodations); if (cabinCats.length) { html += `

🛏️ 객실 타입

`; cabinCats.forEach(cat => { const rowId = 'cabin-row-' + cat.id; html += `

`; html += `

${cat.label} (${cat.items.length})

`; html += `

`; cat.items.forEach(a => { const aName = Translations.accommodationName(a.name); const descText = a.desc || Translations.cabinDescKo(cat.id); const aDesc = descText ? `

${descText}

` : ''; html += `

`; if (a.image) html += `

`; html += `

${aName}

${aDesc}

`; html += `

`; }); html += `

`; if (cat.items.length > 1) { html += ``; html += `

${cat.items.map((_,i)=>``).join('')}

`; } html += `

`; }); } } } html += `

`; return html; } function renderItinerary(holiday) { const container = document.getElementById('day-cards-container'); if (!container || !holiday.itinerary?.days) { if (container) container.innerHTML = '

일정 데이터가 없습니다.

'; return; } // Widgety API가 해상일을 생략하는 경우 gap을 채워서 완전한 day 배열 생성 const rawDays = holiday.itinerary.days; const filledDays = []; for (let i = 0; i < rawDays.length; i++) { const cur = rawDays[i]; const prevDay = filledDays.length > 0 ? filledDays[filledDays.length - 1].day : 0; // 현재 day 번호와 직전 day 번호 사이의 gap 채우기 for (let d = prevDay + 1; d < cur.day; d++) { filledDays.push({ day: d, day_type: ['SEA'], day_name: '해상', locations: [] }); } filledDays.push(cur); } // 마지막 day 이후에도 nights+1 총 일수에 맞게 해상일 추가 const totalDaysExpected = (holiday.cruise_nights || holiday.duration || 0) + 1; if (totalDaysExpected > 1) { const lastDay = filledDays.length > 0 ? filledDays[filledDays.length - 1].day : 0; for (let d = lastDay + 1; d <= totalDaysExpected; d++) { filledDays.push({ day: d, day_type: ['SEA'], day_name: '해상', locations: [] }); } } // 날짜별 테이블 생성 const rawStart = (holiday.date_from || holiday.departure_date || holiday.start_date || '').replace(/T.*/, ''); const startDate = rawStart ? (/^\d{4}-\d{2}-\d{2}$/.test(rawStart) ? (() => { const [y,m,d] = rawStart.split('-').map(Number); return new Date(y,m-1,d); })() : new Date(rawStart)) : null; const DAYS_KO = ['일','월','화','수','목','금','토']; const DAYS_EN = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat']; let tableHtml = `

`; for (const day of filledDays) { const loc = day.locations?.[0]; const isSeaDay = !loc || (Array.isArray(day.day_type) ? day.day_type.includes('SEA') : day.day_type?.includes('SEA')) || day.day_name?.toLowerCase().includes('at sea') || day.day_name === '해상'; const isFirst = day.day === 1; const isLast = day.day === filledDays.length; let dayLabel = ''; let dateLabel = ''; if (startDate) { const d = new Date(startDate); d.setDate(d.getDate() + day.day - 1); dayLabel = DAYS_KO[d.getDay()] + '요일'; dateLabel = `${d.getFullYear()}년 ${d.getMonth()+1}월 ${d.getDate()}일`; } else { dayLabel = `Day ${day.day}`; } let portCell = ''; let arrCell = '-'; let depCell = '-'; let rowClass = ''; if (isSeaDay) { portCell = `🌊 크루징 - 해상일정`; rowClass = 'itin-tr-sea'; } else { const portName = Translations.portName(loc.name); const country = Translations.countryName(loc.country) || loc.country || ''; const badge = isFirst ? '승선' : isLast ? '하선' : ''; portCell = `${portName}${country ? ', '+country : ''}${badge}`; arrCell = loc.arrival_time || '-'; depCell = loc.departure_time || '-'; if (isFirst) rowClass = 'itin-tr-embark'; else if (isLast) rowClass = 'itin-tr-disembark'; } tableHtml += ``; } tableHtml += `

날짜	요일	도시 / 항구	출항시각	도착시각
${dateLabel}	${dayLabel}	${portCell}	${arrCell}	${depCell}

`; let html = tableHtml + '

'; for (const day of filledDays) { const loc = day.locations?.[0]; const isSeaDay = !loc || (Array.isArray(day.day_type) ? day.day_type.includes('SEA') : day.day_type?.includes('SEA')) || day.day_name?.toLowerCase().includes('at sea') || day.day_name === '해상'; if (isSeaDay) { const seaImages = [ 'https://images.unsplash.com/photo-1548574505-5e239809ee19?w=800&q=80', 'https://images.unsplash.com/photo-1571896349842-33c89424de2d?w=800&q=80', 'https://images.unsplash.com/photo-1566073771259-6a8506099945?w=800&q=80', 'https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?w=800&q=80', 'https://images.unsplash.com/photo-1582719508461-905c673771fd?w=800&q=80', 'https://images.unsplash.com/photo-1544551763-46a013bb70d5?w=800&q=80', 'https://images.unsplash.com/photo-1530521954074-e64f6810b32d?w=800&q=80', 'https://images.unsplash.com/photo-1559827260-dc66d52bef19?w=800&q=80', 'https://images.unsplash.com/photo-1540555700478-4be289fbecef?w=800&q=80', 'https://images.unsplash.com/photo-1584132967334-10e028bd69f7?w=800&q=80', ]; const seaImg = seaImages[(day.day - 1) % seaImages.length]; html += `

${day.day}일차 🌊 크루징 - 해상일정

기항지가 없는 해상일정입니다. 수영장, 스파, 카지노, 레스토랑 등 선박의 다양한 시설과 엔터테인먼트를 마음껏 즐기며 특별한 하루를 보내세요.

`; } else { const portName = Translations.portName(loc.name); const countryName = Translations.countryName(loc.country); const arrTime = loc.arrival_time || ''; const depTime = loc.departure_time || ''; const timeStr = arrTime && depTime ? `${arrTime} 입항 ~ ${depTime} 출항` : depTime ? `${depTime} 출항` : arrTime ? `${arrTime} 입항` : ''; // 기항지 이미지: widgety_data만 사용 (operator_data는 선박이미지일 수 있어 제외) const portImages = (loc.widgety_data?.images || []).filter(i => i?.href); const descKo = Translations.portDesc(loc.name); // 영문 API 설명 정제 후 fallback const rawApiDesc = (loc.widgety_data?.description || '').replace(/<[^>]*>/g,' ').replace(/\s+/g,' ').trim().slice(0,200); const desc = descKo || `아름다운 기항지 ${portName}에서 특별한 시간을 보내세요.`; // 이미지 슬라이더 (최대 3장) const imgHtml = portImages.length > 0 ? (() => { const imgs = portImages.slice(0, 3); if (imgs.length === 1) { return `

`; } const dayId = 'day-img-' + day.day; const total = imgs.length; const pct = (100 / total).toFixed(4); return `

${imgs.map(i=>` ${portName}

`).join('')}

${imgs.map((_,k)=>``).join('')}

`; })() : ''; html += `

${day.day}일차 📍 ${portName}${countryName ? ', ' + countryName : ''} ${timeStr ? '⏰ ' + timeStr : ''}

${imgHtml}

${desc ? `

${desc}

` : ''}

`; } } html += '

'; container.innerHTML = html; } function slideDayImg(slider, idx) { if (typeof slider === 'string') slider = document.getElementById(slider); if (!slider) return; const total = parseInt(slider.dataset.total) || 1; idx = (idx + total) % total; slider.dataset.current = idx; const slides = slider.querySelector('.day-img-slides'); const wrap = slider.querySelector('.day-img-wrap'); if (slides && wrap) { // 픽셀 기반 이동 — wrap 너비 × idx slides.style.transform = `translateX(-${idx * wrap.offsetWidth}px)`; } slider.querySelectorAll('.day-dot').forEach((b, i) => { b.style.background = i === idx ? 'var(--navy)' : '#ccc'; b.classList.toggle('day-dot-active', i === idx); }); } function initDaySliders() { document.querySelectorAll('.day-img-slider').forEach(slider => { // 도트 클릭 slider.querySelectorAll('.day-dot').forEach((dot, i) => { dot.addEventListener('click', () => slideDayImg(slider, i)); }); const wrap = slider.querySelector('.day-img-wrap'); const slides = slider.querySelector('.day-img-slides'); if (!wrap || !slides) return; // ── 터치 스와이프 (모바일) ── let _tx = 0, _ty = 0, _isHoriz = false, _started = false; wrap.addEventListener('touchstart', e => { _tx = e.touches[0].clientX; _ty = e.touches[0].clientY; _isHoriz = false; _started = true; slides.style.transition = 'none'; // 드래그 중 애니메이션 끄기 }, { passive: true }); wrap.addEventListener('touchmove', e => { if (!_started) return; const dx = e.touches[0].clientX - _tx; const dy = e.touches[0].clientY - _ty; if (!_isHoriz) { if (Math.abs(dx) > Math.abs(dy) + 3) { _isHoriz = true; } else if (Math.abs(dy) > Math.abs(dx) + 3) { _started = false; // 세로 스크롤이면 포기 slides.style.transition = 'transform 0.35s ease'; return; } } if (_isHoriz) { e.preventDefault(); const cur = parseInt(slider.dataset.current || 0); slides.style.transform = `translateX(${-(cur * wrap.offsetWidth) + dx}px)`; } }, { passive: false }); wrap.addEventListener('touchend', e => { if (!_started) return; _started = false; slides.style.transition = 'transform 0.35s ease'; if (_isHoriz) { const dx = e.changedTouches[0].clientX - _tx; const cur = parseInt(slider.dataset.current || 0); if (Math.abs(dx) > 40) { slideDayImg(slider, cur + (dx < 0 ? 1 : -1)); } else { // 제자리로 slides.style.transform = `translateX(-${cur * wrap.offsetWidth}px)`; } } _isHoriz = false; }, { passive: true }); // ── 마우스 드래그 (PC) ── let _mx = 0, _mdown = false; wrap.addEventListener('mousedown', e => { _mdown = true; _mx = e.pageX; slides.style.transition = 'none'; }); wrap.addEventListener('mousemove', e => { if (!_mdown) return; const dx = e.pageX - _mx; const cur = parseInt(slider.dataset.current || 0); slides.style.transform = `translateX(${-(cur * wrap.offsetWidth) + dx}px)`; }); wrap.addEventListener('mouseup', e => { if (!_mdown) return; _mdown = false; slides.style.transition = 'transform 0.35s ease'; const dx = e.pageX - _mx; const cur = parseInt(slider.dataset.current || 0); if (Math.abs(dx) > 40) { slideDayImg(slider, cur + (dx < 0 ? 1 : -1)); } else { slides.style.transform = `translateX(-${cur * wrap.offsetWidth}px)`; } }); wrap.addEventListener('mouseleave', () => { if (!_mdown) return; _mdown = false; slides.style.transition = 'transform 0.35s ease'; const cur = parseInt(slider.dataset.current || 0); slides.style.transform = `translateX(-${cur * wrap.offsetWidth}px)`; }); // ── 이미지 드래그 방지 ── wrap.querySelectorAll('img').forEach(img => { img.addEventListener('dragstart', e => e.preventDefault()); }); }); } function renderPricing(holiday, shipDetail) { const section = document.getElementById('pricing-section'); if (!section) return; const prices = holiday.headline_prices?.cruise; if (!prices) return; const double = prices.double; // 로컬 JSON 포맷 (prices.inside.amount) 또는 Widgety 포맷 (prices.double.from_inside) 모두 지원 const getPrice = (key) => { // Widgety API 포맷: prices.double.from_inside const widgety = double?.['from_' + key]; if (widgety) return widgety; // 로컬 JSON 포맷: prices.inside.amount 또는 prices.inside (숫자) const local = prices[key]; if (local) return typeof local === 'object' ? local.amount : local; return null; }; let html = `

💰 객실 & 요금

1인 기준 요금 (2인 1실, 세금/항만료 별도)

`; const types = [ {key:'inside', label:'🚪 내측 캐빈'}, {key:'outside', label:'🪟 오션뷰 캐빈'}, {key:'balcony', label:'🌅 발코니 캐빈'}, {key:'suite', label:'👑 스위트 캐빈'}, ]; types.forEach(t => { const dp = getPrice(t.key); if (dp) { html += ``; } }); html += `

객실 타입	요금 /1인
${t.label}	${fmtPrice(dp)} ~ /1인

※ 요금은 선실 카테고리별 시작 요금으로 카테고리별로 달라집니다. 정확한 요금은 문의 주시기 바랍니다.

`; section.innerHTML = html; } function renderFromAPI(holiday, shipDetail, shipLive) { // Full page render from live API data (no local cruise in cruises.json) const nights = holiday.cruise_nights || holiday.duration_days || holiday.duration || 0; const opName = Translations.operatorName(holiday.operator_title || ''); const shipName = Translations.shipName(holiday.ship_title || ''); const price = holiday.headline_prices?.cruise; // Widgety 포맷: price.double.from_balcony / 로컬 JSON 포맷: price.balcony.amount (또는 숫자) const getP = (key) => { const w = price?.double?.['from_' + key]; if (w) return w; const l = price?.[key]; if (l) return typeof l === 'object' ? l.amount : l; return null; }; const fromPrice = getP('balcony') || getP('outside') || getP('inside'); const priceStr = fromPrice ? API.formatPrice(fromPrice) : '문의'; const countries = (holiday.countries || []).map(c => Translations.countryName(c)).join(', '); const route = holiday._portRouteKo || API.routeString(holiday.itinerary); const coverImg = shipLive?.cover_image_href || holiday._localImage || ''; const facts = shipLive?.ship_facts || {}; // 로컬 JSON 한국어 타이틀 우선, 없으면 국가명 기반 생성, 최후엔 API name const cruiseTitle = holiday._koreanTitle || (() => { const ctries = (holiday.countries||[]).map(c => Translations.countryName(c)).filter(Boolean); return ctries.length ? `${ctries.slice(0,2).join('·')} ${nights}박 크루즈` : null; })() || `${Translations.portName(holiday.starts_at?.name||'')} 출발 ${nights}박 크루즈`; window._cruiseData = { title: cruiseTitle, operator: holiday.operator_title, shipTitle: holiday.ship_title, departureDate: holiday.date_from, nights, ref }; document.title = `${cruiseTitle} - 크루즈링크`; let html = `

${opName} · ${shipName}

🚢 ${cruiseTitle}

📅 ${API.formatDateKo(holiday.date_from || holiday.start_date)} ~ ${(() => { const df = (holiday.date_from || holiday.start_date || '').slice(0,10); if(!df) return ''; const parts=df.split('-').map(Number); const d=new Date(parts[0],parts[1]-1,parts[2]); d.setDate(d.getDate()+(holiday.cruise_nights||holiday.duration_days||holiday.duration||0)); return API.formatDateKo(`${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`); })()} 🌙 ${nights}박 ${parseInt(nights)+1}일 🚢 ${shipName} 🌏 ${countries}

${priceStr} /1인

💬 카카오톡 상담

`; // Cover image if (coverImg) { html += `

`; } // Info bar html += `

🚢 선박

${shipName}

🌙 기간

${nights}박 ${parseInt(nights)+1}일

🚪 출발/도착

${Translations.portName(holiday.starts_at?.name||'')} → ${Translations.portName(holiday.ends_at?.name||'')}

💰 요금

${priceStr} /1인

`; // Itinerary placeholder html += `

🗓️ 상세 일정

일정 데이터를 불러오는 중...

`; // Ship section — renderShipSection()으로 통합 (모든 선사 동일 디자인) const liveDetail = normalizeShipLive(shipLive); const cruiseProxy = { shipTitle: holiday.ship_title || '', shipTitleKo: Translations.shipName?.(holiday.ship_title || '') || holiday.ship_title || '', operator: holiday.operator_title || '', }; html += renderShipSection(cruiseProxy, {}, null, liveDetail); // Pricing placeholder html += `

`; // Include / Exclude html += `

📋 포함 / 불포함 사항

✅ 포함 사항

객실 숙박
메인 레스토랑 & 뷔페 식사 (조식·중식·석식)
선상 엔터테인먼트 (쇼, 공연, 수영장)
피트니스 센터
키즈 & 틴즈 클럽 프로그램
객실 룸서비스 (기본)
기항지 셔틀버스 (일부)

❌ 불포함 사항

항공편
스페셜티 레스토랑
주류 및 음료 패키지
기항지 관광 (Shore Excursion)
스파 & 뷰티 트리트먼트
Wi-Fi 인터넷 패키지
여행자 보험

`; // CTA html += `

이 크루즈가 마음에 드셨나요?

크루즈링크 전문 상담원이 최적의 객실과 가격을 안내해드립니다.

💬 카카오톡 상담

`; content.innerHTML = html; renderItinerary(holiday); renderPricing(holiday, shipDetail); initAllSliders(); } function initSlider(containerId) { const container = document.getElementById(containerId); if (!container) return; const slides = container.querySelector('.facility-slides'); const dots = container.querySelectorAll('.slider-dot'); const total = dots.length; if (total === 0) return; let current = 0; function goTo(i) { current = (i + total) % total; slides.style.transform = `translateX(-${current * 100}%)`; dots.forEach((d, idx) => d.classList.toggle('active', idx === current)); } container.querySelector('.slider-prev')?.addEventListener('click', () => goTo(current - 1)); container.querySelector('.slider-next')?.addEventListener('click', () => goTo(current + 1)); dots.forEach((d, i) => d.addEventListener('click', () => goTo(i))); // 터치 스와이프 let _tx = 0, _ty = 0, _swiping = false; slides.addEventListener('touchstart', e => { _tx = e.touches[0].clientX; _ty = e.touches[0].clientY; _swiping = false; }, { passive: true }); slides.addEventListener('touchmove', e => { const dx = e.touches[0].clientX - _tx; const dy = e.touches[0].clientY - _ty; // 수평 스와이프가 확실하면 세로 스크롤 막기 if (!_swiping && Math.abs(dx) > Math.abs(dy) && Math.abs(dx) > 8) { _swiping = true; } if (_swiping) e.preventDefault(); }, { passive: false }); slides.addEventListener('touchend', e => { const dx = e.changedTouches[0].clientX - _tx; if (_swiping && Math.abs(dx) > 40) goTo(dx < 0 ? current + 1 : current - 1); _swiping = false; }); } function initAllSliders() { document.querySelectorAll('.facility-slider').forEach(el => initSlider(el.id)); initDaySliders(); } function switchShipTab(el, panelId) { el.parentElement.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active')); el.classList.add('active'); const parent = el.closest('.ship-tabs'); parent.querySelectorAll('.tab-content').forEach(c => c.classList.remove('active')); document.getElementById(panelId)?.classList.add('active'); } load(); /* ── Inquiry Modal ── */ function openInquiry() { const c = window._cruiseData; if (c) { const title = c.title || c.titleKo || ''; const ship = c.shipTitleKo || Translations.shipName(c.shipTitle || ''); const op = Translations.operatorName(c.operator || ''); const price = c.priceBalcony || c.priceOutside || c.priceInside; const route = Translations.portRoute(c.portRouteKo || c.portRoute || ''); document.getElementById('modalProductName').textContent = title; document.getElementById('modalProductDetail').innerHTML = `${op} · ${ship}
출발: ${(c.dateFrom || c.departureDate || '').substring(0,10)} / ${c.nights || ''}박${price ? ' / $'+price+'~' : ''}`; document.getElementById('f_product').value = title; document.getElementById('f_cruiseline').value = c.operator || ''; document.getElementById('f_ship').value = ship; document.getElementById('f_date').value = (c.dateFrom || c.departureDate || '').substring(0,10); document.getElementById('f_ports').value = route; document.getElementById('f_price').value = price ? '$'+price+'~' : '문의'; document.getElementById('f_ref').value = c.ref || ''; } document.getElementById('inquiryModal').classList.add('open'); document.body.style.overflow = 'hidden'; } function closeInquiry() { document.getElementById('inquiryModal').classList.remove('open'); document.body.style.overflow = ''; } document.addEventListener('click', e => { if (e.target.id === 'inquiryModal') closeInquiry(); }); function submitInquiry(e) { e.preventDefault(); const btn = document.getElementById('submitBtn'); btn.disabled = true; btn.textContent = '전송 중...'; const form = document.createElement('form'); form.method = 'POST'; const fd = { _subject: `[크루즈링크] ${document.getElementById('f_product').value} - ${document.getElementById('f_name').value}님`, '크루즈 상품': document.getElementById('f_product').value, '선사': document.getElementById('f_cruiseline').value, '선박': document.getElementById('f_ship').value, '출발일': document.getElementById('f_date').value, '일정': document.getElementById('f_ports').value, '참고가격': document.getElementById('f_price').value, 'Ref': document.getElementById('f_ref').value, '고객 이름': document.getElementById('f_name').value, '고객 이메일': document.getElementById('f_email').value, '고객 연락처': document.getElementById('f_phone').value, '인원': document.getElementById('f_pax').value, '희망 객실': document.getElementById('f_cabin').value, '요청사항': document.getElementById('f_message').value || '없음', }; const inquiryPayload = { product: fd["크루즈 상품"], cruiseline: fd["선사"], ship: fd["선박"], dateFrom: fd["출발일"], ports: fd["일정"], price: fd["참고가격"], ref: fd["Ref"], name: fd["고객 이름"], email: fd["고객 이메일"], phone: fd["고객 연락처"], pax: fd["인원"], cabin: fd["희망 객실"], message: fd["요청사항"], }; fetch("/api/inquiry", { method: "POST", headers: {"Content-Type": "application/json"}, body: JSON.stringify(inquiryPayload) }).then(() => { document.getElementById('formStatus').innerHTML = '

✅ 문의가 접수되었습니다.
입력하신 이메일로 견적서를 회신드리겠습니다.

'; document.getElementById('inquiryForm').style.display = 'none'; btn.style.display = 'none'; }).catch(() => { document.getElementById('formStatus').innerHTML = '

✅ 문의가 접수되었습니다.
입력하신 이메일로 견적서를 회신드리겠습니다.

'; document.getElementById('inquiryForm').style.display = 'none'; btn.style.display = 'none'; }); }

🚢 크루즈 문의하기