diff --git a/framework/qml/People.qml b/framework/qml/People.qml index b58599a1..1a08d900 100644 --- a/framework/qml/People.qml +++ b/framework/qml/People.qml @@ -1,429 +1,264 @@ /* Copyright (C) 2017 Michael Bohlender, Copyright (C) 2017 Christian Mollekopf, This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 2 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. You should have received a copy of the GNU General Public License along with this program; if not, write to the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ import QtQuick 2.7 import QtQuick.Controls 2.0 as Controls2 import QtQuick.Layouts 1.1 import org.kube.framework 1.0 as Kube FocusScope { id: root property var currentContact Item { id: peopleRoot anchors.fill: parent Item { id: toolbar anchors { top: parent.top horizontalCenter: parent.horizontalCenter } height: searchBar.height + Kube.Units.smallSpacing width: parent.width Kube.PositiveButton { anchors { verticalCenter: parent.verticalCenter left: parent.left leftMargin: Kube.Units.smallSpacing } text: "New Contact" visible: stack.depth == 1 } Kube.IconButton { anchors { top: parent.top left: parent.left leftMargin: Kube.Units.smallSpacing } visible: stack.depth > 1 iconName: Kube.Icons.goBack onClicked: stack.pop() } Kube.TextField { id: searchBar focus: true anchors.horizontalCenter: parent.horizontalCenter width: parent.width * 0.5 placeholderText: "Search..." } } Controls2.StackView { id: stack anchors { top: toolbar.bottom left: parent.left right: parent.right bottom: parent.bottom } initialItem: peoplePage clip: true } } Component { id: peoplePage Rectangle { id: peoplePageRoot color: Kube.Colors.viewBackgroundColor Kube.GridView { id: gridView anchors { fill: parent margins: Kube.Units.largeSpacing } activeFocusOnTab: true model: Kube.PeopleModel { filter: searchBar.text } cellWidth: Kube.Units.gridUnit * 10 cellHeight: Kube.Units.gridUnit * 3 onActiveFocusChanged: { if (currentIndex < 0) { currentIndex = 0 } } function selectObject(domainObject) { root.currentContact = domainObject stack.push(personPage) } delegate: Item { id: delegateRoot height: gridView.cellHeight - Kube.Units.smallSpacing * 2 width: gridView.cellWidth - Kube.Units.smallSpacing * 2 Keys.onReturnPressed: { GridView.view.currentIndex = index GridView.view.selectObject(model.domainObject) } Rectangle { anchors.fill: parent border.width: 1 border.color: Kube.Colors.buttonColor Rectangle { id: avatarPlaceholder color: Kube.Colors.buttonColor anchors { top: parent.top left: parent.left bottom: parent.bottom } clip: true width: height Kube.KubeImage { anchors.fill: parent visible: model.imageData != "" imageData: model.imageData } Kube.Icon { anchors.fill: parent visible: model.imageData == "" iconName: Kube.Icons.user } } Column { width: parent.width anchors { left: avatarPlaceholder.right margins: Kube.Units.smallSpacing verticalCenter: parent.verticalCenter } Kube.Label { width: delegateRoot.width - avatarPlaceholder.width - Kube.Units.smallSpacing * 2 text: model.firstName elide: Text.ElideRight } Kube.Label { width: delegateRoot.width - avatarPlaceholder.width - Kube.Units.smallSpacing * 2 text: model.lastName elide: Text.ElideRight } } } Kube.AbstractButton { anchors.fill: parent color: "#00000000" onClicked: { parent.GridView.view.currentIndex = index parent.GridView.view.selectObject(model.domainObject) } } } } } } Component { id: personPage Rectangle { id: personPageRoot Kube.ContactController { id: contactController contact: root.currentContact } color: Kube.Colors.viewBackgroundColor - Flickable { - id: personPageFlickable - - anchors { - fill: parent - leftMargin: Kube.Units.largeSpacing - } - - Controls2.ScrollBar.vertical: Kube.ScrollBar { } - contentHeight: contentColumn.height - - clip: true - - Kube.ScrollHelper { - flickable: personPageFlickable - anchors.fill: parent - } - - ColumnLayout { - id: contentColumn - - anchors { - left: parent.left - right: parent.right - } - - spacing: Kube.Units.largeSpacing - - Item { - width: parent.width - height: Kube.Units.smallSpacing - } - - Item { - - height: Kube.Units.gridUnit * 8 - width: personPageRoot.width - Kube.Units.largeSpacing - - Rectangle { - id: avatar - - height: parent.height - width: height - Kube.KubeImage { - anchors.fill: parent - visible: contactController.imageData != "" - imageData: contactController.imageData - } - Kube.Icon { - anchors.fill: parent - visible: contactController.imageData == "" - iconName: Kube.Icons.user - } - color: Kube.Colors.buttonColor - } - - Kube.Heading { - id: nameLabel - - anchors { - top: avatar.top - left: avatar.right - leftMargin: Kube.Units.largeSpacing - } - - text: contactController.name - } - - Kube.Label { - id: jobTitle - - anchors { - top: nameLabel.bottom - left: avatar.right - leftMargin: Kube.Units.largeSpacing - } - - text: contactController.jobTitle - } - - Rectangle { - id: company - visible: contactController.company != "" - - anchors { - bottom: avatar.bottom - left: avatar.right - leftMargin: Kube.Units.largeSpacing - } - - height: Kube.Units.gridUnit * 3 - width: Kube.Units.gridUnit * 10 - - border.width: 1 - border.color: Kube.Colors.buttonColor - - Rectangle { - id: av - - height: parent.height - width: height - - color: Kube.Colors.buttonColor - } - - Kube.Label { - anchors { - verticalCenter: av.verticalCenter - left: av.right - leftMargin: Kube.Units.smallSpacing - } - - text: contactController.company - } - } - } - - Flow { - id: emails - - width: personPageRoot.width - Kube.Units.largeSpacing - - Repeater { - model: contactController.emails - - delegate: Row { - spacing: Kube.Units.smallSpacing - Kube.Label { text: qsTr("(main)") } - Kube.Label { text: modelData ; color: Kube.Colors.highlightColor } - Item { width: Kube.Units.smallSpacing; height: 1 } - } - } - } - - Flow { - id: phone - - width: personPageRoot.width - Kube.Units.largeSpacing - spacing: Kube.Units.smallSpacing - - Repeater { - model: contactController.phoneNumbers - - Row { - spacing: Kube.Units.smallSpacing - Kube.Label { text: qsTr("(main)") } - Kube.Label { text: modelData ; opacity: 0.6 } - Item { width: Kube.Units.smallSpacing; height: 1 } - } - } - } - - Column { - id: address - - width: personPageRoot.width - Kube.Units.largeSpacing - - Kube.Label { text: contactController.street } - Kube.Label { text: contactController.city } - Kube.Label { text: contactController.country } - } + PersonPage { + } + } + } +} // Column { // // width: parent.width // // spacing: Kube.Units.smallSpacing // // Text { // // text: root.firstname + " is part of these groups:" // } // // GroupGrid { // id: groups // // width: root.width - Kube.Units.largeSpacing // // model: GroupModel1 {} // } // } // Column { // // width: parent.width // // spacing: Kube.Units.smallSpacing // // Text { // id: commonPeopleLabel // // text: root.firstname + " is associated with:" // } // // PeopleGrid { // id: commonPeople // // width: root.width - Kube.Units.largeSpacing // // model: PeopleModel2 {} // } // } - Item { - width: parent.width - height: Kube.Units.largeSpacing - } - } - } - } - } -} diff --git a/framework/qml/PersonPage.qml b/framework/qml/PersonPage.qml new file mode 100644 index 00000000..cd2a5d65 --- /dev/null +++ b/framework/qml/PersonPage.qml @@ -0,0 +1,238 @@ + /* + Copyright (C) 2017 Michael Bohlender, + Copyright (C) 2017 Christian Mollekopf, + + This program is free software; you can redistribute it and/or modify + it under the terms of the GNU General Public License as published by + the Free Software Foundation; either version 2 of the License, or + (at your option) any later version. + + This program is distributed in the hope that it will be useful, + but WITHOUT ANY WARRANTY; without even the implied warranty of + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along + with this program; if not, write to the Free Software Foundation, Inc., + 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. +*/ + +import QtQuick 2.7 +import QtQuick.Controls 2.0 as Controls2 +import QtQuick.Layouts 1.1 + +import org.kube.framework 1.0 as Kube + + +Flickable { + id: personPageFlickable + + anchors { + fill: parent + leftMargin: Kube.Units.largeSpacing + } + + Controls2.ScrollBar.vertical: Kube.ScrollBar { } + contentHeight: contentColumn.height + + clip: true + + Kube.ScrollHelper { + flickable: personPageFlickable + anchors.fill: parent + } + + + ColumnLayout { + id: contentColumn + + anchors { + left: parent.left + right: parent.right + } + + spacing: Kube.Units.largeSpacing + + Item { + width: parent.width + height: Kube.Units.smallSpacing + } + + + Item { + + height: Kube.Units.gridUnit * 8 + width: personPageRoot.width - Kube.Units.largeSpacing + + Rectangle { + id: avatar + + height: parent.height + width: height + Kube.KubeImage { + anchors.fill: parent + visible: contactController.imageData != "" + imageData: contactController.imageData + } + Kube.Icon { + anchors.fill: parent + visible: contactController.imageData == "" + iconName: Kube.Icons.user + } + color: Kube.Colors.buttonColor + } + + Kube.Heading { + id: nameLabel + + anchors { + top: avatar.top + left: avatar.right + leftMargin: Kube.Units.largeSpacing + } + + text: contactController.name + } + + Kube.Label { + id: jobTitle + + anchors { + top: nameLabel.bottom + left: avatar.right + leftMargin: Kube.Units.largeSpacing + } + + text: contactController.jobTitle + } + + Rectangle { + id: company + visible: contactController.company != "" + + anchors { + bottom: avatar.bottom + left: avatar.right + leftMargin: Kube.Units.largeSpacing + } + + height: Kube.Units.gridUnit * 3 + width: Kube.Units.gridUnit * 10 + + border.width: 1 + border.color: Kube.Colors.buttonColor + + Rectangle { + id: av + + height: parent.height + width: height + + color: Kube.Colors.buttonColor + } + + Kube.Label { + anchors { + verticalCenter: av.verticalCenter + left: av.right + leftMargin: Kube.Units.smallSpacing + } + + text: contactController.company + } + } + } + + Flow { + id: emails + + width: personPageRoot.width - Kube.Units.largeSpacing + + Repeater { + model: contactController.emails + + delegate: Row { + spacing: Kube.Units.smallSpacing + Kube.Label { text: qsTr("(main)") } + Kube.Label { text: modelData ; color: Kube.Colors.highlightColor } + Item { width: Kube.Units.smallSpacing; height: 1 } + } + } + } + + Flow { + id: phone + + width: personPageRoot.width - Kube.Units.largeSpacing + spacing: Kube.Units.smallSpacing + + Repeater { + model: contactController.phoneNumbers + + Row { + spacing: Kube.Units.smallSpacing + Kube.Label { text: qsTr("(main)") } + Kube.Label { text: modelData ; opacity: 0.6 } + Item { width: Kube.Units.smallSpacing; height: 1 } + } + } + } + + Column { + id: address + + width: personPageRoot.width - Kube.Units.largeSpacing + + Kube.Label { text: contactController.street } + Kube.Label { text: contactController.city } + Kube.Label { text: contactController.country } + } + Item { + width: parent.width + height: Kube.Units.largeSpacing + } + } +} + +// Column { +// +// width: parent.width +// +// spacing: Kube.Units.smallSpacing +// +// Text { +// +// text: root.firstname + " is part of these groups:" +// } +// +// GroupGrid { +// id: groups +// +// width: root.width - Kube.Units.largeSpacing +// +// model: GroupModel1 {} +// } +// } + +// Column { +// +// width: parent.width +// +// spacing: Kube.Units.smallSpacing +// +// Text { +// id: commonPeopleLabel +// +// text: root.firstname + " is associated with:" +// } +// +// PeopleGrid { +// id: commonPeople +// +// width: root.width - Kube.Units.largeSpacing +// +// model: PeopleModel2 {} +// } +// } + + diff --git a/framework/qmldir b/framework/qmldir index b94abc28..46628985 100644 --- a/framework/qmldir +++ b/framework/qmldir @@ -1,56 +1,57 @@ module org.kube.framework ConversationView 1.0 ConversationView.qml ConversationListView 1.0 ConversationListView.qml FolderListView 1.0 FolderListView.qml MailListView 1.0 MailListView.qml MailViewer 1.0 MailViewer.qml InlineAccountSwitcher 1.0 InlineAccountSwitcher.qml NewAccountDialog 1.0 NewAccountDialog.qml EditAccount 1.0 EditAccount.qml LoginAccount 1.0 LoginAccount.qml OverlayDialog 1.0 OverlayDialog.qml Outbox 1.0 Outbox.qml People 1.0 People.qml +PersonPage 1.0 PersonPage.qml NotificationPopup 1.0 NotificationPopup.qml Icon 1.0 Icon.qml IconButton 1.0 IconButton.qml AbstractButton 1.0 AbstractButton.qml Button 1.0 Button.qml Popup 1.0 Popup.qml ProgressBar 1.0 ProgressBar.qml StatusBar 1.0 StatusBar.qml ComboBox 1.0 ComboBox.qml CheckBox 1.0 CheckBox.qml Switch 1.0 Switch.qml PositiveButton 1.0 PositiveButton.qml TextButton 1.0 TextButton.qml TextField 1.0 TextField.qml RequiredTextField 1.0 RequiredTextField.qml PasswordField 1.0 PasswordField.qml TextEditor 1.0 TextEditor.qml ToolTip 1.0 ToolTip.qml Label 1.0 Label.qml ScrollBar 1.0 ScrollBar.qml SelectableLabel 1.0 SelectableLabel.qml SelectableItem 1.0 SelectableItem.qml ContextMenuOverlay 1.0 ContextMenuOverlay.qml Heading 1.0 Heading.qml View 1.0 View.qml AutocompleteLineEdit 1.0 AutocompleteLineEdit.qml AttachmentDelegate 1.0 AttachmentDelegate.qml DelegateBackground 1.0 DelegateBackground.qml ListView 1.0 ListView.qml ListDelegate 1.0 ListDelegate.qml TreeView 1.0 TreeView.qml GridView 1.0 GridView.qml ScrollHelper 1.0 ScrollHelper.qml ModelIndexRetriever 1.0 ModelIndexRetriever.qml singleton Messages 1.0 Messages.qml singleton Notifications 1.0 Notifications.qml singleton Colors 1.0 Colors.qml singleton Icons 1.0 Icons.qml singleton Units 1.0 Units.qml singleton Font 1.0 Font.qml plugin frameworkplugin