/******************************************************************************
**
** Copyright (C) 2020 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of the Qt Quick Ultralite module.
**
** $QT_BEGIN_LICENSE:COMM$
**
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and The Qt Company. For licensing terms
** and conditions see http://www.qt.io/terms-conditions. For further
** information use the contact form at http://www.qt.io/contact-us.
**
** $QT_END_LICENSE$
**
******************************************************************************/
import QtQuick 2.15
import QtQuickUltralite.Extras 2.0

Column {
    id: root
    height: 90
    width: 50
    property int timeValueHours: 10
    property int timeValueMinutes: 00

    Text
    {
        id: timeInfoMinutesLower
        height: timeInfoMinutesLower.width
        font.pixelSize: 38
        font.family: "Barlow-mono"
        color: Style.white
        text: (root.timeValueMinutes%10).toFixed()
        transform: [
            Rotation {
                origin.x: timeInfoMinutesLower.width / 2
                origin.y: timeInfoMinutesLower.height / 2
                angle: -90
            }
        ]
    }
    Text
    {
        id: timeInfoMinutesUpper
        height: timeInfoMinutesUpper.width
        font.pixelSize: 38
        font.family: "Barlow-mono"
        color: Style.white
        text: ((root.timeValueMinutes-root.timeValueMinutes%10)/10).toFixed()
        transform: [
            Rotation {
                origin.x: timeInfoMinutesUpper.width / 2
                origin.y: timeInfoMinutesUpper.height / 2
                angle: -90
            }
        ]
    }
    StaticText
    {
        id: timeInfoCollon
        height: timeInfoCollon.width
        text: ":"
        font.pixelSize: 38
        font.family: "Barlow-mono"
        color: Style.white
        transform: [
            Rotation {
                origin.x: timeInfoCollon.width / 2
                origin.y: timeInfoCollon.height / 2
                angle: -90
            }
        ]
    }
    Text
    {
        id: timeInfoHoursLower
        height: timeInfoHoursLower.width
        font.pixelSize: 38
        font.family: "Barlow-mono"
        color: Style.white
        text: (root.timeValueHours%10).toFixed()
        transform: [
            Rotation {
                origin.x: timeInfoHoursLower.width / 2
                origin.y: timeInfoHoursLower.height / 2
                angle: -90
            }
        ]
    }
    Text
    {
        id: timeInfoHoursUpper
        height: timeInfoHoursUpper.width
        font.pixelSize: 38
        font.family: "Barlow-mono"
        color: Style.white
        text: ((root.timeValueHours-root.timeValueHours%10)/10).toFixed()
        transform: [
            Rotation {
                origin.x: timeInfoHoursUpper.width / 2
                origin.y: timeInfoHoursUpper.height / 2
                angle: -90
            }
        ]
    }

    Timer {
        interval: 1000*60// 1 minute
        running: true
        repeat: true
        onTriggered: {
            root.timeValueMinutes = (root.timeValueMinutes + 1)%60;
            if (0===root.timeValueMinutes) root.timeValueHours = (root.timeValueHours+1)%24;
            if (0===root.timeValueHours) root.timeValueHours = 10;
        }
    }
}