summaryrefslogtreecommitdiff
path: root/components
diff options
context:
space:
mode:
author2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>2025-09-13 15:50:04 +1000
committer2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>2025-09-13 15:50:04 +1000
commit98a709af78b4d3e7a41f40526d9ac0f99608e36f (patch)
treebb2a2b29784fd104e9ff731467b9ea33a834166a /components
parentplugin: refactor into modules (diff)
downloadcaelestia-shell-98a709af78b4d3e7a41f40526d9ac0f99608e36f.tar.gz
caelestia-shell-98a709af78b4d3e7a41f40526d9ac0f99608e36f.tar.bz2
caelestia-shell-98a709af78b4d3e7a41f40526d9ac0f99608e36f.zip
plugin/managers: add CircularIndicatorManager
Basically move StyledBusyIndicator -> CircularIndicator + logic for it from js -> c++
Diffstat (limited to 'components')
-rw-r--r--components/controls/CircularIndicator.qml108
-rw-r--r--components/controls/CircularProgress.qml9
-rw-r--r--components/controls/StyledBusyIndicator.qml151
3 files changed, 111 insertions, 157 deletions
diff --git a/components/controls/CircularIndicator.qml b/components/controls/CircularIndicator.qml
new file mode 100644
index 0000000..cbf300a
--- /dev/null
+++ b/components/controls/CircularIndicator.qml
@@ -0,0 +1,108 @@
+import ".."
+import qs.services
+import qs.config
+import Caelestia.Managers
+import QtQuick
+import QtQuick.Templates
+
+BusyIndicator {
+ id: root
+
+ enum AnimType {
+ Advance = 0,
+ Retreat
+ }
+
+ enum AnimState {
+ Stopped,
+ Running,
+ Completing
+ }
+
+ property real implicitSize: Appearance.font.size.normal * 3
+ property real strokeWidth: Appearance.padding.small * 0.8
+ property color fgColour: Colours.palette.m3primary
+ property color bgColour: Colours.palette.m3secondaryContainer
+
+ property alias type: manager.indeterminateAnimationType
+ readonly property alias progress: manager.progress
+
+ property real internalStrokeWidth: strokeWidth
+ property int animState
+
+ padding: 0
+ implicitWidth: implicitSize
+ implicitHeight: implicitSize
+
+ Component.onCompleted: {
+ if (running) {
+ running = false;
+ running = true;
+ }
+ }
+
+ onRunningChanged: {
+ if (running) {
+ manager.completeEndProgress = 0;
+ animState = CircularIndicator.Running;
+ } else {
+ if (animState == CircularIndicator.Running)
+ animState = CircularIndicator.Completing;
+ }
+ }
+
+ states: State {
+ name: "stopped"
+ when: !root.running
+
+ PropertyChanges {
+ root.opacity: 0
+ root.internalStrokeWidth: root.strokeWidth / 3
+ }
+ }
+
+ transitions: Transition {
+ Anim {
+ properties: "opacity,internalStrokeWidth"
+ duration: manager.completeEndDuration * Appearance.anim.durations.scale
+ }
+ }
+
+ contentItem: CircularProgress {
+ anchors.fill: parent
+ strokeWidth: root.internalStrokeWidth
+ fgColour: root.fgColour
+ bgColour: root.bgColour
+ padding: root.padding
+ rotation: manager.rotation
+ startAngle: manager.startFraction * 360
+ value: manager.endFraction - manager.startFraction
+ }
+
+ CircularIndicatorManager {
+ id: manager
+ }
+
+ NumberAnimation {
+ running: root.animState !== CircularIndicator.Stopped
+ loops: Animation.Infinite
+ target: manager
+ property: "progress"
+ from: 0
+ to: 1
+ duration: manager.duration * Appearance.anim.durations.scale
+ }
+
+ NumberAnimation {
+ running: root.animState === CircularIndicator.Completing
+ target: manager
+ property: "completeEndProgress"
+ from: 0
+ to: 1
+ duration: manager.completeEndDuration * Appearance.anim.durations.scale
+ onFinished: {
+ if (root.animState === CircularIndicator.Completing)
+ root.animState = CircularIndicator.Stopped;
+ }
+ }
+}
diff --git a/components/controls/CircularProgress.qml b/components/controls/CircularProgress.qml
index 209d53b..a15cd90 100644
--- a/components/controls/CircularProgress.qml
+++ b/components/controls/CircularProgress.qml
@@ -1,3 +1,4 @@
+import ".."
import qs.services
import qs.config
import QtQuick
@@ -38,10 +39,8 @@ Shape {
}
Behavior on strokeColor {
- ColorAnimation {
+ CAnim {
duration: Appearance.anim.durations.large
- easing.type: Easing.BezierSpline
- easing.bezierCurve: Appearance.anim.curves.standard
}
}
}
@@ -62,10 +61,8 @@ Shape {
}
Behavior on strokeColor {
- ColorAnimation {
+ CAnim {
duration: Appearance.anim.durations.large
- easing.type: Easing.BezierSpline
- easing.bezierCurve: Appearance.anim.curves.standard
}
}
}
diff --git a/components/controls/StyledBusyIndicator.qml b/components/controls/StyledBusyIndicator.qml
deleted file mode 100644
index 9fd1c3e..0000000
--- a/components/controls/StyledBusyIndicator.qml
+++ /dev/null
@@ -1,151 +0,0 @@
-import ".."
-import qs.services
-import qs.config
-import QtQuick
-import QtQuick.Controls
-
-BusyIndicator {
- id: root
-
- property real implicitSize: Appearance.font.size.normal * 3
- property real strokeWidth: Appearance.padding.small
- property color fgColour: Colours.palette.m3primary
- property color bgColour: Colours.palette.m3secondaryContainer
-
- property real internalStrokeWidth: strokeWidth
- property string animState
-
- padding: 0
- implicitWidth: implicitSize
- implicitHeight: implicitSize
-
- onRunningChanged: {
- if (running) {
- updater.completeEndProgress = 0;
- animState = "running";
- } else {
- if (animState == "running")
- animState = "completing";
- }
- }
-
- states: State {
- name: "stopped"
- when: !root.running
-
- PropertyChanges {
- root.opacity: 0
- root.internalStrokeWidth: root.strokeWidth / 3
- }
- }
-
- transitions: Transition {
- Anim {
- properties: "opacity,internalStrokeWidth"
- duration: updater.completeEndDuration
- }
- }
-
- background: null
-
- contentItem: CircularProgress {
- anchors.fill: parent
- strokeWidth: root.internalStrokeWidth
- fgColour: root.fgColour
- bgColour: root.bgColour
- padding: root.padding
- startAngle: updater.startFraction * 360
- value: updater.endFraction - updater.startFraction
- }
-
- Updater {
- id: updater
- }
-
- NumberAnimation {
- running: root.animState !== "stopped"
- loops: Animation.Infinite
- target: updater
- property: "progress"
- from: 0
- to: 1
- duration: updater.duration
- }
-
- NumberAnimation {
- running: root.animState === "completing"
- target: updater
- property: "completeEndProgress"
- from: 0
- to: 1
- duration: updater.completeEndDuration
- onFinished: {
- if (root.animState === "completing")
- root.animState = "stopped";
- }
- }
-
- component Updater: QtObject {
- readonly property int duration: 5400 * Appearance.anim.durations.scale
- readonly property int expandDuration: 667 * Appearance.anim.durations.scale
- readonly property int collapseDuration: 667 * Appearance.anim.durations.scale
- readonly property int completeEndDuration: 333 * Appearance.anim.durations.scale
- readonly property int tailDegOffset: -20
- readonly property int extraDegPerCycle: 250
- readonly property int constantRotDeg: 1520
- readonly property list<int> expandDelay: [0, 1350, 2700, 4050].map(d => d * Appearance.anim.durations.scale)
- readonly property list<int> collapseDelay: [667, 2017, 3367, 4717].map(d => d * Appearance.anim.durations.scale)
-
- property real progress: 0
- property real startFraction: 0
- property real endFraction: 0
- property real rotation: 0
- property real completeEndProgress: 0
-
- onProgressChanged: update(progress)
-
- function update(p: real): void {
- const playtime = p * duration;
- let startDeg = constantRotDeg * p + tailDegOffset;
- let endDeg = constantRotDeg * p;
-
- for (let i = 0; i < 4; i++) {
- const expandFraction = getFractionInRange(playtime, expandDelay[i], expandDuration);
- endDeg += fastOutSlowIn(expandFraction) * extraDegPerCycle;
-
- const collapseFraction = getFractionInRange(playtime, collapseDelay[i], collapseDuration);
- startDeg += fastOutSlowIn(collapseFraction) * extraDegPerCycle;
- }
-
- // Gap closing
- startDeg += (endDeg - startDeg) * completeEndProgress;
-
- startFraction = startDeg / 360;
- endFraction = endDeg / 360;
- }
-
- function getFractionInRange(currentTime: real, delay: int, duration: int): real {
- if (currentTime < delay)
- return 0;
- if (currentTime > delay + duration)
- return 1;
- return (currentTime - delay) / duration;
- }
-
- function lerp(a: real, b: real, t: real): real {
- return a + (b - a) * t;
- }
-
- function cubic(a: real, b: real, c: real, d: real, t: real): real {
- return ((1 - t) ** 3) * a + 3 * ((1 - t) ** 2) * t * b + 3 * (1 - t) * (t ** 2) * c + (t ** 3) * d;
- }
-
- function cubicBezier(p1x: real, p1y: real, p2x: real, p2y: real, t: real): real {
- return cubic(0, p1y, p2y, 1, t);
- }
-
- function fastOutSlowIn(t: real): real {
- return cubicBezier(0.4, 0.0, 0.2, 1.0, t);
- }
- }
-}