Fix media lightbox and sleep target

This commit is contained in:
2026-05-19 16:07:35 +02:00
parent 3e497a8047
commit 6a5852654b
7 changed files with 92 additions and 18 deletions
+25 -1
View File
@@ -886,15 +886,39 @@ body.page-dashboard .content {
}
.sleep-phase-bar {
position: relative;
display: flex;
min-height: 2.35rem;
margin-top: 0.75rem;
margin-top: 1.55rem;
overflow: hidden;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.14);
background: rgba(255, 255, 255, 0.08);
}
.sleep-phase-bar__target {
position: absolute;
left: var(--sleep-optimal-left, 100%);
top: -1.28rem;
bottom: 0;
width: 0;
border-left: 2px solid rgba(255, 255, 255, 0.92);
filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45));
pointer-events: none;
}
.sleep-phase-bar__target span {
position: absolute;
top: 0;
left: 0.28rem;
padding: 0.08rem 0.34rem;
border-radius: 999px;
background: rgba(6, 16, 28, 0.72);
color: rgba(255, 255, 255, 0.95);
font-size: 0.68rem;
white-space: nowrap;
}
.sleep-phase-bar__segment {
display: inline-flex;
align-items: center;
+4
View File
@@ -1658,6 +1658,10 @@
return;
}
if (lightbox.parentElement !== document.body) {
document.body.appendChild(lightbox);
}
const close = () => {
lightbox.setAttribute("hidden", "hidden");
content.replaceChildren();
+40 -14
View File
@@ -366,7 +366,7 @@ final class App
$metrics = $this->healthMetricsFromPayload($payload);
$workouts = $this->healthWorkoutsFromPayload($payload);
$metricImport = $this->healthEventsFromMetrics($metrics);
$metricImport = $this->healthEventsFromMetrics($metrics, (float) ($settings['sleep']['optimal_hours'] ?? 7.0));
$workoutImport = $this->healthEventsFromWorkouts($workouts, $settings);
$entries = $this->entries->all($username);
@@ -717,7 +717,7 @@ final class App
];
}
private function healthEventsFromMetrics(array $metrics): array
private function healthEventsFromMetrics(array $metrics, float $optimalSleepHours = 7.0): array
{
$steps = [];
$sleepBuckets = [];
@@ -786,7 +786,7 @@ final class App
$sleep = [];
foreach ($sleepBuckets as $date => $bucket) {
$signals = $this->healthSleepSignals($bucket);
$signals = $this->healthSleepSignals($bucket, $optimalSleepHours);
$sleep[$date][] = [
'id' => 'health-sleep-' . $date,
@@ -815,17 +815,19 @@ final class App
];
}
private function healthSleepSignals(array $bucket): array
private function healthSleepSignals(array $bucket, float $optimalSleepHours = 7.0): array
{
$hours = (float) ($bucket['hours'] ?? 0);
$deep = (float) ($bucket['deep'] ?? 0);
$rem = (float) ($bucket['rem'] ?? 0);
$core = (float) ($bucket['core'] ?? 0);
$optimalSleepHours = max(1.0, min(16.0, $optimalSleepHours));
$quality = 0;
$deviation = abs($hours - $optimalSleepHours);
if ($hours >= 7 && $hours <= 9) {
if ($deviation <= 0.75) {
$quality++;
} elseif ($hours < 5 || $hours > 10) {
} elseif ($deviation >= 2.0) {
$quality--;
}
@@ -843,8 +845,8 @@ final class App
return [
'mood' => max(-2, min(2, $quality - 1)),
'energy' => max(-2, min(2, (int) round(($deep + $rem) - 2))),
'stress' => max(-2, min(2, $core >= 3.5 && $hours >= 6 ? -1 : ($hours < 5 ? 1 : 0))),
'energy' => max(-2, min(2, (int) round(($deep + $rem) - 2 - max(0, $deviation - 1)))),
'stress' => max(-2, min(2, $core >= 3.5 && $deviation <= 1.0 ? -1 : ($deviation >= 2.0 ? 1 : 0))),
];
}
@@ -1202,7 +1204,7 @@ final class App
'dayEntry' => $selectedEntry,
'dashboardEventTypes' => day_event_type_options(),
'dashboardSignals' => signal_scale_options(),
'dashboardTimeline' => $this->buildDashboardTimeline($selectedEntry),
'dashboardTimeline' => $this->buildDashboardTimeline($selectedEntry, $settings),
'dashboardCompareDays' => $this->buildDashboardCompareDays($dashboardDate, $entryMap, $settings),
'dashboardWeek' => $this->buildDashboardWeekView($dashboardDate, $entryMap),
'dashboardMonth' => $this->buildDashboardMonthView($dashboardDate, $entryMap),
@@ -1392,7 +1394,7 @@ final class App
]);
}
private function buildDashboardTimeline(array $entry): array
private function buildDashboardTimeline(array $entry, array $settings): array
{
$timeline = [];
@@ -1401,10 +1403,26 @@ final class App
continue;
}
$type = (string) ($event['type'] ?? 'event');
$mood = normalize_signal_value($event['mood'] ?? 0);
$energy = normalize_signal_value($event['energy'] ?? 0);
$stress = normalize_signal_value($event['stress'] ?? 0);
if ($type === 'sleep' && (string) ($event['source'] ?? '') === 'health_auto_export') {
$signals = $this->healthSleepSignals([
'hours' => (float) ($event['value'] ?? 0),
'deep' => (float) ($event['sleep_deep'] ?? 0),
'rem' => (float) ($event['sleep_rem'] ?? 0),
'core' => (float) ($event['sleep_core'] ?? 0),
], (float) ($settings['sleep']['optimal_hours'] ?? 7.0));
$mood = $signals['mood'];
$energy = $signals['energy'];
$stress = $signals['stress'];
}
$timeline[] = [
'kind' => 'event',
'id' => (string) ($event['id'] ?? ''),
'type' => (string) ($event['type'] ?? 'event'),
'type' => $type,
'time' => (string) ($event['time'] ?? ''),
'comment' => (string) ($event['comment'] ?? ''),
'value' => (float) ($event['value'] ?? 0),
@@ -1413,9 +1431,9 @@ final class App
'consumed' => !empty($event['consumed']),
'image' => (string) ($event['image'] ?? ''),
'image_url' => is_string($event['image_url'] ?? null) ? (string) $event['image_url'] : null,
'mood' => normalize_signal_value($event['mood'] ?? 0),
'energy' => normalize_signal_value($event['energy'] ?? 0),
'stress' => normalize_signal_value($event['stress'] ?? 0),
'mood' => $mood,
'energy' => $energy,
'stress' => $stress,
'source' => (string) ($event['source'] ?? ''),
'import_id' => (string) ($event['import_id'] ?? ''),
'duration_label' => (string) ($event['duration_label'] ?? ''),
@@ -2894,6 +2912,9 @@ final class App
$settings['walk'] = [
'mode' => ($input['walk']['mode'] ?? ($settings['walk']['mode'] ?? 'time')) === 'steps' ? 'steps' : 'time',
];
$settings['sleep'] = [
'optimal_hours' => max(1.0, min(16.0, round((float) ($input['sleep']['optimal_hours'] ?? ($settings['sleep']['optimal_hours'] ?? 7.0)), 1))),
];
$settings['scoring']['mood_multiplier'] = max(0, min(10, (int) ($input['scoring']['mood_multiplier'] ?? 3)));
$settings['scoring']['energy_multiplier'] = max(0, min(10, (int) ($input['scoring']['energy_multiplier'] ?? 2)));
@@ -2976,6 +2997,11 @@ final class App
Defaults::settings()['walk'],
is_array($settings['walk'] ?? null) ? $settings['walk'] : []
);
$settings['sleep'] = array_replace(
Defaults::settings()['sleep'],
is_array($settings['sleep'] ?? null) ? $settings['sleep'] : []
);
$settings['sleep']['optimal_hours'] = max(1.0, min(16.0, round((float) ($settings['sleep']['optimal_hours'] ?? 7.0), 1)));
$settings['tracking'] = array_replace(
Defaults::settings()['tracking'],
is_array($settings['tracking'] ?? null) ? $settings['tracking'] : []
+3
View File
@@ -19,6 +19,9 @@ final class Defaults
'walk' => [
'mode' => 'time',
],
'sleep' => [
'optimal_hours' => 7.0,
],
'tracking' => [
'pain_enabled' => false,
],
+1 -1
View File
@@ -19,7 +19,7 @@ $jsVersion = is_file(base_path('assets/js/app.js')) ? (string) filemtime(base_pa
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="theme-color" content="#0b1e2e">
<meta name="robots" content="noindex, nofollow, noarchive, nosnippet">
<meta name="apple-mobile-web-app-capable" content="yes">
+7 -2
View File
@@ -10,6 +10,7 @@ $summaryAlcohol = !empty($dayEntry['summary']['alcohol'] ?? $dayEntry['summary_a
$dayHealth = is_array($dayEntry['health'] ?? null) ? $dayEntry['health'] : [];
$daySteps = (int) ($dayHealth['steps'] ?? 0);
$dayStepBonus = (float) ($dayEntry['evaluation']['components']['step_bonus'] ?? 0);
$optimalSleepHours = max(1.0, min(16.0, (float) ($settings['sleep']['optimal_hours'] ?? 7.0)));
?>
<section class="dashboard-shell<?= $dayBackground !== null ? ' dashboard-shell--with-image' : '' ?>" data-dashboard-root>
@@ -113,6 +114,8 @@ $dayStepBonus = (float) ($dayEntry['evaluation']['components']['step_bonus'] ??
}
}
$sleepPhaseTotal = max(0.0, array_sum($sleepPhases));
$sleepBarTotal = $eventType === 'sleep' ? max((float) ($item['value'] ?? 0), $sleepPhaseTotal, $optimalSleepHours) : 0.0;
$sleepOptimalPercent = $sleepBarTotal > 0 ? max(0, min(100, ($optimalSleepHours / $sleepBarTotal) * 100)) : 0;
?>
<?php $eventStats = array_values(array_filter([
$eventType !== 'sleep' ? (string) ($item['duration_label'] ?? '') : '',
@@ -121,7 +124,7 @@ $dayStepBonus = (float) ($dayEntry['evaluation']['components']['step_bonus'] ??
(string) ($item['heart_rate_label'] ?? ''),
], static function (string $value): bool {
$value = trim($value);
return $value !== '' && !preg_match('/^-\s*(Distanz|Energie|Puls|Route)-?Label:?$/u', $value);
return $value !== '' && !preg_match('/^-\s*(Distanz|Energie|Puls|Route)(?:-?Label)?:?$/u', $value);
})); ?>
<?php $eventPayload = encode_payload([
'id' => (string) ($item['id'] ?? ''),
@@ -182,7 +185,7 @@ $dayStepBonus = (float) ($dayEntry['evaluation']['components']['step_bonus'] ??
<?php endif; ?>
<?php if ($eventType === 'sleep' && $sleepPhaseTotal > 0): ?>
<div class="sleep-phase-bar" aria-label="Schlafphasen">
<div class="sleep-phase-bar" aria-label="Schlafphasen" style="--sleep-optimal-left: <?= e((string) $sleepOptimalPercent) ?>%">
<?php foreach (['deep' => ['Tief', 'deep'], 'rem' => ['REM', 'rem'], 'core' => ['Kern', 'core']] as $phase => [$label, $class]): ?>
<?php $phaseHours = max(0.0, (float) ($sleepPhases[$phase] ?? 0)); ?>
<?php if ($phaseHours <= 0) { continue; } ?>
@@ -190,6 +193,7 @@ $dayStepBonus = (float) ($dayEntry['evaluation']['components']['step_bonus'] ??
<strong><?= e($label) ?></strong> <?= e(format_points($phaseHours)) ?> h
</span>
<?php endforeach; ?>
<span class="sleep-phase-bar__target"><span><?= e(format_points($optimalSleepHours)) ?> h</span></span>
</div>
<?php endif; ?>
@@ -626,6 +630,7 @@ $dayStepBonus = (float) ($dayEntry['evaluation']['components']['step_bonus'] ??
<div class="settings-menu-grid">
<a class="options-menu-card" href="/options?panel=sports"><strong>Sportarten anpassen</strong><span>Eigene Sportarten und Bonuspunkte</span></a>
<a class="options-menu-card" href="/options?panel=walk"><strong>Spaziergang anpassen</strong><span>Zeit oder Schritte auswerten</span></a>
<a class="options-menu-card" href="/options?panel=sleep"><strong>Schlaf anpassen</strong><span>Optimale Schlafmenge</span></a>
<a class="options-menu-card" href="/options?panel=health"><strong>Health Import</strong><span>Apple Health automatisch übernehmen</span></a>
<a class="options-menu-card" href="/options?panel=reminders"><strong>Erinnerungen setzen</strong><span>Push und tägliche Erinnerung</span></a>
<a class="options-menu-card" href="/options?panel=ratings"><strong>Bewertungsskala ändern</strong><span>Labels und Schutzregeln</span></a>
+12
View File
@@ -18,6 +18,7 @@
<div class="options-menu-grid">
<button class="options-menu-card" type="button" data-options-open="sports"><strong>Sportarten anpassen</strong><span>Eigene Sportarten und Bonuspunkte</span></button>
<button class="options-menu-card" type="button" data-options-open="walk"><strong>Spaziergang anpassen</strong><span>Zeit oder Schritte auswerten</span></button>
<button class="options-menu-card" type="button" data-options-open="sleep"><strong>Schlaf anpassen</strong><span>Optimale Schlafmenge markieren</span></button>
<button class="options-menu-card" type="button" data-options-open="reminders"><strong>Erinnerungen setzen</strong><span>Push und tägliche Erinnerung</span></button>
<button class="options-menu-card" type="button" data-options-open="health"><strong>Health Import</strong><span>Apple Health automatisch übernehmen</span></button>
<button class="options-menu-card" type="button" data-options-open="ratings"><strong>Bewertungsskala ändern</strong><span>Labels und Schutzregeln</span></button>
@@ -113,6 +114,17 @@
</form>
</div>
<div class="options-panel" data-options-panel="sleep" hidden>
<h2>Schlaf anpassen</h2>
<form method="post" action="/options" class="stack-form">
<?= csrf_field() ?>
<input type="hidden" name="form_name" value="settings">
<p class="helper-text">Diese Zielmenge wird im importierten Schlafbalken als horizontale Markierung angezeigt und fließt in die automatische Stimmung/Energie/Stress-Einschätzung ein.</p>
<label><span>Optimale Schlafdauer</span><input type="number" name="settings[sleep][optimal_hours]" value="<?= e((string) ($settings['sleep']['optimal_hours'] ?? 7.0)) ?>" min="1" max="16" step="0.1"></label>
<button class="primary-button" type="submit">Schlaf speichern</button>
</form>
</div>
<div class="options-panel" data-options-panel="reminders" hidden>
<h2>Erinnerungen setzen</h2>
<form method="post" action="/options" class="stack-form">