sddm-theme/theme/Main.qml

/***************************************************************************
 * Copyright (c) 2013 Abdurrahman AVCI <abdurrahmanavci@gmail.com>
 *
 * Permission is hereby granted, free of charge, to any person
 * obtaining a copy of this software and associated documentation
 * files (the "Software"), to deal in the Software without restriction,
 * including without limitation the rights to use, copy, modify, merge,
 * publish, distribute, sublicense, and/or sell copies of the Software,
 * and to permit persons to whom the Software is furnished to do so,
 * subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included
 * in all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
 * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
 * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR
 * OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
 * ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE
 * OR OTHER DEALINGS IN THE SOFTWARE.
 *
 ***************************************************************************/

 import QtQuick 2.0
 import SddmComponents 2.0

 Rectangle {
	id: container
	width: 640
	height: 480
	color: "#282828"

	LayoutMirroring.enabled: Qt.locale().textDirection == Qt.RightToLeft
	LayoutMirroring.childrenInherit: true

	property int sessionIndex: session.index

	TextConstants { id: textConstants }

	Connections {
		target: sddm
		function onLoginSucceeded() {
			errorMessage.color = "#83a598"
			errorMessage.text = textConstants.loginSucceeded
		}
		function onLoginFailed() {
			password.text = ""
			errorMessage.color = "#fb4934"
			errorMessage.text = textConstants.loginFailed
		}
		function onInformationMessage(message) {
			errorMessage.color = "#fb4934"
			errorMessage.text = message
		}
	}

	// Background
	Rectangle {
		anchors.fill: parent
		color: "transparent"
		//visible: primaryScreen

		// Display an unobtrusive clock in the corner
		Clock {
			id: clock
			anchors.margins: 64
			anchors.bottom: parent.bottom; anchors.right: parent.right
			color: "#cc32302f"
			timeFont.family: "IBM Plex Sans"
		}

		// Within that bg, we have a login box with everything in it
		Rectangle {
			id: rectangle
			anchors.centerIn: parent
			width: Math.max(600, mainColumn.implicitWidth + 50)
			height: Math.max(800, mainColumn.implicitHeight + 50)
			color: "#cc32302f"
			radius: 8

			// Lay out everything within as a column
			Column {
				id: mainColumn
				anchors.centerIn: parent
				spacing: 12

				// This column contains the UN field
				Column {
					width: parent.width
					spacing: 4
					Text {
						id: lblName
						color: "#ebdbb2"
						width: parent.width
						text: textConstants.userName
						font.pixelSize: 12
					}

					TextBox {
						id: name
						width: parent.width; height: 30
						text: userModel.lastUser
						font.pixelSize: 14

						KeyNavigation.backtab: rebootButton; KeyNavigation.tab: password

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

				Column {
					width: parent.width
					spacing : 4
					Text {
						id: lblPassword
						color: "#ebdbb2"
						width: parent.width
						text: textConstants.password
						font.pixelSize: 12
					}

					PasswordBox {
						id: password
						width: parent.width; height: 30
						font.pixelSize: 14

						KeyNavigation.backtab: name; KeyNavigation.tab: session

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

				Row {
					spacing: 4
					width: parent.width / 2
					z: 100

					Column {
						z: 100
						width: parent.width * 1.3
						spacing : 4
						anchors.bottom: parent.bottom

						Text {
							id: lblSession
							color: "#ebdbb2"
							width: parent.width
							text: textConstants.session
							wrapMode: TextEdit.WordWrap
							font.pixelSize: 12
						}

						ComboBox {
							id: session
							width: parent.width; height: 30
							font.pixelSize: 14

							arrowIcon: Qt.resolvedUrl("angle-down.png")

							model: sessionModel
							index: sessionModel.lastIndex

							KeyNavigation.backtab: password; KeyNavigation.tab: layoutBox
						}
					}

					Column {
						z: 101
						width: parent.width * 0.7
						spacing : 4
						anchors.bottom: parent.bottom

						visible: keyboard.enabled && keyboard.layouts.length > 0

						Text {
							id: lblLayout
							color: "#ebdbb2"
							width: parent.width
							text: textConstants.layout
							wrapMode: TextEdit.WordWrap
							font.pixelSize: 12
						}

						LayoutBox {
							id: layoutBox
							width: parent.width; height: 30
							font.pixelSize: 14

							arrowIcon: Qt.resolvedUrl("angle-down.png")

							KeyNavigation.backtab: session; KeyNavigation.tab: loginButton
						}
					}
				}

				Column {
					width: parent.width
					Text {
						id: errorMessage
						color: "#ebdbb2"
						anchors.horizontalCenter: parent.horizontalCenter
						text: textConstants.prompt
						font.pixelSize: 10
					}
				}

				Row {
					spacing: 4
					anchors.horizontalCenter: parent.horizontalCenter
					property int btnWidth: Math.max(loginButton.implicitWidth,
					shutdownButton.implicitWidth,
					rebootButton.implicitWidth, 80) + 8
					Button {
						id: loginButton
						text: textConstants.login
						width: parent.btnWidth
						radius: 8

						onClicked: sddm.login(name.text, password.text, sessionIndex)

						KeyNavigation.backtab: layoutBox; KeyNavigation.tab: shutdownButton
					}

					Button {
						id: shutdownButton
						text: textConstants.shutdown
						width: parent.btnWidth
						radius: 8

						onClicked: sddm.powerOff()

						KeyNavigation.backtab: loginButton; KeyNavigation.tab: rebootButton
					}

					Button {
						id: rebootButton
						text: textConstants.reboot
						width: parent.btnWidth
						radius: 8

						onClicked: sddm.reboot()

						KeyNavigation.backtab: shutdownButton; KeyNavigation.tab: name
					}
				}
			}
		}
	}

	Component.onCompleted: {
		if (name.text == "")
		name.focus = true
		else
		password.focus = true
	}
 }