nClocks/text_clock.qml

import QtQuick 2.12

import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import QtGraphicalEffects 1.0

import NERvGear 1.0 as NVG
import NERvGear.Templates 1.0 as T
import NERvGear.Preferences 1.0 as P



T.Widget {
    id: widget
    solid: true
    title: qsTr("Text Clock")
    resizable: true

    property real day: 1
    property real hours: 0
    property string minutes: ""
    property string seconds: ""

    readonly property string hlight_color: widget.settings.styles["HighLight Color"]
    readonly property string normal_color: widget.settings.styles["Normal Color"]
    readonly property string rfulltext: "<font color='{0}'>IT</font>A<font color='{1}'>IS</font>SL" + ((day===5) ? "TGIF" : "GTFI") + "<br>" +
                                        "FJLVZG<font color='{2}'>ABOUT</font><br>" +
                                        "AC<font color='{3}'>QUARTER</font>BS<br>" +
                                        "<font color='{4}'>TWENTY</font><font color='{5}'>FIVE</font>X<br>" +
                                        "<font color='{6}'>HALF</font>B<font color='{7}'>TEN</font>F<font color='{8}'>TO</font><br>" +
                                        "<font color='{9}'>PAST</font>ERU<font color='{10}'>NINE</font><br>" +
                                        "<font color='{11}'>ONE</font><font color='{12}'>SIX</font><font color='{13}'>THREE</font><br>" +
                                        "<font color='{14}'>FOUR</font><font color='{15}'>FIVE</font><font color='{16}'>TWO</font><br>" +
                                        "<font color='{17}'>EIGHT</font><font color='{18}'>ELEVEN</font><br>" +
                                        "<font color='{19}'>SEVEN</font>T<font color='{20}'>NOON</font>E<br>" +
                                        "<font color='{21}'>TEN</font>SE<font color='{22}'>OCLOCK</font><br>" +
                                        "A<font color='{23}'>MIDNIGHT</font>VW<br>"


    property var rcolors: [hlight_color, hlight_color, hlight_color, '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '']
    readonly property var rcindex: {"M15": 3, "M20": 4, "M5": 5, "M30": 6, "M10": 7, "TO": 8, "PAST": 9,
                                    "9": 10, "1": 11, "13": 11, "6": 12, "3": 13, "4": 14, "5": 15, "2": 16,
                                    "8": 17, "11": 18, "23": 18, "7": 19, "12": 20, "10": 21, "OCLOCK": 22, "0": 23, "24": 23}

    readonly property var fonts: Qt.fontFamilies()
    readonly property var fontweight: [Font.Light, Font.Normal, Font.DemiBold, Font.Bold, Font.Black]
    readonly property var sfontweight: ["Light", "Normal", "DemiBold", "Bold", "Black"]

    function stringFormat(rtext, format) {
        if (!rtext)
            return null;
        var str = rtext;
        for (var i = 0; i < format.length; i++)
        {
            var re = new RegExp('\\{' + i + '\\}', 'gm');
            str = str.replace(re, format[i]);
        }
        return str;
    }

    function clearHLColors() {
        for(let i=3; i<24; i++) {
            rcolors[i] = "";
        }
    }

    function updateHLColors(){
        for(let i=0; i<arguments.length; i++) {
            if(rcindex[arguments[i]])
                rcolors[rcindex[arguments[i]]] = hlight_color;
        }
    }

    Text {
        id: main
        color: widget.settings.styles["Normal Color"]
        text: ""

        anchors.centerIn: parent
        font.pointSize: widget.settings.styles["Font Size"]
        font.weight: fontweight[widget.settings.styles["Font Weight"]]
        font.family: fonts[widget.settings.styles["Font Name"]]
        lineHeight: widget.settings.styles["Line Height"]
        font.letterSpacing: widget.settings.styles["Letter Space"]
    }

    Timer {
        interval: 1000
        repeat: true
        running: widget.NVG.View.exposed
        onTriggered: {
            var newDate = new Date();
            day = newDate.getDay();
            hours = newDate.getHours();
            minutes = newDate.getMinutes().toString();
            seconds = newDate.getSeconds().toString();

            if (hours > 12 && hours !== 23) {
                hours = hours - 12;
            }

            if (minutes < 10) {
                minutes = 0 + minutes;
            }
            if (seconds < 10) {
                seconds = 0 + seconds;
            }

            var minsSecs = minutes + seconds;
            if (minsSecs > 3230) {
                hours++;
            }

            clearHLColors();
            updateHLColors(hours);

            if ((minsSecs >= 5730 && minsSecs < 6000) || (minsSecs >= 0 && minsSecs < 230)) {
                if (hours !== 24 && hours !== 0) {
                    updateHLColors("OCLOCK");
                }
            } else if (minsSecs >= 230 && minsSecs < 730) {
                updateHLColors("M5","PAST");
            } else if (minsSecs >= 730 && minsSecs < 1230) {
                updateHLColors("M10", "PAST");
            } else if (minsSecs >= 1230 && minsSecs < 1730) {
                updateHLColors("M15","PAST");
            } else if (minsSecs >= 1730 && minsSecs < 2230) {
                updateHLColors("M20", "PAST");
            } else if (minsSecs >= 2230 && minsSecs < 2730) {
                updateHLColors("M20", "M5", "PAST");
            } else if (minsSecs >= 2730 && minsSecs < 3230) {
                updateHLColors("M30", "PAST");
            } else if (minsSecs >= 3230 && minsSecs < 3730) {
                updateHLColors("M20", "M5", "TO");
            } else if (minsSecs >= 3730 && minsSecs < 4230) {
                updateHLColors("M20", "TO");
            } else if (minsSecs >= 4230 && minsSecs < 4730) {
                updateHLColors("M15", "TO");
            } else if (minsSecs >= 4730 && minsSecs < 5230) {
                updateHLColors("M10", "TO");
            } else if (minsSecs >= 5230 && minsSecs < 5730) {
                updateHLColors("M5", "TO");
            }
            main.text = stringFormat(rfulltext, rcolors);
        }
    }

    menu: Menu {
        Action {
            text: qsTr("Settings") + "..."
            onTriggered: styleDialog.active = true
        }
    }

    Loader {
        id: styleDialog
        active: false
        sourceComponent: NVG.Window {
            id: window
            title: qsTr("Clock Settings")
            visible: true
            minimumWidth: 380
            minimumHeight: 580
            maximumWidth: minimumWidth
            maximumHeight: minimumHeight
            width: minimumWidth
            height: minimumHeight

            transientParent: widget.NVG.View.window

            property var configuration

            ColumnLayout {
                id: root
                anchors.fill: parent
                anchors.margins: 16
                anchors.topMargin: 0

                Row {
                    spacing: 234

                    ToolButton {
                        text: qsTr("Save")
                        onClicked: {
                            configuration = rootPreference.save();
                            widget.settings.styles = configuration;
                            styleDialog.active = false;
                        }
                    }

                    ToolButton {
                        text: qsTr("Reset")
                        onClicked: {
                            rootPreference.load();
                            let cfg = rootPreference.save();
                            widget.settings.styles = cfg;
                        }
                    }
                }

                Label {
                    Layout.alignment: Qt.AlignCenter
                    text: qsTr("Settings")
                    font.pixelSize: 24
                }

                Flickable {
                    Layout.fillWidth: true
                    Layout.fillHeight: true

                    clip: true
                    contentWidth: preferenceLayout.implicitWidth
                    contentHeight: preferenceLayout.implicitHeight

                    ColumnLayout {
                        id: preferenceLayout
                        width: root.width

                        P.PreferenceGroup {
                            id: rootPreference
                            Layout.fillWidth: true

                            label: qsTr("Configuration")

                            onPreferenceEdited: {
                                widget.settings.styles = rootPreference.save();
                            }

                            P.SelectPreference {
                                name: "Font Name"
                                label: qsTr("Font Style")
                                icon.name: "solid:\uf1fc"
                                defaultValue: 408
                                model: fonts
                            }

                            P.SelectPreference {
                                name: "Font Weight"
                                label: qsTr("Font Weight")
                                icon.name: "solid:\uf1fc"
                                defaultValue: 0
                                model: sfontweight
                            }

                            P.ColorPreference {
                                name: "HighLight Color"
                                label: qsTr("HighLight Color")
                                defaultValue: "#FFF"
                            }

                            P.ColorPreference {
                                name: "Normal Color"
                                label: qsTr("Normal Color")
                                defaultValue: "#333333"
                            }

                            P.SliderPreference {
                                name: "Font Size"
                                label: qsTr("Font Size")
                                from: 1
                                to: 40
                                stepSize: 1
                                defaultValue: 20
                                displayValue: value
                            }

                            P.SliderPreference {
                                name: "Letter Space"
                                label: qsTr("Letter Space")
                                from: 1
                                to: 40
                                stepSize: 1
                                defaultValue: 20
                                displayValue: value
                            }

                            P.SliderPreference {
                                name: "Line Height"
                                label: qsTr("Line Spacing")
                                from: 0.8
                                to: 2
                                stepSize: 0.1
                                defaultValue: 1.5
                                displayValue: value.toFixed(1)
                            }

                            Component.onCompleted: {
                                if(!widget.settings.styles) {
                                    configuration = rootPreference.save();
                                    widget.settings.styles = configuration;
                                }
                                rootPreference.load(widget.settings.styles);
                                configuration = widget.settings.styles;
                            }
                        }
                    }
                }
            }

            onClosing: {
                widget.settings.styles = configuration;
                styleDialog.active = false;
            }
        }
    }

    Component.onCompleted: {
        if (!widget.settings.styles) {
            widget.settings.styles = {"Font Name": fonts.length-1, "Font Weight": 0, "Normal Color": "#333333", "HighLight Color": "#FFF", "Font Size": 20, "Letter Space": 20, "Line Height": 1.5};
        }
    }
}