From 7dda10629a4fba2a066c1fad1b1ad714d6fdee43 Mon Sep 17 00:00:00 2001 From: end-4 <97237370+end-4@users.noreply.github.com> Date: Sun, 5 Oct 2025 21:38:03 +0200 Subject: [PATCH] background clock: refractor hour hand and minute hand to new file --- .../ii/modules/background/Background.qml | 2 + .../{ => cookieClock}/CookieClock.qml | 64 ++++--------------- .../background/cookieClock/HourHand.qml | 48 ++++++++++++++ .../background/cookieClock/MinuteHand.qml | 51 +++++++++++++++ 4 files changed, 114 insertions(+), 51 deletions(-) rename .config/quickshell/ii/modules/background/{ => cookieClock}/CookieClock.qml (87%) create mode 100644 .config/quickshell/ii/modules/background/cookieClock/HourHand.qml create mode 100644 .config/quickshell/ii/modules/background/cookieClock/MinuteHand.qml diff --git a/.config/quickshell/ii/modules/background/Background.qml b/.config/quickshell/ii/modules/background/Background.qml index d322120ba..47962f514 100644 --- a/.config/quickshell/ii/modules/background/Background.qml +++ b/.config/quickshell/ii/modules/background/Background.qml @@ -14,6 +14,8 @@ import Quickshell.Io import Quickshell.Wayland import Quickshell.Hyprland +import "./cookieClock" + Variants { id: root readonly property bool fixedClockPosition: Config.options.background.clock.fixedPosition diff --git a/.config/quickshell/ii/modules/background/CookieClock.qml b/.config/quickshell/ii/modules/background/cookieClock/CookieClock.qml similarity index 87% rename from .config/quickshell/ii/modules/background/CookieClock.qml rename to .config/quickshell/ii/modules/background/cookieClock/CookieClock.qml index 53032b980..1a6c70dea 100644 --- a/.config/quickshell/ii/modules/background/CookieClock.qml +++ b/.config/quickshell/ii/modules/background/cookieClock/CookieClock.qml @@ -35,17 +35,17 @@ Item { property color colShadow: Appearance.colors.colShadow property color colBackground: Appearance.colors.colSecondaryContainer property color colOnBackground: ColorUtils.mix(Appearance.colors.colPrimary, Appearance.colors.colSecondaryContainer, 0.5) - property color colMinuteHand: Appearance.colors.colPrimary - property color colHourHand: Appearance.colors.colSecondaryActive + property color colMinuteHand: Appearance.colors.colSecondary + property color colHourHand: Appearance.colors.colPrimary property color colOnHourHand: Appearance.colors.colOnPrimary property color colTimeIndicators: Appearance.colors.colSecondaryContainerHover property color colSeconds: Appearance.colors.colTertiary + readonly property list clockNumbers: DateTime.time.split(/[: ]/) readonly property int clockHour: parseInt(clockNumbers[0]) % 12 readonly property int clockMinute: DateTime.clock.minutes readonly property int clockSecond: DateTime.clock.seconds - implicitWidth: implicitSize implicitHeight: implicitSize @@ -169,59 +169,21 @@ Item { } // Hour hand - Item { - opacity: Config.options.background.clock.cookie.hourHandStyle === "hide" ? 0.0 : 1.0 + HourHand { anchors.fill: parent - z: Config.options.background.clock.cookie.hourHandStyle === "fill" ? 3 : 1 - rotation: -90 + (360 / 12) * (root.clockHour + root.clockMinute / 60) - Behavior on opacity { - animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this) - } - Rectangle { - opacity: Config.options.background.clock.cookie.hourHandStyle !== "hide" ? 1.0 : 0 - anchors.verticalCenter: parent.verticalCenter - x: Config.options.background.clock.cookie.hourHandStyle === "classic" ? (parent.width / 2 - minuteHandWidth / 2) - 15 : parent.width / 2 - minuteHandWidth / 2 - width: hourHandLength - height: Config.options.background.clock.cookie.hourHandStyle === "classic" ? 8 : hourHandWidth - radius: Config.options.background.clock.cookie.hourHandStyle === "classic" ? 2 : hourHandWidth / 2 - color : Config.options.background.clock.cookie.hourHandStyle === "stroke" ? "transparent" : root.colHourHand - border.color: root.colHourHand - border.width: 4 - Behavior on opacity { - animation: Appearance.animation.elementResize.numberAnimation.createObject(this) - } - Behavior on x{ - animation: Appearance.animation.elementResize.numberAnimation.createObject(this) - } - } + handWidth: root.hourHandWidth + clockHour: root.clockHour + clockMinute: root.clockMinute + style: Config.options.background.clock.cookie.hourHandStyle + color: root.colHourHand } // Minute hand - Item { - opacity: Config.options.background.clock.cookie.minuteHandStyle === "hide" ? 0.0 : 1.0 + MinuteHand { anchors.fill: parent - z: Config.options.background.clock.cookie.minuteHandStyle === "thin" ? 1 : 3 - rotation: -90 + (360 / 60) * root.clockMinute - Behavior on rotation{ - animation: Appearance.animation.elementResize.numberAnimation.createObject(this) - } - Behavior on opacity { - animation: Appearance.animation.elementResize.numberAnimation.createObject(this) - } - Rectangle { - anchors.verticalCenter: parent.verticalCenter - x: Config.options.background.clock.cookie.minuteHandStyle === "classic" ? (parent.width / 2 - minuteHandWidth / 2) - 15 : parent.width / 2 - minuteHandWidth / 2 - width: minuteHandLength - height: minuteHandWidth - radius: Config.options.background.clock.cookie.minuteHandStyle === "classic" ? 2 : minuteHandWidth / 2 - color: root.colMinuteHand - Behavior on height { - animation: Appearance.animation.elementResize.numberAnimation.createObject(this) - } - Behavior on x{ - animation: Appearance.animation.elementResize.numberAnimation.createObject(this) - } - } + clockMinute: root.clockMinute + style: Config.options.background.clock.cookie.minuteHandStyle + color: root.colMinuteHand } // Center dot diff --git a/.config/quickshell/ii/modules/background/cookieClock/HourHand.qml b/.config/quickshell/ii/modules/background/cookieClock/HourHand.qml new file mode 100644 index 000000000..17e88a500 --- /dev/null +++ b/.config/quickshell/ii/modules/background/cookieClock/HourHand.qml @@ -0,0 +1,48 @@ +pragma ComponentBehavior: Bound + +import qs +import qs.services +import qs.modules.common +import qs.modules.common.widgets +import qs.modules.common.functions +import QtQuick + +Item { + id: root + anchors.fill: parent + + required property int clockHour + required property int clockMinute + property real handWidth: 16 + property string style: "fill" + property color color: Appearance.colors.colPrimary + + rotation: -90 + (360 / 12) * (root.clockHour + root.clockMinute / 60) + z: root.style === "fill" ? 3 : 1 + + opacity: root.style === "hide" ? 0.0 : 1.0 + Behavior on opacity { + animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this) + } + + Rectangle { + anchors.verticalCenter: parent.verticalCenter + x: { + let position = parent.width / 2 - handWidth / 2; + if (root.style === "classic") position -= 15; + return position; + } + width: hourHandLength + height: root.style === "classic" ? 8 : handWidth + + radius: root.style === "classic" ? 2 : handWidth / 2 + color : root.style === "stroke" ? "transparent" : root.color + + border.color: root.color + border.width: 4 + + Behavior on x { + animation: Appearance.animation.elementResize.numberAnimation.createObject(this) + } + } +} diff --git a/.config/quickshell/ii/modules/background/cookieClock/MinuteHand.qml b/.config/quickshell/ii/modules/background/cookieClock/MinuteHand.qml new file mode 100644 index 000000000..17d7b7c65 --- /dev/null +++ b/.config/quickshell/ii/modules/background/cookieClock/MinuteHand.qml @@ -0,0 +1,51 @@ +pragma ComponentBehavior: Bound + +import qs +import qs.services +import qs.modules.common +import qs.modules.common.widgets +import qs.modules.common.functions +import QtQuick + +Item { + id: root + anchors.fill: parent + + required property int clockMinute + property real handWidth: 16 + property string style: "medium" + property color color: Appearance.colors.colSecondary + + z: root.style === "thin" ? 1 : 3 + rotation: -90 + (360 / 60) * root.clockMinute + opacity: root.style === "hide" ? 0.0 : 1.0 + + Behavior on rotation{ + animation: Appearance.animation.elementResize.numberAnimation.createObject(this) + } + Behavior on opacity { + animation: Appearance.animation.elementResize.numberAnimation.createObject(this) + } + + Rectangle { + anchors.verticalCenter: parent.verticalCenter + x: { + let position = parent.width / 2 - root.handWidth / 2; + if (root.style === "classic") position -= 15; + return position; + } + width: minuteHandLength + height: root.handWidth + + radius: root.style === "classic" ? 2 : root.handWidth / 2 + color: root.color + + Behavior on height { + animation: Appearance.animation.elementResize.numberAnimation.createObject(this) + } + + Behavior on x { + animation: Appearance.animation.elementResize.numberAnimation.createObject(this) + } + } +}