status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat(StatusQ.Popups) Adding SearchPopup component 

Closes #264
This commit is contained in:
Alexandra Betouni 2021-07-23 19:28:16 +03:00 committed by Michał Cieślak
parent 67330d68ae
commit 11071a903e
19 changed files with 1085 additions and 230 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

263
ui/StatusQ/sandbox/DemoApp.qml
View File

@ -299,14 +299,14 @@ Rectangle {
StatusChatList {
anchors.horizontalCenter: parent.horizontalCenter
chatListItems.model: demoChatListItems
chatListItems.model: models.demoChatListItems
selectedChatId: "0"
onChatItemSelected: selectedChatId = id
onChatItemUnmuted: {
for (var i = 0; i < demoChatListItems.count; i++) {
let item = demoChatListItems.get(i);
for (var i = 0; i < models.demoChatListItems.count; i++) {
let item = models.demoChatListItems.get(i);
if (item.chatId === id) {
demoChatListItems.setProperty(i, "muted", false)
models.demoChatListItems.setProperty(i, "muted", false)
}
}
}
@ -412,7 +412,7 @@ Rectangle {
handle: Rectangle {
implicitWidth: 5
color: SplitHandle.pressed ? Theme.palette.baseColor2
: (SplitHandle.hovered ? Qt.darker(Theme.palette.baseColor5, 1.1) : "transparent")
: (SplitHandle.hovered ? Qt.darker(Theme.palette.baseColor5, 1.1) : "transparent")
}
leftPanel: Item {
id: leftPanel
@ -467,8 +467,8 @@ Rectangle {
width: leftPanel.width
height: implicitHeight > (leftPanel.height - 64) ? implicitHeight + 8 : leftPanel.height - 64
chatList.model: demoCommunityChatListItems
categoryList.model: demoCommunityCategoryItems
chatList.model: models.demoCommunityChatListItems
categoryList.model: models.demoCommunityCategoryItems
showCategoryActionButtons: true
onChatItemSelected: selectedChatId = id
@ -557,6 +557,7 @@ Rectangle {
centerPanel: Item {
StatusChatToolBar {
id: statusChatToolBar
anchors.top: parent.top
width: parent.width
@ -564,12 +565,61 @@ Rectangle {
chatInfoButton.subTitle: "Community Chat"
chatInfoButton.icon.color: Theme.palette.miscColor6
chatInfoButton.type: StatusChatInfoButton.Type.CommunityChat
searchButton.onClicked: searchButton.highlighted = !searchButton.highlighted
onSearchButtonClicked: {
searchButton.highlighted = !searchButton.highlighted;
searchPopup.searchSelectionButton.primaryText = demoCommunityDetailModal.header.title;
searchPopup.searchSelectionButton.image.source = demoCommunityDetailModal.header.image.source;
searchPopup.open();
}
membersButton.onClicked: membersButton.highlighted = !membersButton.highlighted
onMembersButtonClicked: {
root.showRightPanel = !root.showRightPanel;
}
}
StatusSearchPopup {
id: searchPopup
searchOptionsPopupMenu: searchPopupMenu
onAboutToHide: {
if (searchPopupMenu.visible) {
searchPopupMenu.close();
}
//clear menu
for (var i = 2; i < searchPopupMenu.count; i++) {
searchPopupMenu.removeItem(searchPopupMenu.takeItem(i));
}
}
onClosed: {
statusChatToolBar.searchButton.highlighted = false
searchPopupMenu.dismiss();
}
onSearchTextChanged: {
if (searchPopup.searchText !== "") {
searchPopup.loading = true;
searchModelSimTimer.start();
} else {
searchPopup.searchResults = [];
searchModelSimTimer.stop();
}
}
Timer {
id: searchModelSimTimer
interval: 500
onTriggered: {
if (searchPopup.searchText.startsWith("c")) {
searchPopup.searchResults = models.searchResultsA;
} else {
searchPopup.searchResults = models.searchResultsB;
}
searchPopup.loading = false;
}
}
}
StatusSearchLocationMenu {
id: searchPopupMenu
searchPopup: searchPopup
locatioModel: models.optionsModel
}
}
rightPanel: Item {
@ -654,7 +704,7 @@ Rectangle {
spacing: 4
Repeater {
model: demoProfileGeneralMenuItems
model: models.demoProfileGeneralMenuItems
delegate: StatusNavigationListItem {
title: model.title
icon.name: model.icon
@ -664,7 +714,7 @@ Rectangle {
StatusListSectionHeadline { text: "Settings" }
Repeater {
model: demoProfileSettingsMenuItems
model: models.demoProfileSettingsMenuItems
delegate: StatusNavigationListItem {
title: model.title
icon.name: model.icon
@ -678,7 +728,7 @@ Rectangle {
}
Repeater {
model: demoProfileOtherMenuItems
model: models.demoProfileOtherMenuItems
delegate: StatusNavigationListItem {
title: model.title
icon.name: model.icon
@ -833,194 +883,7 @@ Rectangle {
}
}
ListModel {
id: demoChatListItems
ListElement {
chatId: "0"
name: "#status"
chatType: StatusChatListItem.Type.PublicChat
muted: false
unreadMessagesCount: 0
mentionsCount: 0
color: "blue"
}
ListElement {
chatId: "1"
name: "status-desktop"
chatType: StatusChatListItem.Type.PublicChat
muted: false
color: "red"
unreadMessagesCount: 1
mentionsCount: 1
}
ListElement {
chatId: "2"
name: "Amazing Funny Squirrel"
chatType: StatusChatListItem.Type.OneToOneChat
muted: false
color: "green"
identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
unreadMessagesCount: 0
}
ListElement {
chatId: "3"
name: "Black Ops"
chatType: StatusChatListItem.Type.GroupChat
muted: false
color: "purple"
unreadMessagesCount: 0
}
ListElement {
chatId: "4"
name: "Spectacular Growing Otter"
chatType: StatusChatListItem.Type.OneToOneChat
muted: true
color: "Orange"
unreadMessagesCount: 0
}
ListElement {
chatId: "5"
name: "channel-with-a-super-duper-long-name"
chatType: StatusChatListItem.Type.PublicChat
muted: false
color: "green"
unreadMessagesCount: 0
}
}
ListModel {
id: demoCommunityChatListItems
ListElement {
chatId: "0"
name: "general"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
}
ListElement {
chatId: "1"
name: "random"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "public"
}
ListElement {
chatId: "2"
name: "watercooler"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "public"
}
ListElement {
chatId: "3"
name: "language-design"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "dev"
}
}
ListModel {
id: demoCommunityCategoryItems
ListElement {
categoryId: "public"
name: "Public"
}
ListElement {
categoryId: "dev"
name: "Development"
}
}
ListModel {
id: demoProfileGeneralMenuItems
ListElement {
title: "My Profile"
icon: "profile"
}
ListElement {
title: "Contacts"
icon: "contact"
}
ListElement {
title: "ENS Usernames"
icon: "username"
}
}
ListModel {
id: demoProfileSettingsMenuItems
ListElement {
title: "Privacy & Security"
icon: "security"
}
ListElement {
title: "Appearance"
icon: "appearance"
}
ListElement {
title: "Browser"
icon: "browser"
}
ListElement {
title: "Sounds"
icon: "sound"
}
ListElement {
title: "Language"
icon: "language"
}
ListElement {
title: "Notifications"
icon: "notification"
}
ListElement {
title: "Sync settings"
icon: "mobile"
}
ListElement {
title: "Advanced"
icon: "settings"
}
}
ListModel {
id: demoProfileOtherMenuItems
ListElement {
title: "Need help?"
icon: "help"
}
ListElement {
title: "About"
icon: "info"
}
ListElement {
title: "Sign out & Quit"
icon: "logout"
}
Models {
id: models
}
}

21
ui/StatusQ/sandbox/ListItems.qml
View File

@ -295,6 +295,27 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
type: StatusListItem.Type.Danger
}
StatusListItem {
title: "List Item with Badge"
subTitle: "Subtitle"
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
image.isIdenticon: true
badge.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
badge.primaryText: "CryptoKitties"
badge.secondaryText: "#test"
}
StatusListItem {
title: "List Item with Badge 2"
subTitle: "Subtitle"
icon.isLetterIdenticon: true
badge.primaryText: "CryptoKitties"
badge.secondaryText: "#test"
badge.icon.color: "orange"
badge.icon.isLetterIdenticon: true
}
StatusDescriptionListItem {
title: "Title"
subTitle: "Subtitle"

309
ui/StatusQ/sandbox/Models.qml Normal file
View File

@ -0,0 +1,309 @@
import QtQuick 2.14
import StatusQ.Components 0.1
QtObject {
property var demoChatListItems: ListModel {
id: demoChatListItems
ListElement {
chatId: "0"
name: "#status"
chatType: StatusChatListItem.Type.PublicChat
muted: false
unreadMessagesCount: 0
mentionsCount: 0
color: "blue"
}
ListElement {
chatId: "1"
name: "status-desktop"
chatType: StatusChatListItem.Type.PublicChat
muted: false
color: "red"
unreadMessagesCount: 1
mentionsCount: 1
}
ListElement {
chatId: "2"
name: "Amazing Funny Squirrel"
chatType: StatusChatListItem.Type.OneToOneChat
muted: false
color: "green"
identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
unreadMessagesCount: 0
}
ListElement {
chatId: "3"
name: "Black Ops"
chatType: StatusChatListItem.Type.GroupChat
muted: false
color: "purple"
unreadMessagesCount: 0
}
ListElement {
chatId: "4"
name: "Spectacular Growing Otter"
chatType: StatusChatListItem.Type.OneToOneChat
muted: true
color: "Orange"
unreadMessagesCount: 0
}
ListElement {
chatId: "5"
name: "channel-with-a-super-duper-long-name"
chatType: StatusChatListItem.Type.PublicChat
muted: false
color: "green"
unreadMessagesCount: 0
}
}
property var demoCommunityChatListItems: ListModel {
id: demoCommunityChatListItems
ListElement {
chatId: "0"
name: "general"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
}
ListElement {
chatId: "1"
name: "random"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "public"
}
ListElement {
chatId: "2"
name: "watercooler"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "public"
}
ListElement {
chatId: "3"
name: "language-design"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "dev"
}
}
property var demoCommunityCategoryItems: ListModel {
id: demoCommunityCategoryItems
ListElement {
categoryId: "public"
name: "Public"
}
ListElement {
categoryId: "dev"
name: "Development"
}
}
property var demoProfileGeneralMenuItems: ListModel {
id: demoProfileGeneralMenuItems
ListElement {
title: "My Profile"
icon: "profile"
}
ListElement {
title: "Contacts"
icon: "contact"
}
ListElement {
title: "ENS Usernames"
icon: "username"
}
}
property var demoProfileSettingsMenuItems: ListModel {
id: demoProfileSettingsMenuItems
ListElement {
title: "Privacy & Security"
icon: "security"
}
ListElement {
title: "Appearance"
icon: "appearance"
}
ListElement {
title: "Browser"
icon: "browser"
}
ListElement {
title: "Sounds"
icon: "sound"
}
ListElement {
title: "Language"
icon: "language"
}
ListElement {
title: "Notifications"
icon: "notification"
}
ListElement {
title: "Sync settings"
icon: "mobile"
}
ListElement {
title: "Advanced"
icon: "settings"
}
}
property var demoProfileOtherMenuItems: ListModel {
id: demoProfileOtherMenuItems
ListElement {
title: "Need help?"
icon: "help"
}
ListElement {
title: "About"
icon: "info"
}
ListElement {
title: "Sign out & Quit"
icon: "logout"
}
}
//dummy search popup models
property var searchResultsA: ListModel {
ListElement { name: "@Flea"; sectionName: "Messages"; time: "18:55 AM"; content: "lorem ipsum <font color='#4360DF'>@Nick</font> dolor sit amet";
badgeImage: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg";
badgePrimaryText: "CryptoKities";
badgeSecondaryText: "";
badgeIdenticonColor: "";
isLetterIdenticon: false }
ListElement { name: "core"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "communities-phase3"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "core-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "desktop"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "Crocodile Vanilla Bird"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "carmen eth"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "MyCommunity"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
}
property var searchResultsB: ListModel {
ListElement { name: "@Ant"; sectionName: "Messages"; time: "11:43 AM"; content: "<font color='#4360DF'>@John</font>, lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum ";
badgeImage: "";
badgePrimaryText: "CryptoKities";
badgeSecondaryText: "#design";
badgeIdenticonColor: "pink"; isLetterIdenticon: true }
ListElement { name: "support"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "desktop-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "climate-change"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "food"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: "pink"; isLetterIdenticon: true }
ListElement { name: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "CryptoRangers"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: ""; isLetterIdenticon: false }
ListElement { name: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIdenticonColor: "orange"; isLetterIdenticon: true }
}
property ListModel optionsModel: ListModel {
ListElement {
title: "Item with icon";
imageSource: ""
iconName: "chat"
iconColor: ""
isIdenticon: false
subItems: [
ListElement {
text: "Profile image item"
imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
iconName: ""
iconColor: ""
isIdenticon: false
},
ListElement {
text: "identicon item"
imageSource: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
iconName: ""
iconColor: ""
isIdenticon: true
}]}
ListElement {
title: "Community item";
imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
iconName: ""
iconColor: ""
isIdenticon: false
subItems: [
ListElement {
text: "welcome"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
},
ListElement {
text: "support"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
},
ListElement {
text: "news"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
}]}
ListElement {
title: "Other";
imageSource: "";
iconName: "info"
iconColor: ""
isIdenticon: false
subItems: [
ListElement {
text: "news"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
}]}
ListElement {
title: "Letter identicon";
imageSource: "";
iconName: ""
iconColor: "red"
isIdenticon: false
subItems: [
ListElement {
text: "news"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
}]}
}
}

4
ui/StatusQ/sandbox/StatusPopupMenuPage.qml
View File

@ -46,7 +46,7 @@ GridLayout {
StatusPopupMenu {
id: complexMenu
subMenuItemIcons: ['info']
subMenuItemIcons: [{ icon: 'info' }]
StatusMenuItem {
text: "One"
@ -82,7 +82,7 @@ GridLayout {
id: customMenu
subMenuItemIcons: [
"chat",
{ icon: "chat" },
{
source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
},

4
ui/StatusQ/src/StatusQ/Components/StatusLetterIdenticon.qml
View File

@ -14,7 +14,9 @@ Rectangle {
radius: width / 2
StatusBaseText {
text: (statusLetterIdenticon.name.charAt(0) == "#" ? statusLetterIdenticon.name.charAt(1) : statusLetterIdenticon.name.charAt(0)).toUpperCase()
text: ((statusLetterIdenticon.name.charAt(0) === "#")
|| (statusLetterIdenticon.name.charAt(0) === "@") ?
statusLetterIdenticon.name.charAt(1) : statusLetterIdenticon.name.charAt(0)).toUpperCase()
font.weight: Font.Bold
font.pixelSize: statusLetterIdenticon.letterSize
color: Qt.rgba(255, 255, 255, 0.7)

34
ui/StatusQ/src/StatusQ/Components/StatusListItem.qml
View File

@ -1,4 +1,6 @@
import QtQuick 2.13
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
@ -33,8 +35,11 @@ Rectangle {
radius: 8
property string title: ""
property string titleAsideText: ""
property string subTitle: ""
property string tertiaryTitle: ""
property alias badge: statusListItemBadge
property real leftPadding: 16
property real rightPadding: 16
property bool enabled: true
@ -107,6 +112,7 @@ Rectangle {
}
return !!statusListItem.icon.name ? statusRoundedIcon : statusRoundedImage
}
active: statusListItem.icon.isLetterIdenticon ||
!!statusListItem.icon.name ||
!!statusListItem.image.source.toString()
@ -158,15 +164,15 @@ Rectangle {
anchors.leftMargin: statusListItem.leftPadding
anchors.rightMargin: statusListItem.rightPadding
anchors.verticalCenter: parent.verticalCenter
height: statusListItemTitle.height +
(statusListItemSubTitle.visible ? statusListItemSubTitle.height : 0) +
(statusListItemTertiaryTitle.visible ? statusListItemTertiaryTitle.height : 0)
height: childrenRect.height
StatusBaseText {
id: statusListItemTitle
text: statusListItem.title
width: parent.width
width: contentWidth < (parent.width - statusListItemTitleAsideText.contentWidth) ?
contentWidth : (parent.width - statusListItemTitleAsideText.contentWidth)
font.pixelSize: 15
height: visible ? contentHeight : 0
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
color: {
if (!statusListItem.enabled) {
@ -183,6 +189,17 @@ Rectangle {
}
}
StatusBaseText {
id: statusListItemTitleAsideText
anchors.left: statusListItemTitle.right
anchors.leftMargin: 4
anchors.verticalCenter: statusListItemTitle.verticalCenter
text: statusListItem.titleAsideText
font.pixelSize: 10
color: Theme.palette.baseColor1
visible: !!statusListItem.titleAsideText
}
StatusBaseText {
id: statusListItemSubTitle
anchors.top: statusListItemTitle.bottom
@ -190,6 +207,7 @@ Rectangle {
text: statusListItem.subTitle
font.pixelSize: 15
color: !statusListItem.enabled || !statusListItem.tertiaryTitle ? Theme.palette.baseColor1 : Theme.palette.directColor1
height: visible ? contentHeight : 0
visible: !!statusListItem.subTitle
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
}
@ -198,12 +216,20 @@ Rectangle {
id: statusListItemTertiaryTitle
anchors.top: statusListItemSubTitle.bottom
width: parent.width
height: visible ? contentHeight : 0
text: statusListItem.tertiaryTitle
color: Theme.palette.baseColor1
font.pixelSize: 13
visible: !!statusListItem.tertiaryTitle
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
}
StatusListItemBadge {
id: statusListItemBadge
anchors.top: statusListItemTertiaryTitle.bottom
width: contentItem.width
implicitHeight: visible ? 22 : 0
}
}
StatusBaseText {

80
ui/StatusQ/src/StatusQ/Components/StatusListItemBadge.qml Normal file
View File

@ -0,0 +1,80 @@
import QtQuick 2.13
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
Control {
id: root
implicitWidth: contentItem.width
implicitHeight: visible ? 22 : 0
visible: !!root.primaryText
property string primaryText: ""
property string secondaryText: ""
property StatusImageSettings image: StatusImageSettings {
height: 16
width: 16
isIdenticon: false
}
property StatusIconSettings icon: StatusIconSettings {
height: 16
width: 16
isLetterIdenticon: false
background: StatusIconBackgroundSettings {}
color: "transparent"
}
background: Rectangle {
anchors.fill: parent
color: "transparent"
radius: 11
border.color: Theme.palette.directColor7
}
contentItem: Item {
id: contentItem
width: (contentItemRow.width + 10)
height: parent.height
RowLayout {
id: contentItemRow
anchors.centerIn: parent
anchors.horizontalCenterOffset: -spacing
spacing: 2
StatusRoundedImage {
implicitWidth: root.image.width
implicitHeight: root.image.height
visible: !root.icon.isLetterIdenticon
image.source: root.image.source
border.color: Theme.palette.baseColor1
border.width: root.image.isIdenticon ? 1 : 0
}
StatusLetterIdenticon {
implicitWidth: root.icon.width
implicitHeight: root.icon.width
letterSize: 11
visible: root.icon.isLetterIdenticon
color: root.icon.color
name: root.primaryText
}
StatusBaseText {
font.weight: Font.Medium
color: Theme.palette.baseColor1
text: root.primaryText
}
StatusIcon {
Layout.alignment: Qt.AlignVCenter
visible: !!root.secondaryText
color: Theme.palette.baseColor1
icon: "next"
}
StatusBaseText {
font.weight: Font.Medium
color: Theme.palette.baseColor1
visible: !!root.secondaryText
text: root.secondaryText
}
}
}
}

1
ui/StatusQ/src/StatusQ/Components/qmldir
View File

@ -19,3 +19,4 @@ StatusNavigationPanelHeadline 0.1 StatusNavigationPanelHeadline.qml
StatusRoundIcon 0.1 StatusRoundIcon.qml
StatusRoundedImage 0.1 StatusRoundedImage.qml
StatusMacWindowButtons 0.1 StatusMacWindowButtons.qml
StatusListItemBadge 0.1 StatusListItemBadge.qml

4
ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml
View File

@ -179,8 +179,8 @@ Item {
StatusFlatRoundButton {
id: clearButtton
visible: edit.text.length != 0 &&
statusBaseInput.clearable &&
visible: edit.text.length != 0 &&
statusBaseInput.clearable &&
!statusBaseInput.multiline &&
edit.activeFocus
anchors.right: parent.right

4
ui/StatusQ/src/StatusQ/Controls/StatusInput.qml
View File

@ -4,9 +4,8 @@ import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
Rectangle {
Item {
id: root
implicitWidth: 480
height: (label.visible ?
label.anchors.topMargin +
@ -22,7 +21,6 @@ Rectangle {
errorMessage.height :
0) + 8
color: "transparent"
property alias input: statusBaseInput
property string label: ""
property int charLimit: 0

10
ui/StatusQ/src/StatusQ/Popups/StatusModal.qml
View File

@ -19,6 +19,8 @@ QC.Popup {
property alias contentComponent: contentLoader.item
property alias rightButtons: footerImpl.rightButtons
property alias leftButtons: footerImpl.leftButtons
property bool showHeader: true
property bool showFooter: true
signal editButtonClicked()
@ -46,8 +48,9 @@ QC.Popup {
width: parent.width
Spares.StatusModalHeader {
id: headerImpl
width: 480
width: visible ? parent.width : 0
visible: statusModal.showHeader
title: header.title
subTitle: header.subTitle
image: header.image
@ -59,14 +62,15 @@ QC.Popup {
Loader {
id: contentLoader
width: parent.width
active: true
anchors.horizontalCenter: parent.horizontalCenter
sourceComponent: statusModal.content
}
Spares.StatusModalFooter {
id: footerImpl
width: 480
width: visible ? parent.width : 0
visible: statusModal.showFooter
}
}
}

34
ui/StatusQ/src/StatusQ/Popups/StatusPopupMenu.qml
View File

@ -10,16 +10,18 @@ import StatusQ.Popups 0.1
Menu {
id: statusPopupMenu
closePolicy: Popup.CloseOnReleaseOutside | Popup.CloseOnEscape
closePolicy: Popup.CloseOnReleaseOutsideParent | Popup.CloseOnEscape
topPadding: 8
bottomPadding: 8
property int menuItemCount: 0
property var subMenuItemIcons: []
property var openHandler
property var closeHandler
signal menuItemClicked(int menuIndex)
onOpened: {
if (typeof openHandler === "function") {
openHandler()
@ -34,19 +36,21 @@ Menu {
delegate: MenuItem {
id: statusPopupMenuItem
implicitWidth: parent ? parent.width : 0
implicitHeight: action.enabled ? 38 : 0
property int subMenuIndex
Component.onCompleted: {
if (subMenu) {
if (!!subMenu) {
subMenuIndex = statusPopupMenu.menuItemCount
statusPopupMenu.menuItemCount += 1
}
}
action: StatusMenuItem {}
action: StatusMenuItem {
onTriggered: { statusPopupMenu.menuItemClicked(statusPopupMenuItem.subMenuIndex); }
}
Component {
id: indicatorComponent
@ -63,12 +67,17 @@ Menu {
}
rotation: statusPopupMenuItem.action.iconRotation
icon: {
if (statusPopupMenuItem.subMenu) {
return statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex]
if (statusPopupMenuItem.subMenu && !!statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex] &&
statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex].icon.toString() !== "") {
return statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex].icon;
} else if (!!statusPopupMenuItem.action && statusPopupMenuItem.action.icon.name !== "") {
return statusPopupMenuItem.action.icon.name;
} else if (statusPopupMenuItem.action.iconSettings.name !== "") {
return statusPopupMenuItem.action.iconSettings.name;
} else {
return "";
}
return statusPopupMenuItem.action.icon.name ||
statusPopupMenuItem.action.iconSettings.name
}
}
color: {
let c = statusPopupMenuItem.action.iconSettings.color ||
statusPopupMenuItem.action.icon.color
@ -195,7 +204,7 @@ Menu {
background: Rectangle {
color: {
if (hovered) {
if (statusPopupMenuItem.hovered) {
return statusPopupMenuItem.action.type === StatusMenuItem.Type.Danger ? Theme.palette.dangerColor3 : Theme.palette.statusPopupMenu.hoverBackgroundColor
}
return "transparent"
@ -204,9 +213,8 @@ Menu {
MouseArea {
id: sensor
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
cursorShape: Qt.PointingHandCursor
hoverEnabled: statusPopupMenuItem.action.enabled
onPressed: mouse.accepted = false
}

144
ui/StatusQ/src/StatusQ/Popups/StatusSearchLocationMenu.qml Normal file
View File

@ -0,0 +1,144 @@
import QtQuick 2.12
import QtQuick.Controls 2.14
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Popups 0.1
StatusPopupMenu {
id: root
property var searchPopup
property var locatioModel
signal subMenuClicked()
signal subMenuItemClicked()
signal anywhereItemClicked()
signal menuItemNoSubMenuClicked()
StatusMenuItem {
text: "Anywhere"
onTriggered: {
searchPopup.resetSelectionBadge();
searchPopup.searchSelectionButton.primaryText = text;
root.anywhereItemClicked();
}
}
StatusMenuSeparator { }
//Dummy item to keep seperator in right position
MenuItem { implicitHeight: 0.00001 }
Instantiator {
model: root.locatioModel
delegate: Loader {
sourceComponent: (!!model.subItems && model.subItems.count > 0) ? subMenus : subMenuItemComponent
onLoaded: {
if (!!model.subItems && model.subItems.count > 0) {
item.title = model.title;
item.subItemsModel = model.subItems;
item.parentIconName = model.iconName;
item.parentImageSource = model.imageSource;
item.parentIdenticonColor = !!model.iconColor ? model.iconColor : Theme.palette.primaryColor1;
item.parentIsIdenticon = model.isIdenticon;
root.subMenuItemIcons.push({
source: model.imageSource,
icon: model.iconName,
isIdenticon: model.isIdenticon,
color: model.iconColor,
isLetterIdenticon: !model.imageSource && !model.iconName
});
root.insertMenu(index+2, item);
} else {
item.text = model.title;
item.iconSettings.name = model.iconName;
item.iconSettings.color = model.iconColor;
item.iconSettings.isLetterIdenticon = !model.imageSource && !model.iconName
item.image.source = model.imageSource;
item.image.isIdenticon = model.isIdenticon;
root.insertItem(index+2, item);
}
}
}
onObjectRemoved: { root.removeItem(root.takeItem(index+2)); }
}
Component {
id: subMenuItemComponent
StatusSearchPopupMenuItem {
onClicked: {
searchPopup.resetSelectionBadge()
searchPopup.searchSelectionButton.primaryText = text;
searchPopup.searchSelectionButton.image.source = image.source;
searchPopup.searchSelectionButton.image.isIdenticon = image.isIdenticon;
searchPopup.searchSelectionButton.iconSettings.name = iconSettings.name;
searchPopup.searchSelectionButton.iconSettings.color = !!iconSettings.color ? iconSettings.color : Theme.palette.primaryColor1
searchPopup.searchSelectionButton.iconSettings.isLetterIdenticon = !iconSettings.name && !image.source
root.menuItemNoSubMenuClicked();
}
}
}
Component {
id: subMenus
StatusPopupMenu {
id: menu
property var subItemsModel
property string parentIconName
property string parentImageSource
property string parentIdenticonColor
property string parentIsIdenticon
Repeater {
id: menuLoader
model: menu.subItemsModel
property string parentTitleText: menu.title
property string parentIconName: menu.parentIconName
property string parentImageSource: menu.parentImageSource
property string parentIdenticonColor: menu.parentIdenticonColor
property string parentIsIdenticon: menu.parentIsIdenticon
Loader {
id: subMenuLoader
sourceComponent: StatusSearchPopupMenuItem {
text: model.text
image.source: model.imageSource
iconSettings.name: model.iconName
iconSettings.color: model.iconColor
image.isIdenticon: model.isIdenticon
onTriggered: {
searchPopup.resetSelectionBadge();
if (menuLoader.parentTitleText === "Chat") {
searchPopup.searchSelectionButton.primaryText = model.text;
searchPopup.searchSelectionButton.image.source = model.imageSource;
searchPopup.searchSelectionButton.image.isIdenticon = model.isIdenticon;
searchPopup.searchSelectionButton.iconSettings.name = model.iconName;
searchPopup.searchSelectionButton.iconSettings.color = !!model.iconColor ? model.iconColor : Theme.palette.primaryColor1;
searchPopup.searchSelectionButton.iconSettings.isLetterIdenticon = !model.iconName && !model.imageSource
} else {
searchPopup.searchSelectionButton.primaryText = menuLoader.parentTitleText;
searchPopup.searchSelectionButton.secondaryText = model.text;
searchPopup.searchSelectionButton.image.source = menuLoader.parentImageSource;
searchPopup.searchSelectionButton.image.isIdenticon = menuLoader.parentIsIdenticon;
searchPopup.searchSelectionButton.iconSettings.name = menuLoader.parentIconName;
searchPopup.searchSelectionButton.iconSettings.color = !!menuLoader.parentIdenticonColor ? menuLoader.parentIdenticonColor : Theme.palette.primaryColor1;
searchPopup.searchSelectionButton.iconSettings.isLetterIdenticon = !menuLoader.parentIconName && !menuLoader.parentImageSource
}
root.subMenuItemClicked();
root.dismiss();
}
}
}
}
}
}
onMenuItemClicked: {
searchPopup.resetSelectionBadge();
let menuItem = root.menuAt(root.currentIndex)
searchPopup.searchSelectionButton.primaryText = menuItem.title;
searchPopup.searchSelectionButton.image.source = menuItem.parentImageSource;
searchPopup.searchSelectionButton.image.isIdenticon = menuItem.parentIsIdenticon;
searchPopup.searchSelectionButton.iconSettings.name = menuItem.parentIconName;
searchPopup.searchSelectionButton.iconSettings.color = menuItem.parentIdenticonColor;
searchPopup.searchSelectionButton.iconSettings.isLetterIdenticon = !menuItem.parentIconName && !menuItem.parentImageSource
root.subMenuClicked();
//TODO fix error "QML StatusPopupMenu: cannot find any window to open popup in."
root.dismiss();
}
}

315
ui/StatusQ/src/StatusQ/Popups/StatusSearchPopup.qml Normal file
View File

@ -0,0 +1,315 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.12
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Popups 0.1
StatusModal {
id: root
width: 700
height: (!!searchResults && (searchResults.count >= 0) && (searchText !== "")) ? (((searchResults.count < 5)) ? 560 : 770) : 142 //970
anchors.centerIn: parent
showHeader: false
showFooter: false
property string searchText: contentComponent.searchText
property string noResultsLabel: "No results"
property bool loading
property Menu searchOptionsPopupMenu: Menu { }
property var searchResults: [ ]
property var searchSelectionButton
function resetSelectionBadge() {
searchSelectionButton.iconSettings.name = ""
searchSelectionButton.iconSettings.isLetterIdenticon = false
searchSelectionButton.iconSettings.color = "transparent"
searchSelectionButton.image.source = ""
searchSelectionButton.image.isIdenticon = false
searchSelectionButton.primaryText = qsTr("Anywhere");
searchSelectionButton.secondaryText = "";
}
content: Item {
width: parent.width
height: root.height
property alias searchText: inputText.text
ColumnLayout {
id: contentItemColumn
anchors.fill: parent
spacing: 0
Item {
Layout.fillWidth: true
Layout.preferredHeight: 63
StatusIcon {
id: statusIcon
width: 40
height: 40
anchors.left: parent.left
anchors.leftMargin: 12
anchors.verticalCenter: parent.verticalCenter
icon: "search"
color: Theme.palette.baseColor1
}
TextEdit {
id: inputText
anchors.left: statusIcon.right
anchors.leftMargin: 15
anchors.right: parent.right
anchors.rightMargin: 8
anchors.verticalCenter: parent.verticalCenter
focus: true
font.pixelSize: 28
font.family: Theme.palette.baseFont.name
color: Theme.palette.directColor1
}
}
StatusMenuSeparator {
topPadding: 0
Layout.fillWidth: true
}
Item {
Layout.preferredWidth: parent.width
Layout.preferredHeight: 58
Button {
id: searchOptionsMenuButton
Component.onCompleted: {
root.searchSelectionButton = searchOptionsMenuButton
}
property string prefixText: "In"
property string primaryText: ""
property string secondaryText: ""
property StatusIconSettings iconSettings: StatusIconSettings {
name: ""
isLetterIdenticon: false
}
property StatusImageSettings image: StatusImageSettings {
source: ""
isIdenticon: false
}
anchors.left: parent.left
anchors.leftMargin: 16
anchors.verticalCenter: parent.verticalCenter
implicitWidth: (contentItemRowLayout.width + 24)
implicitHeight: 32
background: Rectangle {
anchors.fill: parent
color: Theme.palette.baseColor2
radius: 8
}
contentItem: Item {
anchors.fill: parent
MouseArea {
id: sensor
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: root.searchOptionsPopupMenu.popup();
RowLayout {
id: contentItemRowLayout
anchors.centerIn: parent
spacing: 2
StatusBaseText {
color: Theme.palette.directColor1
text: searchOptionsMenuButton.prefixText + ": "
font.weight: Font.Medium
}
Loader {
Layout.preferredWidth: active ? 16 : 0
Layout.preferredHeight: 16
active: searchOptionsMenuButton.iconSettings.name ||
searchOptionsMenuButton.iconSettings.isLetterIdenticon ||
!!searchOptionsMenuButton.image.source.toString()
sourceComponent: {
if (!!searchOptionsMenuButton.image.source.toString()) {
return statusRoundedImageCmp
}
if (!!searchOptionsMenuButton.iconSettings.isLetterIdenticon || !searchOptionsMenuButton.iconSettings.name) {
return statusLetterIdenticonCmp
}
return statusIconCmp
}
}
Component {
id: statusIconCmp
StatusIcon {
width: 16
icon: searchOptionsMenuButton.iconSettings.name
color: searchOptionsMenuButton.iconSettings.color
}
}
Component {
id: statusRoundedImageCmp
Item {
width: 16
height: 16
StatusRoundedImage {
id: statusRoundedImage
implicitWidth: parent.width
implicitHeight: parent.height
image.source: searchOptionsMenuButton.image.source
color: searchOptionsMenuButton.image.isIdenticon ?
Theme.palette.statusRoundedImage.backgroundColor :
"transparent"
border.width: searchOptionsMenuButton.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
}
Loader {
sourceComponent: statusLetterIdenticonCmp
active: statusRoundedImage.image.status === Image.Error
}
}
}
Component {
id: statusLetterIdenticonCmp
StatusLetterIdenticon {
implicitWidth: 16
implicitHeight: 16
letterSize: 11
color: searchOptionsMenuButton.iconSettings.color
name: searchOptionsMenuButton.primaryText
}
}
StatusBaseText {
color: Theme.palette.directColor1
text: searchOptionsMenuButton.primaryText
font.weight: Font.Medium
}
StatusIcon {
Layout.preferredWidth: 14.5
Layout.preferredHeight: 17.5
Layout.alignment: Qt.AlignVCenter
visible: !!searchOptionsMenuButton.secondaryText
color: Theme.palette.baseColor1
icon: "next"
}
StatusBaseText {
color: Theme.palette.directColor1
visible: !!searchOptionsMenuButton.secondaryText
text: "# " + searchOptionsMenuButton.secondaryText
font.weight: Font.Medium
}
StatusIcon {
Layout.preferredWidth: 17.5
Layout.preferredHeight: 14.5
Layout.alignment: Qt.AlignVCenter
icon: "chevron-down"
color: Theme.palette.directColor1
}
}
}
}
}
StatusFlatRoundButton {
id: closeButton
width: 32
height: 32
anchors.left: searchOptionsMenuButton.right
anchors.leftMargin: 4
anchors.verticalCenter: parent.verticalCenter
opacity: (searchOptionsMenuButton.primaryText === qsTr("Anywhere")) ? 0.0 : 1.0
visible: (opacity > 0.1)
type: StatusFlatRoundButton.Type.Secondary
icon.name: "close"
icon.color: Theme.palette.directColor1
icon.width: 20
icon.height: 20
onClicked: { root.resetSelectionBadge(); }
}
}
StatusMenuSeparator { Layout.fillWidth: true; visible: (root.height > 142) }
Item {
Layout.fillWidth: true
Layout.fillHeight: true
clip: true
ListView {
id: view
anchors.fill: parent
anchors {
leftMargin: 0
rightMargin: 0
bottomMargin: 67
}
visible: (!root.loading && (count > 0))
model: root.searchResults
ScrollBar.vertical: ScrollBar { }
delegate: StatusListItem {
width: view.width
title: model.name
statusListItemTitle.color: model.name.startsWith("@") ? Theme.palette.primaryColor1 : Theme.palette.directColor1
subTitle: model.content
radius: 0
statusListItemSubTitle.height: model.content !== "" ? 20 : 0
statusListItemSubTitle.elide: Text.ElideRight
statusListItemSubTitle.color: Theme.palette.black
icon.isLetterIdenticon: (model.badgeImage === "")
titleAsideText: model.time
image.source: model.badgeImage
badge.primaryText: model.badgePrimaryText
badge.secondaryText: model.badgeSecondaryText
badge.image.source: model.badgeImage
badge.icon.isLetterIdenticon: model.isLetterIdenticon
badge.icon.color: model.badgeIdenticonColor
}
section.property: "sectionName"
section.criteria: ViewSection.FullString
section.delegate: Item {
height: 34
width: view.width
StatusBaseText {
font.pixelSize: 15
color: Theme.palette.baseColor1
text: section
anchors.left: parent.left
anchors.leftMargin: 16
anchors.bottom: parent.bottom
anchors.bottomMargin: 4
}
}
}
StatusLoadingIndicator {
anchors.centerIn: parent
visible: root.loading
color: Theme.palette.primaryColor1
width: 24
height: 24
}
StatusBaseText {
anchors.centerIn: parent
text: root.noResultsLabel
color: Theme.palette.baseColor1
font.pixelSize: 13
visible: ((inputText.text !== "") && (view.count === 0) && !root.loading)
}
}
}
}
onClosed: {
root.resetSelectionBadge();
root.loading = false;
contentComponent.searchText = "";
}
}

77
ui/StatusQ/src/StatusQ/Popups/StatusSearchPopupMenuItem.qml Normal file
View File

@ -0,0 +1,77 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.12
import StatusQ.Components 0.1
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
MenuItem {
id: root
implicitHeight: 38
property StatusImageSettings image: StatusImageSettings {
height: 16
width: 16
isIdenticon: false
}
property StatusIconSettings iconSettings: StatusIconSettings {
height: 16
width: 16
isLetterIdenticon: (root.image.source.toString() === ""
&& root.iconSettings.name.toString() === "")
background: StatusIconBackgroundSettings {}
color: "transparent"
}
background: Rectangle {
color: root.hovered ? Theme.palette.statusPopupMenu.hoverBackgroundColor : "transparent"
}
contentItem: RowLayout {
anchors.left: parent.left
anchors.leftMargin: 12
StatusIcon {
Layout.preferredWidth: visible ? root.iconSettings.width : 0
Layout.preferredHeight: visible ? root.iconSettings.height : 0
Layout.alignment: Qt.AlignVCenter
visible: !!root.iconSettings.name && !root.image.source.toString()
icon: root.iconSettings.name
color: root.iconSettings.color
}
StatusRoundedImage {
Layout.preferredWidth: visible ? root.image.width : 0
Layout.preferredHeight: visible ? root.image.height : 0
Layout.alignment: Qt.AlignVCenter
visible: root.image.source.toString() !== ""
image.source: root.image.source
border.width: root.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
}
StatusLetterIdenticon {
Layout.preferredWidth: visible ? root.iconSettings.width : 0
Layout.preferredHeight: visible ? root.iconSettings.height : 0
visible: root.iconSettings.isLetterIdenticon && !root.iconSettings.name && !root.image.source.toString()
color: root.iconSettings.color
name: root.text
letterSize: 11
}
StatusBaseText {
Layout.fillWidth: true
Layout.alignment: Qt.AlignVCenter
text: root.text
color: Theme.palette.directColor1
font.pixelSize: 13
elide: Text.ElideRight
}
Item {
Layout.fillWidth: true
}
}
MouseArea {
id: sensor
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onPressed: mouse.accepted = false
}
}

3
ui/StatusQ/src/StatusQ/Popups/qmldir
View File

@ -5,4 +5,7 @@ StatusPopupMenu 0.1 StatusPopupMenu.qml
StatusMenuItem 0.1 StatusMenuItem.qml
StatusMenuHeadline 0.1 StatusMenuHeadline.qml
StatusModal 0.1 StatusModal.qml
StatusSearchPopup 0.1 StatusSearchPopup.qml
StatusModalDivider 0.1 StatusModalDivider.qml
StatusSearchPopupMenuItem 0.1 StatusSearchPopupMenuItem.qml
StatusSearchLocationMenu 0.1 StatusSearchLocationMenu.qml

2
ui/StatusQ/src/StatusQ/Popups/statusModal/StatusModalFooter.qml
View File

@ -30,7 +30,7 @@ Rectangle {
}
}
implicitHeight: rootLayout.implicitHeight + 30
implicitHeight: visible ? rootLayout.implicitHeight + 30 : 0
RowLayout {
id: rootLayout

2
ui/StatusQ/src/StatusQ/Popups/statusModal/StatusModalHeader.qml
View File

@ -20,7 +20,7 @@ Rectangle {
signal editButtonClicked
signal close
implicitHeight: Math.max(closeButton.height, imageWithTitle.implicitHeight) + 32
implicitHeight: visible? Math.max(closeButton.height, imageWithTitle.implicitHeight) + 32 : 0
implicitWidth: 480
radius: 16

4
ui/StatusQ/statusq.qrc
View File

@ -250,5 +250,9 @@
<file>src/StatusQ/Popups/statusModal/StatusModalHeader.qml</file>
<file>src/StatusQ/Popups/StatusModal.qml</file>
<file>src/StatusQ/Core/StatusModalHeaderSettings.qml</file>
<file>src/StatusQ/Popups/StatusSearchPopup.qml</file>
<file>src/StatusQ/Components/StatusListItemBadge.qml</file>
<file>src/StatusQ/Popups/StatusSearchPopupMenuItem.qml</file>
<file>src/StatusQ/Popups/StatusSearchLocationMenu.qml</file>
</qresource>
</RCC>