import QtQuick
import "../services" as S

Item {
    id: root

    required property real screenHeight

    opacity: 0
    property real _slideX: -80

    NumberAnimation on opacity {
        to: 1
        duration: 400
        easing.type: Easing.OutCubic
    }
    NumberAnimation on _slideX {
        to: 0
        duration: 500
        easing.type: Easing.OutCubic
    }

    transform: Translate {
        x: root._slideX
    }

    Column {
        anchors.centerIn: parent
        spacing: 8
        rotation: -90
        transformOrigin: Item.Center

        Text {
            id: _clockText
            text: Qt.formatTime(new Date(), "HH:mm")
            color: S.Theme.base05
            font.pixelSize: Math.max(48, root.screenHeight * 0.28)
            font.family: S.Theme.fontFamily
            font.bold: true

            Timer {
                interval: 1000
                running: true
                repeat: true
                onTriggered: parent.text = Qt.formatTime(new Date(), "HH:mm")
            }
        }

        Text {
            text: Qt.formatDate(new Date(), "dddd, d MMMM")
            color: S.Theme.base04
            font.pixelSize: S.Theme.fontSize + 2
            font.family: S.Theme.fontFamily

            Timer {
                interval: 60000
                running: true
                repeat: true
                onTriggered: parent.text = Qt.formatDate(new Date(), "dddd, d MMMM")
            }
        }
    }

    implicitWidth: _clockText.height
}