bar/TimeDate.qml


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133

import QtQuick
import QtQuick.Layouts

import qs.services as Services
import qs.components
import qs.config

Item {
    id: root

    property bool isAlt: false
    property bool isCollapsed: false

    implicitWidth: container.implicitWidth
    implicitHeight: container.implicitHeight - General.rectMargin
    IRect {
        id: container
        anchors {
            fill: parent
            centerIn: parent
        }

        // implicitWidth: !isAlt ? nonAlt.implicitWidth + General.rectMargin * 2 : alt.implicitWidth + General.rectMargin * 2
        implicitWidth: layout.width + General.rectMargin * 2
        implicitHeight: Bar.height

        color: Colors.accent
        radius: Style.rounding.large

        RowLayout {
            id: layout
            anchors.centerIn: parent
            spacing: Bar.resourceIconTextSpacing
            Loader {
                sourceComponent: !root.isAlt ? main : alt
                readonly property Component main: Component {
                    RowLayout {
                        id: root
                        property int h: Services.TimeDate.hours
                        property int m: Services.TimeDate.minutes
                        property int s: Services.TimeDate.seconds

                        Item {
                            Layout.fillWidth: true
                        }
                        anchors.centerIn: parent
                        spacing: Bar.resourceIconTextSpacing

                        Icon {
                            text: Icons.resource.clock[root.h - 1]
                            font.pixelSize: Style.font.size.larger
                        }
                        RowLayout {
                            spacing: 0
                            IText {
                                animate: true
                                text: (root.h >= 10 ? "" : "0") + root.h
                            }
                            IText {
                                text: ":"
                                renderType: Text.CurveRendering
                            }
                            IText {
                                animate: true
                                text: (root.m >= 10 ? "" : "0") + root.m
                            }
                            IText {
                                text: ":"
                                renderType: Text.CurveRendering
                            }
                            IText {
                                animate: true
                                text: (root.s >= 10 ? "" : "0") + root.s
                                renderType: Text.QtRendering // it's not static and is rapidly updated
                            }
                        }
                        Item {
                            Layout.fillWidth: true
                        }
                        SequentialAnimation {
                            running: true
                            NumberAnimation {
                                target: parent
                                property: "opacity"
                                from: 0
                                to: 1
                                duration: General.animationDuration / 2
                            }
                        }
                    }
                }
                readonly property Component alt: Component {
                    RowLayout {
                        Item {
                            Layout.fillWidth: true
                        }
                        anchors.centerIn: parent
                        spacing: Bar.resourceIconTextSpacing

                        Icon {
                            text: Icons.resource.calendar
                            font.pixelSize: Style.font.size.larger
                        }
                        IText {
                            animate: true
                            text: Services.TimeDate.date
                        }
                        Item {
                            Layout.fillWidth: true
                        }
                        SequentialAnimation {
                            running: true
                            NumberAnimation {
                                target: parent
                                property: "opacity"
                                from: 0
                                to: 1
                                duration: General.animationDuration / 2
                            }
                        }
                    }
                }
            }
        }
    }
    MouseArea {
        anchors.fill: parent
        cursorShape: Qt.PointingHandCursor
        onPressed: {
            root.isAlt = !root.isAlt;
        }
    }
}