From 4cb28fee1233004286ce1280af67ff5ac3548abd Mon Sep 17 00:00:00 2001 From: Noelia Date: Tue, 1 Feb 2022 16:20:57 +0100 Subject: [PATCH] chore(demoApp): restore DemoApp to have the latest changes from both master and base_bc Updated DemoApp, main and Models to have the latest changes from both master and base_bc --- ui/StatusQ/sandbox/DemoApp.qml | 521 +----------------- ui/StatusQ/sandbox/Models.qml | 498 ----------------- .../sandbox/demoapp/StatusAppChatView.qml | 5 +- .../demoapp/StatusAppCommunityView.qml | 4 +- ui/StatusQ/sandbox/demoapp/data/Models.qml | 357 +++++++++--- ui/StatusQ/sandbox/main.qml | 19 +- 6 files changed, 298 insertions(+), 1106 deletions(-) delete mode 100644 ui/StatusQ/sandbox/Models.qml diff --git a/ui/StatusQ/sandbox/DemoApp.qml b/ui/StatusQ/sandbox/DemoApp.qml index a3feb05347..7ca2308c81 100644 --- a/ui/StatusQ/sandbox/DemoApp.qml +++ b/ui/StatusQ/sandbox/DemoApp.qml @@ -10,6 +10,7 @@ import StatusQ.Popups 0.1 import StatusQ.Platform 0.1 import "demoapp" +import "demoapp/data" 1.0 Rectangle { id: demoApp @@ -33,15 +34,15 @@ Rectangle { } function setActiveItem(sectionId) { - for (var i = 0; i < models.demoAppSectionsModel.count; i++) { - let item = models.demoAppSectionsModel.get(i) + for (var i = 0; i < Models.demoAppSectionsModel.count; i++) { + let item = Models.demoAppSectionsModel.get(i) if (item.sectionId !== sectionId) { - models.demoAppSectionsModel.setProperty(i, "active", false) + Models.demoAppSectionsModel.setProperty(i, "active", false) continue } - models.demoAppSectionsModel.setProperty(i, "active", true); + Models.demoAppSectionsModel.setProperty(i, "active", true); } } @@ -77,7 +78,7 @@ Rectangle { communityTypeRole: "sectionType" communityTypeValue: appSectionType.community - sectionModel: models.demoAppSectionsModel + sectionModel: Models.demoAppSectionsModel property bool communityAdded: false @@ -185,514 +186,16 @@ Rectangle { Component { id: statusAppChatView - - StatusAppTwoPanelLayout { - - leftPanel: Item { - anchors.fill: parent - - StatusNavigationPanelHeadline { - id: headline - anchors.top: parent.top - anchors.topMargin: 16 - anchors.horizontalCenter: parent.horizontalCenter - text: "Chat" - } - - Item { - id: searchInputWrapper - anchors.top: headline.bottom - anchors.topMargin: 16 - width: parent.width - height: searchInput.height - - StatusBaseInput { - id: searchInput - - anchors.verticalCenter: parent.verticalCenter - anchors.left: parent.left - anchors.right: actionButton.left - anchors.leftMargin: 16 - anchors.rightMargin: 16 - - height: 36 - topPadding: 8 - bottomPadding: 0 - placeholderText: "Search" - icon.name: "search" - } - - StatusRoundButton { - id: actionButton - anchors.verticalCenter: parent.verticalCenter - anchors.right: parent.right - anchors.rightMargin: 8 - width: 32 - height: 32 - - type: StatusRoundButton.Type.Secondary - icon.name: "add" - state: "default" - - onClicked: chatContextMenu.popup(actionButton.width-chatContextMenu.width, actionButton.height + 4) - states: [ - State { - name: "default" - PropertyChanges { - target: actionButton - icon.rotation: 0 - highlighted: false - } - }, - State { - name: "pressed" - PropertyChanges { - target: actionButton - icon.rotation: 45 - highlighted: true - } - } - ] - - transitions: [ - Transition { - from: "default" - to: "pressed" - - RotationAnimation { - duration: 150 - direction: RotationAnimation.Clockwise - easing.type: Easing.InCubic - } - }, - Transition { - from: "pressed" - to: "default" - RotationAnimation { - duration: 150 - direction: RotationAnimation.Counterclockwise - easing.type: Easing.OutCubic - } - } - ] - - StatusPopupMenu { - id: chatContextMenu - - onOpened: { - actionButton.state = "pressed" - } - - onClosed: { - actionButton.state = "default" - } - - StatusMenuItem { - text: "Start new chat" - icon.name: "private-chat" - } - - StatusMenuItem { - text: "Start group chat" - icon.name: "group-chat" - } - - StatusMenuItem { - text: "Join public chat" - icon.name: "public-chat" - } - - StatusMenuItem { - text: "Communities" - icon.name: "communities" - } - } - } - } - - Column { - anchors.top: searchInputWrapper.bottom - anchors.topMargin: 16 - width: parent.width - spacing: 8 - - StatusContactRequestsIndicatorListItem { - anchors.horizontalCenter: parent.horizontalCenter - title: "Contact requests" - requestsCount: 3 - sensor.onClicked: demoContactRequestsModal.open() - } - - StatusChatList { - anchors.horizontalCenter: parent.horizontalCenter - - model: models.demoChatListItems - onChatItemUnmuted: { - for (var i = 0; i < models.demoChatListItems.count; i++) { - let item = models.demoChatListItems.get(i); - if (item.chatId === id) { - models.demoChatListItems.setProperty(i, "muted", false) - } - } - } - - popupMenu: StatusPopupMenu { - - property string chatId - - openHandler: function (id) { - chatId = id - } - - StatusMenuItem { - text: "View Profile" - icon.name: "group-chat" - } - - StatusMenuSeparator {} - - StatusMenuItem { - text: "Mute chat" - icon.name: "notification" - } - - StatusMenuItem { - text: "Mark as Read" - icon.name: "checkmark-circle" - } - - StatusMenuItem { - text: "Clear history" - icon.name: "close-circle" - } - - StatusMenuSeparator {} - - StatusMenuItem { - text: "Delete chat" - icon.name: "delete" - type: StatusMenuItem.Type.Danger - } - } - } - } - } - - rightPanel: Item { - anchors.fill: parent - - StatusChatToolBar { - anchors.top: parent.top - width: parent.width - - chatInfoButton.title: "Amazing Funny Squirrel" - chatInfoButton.subTitle: "Contact" - chatInfoButton.icon.color: Theme.palette.miscColor7 - chatInfoButton.type: StatusChatInfoButton.Type.OneToOneChat - chatInfoButton.pinnedMessagesCount: 1 - - searchButton.visible: false - membersButton.visible: false - notificationCount: 1 - - onNotificationButtonClicked: notificationCount = 0 - - popupMenu: StatusPopupMenu { - id: contextMenu - - StatusMenuItem { - text: "Mute Chat" - icon.name: "notification" - } - StatusMenuItem { - text: "Mark as Read" - icon.name: "checkmark-circle" - } - StatusMenuItem { - text: "Clear History" - icon.name: "close-circle" - } - - StatusMenuSeparator {} - - StatusMenuItem { - text: "Leave Chat" - icon.name: "arrow-right" - icon.width: 14 - iconRotation: 180 - type: StatusMenuItem.Type.Danger - } - } - } - } - } + StatusAppChatView { } } Component { id: statusAppCommunityView - - StatusAppThreePanelLayout { - id: root - - handle: Rectangle { - implicitWidth: 5 - color: SplitHandle.pressed ? Theme.palette.baseColor2 - : (SplitHandle.hovered ? Qt.darker(Theme.palette.baseColor5, 1.1) : "transparent") - } - leftPanel: Item { - id: leftPanel - - StatusChatInfoToolBar { - id: statusChatInfoToolBar - - anchors.top: parent.top - anchors.horizontalCenter: parent.horizontalCenter - - chatInfoButton.title: "CryptoKitties" - chatInfoButton.subTitle: "128 Members" - chatInfoButton.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg" - chatInfoButton.icon.color: Theme.palette.miscColor6 - chatInfoButton.onClicked: demoCommunityDetailModal.open() - - popupMenu: StatusPopupMenu { - - StatusMenuItem { - text: "Create channel" - icon.name: "channel" - } - - StatusMenuItem { - text: "Create category" - icon.name: "channel-category" - } - - StatusMenuSeparator {} - - StatusMenuItem { - text: "Invite people" - icon.name: "share-ios" - } - - } - } - - ScrollView { - id: scrollView - - anchors.top: statusChatInfoToolBar.bottom - anchors.topMargin: 8 - anchors.bottom: parent.bottom - width: leftPanel.width - - contentHeight: communityCategories.height - clip: true - - StatusChatListAndCategories { - id: communityCategories - width: leftPanel.width - height: implicitHeight > (leftPanel.height - 64) ? implicitHeight + 8 : leftPanel.height - 64 - - draggableItems: true - draggableCategories: false - model: models.demoCommunityChatListItems - showCategoryActionButtons: true - - categoryPopupMenu: StatusPopupMenu { - - property string categoryId - - openHandler: function (id) { - categoryId = id - } - - StatusMenuItem { - text: "Mute Category" - icon.name: "notification" - } - - StatusMenuItem { - text: "Mark as Read" - icon.name: "checkmark-circle" - } - - StatusMenuItem { - text: "Edit Category" - icon.name: "edit" - } - - StatusMenuSeparator {} - - StatusMenuItem { - text: "Delete Category" - icon.name: "delete" - type: StatusMenuItem.Type.Danger - } - } - - chatListPopupMenu: StatusPopupMenu { - - property string chatId - - StatusMenuItem { - text: "Mute chat" - icon.name: "notification" - } - - StatusMenuItem { - text: "Mark as Read" - icon.name: "checkmark-circle" - } - - StatusMenuItem { - text: "Clear history" - icon.name: "close-circle" - } - - StatusMenuSeparator {} - - StatusMenuItem { - text: "Delete chat" - icon.name: "delete" - type: StatusMenuItem.Type.Danger - } - } - - popupMenu: StatusPopupMenu { - StatusMenuItem { - text: "Create channel" - icon.name: "channel" - } - - StatusMenuItem { - text: "Create category" - icon.name: "channel-category" - } - - StatusMenuSeparator {} - - StatusMenuItem { - text: "Invite people" - icon.name: "share-ios" - } - } - } - } - } - - centerPanel: Item { - StatusChatToolBar { - id: statusChatToolBar - anchors.top: parent.top - width: parent.width - - chatInfoButton.title: "general" - chatInfoButton.subTitle: "Community Chat" - chatInfoButton.icon.color: Theme.palette.miscColor6 - chatInfoButton.type: StatusChatInfoButton.Type.CommunityChat - onSearchButtonClicked: { - searchButton.highlighted = !searchButton.highlighted; - searchPopup.setSearchSelection(demoCommunityDetailModal.header.title, - "", - 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 - locationModel: models.optionsModel - } - } - - rightPanel: Item { - id: rightPanel - StatusBaseText { - id: titleText - anchors.top: parent.top - anchors.topMargin:16 - anchors.left: parent.left - anchors.leftMargin: 16 - opacity: (rightPanel.width > 50) ? 1.0 : 0.0 - visible: (opacity > 0.1) - font.pixelSize: 15 - text: qsTr("Members") - } - - ListView { - anchors.top: titleText.bottom - anchors.topMargin: 16 - anchors.left: parent.left - anchors.leftMargin: 8 - anchors.right: parent.right - anchors.rightMargin: 8 - anchors.bottom: parent.bottom - anchors.bottomMargin: 16 - boundsBehavior: Flickable.StopAtBounds - model: ["John", "Nick", "Maria", "Mike"] - delegate: Row { - width: parent.width - height: 30 - spacing: 8 - Rectangle { - width: 24 - height: 24 - radius: width/2 - color: Qt.rgba(Math.random(), Math.random(), Math.random(), 255) - } - StatusBaseText { - height: parent.height - horizontalAlignment: Text.AlignHCenter - opacity: (rightPanel.width > 50) ? 1.0 : 0.0 - visible: (opacity > 0.1) - font.pixelSize: 15 - color: Theme.palette.directColor1 - text: modelData - } - } - } + StatusAppCommunityView { + communityDetailModalTitle: demoCommunityDetailModal.header.title + communityDetailModalImage: demoCommunityDetailModal.header.image.source + onChatInfoButtonClicked: { + demoCommunityDetailModal.open(); } } } diff --git a/ui/StatusQ/sandbox/Models.qml b/ui/StatusQ/sandbox/Models.qml deleted file mode 100644 index a27f95bf1b..0000000000 --- a/ui/StatusQ/sandbox/Models.qml +++ /dev/null @@ -1,498 +0,0 @@ -import QtQuick 2.14 -import StatusQ.Components 0.1 - -QtObject { - - property var demoChatListItems: ListModel { - id: demoChatListItems - ListElement { - itemId: "x012340000" - name: "#status" - icon: "" - isIdenticon: false - color: "blue" - description: "" - type: StatusChatListItem.Type.PublicChat - hasUnreadMessages: true - notificationsCount: 0 - muted: false - active: false - position: 0 - subItems: [] - } - ListElement { - itemId: "x012340001" - name: "status-desktop" - icon: "" - isIdenticon: false - color: "red" - description: "" - type: StatusChatListItem.Type.PublicChat - hasUnreadMessages: true - notificationsCount: 1 - muted: false - active: false - position: 1 - subItems: [] - } - ListElement { - itemId: "x012340002" - name: "Amazing Funny Squirrel" - icon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh -CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC" - isIdenticon: true - color: "green" - description: "" - type: StatusChatListItem.Type.OneToOneChat - hasUnreadMessages: false - notificationsCount: 0 - muted: false - active: true - position: 2 - subItems: [] - } - ListElement { - itemId: "x012340003" - name: "Black Ops" - icon: "" - isIdenticon: false - color: "purple" - description: "" - type: StatusChatListItem.Type.OneToOneChat - hasUnreadMessages: false - notificationsCount: 0 - muted: false - active: false - position: 3 - subItems: [] - } - ListElement { - itemId: "x012340004" - name: "Spectacular Growing Otter" - icon: "" - isIdenticon: false - color: "orange" - description: "" - type: StatusChatListItem.Type.OneToOneChat - hasUnreadMessages: false - notificationsCount: 0 - muted: false - active: false - position: 4 - subItems: [] - } - ListElement { - itemId: "x012340005" - name: "channel-with-a-super-duper-long-name" - icon: "" - isIdenticon: false - color: "green" - description: "" - type: StatusChatListItem.Type.PublicChat - hasUnreadMessages: false - notificationsCount: 0 - muted: false - active: false - position: 5 - subItems: [] - } - } - - property var demoCommunityChatListItems: ListModel { - id: demoCommunityChatListItems - ListElement { - itemId: "x012340000" - name: "general" - icon: "" - isIdenticon: false - color: "orange" - description: "" - type: StatusChatListItem.Type.CommunityChat - hasUnreadMessages: true - notificationsCount: 0 - muted: false - active: false - position: 0 - subItems: [] - } - ListElement { - itemId: "x012340001" - name: "Public" - icon: "" - isIdenticon: false - color: "orange" - description: "" - type: StatusChatListItem.Type.Unknown0 - hasUnreadMessages: false - notificationsCount: 0 - muted: false - active: true - position: 1 - subItems: [ - ListElement { - itemId: "x012340002" - parentItemId: "x012340001" - name: "random" - icon: "" - isIdenticon: false - color: "orange" - description: "" - hasUnreadMessages: true - notificationsCount: 4 - muted: false - active: false - position: 0 - }, - ListElement { - itemId: "x012340003" - parentItemId: "x012340001" - name: "watercooler" - icon: "" - isIdenticon: false - color: "orange" - description: "" - hasUnreadMessages: false - notificationsCount: 0 - muted: false - active: true - position: 1 - } - ] - } - ListElement { - itemId: "x012340004" - name: "Development" - icon: "" - isIdenticon: false - color: "orange" - description: "" - type: StatusChatListItem.Type.Unknown0 - hasUnreadMessages: false - notificationsCount: 0 - muted: false - active: false - position: 2 - subItems: [ - ListElement { - itemId: "x012340005" - parentItemId: "x012340004" - name: "language-design" - icon: "" - isIdenticon: false - color: "orange" - description: "" - hasUnreadMessages: false - notificationsCount: 0 - muted: true - active: false - position: 0 - } - ] - } - } - - 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 { itemId: "i1"; titleId: "t1"; title: "@Flea"; sectionName: "Messages"; time: "18:55 AM"; content: "lorem ipsum @Nick dolor sit amet"; - image: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"; - color: "orange"; - badgeImage: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"; - badgePrimaryText: "CryptoKities"; - badgeSecondaryText: ""; - badgeIconColor: ""; - badgeIsLetterIdenticon: false } - ListElement { itemId: "i2"; titleId: "t2"; image: ""; color: "blue"; title: "core"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i3"; titleId: "t3"; image: ""; color: "yellow"; title: "communities-phase3"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i4"; titleId: "t4"; image: ""; color: "black"; title: "core-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i5"; titleId: "t5"; image: ""; color: "green"; title: "desktop"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i6"; titleId: "t6"; image: ""; color: "red"; title: "Crocodile Vanilla Bird"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i7"; titleId: "t7"; image: ""; color: "purple"; title: "carmen eth"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i8"; titleId: "t8"; image: ""; color: "red"; title: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i9"; titleId: "t9"; image: ""; color: "blue"; title: "MyCommunity"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i10"; titleId: "t10"; image: ""; color: "green"; title: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - } - property var searchResultsB: ListModel { - ListElement { itemId: "i1"; titleId: "t1"; title: "@Ant"; sectionName: "Messages"; time: "11:43 AM"; content: "@John, 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 "; - image: ""; - color: "orange"; - badgeImage: ""; - badgePrimaryText: "CryptoKities"; - badgeSecondaryText: "#design"; - badgeIconColor: "pink"; badgeIsLetterIdenticon: true } - ListElement { itemId: "i2"; titleId: "t2"; image: ""; color: "blue"; title: "support"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i3"; titleId: "t3"; image: ""; color: "red"; title: "desktop-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i4"; titleId: "t4"; image: ""; color: "orange"; title: "climate-change"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i5"; titleId: "t5"; image: ""; color: "black"; title: "food"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: "pink"; badgeIsLetterIdenticon: true } - ListElement { itemId: "i6"; titleId: "t6"; image: ""; color: "green"; title: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i7"; titleId: "t7"; image: ""; color: "purple"; title: "CryptoRangers"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false } - ListElement { itemId: "i8"; titleId: "t8"; image: ""; color: "yellow"; title: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: "orange"; badgeIsLetterIdenticon: true } - } - - property ListModel optionsModel: ListModel { - ListElement { - value: "item_1" - title: "Item with icon" - imageSource: "" - iconName: "chat" - iconColor: "" - isIdenticon: false - subItems: [ - ListElement { - value: "sub_item_1_1" - text: "Profile image item" - imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg" - iconName: "" - iconColor: "" - isIdenticon: false - }, - ListElement { - value: "sub_item_1_2" - text: "identicon item" - imageSource: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC" - iconName: "" - iconColor: "" - isIdenticon: true - }]} - ListElement { - value: "item_2" - title: "Community item"; - imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg" - iconName: "" - iconColor: "" - isIdenticon: false - subItems: [ - ListElement { - value: "sub_item_2_1" - text: "welcome" - imageSource: "" - iconName: "channel" - iconColor: "" - isIdenticon: false - }, - ListElement { - value: "sub_item_2_2" - text: "support" - imageSource: "" - iconName: "channel" - iconColor: "" - isIdenticon: false - }, - ListElement { - value: "sub_item_2_3" - text: "news" - imageSource: "" - iconName: "channel" - iconColor: "" - isIdenticon: false - }]} - ListElement { - value: "item_3" - title: "Other"; - imageSource: ""; - iconName: "info" - iconColor: "" - isIdenticon: false - subItems: [ - ListElement { - value: "sub_item_3_1" - text: "news" - imageSource: "" - iconName: "channel" - iconColor: "" - isIdenticon: false - }]} - ListElement { - value: "item_4" - title: "Letter identicon"; - imageSource: ""; - iconName: "" - iconColor: "red" - isIdenticon: false - subItems: [ - ListElement { - value: "sub_item_4_1" - text: "news" - imageSource: "" - iconName: "channel" - iconColor: "" - isIdenticon: false - }]} - } - - // App Section Types: - // chat: 0 - // community: 1 - // wallet: 2 - // browser: 3 - // nodeManagement: 4 - // profileSettings: 5 - // apiDocumentation: 100 - // demoApp: 101 - - property ListModel mainAppSectionsModel: ListModel { - ListElement { - sectionId: "mainApp" - sectionType: 100 - name: "API Documentation" - active: true - image: "" - icon: "edit" - color: "" - hasNotification: false - notificationsCount: 0 - } - ListElement { - sectionId: "demoApp" - sectionType: 101 - name: "Demo Application" - active: false - image: "" - icon: "status" - color: "" - hasNotification: false - notificationsCount: 0 - } - } - - property ListModel demoAppSectionsModel: ListModel { - ListElement { - sectionId: "chat" - sectionType: 0 - name: "Chat" - active: true - image: "" - icon: "chat" - color: "" - hasNotification: false - notificationsCount: 0 - } - ListElement { - sectionId: "0x123456789" - sectionType: 1 - name: "Status Community" - active: false - image: "https://assets.brandfetch.io/51a495de903c46a.png" - icon: "" - color: "" - hasNotification: false - notificationsCount: 0 - } - ListElement { - sectionId: "wallet" - sectionType: 2 - name: "Wallet" - active: false - image: "" - icon: "wallet" - color: "" - hasNotification: false - notificationsCount: 0 - } - ListElement { - sectionId: "browser" - sectionType: 3 - name: "Browser" - active: false - image: "" - icon: "bigger/browser" - color: "" - hasNotification: false - notificationsCount: 0 - } - ListElement { - sectionId: "profile" - sectionType: 6 - name: "Profile" - active: false - image: "" - icon: "bigger/settings" - color: "" - hasNotification: true - notificationsCount: 0 - } - } -} diff --git a/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml b/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml index 25595f88d8..19cf4a06c6 100644 --- a/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml +++ b/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml @@ -149,10 +149,7 @@ StatusAppThreePanelLayout { StatusChatList { anchors.horizontalCenter: parent.horizontalCenter - - chatListItems.model: Models.demoChatListItems - selectedChatId: "0" - onChatItemSelected: selectedChatId = id + model: Models.demoChatListItems onChatItemUnmuted: { for (var i = 0; i < Models.demoChatListItems.count; i++) { let item = Models.demoChatListItems.get(i); diff --git a/ui/StatusQ/sandbox/demoapp/StatusAppCommunityView.qml b/ui/StatusQ/sandbox/demoapp/StatusAppCommunityView.qml index 9c971ce651..278974653c 100644 --- a/ui/StatusQ/sandbox/demoapp/StatusAppCommunityView.qml +++ b/ui/StatusQ/sandbox/demoapp/StatusAppCommunityView.qml @@ -77,11 +77,9 @@ StatusAppThreePanelLayout { draggableItems: true draggableCategories: false - chatList.model: Models.demoCommunityChatListItems - categoryList.model: Models.demoCommunityCategoryItems + model: Models.demoCommunityChatListItems showCategoryActionButtons: true - onChatItemSelected: selectedChatId = id categoryPopupMenu: StatusPopupMenu { diff --git a/ui/StatusQ/sandbox/demoapp/data/Models.qml b/ui/StatusQ/sandbox/demoapp/data/Models.qml index 4c7213e57b..91695fd602 100644 --- a/ui/StatusQ/sandbox/demoapp/data/Models.qml +++ b/ui/StatusQ/sandbox/demoapp/data/Models.qml @@ -4,122 +4,216 @@ import StatusQ.Components 0.1 QtObject { - property ListModel demoChatListItems: ListModel { + property var demoChatListItems: ListModel { id: demoChatListItems ListElement { - chatId: "0" + itemId: "x012340000" name: "#status" - chatType: StatusChatListItem.Type.PublicChat - muted: false - unreadMessagesCount: 0 - mentionsCount: 0 + icon: "" + isIdenticon: false color: "blue" + description: "" + type: StatusChatListItem.Type.PublicChat + hasUnreadMessages: true + notificationsCount: 0 + muted: false + active: false position: 0 + isCategory: false + subItems: [] } ListElement { - chatId: "1" + itemId: "x012340001" name: "status-desktop" - chatType: StatusChatListItem.Type.PublicChat - muted: false + icon: "" + isIdenticon: false color: "red" - unreadMessagesCount: 1 - mentionsCount: 1 + description: "" + type: StatusChatListItem.Type.PublicChat + hasUnreadMessages: true + notificationsCount: 1 + muted: false + active: false position: 1 + isCategory: false + subItems: [] } ListElement { - chatId: "2" + itemId: "x012340002" name: "Amazing Funny Squirrel" - chatType: StatusChatListItem.Type.OneToOneChat - muted: false - color: "green" - identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh + icon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC" - unreadMessagesCount: 0 - position: 2 - } - ListElement { - chatId: "3" - name: "Black Ops" - chatType: StatusChatListItem.Type.GroupChat - muted: false - color: "purple" - unreadMessagesCount: 0 - position: 3 - } - ListElement { - chatId: "4" - name: "Spectacular Growing Otter" - chatType: StatusChatListItem.Type.OneToOneChat - muted: true - color: "Orange" - unreadMessagesCount: 0 - position: 4 - } - ListElement { - chatId: "5" - name: "channel-with-a-super-duper-long-name" - chatType: StatusChatListItem.Type.PublicChat - muted: false + isIdenticon: true color: "green" - unreadMessagesCount: 0 + description: "" + type: StatusChatListItem.Type.OneToOneChat + hasUnreadMessages: false + notificationsCount: 0 + muted: false + active: true + position: 2 + isCategory: false + subItems: [] + } + ListElement { + itemId: "x012340003" + name: "Black Ops" + icon: "" + isIdenticon: false + color: "purple" + description: "" + type: StatusChatListItem.Type.OneToOneChat + hasUnreadMessages: false + notificationsCount: 0 + muted: false + active: false + position: 3 + isCategory: false + subItems: [] + } + ListElement { + itemId: "x012340004" + name: "Spectacular Growing Otter" + icon: "" + isIdenticon: false + color: "orange" + description: "" + type: StatusChatListItem.Type.OneToOneChat + hasUnreadMessages: false + notificationsCount: 0 + muted: false + active: false + position: 4 + isCategory: false + subItems: [] + } + ListElement { + itemId: "x012340005" + name: "channel-with-a-super-duper-long-name" + icon: "" + isIdenticon: false + color: "green" + description: "" + type: StatusChatListItem.Type.PublicChat + hasUnreadMessages: false + notificationsCount: 0 + muted: false + active: false position: 5 + isCategory: false + subItems: [] } } property var demoCommunityChatListItems: ListModel { id: demoCommunityChatListItems ListElement { - chatId: "0" + itemId: "x012340000" name: "general" - chatType: StatusChatListItem.Type.CommunityChat - muted: false - unreadMessagesCount: 0 + icon: "" + isIdenticon: false color: "orange" + description: "" + type: StatusChatListItem.Type.Unknown0 + hasUnreadMessages: true + notificationsCount: 0 + muted: false + active: false position: 0 + isCategory: true + subItems: [] } ListElement { - chatId: "1" - name: "random" - chatType: StatusChatListItem.Type.CommunityChat + itemId: "x0125340000" + name: "Pink Channel" + icon: "" + isIdenticon: false + color: "pink" + description: "" + type: StatusChatListItem.Type.CommunityChat + hasUnreadMessages: true + notificationsCount: 0 muted: false - unreadMessagesCount: 0 - color: "orange" - categoryId: "public" + active: false position: 0 + isCategory: false + subItems: [] } ListElement { - chatId: "2" - name: "watercooler" - chatType: StatusChatListItem.Type.CommunityChat - muted: false - unreadMessagesCount: 0 - color: "orange" - categoryId: "public" - position: 1 - } - ListElement { - chatId: "3" - name: "language-design" - chatType: StatusChatListItem.Type.CommunityChat - muted: false - unreadMessagesCount: 0 - color: "orange" - categoryId: "dev" - position: 0 - } - } - - property var demoCommunityCategoryItems: ListModel { - id: demoCommunityCategoryItems - ListElement { - categoryId: "public" + itemId: "x012340001" name: "Public" - position: 0 + icon: "" + isIdenticon: false + color: "orange" + description: "" + type: StatusChatListItem.Type.Unknown0 + hasUnreadMessages: false + notificationsCount: 0 + muted: false + active: true + position: 1 + isCategory: true + subItems: [ + ListElement { + itemId: "x012340002" + parentItemId: "x012340001" + name: "random" + icon: "" + isIdenticon: false + color: "orange" + description: "" + hasUnreadMessages: true + notificationsCount: 4 + muted: false + active: false + position: 0 + }, + ListElement { + itemId: "x012340003" + parentItemId: "x012340001" + name: "watercooler" + icon: "" + isIdenticon: false + color: "orange" + description: "" + hasUnreadMessages: false + notificationsCount: 0 + muted: false + active: true + position: 1 + } + ] } ListElement { - categoryId: "dev" + itemId: "x012340004" name: "Development" - position: 1 + icon: "" + isIdenticon: false + color: "orange" + description: "" + type: StatusChatListItem.Type.Unknown0 + hasUnreadMessages: false + notificationsCount: 0 + muted: false + active: false + position: 2 + isCategory: true + subItems: [ + ListElement { + itemId: "x012340005" + parentItemId: "x012340004" + name: "language-design" + icon: "" + isIdenticon: false + color: "orange" + description: "" + hasUnreadMessages: false + notificationsCount: 0 + muted: true + active: false + position: 0 + } + ] } } @@ -746,12 +840,20 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I } ListElement { nickName: "carmen.eth" + userName: "" + chatKey: "" trustIndicator: StatusMemberListItem.TrustedType.Untrustworthy + isMutualContact: false isOnline: false + source: "" + isIdenticon: false } ListElement { nickName: "This girl I know from work" userName: "annabelle" + chatKey: "" + trustIndicator: StatusMemberListItem.TrustedType.None + isMutualContact: false isOnline: true source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAiElEQVR4nOzXUQpAQBRGYWQvLNAyLJDV8C5qpiGnv/M9al5Ot27X0IUwhMYQGkNoDKGJCRlLH67bftx9X+ap/+P9VcxEDK ExhKZ4a9Uq3TZviZmIITSG0DRvlqcbqVbrlouZiCE0htD4h0hjCI0hNN5aNIbQGKKPxEzEEBpDaAyhMYTmDAAA//+gYCErzmCpCQAAAABJRU5ErkJggg==" @@ -769,4 +871,97 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I isIdenticon: true } } + + // App Section Types: + // chat: 0 + // community: 1 + // wallet: 2 + // browser: 3 + // nodeManagement: 4 + // profileSettings: 5 + // apiDocumentation: 100 + // demoApp: 101 + + property ListModel mainAppSectionsModel: ListModel { + ListElement { + sectionId: "mainApp" + sectionType: 100 + name: "API Documentation" + active: true + image: "" + icon: "edit" + color: "" + hasNotification: false + notificationsCount: 0 + } + ListElement { + sectionId: "demoApp" + sectionType: 101 + name: "Demo Application" + active: false + image: "" + icon: "status" + color: "" + hasNotification: false + notificationsCount: 0 + } + } + + property ListModel demoAppSectionsModel: ListModel { + ListElement { + sectionId: "chat" + sectionType: 0 + name: "Chat" + active: true + image: "" + icon: "chat" + color: "" + hasNotification: false + notificationsCount: 0 + } + ListElement { + sectionId: "0x123456789" + sectionType: 1 + name: "Status Community" + active: false + image: "https://assets.brandfetch.io/51a495de903c46a.png" + icon: "" + color: "" + hasNotification: false + notificationsCount: 0 + } + ListElement { + sectionId: "wallet" + sectionType: 2 + name: "Wallet" + active: false + image: "" + icon: "wallet" + color: "" + hasNotification: false + notificationsCount: 0 + } + ListElement { + sectionId: "browser" + sectionType: 3 + name: "Browser" + active: false + image: "" + icon: "bigger/browser" + color: "" + hasNotification: false + notificationsCount: 0 + } + ListElement { + sectionId: "profile" + sectionType: 6 + name: "Profile" + active: false + image: "" + icon: "bigger/settings" + color: "" + hasNotification: true + notificationsCount: 0 + } + } } diff --git a/ui/StatusQ/sandbox/main.qml b/ui/StatusQ/sandbox/main.qml index e34c18e88a..f9c5ce7b08 100644 --- a/ui/StatusQ/sandbox/main.qml +++ b/ui/StatusQ/sandbox/main.qml @@ -12,6 +12,8 @@ import StatusQ.Components 0.1 import StatusQ.Layout 0.1 import StatusQ.Platform 0.1 +import "demoapp/data" 1.0 + StatusWindow { id: rootWindow width: Qt.platform.os == "ios" || Qt.platform.os == "android" ? Screen.width @@ -46,20 +48,15 @@ StatusWindow { readonly property int demoApp: 101 } - Models { - id: models - } - function setActiveItem(sectionId) { - for (var i = 0; i < models.mainAppSectionsModel.count; i++) { - let item = models.mainAppSectionsModel.get(i) - if (item.sectionId !== sectionId) - { - models.mainAppSectionsModel.setProperty(i, "active", false) + for (var i = 0; i < Models.mainAppSectionsModel.count; i++) { + let item = Models.mainAppSectionsModel.get(i) + if (item.sectionId !== sectionId) { + Models.mainAppSectionsModel.setProperty(i, "active", false); continue } - models.mainAppSectionsModel.setProperty(i, "active", true); + Models.mainAppSectionsModel.setProperty(i, "active", true); } } @@ -72,7 +69,7 @@ StatusWindow { communityTypeRole: "sectionType" communityTypeValue: appSectionType.community - sectionModel: models.mainAppSectionsModel + sectionModel: Models.mainAppSectionsModel regularNavBarButton: StatusNavBarTabButton { anchors.horizontalCenter: parent.horizontalCenter