);
}
// ╔══════════════════════════════════════════════════════════════════════╗
// ║ 오시는 길 — 주소와 좌표를 바꾸면 지도와 링크가 모두 따라갑니다. ║
// ║ ║
// ║ ⚠ lat/lng 는 설문동 일대의 대략적인 좌표입니다. 정확한 위치로 바꾸세요. ║
// ║ 구하는 법: 네이버 지도에서 사업장 검색 → 우클릭 → '이 위치의 좌표' ║
// ║ 또는 구글 지도에서 사업장 우클릭 → 맨 위에 뜨는 숫자 두 개를 복사 ║
// ╚══════════════════════════════════════════════════════════════════════╝
const TSENG_PLACE = {
name: '태성ENG',
addr: '경기도 고양시 일산동구 은마길79번길 81, A동 일부(설문동)',
addrEn: '81 Eunma-gil 79beon-gil, Ilsandong-gu, Goyang-si, Gyeonggi-do, Korea',
zip: '10252',
lat: 37.7177, // 공식 주소DB — 설문동 530-79(은마길79번길 85) 기준
lng: 126.8035, // 530-80 은 바로 옆 번지이므로 오차 수십 m 이내
};
// ╔══════════════════════════════════════════════════════════════════════╗
// ║ 네이버 지도 키 — 이 한 줄만 채우면 지도가 네이버로 바뀝니다. ║
// ║ ║
// ║ 발급 절차 (무료, 월 10만회까지) ║
// ║ 1. https://console.ncloud.com 가입 → 결제수단 등록 ║
// ║ 2. Services → AI·NAVER API → Maps → '이용 신청' ║
// ║ 3. Application 등록 → Web Dynamic Map 체크 ║
// ║ 4. '서비스 URL' 에 실제 도메인 입력 (예: https://taesung-eng.co.kr) ║
// ║ ※ 등록한 도메인에서만 지도가 보입니다. 로컬 테스트시 ║
// ║ http://localhost:5173 같은 주소도 함께 등록하세요. ║
// ║ 5. 발급된 Client ID 를 아래 따옴표 안에 붙여넣기 ║
// ║ ║
// ║ 비워두면 OpenStreetMap 지도가 그대로 표시됩니다(키 불필요). ║
// ╚══════════════════════════════════════════════════════════════════════╝
const NAVER_MAP_KEY = '';
// 네이버 지도 — 키가 있을 때만 스크립트를 불러와 그립니다
function NaverMap5({ onFail }) {
const box = useRef(null);
useEffect(() => {
let dead = false;
const draw = () => {
if (dead || !box.current || !window.naver || !window.naver.maps) return;
const pos = new window.naver.maps.LatLng(TSENG_PLACE.lat, TSENG_PLACE.lng);
const map = new window.naver.maps.Map(box.current, {
center: pos, zoom: 16,
zoomControl: true,
zoomControlOptions: { position: window.naver.maps.Position.TOP_RIGHT },
});
new window.naver.maps.Marker({ position: pos, map, title: TSENG_PLACE.name });
};
if (window.naver && window.naver.maps) { draw(); return; }
const s = document.createElement('script');
s.src = `https://oapi.map.naver.com/openapi/v3/maps.js?ncpKeyId=${NAVER_MAP_KEY}`;
s.async = true;
s.onload = draw;
s.onerror = () => { if (!dead) onFail(); }; // 키·도메인 오류 시 OSM 으로 돼돌아감
document.head.appendChild(s);
return () => { dead = true; };
}, [onFail]);
return ;
}
function Location5() {
const t = useV4(); const ko = t.lang !== 'en';
const [toast, setToast] = useState(false);
const [naverFail, setNaverFail] = useState(false);
const useNaver = !!NAVER_MAP_KEY && !naverFail;
const q = encodeURIComponent(TSENG_PLACE.addr);
const copyAddr = async () => {
try { await navigator.clipboard.writeText(TSENG_PLACE.addr); }
catch {
const ta = document.createElement('textarea');
ta.value = TSENG_PLACE.addr; ta.style.position = 'fixed'; ta.style.opacity = '0';
document.body.appendChild(ta); ta.select();
try { document.execCommand('copy'); } catch {}
document.body.removeChild(ta);
}
setToast(true);
setTimeout(() => setToast(false), 2200);
};
// 지도 앱 딥링크 — API 키 없이 동작합니다
const maps = [
{ ko: '네이버 지도', en: 'Naver Map', href: `https://map.naver.com/p/search/${q}` },
{ ko: '카카오맵', en: 'KakaoMap', href: `https://map.kakao.com/?q=${q}` },
{ ko: '구글 지도', en: 'Google Maps', href: `https://www.google.com/maps/search/?api=1&query=${q}` },
];
const info = [
{ k: ko ? '주소' : 'Address', v: ko ? TSENG_PLACE.addr : TSENG_PLACE.addrEn, sub: ko ? `우편번호 ${TSENG_PLACE.zip}` : `Zip ${TSENG_PLACE.zip}` },
{ k: ko ? '업무시간' : 'Hours', v: ko ? '평일 08:30 – 18:00' : 'Mon–Fri 08:30–18:00', sub: ko ? '토·일요일 및 공휴일 휴무' : 'Closed weekends & holidays' },
{ k: ko ? '주차' : 'Parking', v: ko ? '사업장 내 주차 가능' : 'On-site parking available', sub: ko ? '대형 차량 진입 가능' : 'Accessible for large vehicles' },
];
return (
Location
{ko ? <>직접 오셔서 확인하셔도 됩니다. : <>Come and see the shop yourself.}
{ko
? <>방문 전 전화 주시면 담당자가 대기합니다. 도면을 들고 오시면 현장에서 바로 검토해 드립니다.
: 'Call ahead and someone will be waiting. Bring the drawing and we review it on the spot.'}
{/* 지도 자리 */}
{/* ══ 지도 ══
NAVER_MAP_KEY 가 채워지면 네이버 지도, 비어있으면 OpenStreetMap 이 표시됩니다.
키 발급 절차는 이 파일 상단 NAVER_MAP_KEY 주석 참고. */}
{useNaver ? (
setNaverFail(true)}/>
) : (
)}
{/* 상호·주소 플레이트 — 지도 위에 엹혀 있음 */}