feat: dashboard show on hover, media and weather tabs added

2026-09-30 14:22:22 +02:00
parent d259c6ffbe
commit 2c90339c77
97 changed files with 4480 additions and 990 deletions
@@ -0,0 +1,145 @@
+import QtQuick
+import QtQuick.Layouts
+import ZShell.Config
+import qs.Components
+import qs.Services
+import qs.Helpers
+
+RowLayout {
+	id: root
+
+	spacing: Tokens.spacing.largeIncreased
+
+	readonly property list<var> forecastToday: Weather.hourlyForecast.slice(0, 25)
+
+	property var now: new Date()
+	property bool useTwelveHourClock: Config.services.useTwelveHourClock
+	property bool curveSmoothing: true
+	property real smoothing: 2
+	property real markerGap: Math.min(Math.max(Tokens.spacing.medium / 2, 0), 6)
+
+	readonly property real markerX: {
+		const d = root.now;
+		return d.getHours() + d.getMinutes() / 60;
+	}
+
+	function formatHour(h) {
+		if (root.useTwelveHourClock) {
+			const hr = h % 12 === 0 ? 12 : h % 12;
+			return hr + (h < 12 ? " AM" : " PM");
+		}
+		return h;
+	}
+
+	Timer {
+		interval: 60000
+		repeat: true
+		running: true
+
+		onTriggered: root.now = new Date()
+	}
+
+	ColumnLayout {
+		Layout.fillWidth: true
+		Layout.preferredWidth: root.width / 2
+
+		RowLayout {
+			Layout.fillWidth: true
+
+			MaterialIcon {
+				text: "device_thermostat"
+				font.pointSize: Tokens.font.size.large
+				color: Colors.palette.m3secondary
+			}
+
+			CustomText {
+				text: qsTr("Temperature")
+			}
+		}
+
+		Item {
+			id: temperature
+
+			implicitHeight: 150
+			Layout.fillWidth: true
+
+			LineGraph {
+				id: tempGraph
+
+				anchors.fill: parent
+				values: root.forecastToday.map(e => e.tempC)
+				verticalLineStep: 3
+				xSteps: 24
+				horizontalLineStep: 10
+				minHorizontalLines: 4
+				yPaddingTop: horizontalLineStep
+				yPaddingBottom: horizontalLineStep
+				xLabel: i => root.formatHour(i)
+				yLabel: v => Math.round(v) + "°"
+
+				markerX: root.markerX
+				smoothing: root.smoothing
+				curveSmoothing: root.curveSmoothing
+				markerGap: root.markerGap
+
+				lineColor: Colors.palette.m3secondary
+				gridColor: Colors.palette.m3onSurface
+				markerColor: Colors.palette.m3secondary
+				labelColor: Colors.palette.m3onSurfaceVariant
+			}
+		}
+	}
+
+	ColumnLayout {
+		Layout.fillWidth: true
+		Layout.preferredWidth: root.width / 2
+
+		RowLayout {
+			Layout.fillWidth: true
+
+			MaterialIcon {
+				text: "water_drop"
+				font.pointSize: Tokens.font.size.large
+				color: Colors.palette.m3tertiary
+			}
+
+			CustomText {
+				text: qsTr("Chance of precipitation")
+			}
+		}
+
+		Item {
+			id: precipitation
+
+			Layout.fillWidth: true
+			implicitHeight: 150
+
+			LineGraph {
+				id: graph
+
+				anchors.fill: parent
+
+				values: root.forecastToday.map(e => e?.precipChance ?? null)
+				xSteps: 24
+				yMin: 0
+				yMax: 100
+				yPaddingTop: 20
+				verticalLineStep: 3
+				lastXLine: false
+				horizontalLineStep: 20
+				xLabel: i => root.formatHour(i)
+				yLabel: v => v + "%"
+
+				markerX: root.markerX
+				smoothing: root.smoothing
+				curveSmoothing: root.curveSmoothing
+				markerGap: root.markerGap
+
+				lineColor: Colors.palette.m3tertiary
+				gridColor: Colors.palette.m3onSurface
+				markerColor: Colors.palette.m3tertiary
+				labelColor: Colors.palette.m3onSurfaceVariant
+			}
+		}
+	}
+}