search(e.target.value)}
onBlur={handleBlur}
placeholder={t.loc === 'Konum' ? 'Konum girin...' : 'Enter location...'}
style={{
width: '100%', background: 'transparent', border: 'none',
fontFamily: SDT.mono, fontSize: 15, color: SDT.text,
padding: '14px 16px', outline: 'none', boxSizing: 'border-box',
}}
/>
{loading && (
…
)}
{suggestions.length > 0 && (
{suggestions.map((s, i) => (
select(s)} style={{
padding: '12px 16px', cursor: 'pointer', fontFamily: SDT.mono,
fontSize: 13, color: SDT.text,
borderTop: i > 0 ? '1px solid var(--line)' : 'none',
}}
onMouseEnter={(e) => e.currentTarget.style.background = 'rgba(51,39,26,0.06)'}
onMouseLeave={(e) => e.currentTarget.style.background = 'transparent'}
>
{s.name}
))}
)}
{loc.name && loc.lat !== 0 && (
{loc.lat.toFixed(2)}°N · {loc.lon.toFixed(2)}°E · {loc.alt} m
)}
);
}
/* ── Hesaplama formu ── */
function InputScreen({ state, set, onCalc, t, lang, setLang, nav }) {
const loc = state.loc;
return (
{loc.name}
{state.date.toLocaleDateString(lang === 'tr' ? 'tr-TR' : 'en-US', { day: 'numeric', month: 'short' })} · {loc.lat.toFixed(1)}°N · {loc.alt}m
{/* Sol: faktörler (masaüstü) */}
{/* Orta: kadran */}
{isNow ? t.recommended : SD.fmtClockTz(markDate, loc.tz)}
{bigVal !== null ? (
<>
{String(bigVal)}
{t.minute}
≈ {SD.TARGET_IU} IU D3
) : (
<>
○
{inst.daylight ? t.nowClosed : t.nowNight}
{t.closedSub}
)}
{/* saat kaydırıcı */}
{/* Sağ: pik not + gün yörüngesi */}
);
}
function App() {
const [lang, setLangState] = useState(() => localStorage.getItem('sd_lang') || 'tr');
function setLang(l) { setLangState(l); localStorage.setItem('sd_lang', l); }
const [page, setPage] = useState('calc'); // calc | about | science | faq
const [view, setView] = useState('input'); // input | result
const [anim, setAnim] = useState(false);
const [state, setState] = useState({
loc: { name: '', lat: 0, lon: 0, alt: 0, tz: 0 },
date: new Date(),
skin: 3,
bsa: 25,
cloud: 12,
geo: false,
});
const t = LANG[lang];
const set = (patch) => setState((s) => ({ ...s, ...patch }));
// URL parametrelerinden konum oku
useEffect(() => {
const params = new URLSearchParams(window.location.search);
const lat = parseFloat(params.get('lat'));
const lon = parseFloat(params.get('lon'));
const tz = parseInt(params.get('tz'));
const name = params.get('name');
const langParam = params.get('lang');
if (langParam === 'en' || langParam === 'tr') {
setLang(langParam);
}
if (lat && lon && name) {
// Küçük gecikme: Open-Meteo effect'in üzerine yazmasını bekle
setTimeout(() => {
set({ loc: { name, lat, lon, alt: 0, tz: tz || Math.round(lon / 15) } });
window.history.replaceState({}, '', '/');
}, 800);
}
}, []);
// Konum değişince Open-Meteo'dan rakım, bulut ve timezone al
useEffect(() => {
if (!state.loc.lat || !state.loc.lon) return;
fetch(`https://api.open-meteo.com/v1/forecast?latitude=${state.loc.lat}&longitude=${state.loc.lon}¤t=cloud_cover&timezone=auto&forecast_days=1`)
.then(r => r.json())
.then(data => {
const tz = Math.round((data.utc_offset_seconds || 0) / 3600);
const alt = Math.round(data.elevation || 0);
const cloud = data.current?.cloud_cover ?? 12;
set({
cloud,
loc: { ...state.loc, tz, alt },
});
})
.catch(() => {});
}, [state.loc.lat, state.loc.lon]);
// geolocation
useEffect(() => {
if (!state.geo) return;
set({ geo: false });
if (!navigator.geolocation) return;
navigator.geolocation.getCurrentPosition((pos) => {
const { latitude, longitude } = pos.coords;
// Reverse geocoding ile gerçek şehir adını bul
fetch(`https://nominatim.openstreetmap.org/reverse?lat=${latitude}&lon=${longitude}&format=json&addressdetails=1`, { headers: { 'Accept-Language': lang === 'tr' ? 'tr,en' : 'en' } })
.then(r => r.json())
.then(data => {
const city = data.address?.city || data.address?.town || data.address?.village || data.address?.county || data.display_name.split(',')[0].trim();
const country = data.address?.country || '';
const name = country ? `${city}, ${country}` : city;
set({ loc: { name, lat: latitude, lon: longitude, alt: 0, tz: Math.round(longitude / 15) } });
})
.catch(() => {
let best = SD.CITIES[0], bd = 1e9;
SD.CITIES.forEach((c) => { const d = Math.hypot(c.lat - latitude, c.lon - longitude); if (d < bd) { bd = d; best = c; } });
set({ loc: { ...best, lat: latitude, lon: longitude, name: best.name } });
});
}, () => {});
}, [state.geo]);
const go = (v) => { setAnim(true); setTimeout(() => { setView(v); setAnim(false); }, 260); };
const nav = (p) => {
setAnim(true);
setTimeout(() => {
if (p === 'calc') { setPage('calc'); setView('input'); }
else setPage(p);
window.scrollTo(0, 0);
setAnim(false);
}, 220);
};
let body;
if (page === 'calc') {
body = view === 'input'
?