wifi/ui/ConnectDialog.qml

0001 /*
0002     SPDX-FileCopyrightText: 2020 Devin Lin <espidev@gmail.com>
0003
0004     SPDX-License-Identifier: LGPL-2.0-or-later
0005 */
0006 import QtQuick 2.6
0007 import QtQuick.Layouts 1.2
0008 import QtQuick.Controls 2.2 as Controls
0009 import Qt5Compat.GraphicalEffects
0010 import org.kde.kirigami 2.12 as Kirigami
0011
0012 Controls.Dialog {
0013     id: dialogRoot
0014     property int securityType
0015     property string headingText
0016     property string devicePath
0017     property string specificPath
0018
0019     signal donePressed(string password)
0020
0021     function openAndClear() {
0022         warning.visible = false;
0023         this.open();
0024         passwordField.text = "";
0025         passwordField.focus = true;
0026     }
0027
0028     anchors.centerIn: parent
0029     modal: true
0030     standardButtons: Controls.Dialog.Ok | Controls.Dialog.Cancel
0031
0032     onOpened: passwordField.forceActiveFocus()
0033     onRejected: {
0034         dialogRoot.close();
0035         passwordField.focus = false;
0036     }
0037     onAccepted: {
0038         if (passwordField.acceptableInput) {
0039             dialogRoot.close();
0040             handler.addAndActivateConnection(devicePath, specificPath, passwordField.text);
0041         } else {
0042             warning.visible = true;
0043         }
0044         passwordField.focus = false;
0045     }
0046
0047     property int translateY: (1 - opacity) * Kirigami.Units.gridUnit * 2
0048
0049     NumberAnimation on opacity {
0050         to: 1
0051         from: 0
0052         duration: Kirigami.Units.veryShortDuration
0053         easing.type: Easing.InOutQuad
0054         running: true
0055     }
0056
0057     background: Item {
0058         transform: Translate { y: dialogRoot.translateY }
0059
0060         RectangularGlow {
0061             anchors.fill: rect
0062             anchors.topMargin: 1
0063             cornerRadius: rect.radius * 2
0064             glowRadius: 2
0065             spread: 0.2
0066             color: Qt.rgba(0, 0, 0, 0.3)
0067         }
0068         Rectangle {
0069             id: rect
0070             anchors.fill: parent
0071             Kirigami.Theme.inherit: false
0072             Kirigami.Theme.colorSet: Kirigami.Theme.Window
0073             color: Kirigami.Theme.backgroundColor
0074             radius: Kirigami.Units.smallSpacing
0075
0076             Kirigami.Separator {
0077                 id: topSeparator
0078                 anchors.left: parent.left
0079                 anchors.right: parent.right
0080                 anchors.top: parent.top
0081                 anchors.topMargin: dialogRoot.header.implicitHeight
0082             }
0083
0084             Kirigami.Separator {
0085                 id: bottomSeparator
0086                 anchors.left: parent.left
0087                 anchors.right: parent.right
0088                 anchors.bottom: parent.bottom
0089                 anchors.bottomMargin: dialogRoot.footer.implicitHeight
0090             }
0091
0092             Rectangle {
0093                 Kirigami.Theme.inherit: false
0094                 Kirigami.Theme.colorSet: Kirigami.Theme.View
0095                 color: Kirigami.Theme.backgroundColor
0096                 anchors.left: parent.left
0097                 anchors.right: parent.right
0098                 anchors.top: topSeparator.bottom
0099                 anchors.bottom: bottomSeparator.top
0100             }
0101         }
0102     }
0103
0104     header: Item {
0105         transform: Translate { y: dialogRoot.translateY }
0106         implicitHeight: heading.implicitHeight + Kirigami.Units.largeSpacing * 2
0107
0108         Kirigami.Heading {
0109             id: heading
0110             level: 2
0111             text: headingText
0112             wrapMode: Text.WordWrap
0113             anchors.left: parent.left
0114             anchors.right: parent.right
0115             anchors.leftMargin: Kirigami.Units.largeSpacing
0116             anchors.verticalCenter: parent.verticalCenter
0117         }
0118     }
0119
0120     footer.transform: Translate { y: dialogRoot.translateY }
0121
0122     ColumnLayout {
0123         id: column
0124         transform: Translate { y: dialogRoot.translateY }
0125         spacing: Kirigami.Units.largeSpacing
0126
0127         PasswordField {
0128             id: passwordField
0129             Layout.fillWidth: true
0130             securityType: dialogRoot.securityType
0131             onAccepted: dialogRoot.accept()
0132         }
0133
0134         Controls.Label {
0135             id: warning
0136             text: i18n("Invalid input.")
0137             visible: false
0138         }
0139     }
0140
0141 }