index.php?action=anzeige: Uebersicht, Anlage und Speicher ohne Kopf und
Seitenleiste, schmale Leiste links, immer quer. Nach zwei Minuten ohne
Beruehrung zurueck zur Uebersicht, MQTT verbindet still neu (Punkt in der
Leiste), alle sechs Stunden neu laden. Standard "ruhig" fuer den Pi 3B+
(nur Fluesse, grobe Stufen, kein Mauszeiger); &animation=1 und &maus=1.
Dafuer:
- Seitentabelle kennt "eigen" (Vorlage ist eine ganze Seite)
- Energiefluss: Optionen hochkantUnter und klickFilter; Anlage: hochkantUnter
- Bewaesserungszustand aus solarMQTT.js nach bewaesserungAnzeige.js, von
Solar-Seite und Anzeige gemeinsam genutzt
- Speicher: "voll/leer" mit Tag ("morgen 21:52", "in 3 Tagen")
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
61 lines
3.0 KiB
PHP
61 lines
3.0 KiB
PHP
<?php
|
|
/**
|
|
* Vollbildanzeige für ein festes Display, gedacht für den Raspberry Pi mit
|
|
* dem 7-Zoll-Display (800 x 480) im Kioskmodus:
|
|
*
|
|
* index.php?action=anzeige ruhige Animationen, kein Mauszeiger
|
|
* index.php?action=anzeige&animation=1 alle Animationen (schnellere Geräte)
|
|
* index.php?action=anzeige&maus=1 Mauszeiger sichtbar (zum Einrichten)
|
|
*
|
|
* Eine eigene Seite ohne Kopf, Seitenleiste und die Karten der Solar-Seite:
|
|
* links eine schmale Leiste mit Übersicht, Anlage und Speicher, rechts die
|
|
* Ansicht auf voller Höhe. Gezeichnet wird mit denselben Bausteinen wie auf
|
|
* der Solar-Seite (energiefluss.js, anlage.js, speicher.js); verdrahtet
|
|
* werden sie von js/solar/anzeige.js.
|
|
*
|
|
* index.php bindet für diese Seite weder header.php noch footer.php ein
|
|
* ("eigen" in der Seitentabelle) - deshalb steht der Kopf hier selbst.
|
|
*/
|
|
require_once(__DIR__ . "/energiefluss.php");
|
|
|
|
$ruhig = empty($_GET["animation"]);
|
|
$maus = !empty($_GET["maus"]);
|
|
?>
|
|
<!doctype html>
|
|
<html lang="de" data-bs-theme="dark">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
|
<title>Energiefluss</title>
|
|
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
|
|
<link rel="stylesheet" href="assets/fonts/font_poppins.css" />
|
|
<link rel="stylesheet" href="css/bootstrap-icons.min.css" />
|
|
<link rel="stylesheet" href="./css/solar.css?v=<?= filemtime("css/solar.css") ?>" />
|
|
</head>
|
|
<body class="anzeige<?= $ruhig ? " anzeige-ruhig" : "" ?><?= $maus ? "" : " anzeige-ohne-maus" ?>">
|
|
<nav class="anzeige-leiste" aria-label="Ansicht">
|
|
<button type="button" data-anzeige="fluss" aria-pressed="true" title="Übersicht"><i class="bi bi-diagram-3"></i></button>
|
|
<button type="button" data-anzeige="anlage" aria-pressed="false" title="Anlage"><i class="bi bi-grid-3x2-gap"></i></button>
|
|
<button type="button" data-anzeige="speicher" aria-pressed="false" title="Speicher"><i class="bi bi-battery-half"></i></button>
|
|
<div class="anzeige-fuss">
|
|
<span class="anzeige-punkt" id="anzeigeVerbindung" title="Verbindung wird aufgebaut"></span>
|
|
<span class="anzeige-uhr" id="anzeigeUhr"></span>
|
|
</div>
|
|
</nav>
|
|
<main class="anzeige-inhalt">
|
|
<div class="anzeige-flaeche" data-anzeige-flaeche="fluss" id="anzeige-fluss"></div>
|
|
<div class="anzeige-flaeche" data-anzeige-flaeche="anlage" id="anzeige-anlage" hidden></div>
|
|
<div class="anzeige-flaeche" data-anzeige-flaeche="speicher" id="anzeige-speicher" hidden></div>
|
|
</main>
|
|
<script>
|
|
// Abweichungen dieses Hauses vom Katalog, siehe restricted/energiefluss.php.
|
|
const energieflussEinstellungen = <?= json_encode((object)energieflussLaden(), JSON_UNESCAPED_UNICODE) ?>;
|
|
const anzeigeRuhig = <?= $ruhig ? "true" : "false" ?>;
|
|
</script>
|
|
<script src="js/mqtt.min.js"></script>
|
|
<?php foreach ($page["scripts"] as $script): ?>
|
|
<script src="<?= $script ?>?v=<?= filemtime($script) ?>"></script>
|
|
<?php endforeach; ?>
|
|
</body>
|
|
</html>
|