v1.2.0: add split-flap board and nixie tube display modes with display style config

2026-09-05 20:22:59 +02:00
parent 944b7587bc
commit 361a319d94
9 changed files with 385 additions and 31 deletions
@@ -0,0 +1,138 @@
+/*
+ * Nixie tube display mode — retro amber glowing digits in glass tubes.
+ * Glow is faked with layered text copies, so no QtGraphicalEffects
+ * dependency. Pure QtQuick: testable outside the plasmoid shell.
+ */
+
+import QtQuick 2.15
+
+Row {
+    id: root
+
+    // wired by the parent loader
+    property string display: "--"
+    property color trendColor: "#9e9e9e"
+
+    spacing: height * 0.05
+
+    readonly property string digits: display.replace(/[^0-9]/g, "")
+    readonly property real tubeWidth: height * 0.52
+    readonly property real glowFont: height * 0.80
+
+    Repeater {
+        model: root.digits.length
+
+        delegate: Rectangle {
+            id: tube
+
+            width: root.tubeWidth
+            height: root.height
+            radius: width * 0.30
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: "#3a2410" }
+                GradientStop { position: 0.5; color: "#241505" }
+                GradientStop { position: 1.0; color: "#160c03" }
+            }
+            border.color: "#4a2e12"
+            border.width: 1
+
+            // glass reflection strip
+            Rectangle {
+                anchors.top: parent.top
+                anchors.topMargin: parent.height * 0.06
+                anchors.horizontalCenter: parent.horizontalCenter
+                width: parent.width * 0.5
+                height: parent.height * 0.16
+                radius: height / 2
+                color: "#ffffff"
+                opacity: 0.06
+            }
+
+            Text {
+                id: glowText
+                anchors.centerIn: parent
+                text: root.digits[index]
+                color: "#ffb648"
+                font.family: "DejaVu Serif"
+                font.pixelSize: root.glowFont
+
+                // layered glow: two scaled copies behind the crisp digit
+                Text {
+                    anchors.centerIn: parent
+                    text: parent.text
+                    color: "#ff8c00"
+                    opacity: 0.30
+                    font: parent.font
+                    scale: 1.24
+                }
+                Text {
+                    anchors.centerIn: parent
+                    text: parent.text
+                    color: "#ff9d1e"
+                    opacity: 0.50
+                    font: parent.font
+                    scale: 1.10
+                }
+
+                // occasional gentle nixie flicker
+                Timer {
+                    interval: 2200 + Math.random() * 3200
+                    repeat: false
+                    running: root.visible && root.digits.length > 0
+                    onTriggered: {
+                        flick.stop();
+                        flick.start();
+                        interval = 2200 + Math.random() * 3200;
+                        restart();
+                    }
+                }
+                SequentialAnimation {
+                    id: flick
+                    NumberAnimation {
+                        target: glowText
+                        property: "opacity"
+                        to: 0.82
+                        duration: 70
+                    }
+                    NumberAnimation {
+                        target: glowText
+                        property: "opacity"
+                        to: 1.0
+                        duration: 140
+                    }
+                }
+            }
+        }
+    }
+
+    // currency indicator, dim amber like an indicator lamp
+    Text {
+        anchors.verticalCenter: parent.verticalCenter
+        text: "\u20AC"
+        color: "#8a5a20"
+        font.family: "DejaVu Serif"
+        font.pixelSize: root.glowFont * 0.6
+        visible: root.digits.length > 0
+    }
+
+    // error / empty state
+    Text {
+        anchors.verticalCenter: parent.verticalCenter
+        text: "--"
+        color: "#7a4e1c"
+        font.family: "DejaVu Serif"
+        font.pixelSize: root.glowFont * 0.8
+        visible: root.digits.length === 0
+    }
+
+    // trend LED (green/red/grey)
+    Rectangle {
+        width: root.height * 0.11
+        height: width
+        radius: width / 2
+        anchors.verticalCenter: parent.verticalCenter
+        color: root.trendColor
+        border.color: "#4a2e12"
+        border.width: 1
+    }
+}