diff --git a/public/planetensichtbarkeit.php b/public/planetensichtbarkeit.php index c353189..c7fc0a8 100644 --- a/public/planetensichtbarkeit.php +++ b/public/planetensichtbarkeit.php @@ -109,12 +109,16 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST' && (string) ($_POST['ajax'] ?? '') ===

- Sichtbarkeit der Planeten und des Mondes über 24 Stunden fuer deinen Standard-Standort aus der Datenbank. + Sichtbarkeit der Planeten und des Mondes über 24 Stunden für deinen Standard-Standort aus der Datenbank.

Datum: + + + +
@@ -292,12 +296,41 @@ function addBest(bar, from, to, def) { const tooltip = document.getElementById('tooltip'); const datePicker = document.getElementById('datePicker'); +const btnPrevMonth = document.getElementById('btnPrevMonth'); +const btnPrevDay = document.getElementById('btnPrevDay'); +const btnNextDay = document.getElementById('btnNextDay'); +const btnNextMonth = document.getElementById('btnNextMonth'); const localDateStr = d => `${d.getFullYear()}-${fmt2(d.getMonth() + 1)}-${fmt2(d.getDate())}`; const pickerDate = () => { const [y, m, d] = datePicker.value.split('-').map(Number); return new Date(y, m - 1, d, 12); }; +function daysInMonth(year, monthIndex) { + return new Date(year, monthIndex + 1, 0).getDate(); +} + +function shiftPickerByDays(days) { + const base = pickerDate(); + base.setDate(base.getDate() + days); + datePicker.value = localDateStr(base); + renderChart(base); +} + +function shiftPickerByMonths(months) { + const base = pickerDate(); + const year = base.getFullYear(); + const monthIndex = base.getMonth(); + const day = base.getDate(); + const targetMonthIndex = monthIndex + months; + const targetYear = year + Math.floor(targetMonthIndex / 12); + const normalizedMonthIndex = ((targetMonthIndex % 12) + 12) % 12; + const clampedDay = Math.min(day, daysInMonth(targetYear, normalizedMonthIndex)); + const shifted = new Date(targetYear, normalizedMonthIndex, clampedDay, 12); + datePicker.value = localDateStr(shifted); + renderChart(shifted); +} + async function fetchVisibilityData(localDate) { const formData = new FormData(); formData.set('ajax', '1'); @@ -403,7 +436,7 @@ function renderInfoCards(localDate, data) { infoDiv.innerHTML = `
Standort
${SITE_LOCATION.name}
${LAT.toFixed(3)}deg N | ${LNG.toFixed(3)}deg O | ${ELEV} m
Sonne (${fmtDate(localDate)})
Aufgang: ${hF(tw.sunRiseH)}
Untergang: ${hF(tw.sunSetH)}
-
Dämmerung
Buergerlich: ${hF(tw.civDawnH)} / ${hF(tw.civDuskH)}
Nautisch: ${hF(tw.nautDawnH)} / ${hF(tw.nautDuskH)}
Astronomisch: ${hF(tw.astroDawnH)} / ${hF(tw.astroDuskH)}
+
Dämmerung
Bürgerlich: ${hF(tw.civDawnH)} / ${hF(tw.civDuskH)}
Nautisch: ${hF(tw.nautDawnH)} / ${hF(tw.nautDuskH)}
Astronomisch: ${hF(tw.astroDawnH)} / ${hF(tw.astroDuskH)}
Mond (${fmtDate(localDate)})
${Math.round((moon.illum || 0) * 100)}% ${moon.waning ? 'abnehmend' : 'zunehmend'}
Phase: ${typeof moon.phase === 'number' ? moon.phase.toFixed(1) : '--'}deg
Zeitzone
${tzLabel}
${SITE_LOCATION.timezone}
`; @@ -437,6 +470,22 @@ document.getElementById('btnToday').addEventListener('click', () => { renderChart(new Date(t.getFullYear(), t.getMonth(), t.getDate(), 12)); }); +btnPrevDay.addEventListener('click', () => { + shiftPickerByDays(-1); +}); + +btnNextDay.addEventListener('click', () => { + shiftPickerByDays(1); +}); + +btnPrevMonth.addEventListener('click', () => { + shiftPickerByMonths(-1); +}); + +btnNextMonth.addEventListener('click', () => { + shiftPickerByMonths(1); +}); + datePicker.addEventListener('input', () => { if (datePicker.value) { renderChart(pickerDate());