import QtQuick 2.0
import SddmComponents 2.0

Rectangle {
    id: root
    width: 1920
    height: 1080
    color: config.backgroundColor || "#18141f"

    property int sessionIndex: session.index
    property color accent: config.accent || "#f38ba8"
    property color accent2: config.accent2 || "#cba6f7"
    property color backgroundColor: config.backgroundColor || "#18141f"
    property color panelColor: config.panelColor || "#313244"
    property color foreground: config.foreground || "#f5e0dc"
    property color muted: config.muted || "#cdd6f4"
    property color selectedText: config.selectedText || "#11111b"
    property string themeName: config.themeName || "Rose Night"

    TextConstants { id: textConstants }

    Connections {
        target: sddm

        function onLoginSucceeded() {
            message.text = textConstants.loginSucceeded
            message.color = accent2
        }

        function onLoginFailed() {
            password.text = ""
            message.text = textConstants.loginFailed
            message.color = "#f38ba8"
        }

        function onInformationMessage(text) {
            message.text = text
            message.color = "#f38ba8"
        }
    }

    Background {
        anchors.fill: parent
        source: config.background || ""
        fillMode: Image.PreserveAspectCrop
        onStatusChanged: {
            if (status === Image.Error) {
                source = ""
            }
        }
    }

    Rectangle {
        anchors.fill: parent
        color: "#000000"
        opacity: 0.42
    }

    Rectangle {
        anchors.fill: parent
        gradient: Gradient {
            GradientStop { position: 0.0; color: Qt.rgba(0, 0, 0, 0.10) }
            GradientStop { position: 0.58; color: Qt.rgba(0, 0, 0, 0.38) }
            GradientStop { position: 1.0; color: Qt.rgba(0, 0, 0, 0.62) }
        }
    }

    Timer {
        interval: 1000
        running: true
        repeat: true
        triggeredOnStart: true
        onTriggered: {
            clock.text = Qt.formatDateTime(new Date(), "HH:mm")
            date.text = Qt.formatDateTime(new Date(), "dddd, dd. MMMM yyyy")
        }
    }

    Column {
        anchors.left: parent.left
        anchors.leftMargin: Math.max(42, parent.width * 0.055)
        anchors.top: parent.top
        anchors.topMargin: Math.max(40, parent.height * 0.055)
        spacing: 2

        Text {
            id: clock
            color: foreground
            font.pixelSize: Math.max(64, root.height * 0.105)
            font.weight: Font.Light
        }

        Text {
            id: date
            color: muted
            opacity: 0.88
            font.pixelSize: Math.max(16, root.height * 0.023)
        }
    }

    Rectangle {
        id: panel
        width: Math.min(430, root.width - 48)
        height: 430
        anchors.right: parent.right
        anchors.rightMargin: Math.max(28, parent.width * 0.075)
        anchors.verticalCenter: parent.verticalCenter
        radius: 18
        color: panelColor
        opacity: 0.90
        border.color: accent
        border.width: 1

        Rectangle {
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.top: parent.top
            height: 4
            radius: 2
            gradient: Gradient {
                GradientStop { position: 0.0; color: accent }
                GradientStop { position: 1.0; color: accent2 }
            }
        }

        Column {
            anchors.fill: parent
            anchors.margins: 34
            spacing: 14

            Text {
                text: sddm.hostName
                color: foreground
                font.pixelSize: 26
                font.bold: true
                elide: Text.ElideRight
                width: parent.width
            }

            Text {
                text: themeName
                color: accent
                font.pixelSize: 14
                width: parent.width
                opacity: 0.92
            }

            Item { width: 1; height: 10 }

            Text {
                text: "Benutzer"
                color: muted
                font.pixelSize: 12
                opacity: 0.78
            }

            TextBox {
                id: username
                width: parent.width
                height: 42
                text: userModel.lastUser
                color: backgroundColor
                borderColor: Qt.rgba(accent.r, accent.g, accent.b, 0.40)
                focusColor: accent
                hoverColor: accent2
                textColor: foreground
                radius: 10
                font.pixelSize: 16
                KeyNavigation.tab: password
            }

            Text {
                text: "Passwort"
                color: muted
                font.pixelSize: 12
                opacity: 0.78
            }

            PasswordBox {
                id: password
                width: parent.width
                height: 42
                color: backgroundColor
                borderColor: Qt.rgba(accent.r, accent.g, accent.b, 0.40)
                focusColor: accent
                hoverColor: accent2
                textColor: foreground
                radius: 10
                font.pixelSize: 16
                KeyNavigation.backtab: username
                KeyNavigation.tab: loginButton

                Keys.onPressed: function(event) {
                    if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
                        sddm.login(username.text, password.text, sessionIndex)
                        event.accepted = true
                    }
                }
            }

            ComboBox {
                id: session
                width: parent.width
                height: 36
                model: sessionModel
                index: sessionModel.lastIndex
                color: backgroundColor
                borderColor: Qt.rgba(accent.r, accent.g, accent.b, 0.40)
                focusColor: accent
                hoverColor: accent2
                menuColor: panelColor
                textColor: foreground
                arrowColor: accent
                arrowIcon: "angle-down.png"
                KeyNavigation.backtab: password
                KeyNavigation.tab: loginButton
            }

            Button {
                id: loginButton
                width: parent.width
                height: 44
                text: "Anmelden"
                color: accent
                activeColor: accent2
                pressedColor: accent2
                disabledColor: muted
                borderColor: accent2
                textColor: selectedText
                font.pixelSize: 15
                onClicked: sddm.login(username.text, password.text, sessionIndex)
                KeyNavigation.backtab: session
                KeyNavigation.tab: shutdownButton
            }

            Text {
                id: message
                width: parent.width
                color: muted
                text: ""
                font.pixelSize: 13
                wrapMode: Text.WordWrap
                horizontalAlignment: Text.AlignHCenter
            }
        }
    }

    Row {
        anchors.right: parent.right
        anchors.rightMargin: Math.max(28, parent.width * 0.075)
        anchors.bottom: parent.bottom
        anchors.bottomMargin: Math.max(26, parent.height * 0.045)
        spacing: 10

        Button {
            id: shutdownButton
            text: "Ausschalten"
            color: Qt.rgba(0, 0, 0, 0.42)
            activeColor: accent
            pressedColor: accent2
            borderColor: Qt.rgba(foreground.r, foreground.g, foreground.b, 0.35)
            textColor: foreground
            onClicked: sddm.powerOff()
            KeyNavigation.tab: rebootButton
        }

        Button {
            id: rebootButton
            text: "Neustart"
            color: Qt.rgba(0, 0, 0, 0.42)
            activeColor: accent
            pressedColor: accent2
            borderColor: Qt.rgba(foreground.r, foreground.g, foreground.b, 0.35)
            textColor: foreground
            onClicked: sddm.reboot()
            KeyNavigation.backtab: shutdownButton
        }
    }
}