super-earth-sddm/Main.qml

/*
    SPDX-FileCopyrightText: 2016 David Edmundson <davidedmundson@kde.org>

    SPDX-License-Identifier: LGPL-2.0-or-later
*/

import QtQuick
import QtQuick.Layouts
import QtQuick.Controls

Item {
    id: mainStack
    property bool usingCustomUser: false
    property bool attemptingToLogin: false

    // Background Image
    Image {
        id: sceneImageBackground
        source: "background.png"
        anchors.fill: parent
        sourceSize: Qt.size(parent.width, parent.height)
        fillMode: Image.PreserveAspectCrop
        smooth: true;
    }

    // Session
    ComboBox {
        id: session
        model: sessionModel
        currentIndex: sessionModel.lastIndex
        textRole: "name"
        anchors {
            top: parent.top
            left: parent.left
            topMargin: 75
            leftMargin: 10
        }
        height: 50
        background: null
        contentItem: Text {
            text: session.displayText
            color: "#FFFFFF"
            font.family: "Rajdhani"
            font.capitalization: Font.AllUppercase
            font.bold: true
            font.pointSize: 30
            verticalAlignment: Text.AlignVCenter
            elide: Text.ElideRight
        }
        indicator: Image {
            id: sessionArrow
            source: "icons/down-arrow.png"
            anchors.verticalCenter: parent.verticalCenter
            anchors.right: parent.right
            width: 36
            height: 36
            fillMode: Image.PreserveAspectFit
            rotation: session.popup.visible ? 180 : 0
            Behavior on rotation { NumberAnimation { duration: 150; easing.type: Easing.InOutQuad } }
        }
    }

    // User Switcher
    Rectangle {
        anchors {
            top: parent.top
            right: parent.right
            topMargin: 68
            rightMargin: 3
        }
        width: 50
        height: 50
        color: "#FFFFFF"
        opacity: 0
        radius: 5

        MouseArea {
            hoverEnabled: true
            anchors.fill: parent
            onClicked: {
                usingCustomUser = !usingCustomUser
            }
            onEntered: {
                parent.opacity = 0.2
            }
            onExited: {
                parent.opacity = 0
            }
            onPressed: {
                parent.opacity = 0.3
            }
            onReleased: {
                parent.opacity = 0.2
            }
        }
    }

    Image {
        anchors {
            top: parent.top
            right: parent.right
            topMargin: 75
            rightMargin: 10
        }
        source: "icons/user.png"
        width: 36
        height: 36
        fillMode: Image.PreserveAspectFit
    }

    // Text Fields
    ColumnLayout {
        anchors.horizontalCenter: parent.horizontalCenter
        y: 975

        // Username
        Item {
            Layout.preferredHeight: 100
            visible: usingCustomUser

            Image {
                id: usernameBg
                source: "text-field"
                x: -(sourceSize.width / 2)
            }
            TextField {
                id: usernameField
                enabled: !attemptingToLogin
                focus: usingCustomUser
                placeholderText: "Username"
                x: -(usernameBg.sourceSize.width / 2) + 6
                y: 5
                width: 955
                height: 75
                background: null
                font.family: "Rajdhani"
                font.pointSize: 30
                font.bold: true
                color: "#FFFFFF"
                Keys.onEscapePressed: {
                    mainStack.forceActiveFocus();
                }
                onAccepted: {
                    passwordField.forceActiveFocus();
                }
            }
        }

        // Password
        Item {
            Layout.preferredHeight: 100

            Image {
                id: passwordBg
                source: "text-field"
                x: -(sourceSize.width / 2)
            }
            TextField {
                id: passwordField
                enabled: !attemptingToLogin
                focus: !usingCustomUser
                echoMode: TextInput.Password
                placeholderText: "Password"
                x: -(passwordBg.sourceSize.width / 2) + 6
                y: 5
                width: 955
                height: 75
                background: null
                font.family: "Rajdhani"
                font.pointSize: 30
                font.bold: true
                color: "#FFFFFF"
                Keys.onEscapePressed: {
                    mainStack.forceActiveFocus();
                }
                onAccepted: {
                    attemptingToLogin = true
                    var username = usernameField.text
                    if (!usingCustomUser) {
                        username = userModel.lastUser.name
                    }
                    sddm.login(username, passwordField.text, session.index)
                }
            }

            Connections {
                target: sddm
                function onLoginFailed() {
                    passwordField.selectAll()
                    passwordField.forceActiveFocus()
                    attemptingToLogin = false
                }
            }
        }
    }
}