calendar/qml/AttendeeListEditor.qml

0001 /*
0002  *  Copyright (C) 2017 Michael Bohlender, <michael.bohlender@kdemail.net>
0003  *  Copyright (C) 2017 Christian Mollekopf, <mollekopf@kolabsys.com>
0004  *
0005  *  This program is free software; you can redistribute it and/or modify
0006  *  it under the terms of the GNU General Public License as published by
0007  *  the Free Software Foundation; either version 2 of the License, or
0008  *  (at your option) any later version.
0009  *
0010  *  This program is distributed in the hope that it will be useful,
0011  *  but WITHOUT ANY WARRANTY; without even the implied warranty of
0012  *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
0013  *  GNU General Public License for more details.
0014  *
0015  *  You should have received a copy of the GNU General Public License along
0016  *  with this program; if not, write to the Free Software Foundation, Inc.,
0017  *  51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
0018  */
0019
0020
0021 import QtQuick 2.7
0022 import QtQuick.Layouts 1.1
0023 import QtQuick.Controls 2.2
0024
0025 import org.kube.framework 1.0 as Kube
0026
0027 FocusScope {
0028     id: root
0029     property var controller
0030     property var completer
0031
0032     property alias count: listView.count
0033
0034     implicitHeight: listView.implicitHeight + lineEdit.height
0035
0036     ColumnLayout {
0037         anchors.fill: parent
0038
0039         spacing: Kube.Units.smallSpacing
0040
0041         Kube.ListView {
0042             id: listView
0043             Layout.fillWidth: true
0044             Layout.fillHeight: true
0045             spacing: Kube.Units.smallSpacing
0046             currentIndex: -1
0047
0048             model: controller.model
0049             delegate: Kube.ListDelegate {
0050                 height: Kube.Units.gridUnit + Kube.Units.smallSpacing * 2 //smallSpacing for padding
0051                 selectionEnabled: false
0052
0053                 Rectangle {
0054                     anchors.fill: parent
0055                     color: Kube.Colors.darkBackgroundColor
0056                     opacity: 0.7
0057                 }
0058
0059                 RowLayout {
0060                     anchors {
0061                         fill: parent
0062                         leftMargin: Kube.Units.smallSpacing
0063                         rightMargin: Kube.Units.smallSpacing
0064                     }
0065                     spacing: Kube.Units.smallSpacing
0066
0067                     Kube.Label {
0068                         Layout.maximumWidth: parent.width - statusLabel.width - iconButton.width - 4 * Kube.Units.smallSpacing
0069                         text: model.name
0070                         elide: Text.ElideRight
0071                         color: Kube.Colors.highlightedTextColor
0072                         MouseArea {
0073                             id: mouseArea
0074                             anchors.fill: parent
0075                             hoverEnabled: true
0076                         }
0077                         ToolTip.visible: mouseArea.containsMouse
0078                         ToolTip.text: text
0079                     }
0080
0081                     Item {
0082                         Layout.fillWidth: true
0083                         Layout.fillHeight: true
0084                     }
0085
0086                     Kube.Label {
0087                         id: statusLabel
0088                         text: model.status == Kube.EventController.Accepted ? qsTr("Attending") : qsTr("Invited")
0089                         font.italic: true
0090                         font.pointSize: Kube.Units.smallFontSize
0091                         color: Kube.Colors.highlightedTextColor
0092                     }
0093                     Kube.IconButton {
0094                         id: iconButton
0095                         height: Kube.Units.gridUnit
0096                         width: height
0097                         onClicked: root.controller.remove(model.id)
0098                         padding: 0
0099                         iconName: Kube.Icons.remove
0100                     }
0101                 }
0102             }
0103         }
0104
0105         FocusScope {
0106             height: Kube.Units.gridUnit +  Kube.Units.smallSpacing * 2
0107             width: parent.width
0108             focus: true
0109
0110             Kube.TextButton {
0111                 id: button
0112                 text: "+ " + qsTr("Add attendee")
0113                 textColor: Kube.Colors.highlightColor
0114                 focus: true
0115                 onClicked: {
0116                     lineEdit.visible = true
0117                     lineEdit.forceActiveFocus()
0118                 }
0119             }
0120
0121             Kube.AutocompleteLineEdit {
0122                 id: lineEdit
0123                 anchors {
0124                     left: parent.left
0125                     right: parent.right
0126                 }
0127                 visible: false
0128
0129                 placeholderText: "+ " + qsTr("Add attendee")
0130                 model: root.completer.model
0131                 onSearchTermChanged: root.completer.searchString = searchTerm
0132                 onAccepted: {
0133                     root.controller.add({name: text});
0134                     clear()
0135                     visible = false
0136                     button.forceActiveFocus(Qt.TabFocusReason)
0137                 }
0138                 onAborted: {
0139                     clear()
0140                     visible = false
0141                     button.forceActiveFocus(Qt.TabFocusReason)
0142                 }
0143             }
0144         }
0145     }
0146 }