Compare commits
2
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Anastasiya S
|
ea6e651b2a | ||
|
Anastasiya S
|
0a08bb80c0 |
@@ -1,17 +0,0 @@
|
||||
### Checklist
|
||||
|
||||
- [ ] follow [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/)
|
||||
- the scope should be the component's name e.g: `feat(StatusListItem): ... `
|
||||
- when adding new components, the scope is the module e.g: `feat(StatusQ.Controls): ...`
|
||||
- [ ] add documentation if necessary (new component, new feature)
|
||||
- [ ] update sandbox app
|
||||
- in case of new component, add new component page
|
||||
- in case of new features, add variation to existing component page
|
||||
- nice to have: add it to the demo application as well
|
||||
- [ ] test changes in both light and dark theme?
|
||||
- [ ] is this a breaking change?
|
||||
- [ ] use the dedicated `BREAKING CHANGE` commit message section
|
||||
- [ ] resolve breaking changes in [status-desktop](https://github.com/status-im/status-desktop)
|
||||
- [ ] (pre-merge) adapt code to breaking changes
|
||||
- [ ] (post-merge) update StatusQ submodule pointer
|
||||
- [ ] test changes in [status-desktop](https://github.com/status-im/status-desktop)
|
||||
@@ -13,7 +13,3 @@ Makefile
|
||||
*_qml.cpp
|
||||
*_qmlcache.qrc
|
||||
sandbox/qmlcache_loader.cpp
|
||||
doc/html
|
||||
CMakeLists.txt.user
|
||||
.vscode
|
||||
build/
|
||||
|
||||
@@ -1,3 +0,0 @@
|
||||
[submodule "vendor/SortFilterProxyModel"]
|
||||
path = vendor/SortFilterProxyModel
|
||||
url = https://github.com/status-im/SortFilterProxyModel.git
|
||||
-158
@@ -1,161 +1,3 @@
|
||||
<a name=""></a>
|
||||
## 0.25.0 (2022-03-07)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **@StatusListItem:** fix left padding ([f574e390](f574e390))
|
||||
* **StatusListItem:** add propagateTitleClicks property to StatusListItem ([8495fae8](8495fae8))
|
||||
* **StatusQ.Popups:** removed overlay setting (#557) ([665141f8](665141f8))
|
||||
* **StatusTagSelector:** Updates and fixes in the component ([07a5dc09](07a5dc09))
|
||||
* **build:** fix linux build ([9d06aae1](9d06aae1), closes [#413](413))
|
||||
* **sandbox:** Fix results popup component position ([cdf51fef](cdf51fef))
|
||||
|
||||
#### Features
|
||||
|
||||
* **@StatusListItem:** add option for tags ([381150a7](381150a7))
|
||||
* **StatusChatList:** Highlight chat item at creation time ([9e6fbe95](9e6fbe95))
|
||||
* **StatusChatListItem:** enable assigning emoji to chat item ([5fac8774](5fac8774))
|
||||
* **StatusContactVerificationIcons:** Create new row control that includes mutual connect and trust indicator icons (#559) ([c0f825c6](c0f825c6), closes [#542](542))
|
||||
* **StatusQ:** Moving docs outside sandbox ([825999b1](825999b1))
|
||||
* **StatusQ.Core:** add new arrow-left icon ([e9f20be1](e9f20be1))
|
||||
* **StatusSmartIdenticon:** Add support for color rings in StatusSmartIdenticon (#553) ([3b86d13a](3b86d13a), closes [#517](517))
|
||||
|
||||
#### Breaking Changes
|
||||
|
||||
* **StatusContactVerificationIcons:** Create new row control that includes mutual connect and trust indicator icons (#559) ([c0f825c6](c0f825c6), closes [#542](542))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## 0.24.0 (2022-02-14)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusListItem:** add highlighted property ([5780f183](5780f183))
|
||||
* **StatusQ.Components:** Adding StatusWizardSteper component ([b7d6554b](b7d6554b), closes [#522](522))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.23.0 (2022-02-08)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* Icon components had wrong color in sandbox app ([b632c712](b632c712), closes [#538](538))
|
||||
* **StatusChatList:** unexisting property name for chat item fixed ([c2e07517](c2e07517))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusQ.Components:**
|
||||
* Adding StatusToastMessage ([7b290ddd](7b290ddd), closes [#521](521))
|
||||
* Adding StatusTagSelector component ([094dee49](094dee49), closes [#526](526))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.22.0 (2022-01-31)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusMemberListItem:** Implement `StatusMemberListItem` (#539) ([c5a605bf](c5a605bf), closes [#515](515))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.21.0 (2022-01-24)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **build:** broken MacOS build (#533) ([55901cf0](55901cf0))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusMessage:** Introducing a new StatusQ Component for Chat Messages ([ea955694](ea955694))
|
||||
* **StatusQ.Controls:** Introduce `StatusPasswordStrengthIndicator` ([626695da](626695da), closes [#528](528))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.20.0 (2022-01-17)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusBanner:** introduce type variants for different banner styles ([35d12f44](35d12f44))
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusBaseInput:** Corrects allignment of the placeholder text in the StatusBaseInput. ([5a416aa1](5a416aa1))
|
||||
* **build:** Windows build ([14ab4ce5](14ab4ce5))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.19.0 (2021-12-03)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusChatListItem:** This change fixes the issue of the chat list items getting a highlight even when they are not really hovered ([ab6bdf54](ab6bdf54))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusModal:** introduce `hasCloseButton` property ([2336b6aa](2336b6aa))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.18.0 (2021-11-30)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusAppNavBar:** Fixed position of profile button on the NavBar ([419b7384](419b7384))
|
||||
* **StatusImageWithTitle:** Fix position of the edit title button ([8d2121ad](8d2121ad))
|
||||
* **StatusListItem:** ensure title is elided ([b7883e82](b7883e82))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusListItem:** Expose the Aside text so that it can be modified from the outside ([f82ce8b7](f82ce8b7))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.17.1 (2021-11-19)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusAccountSelector:** Adapt ui to data model changed ([db024436](db024436))
|
||||
* **StatusAssetSelector:** Fixed error of crypto balance not updated correctly ([2040d0f8](2040d0f8))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.17.0 (2021-11-10)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusBaseButton:** introduce `Tiny` size ([dee9f437](dee9f437))
|
||||
* **StatusQ.Controls.Validators:** introduce `StatusUrlValidator` ([a9155865](a9155865))
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusAccountSelector:** adapt AccountSelector to new model (#482) ([ce8d3231](ce8d3231))
|
||||
* **StatusExpandibleItem:** add missing hover indicator in `Secondary` type ([e23dc533](e23dc533), closes [#478](478))
|
||||
* **StatusInput:** ensure validator messages are rendered when validators return boolean values ([f82cd7f5](f82cd7f5))
|
||||
* **StatusListItem:** This solves the issue of channel list overlpaing when a category is collapsed. ([0c715b17](0c715b17))
|
||||
* **StatusSearchPopup:** disable enter and return keys to avoid UI breakage ([fecfb2a7](fecfb2a7))
|
||||
* **StatusSlider:** slider background and handle should not depend on root's height ([31cfc883](31cfc883))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.16.0 (2021-11-01)
|
||||
|
||||
|
||||
@@ -1,23 +0,0 @@
|
||||
cmake_minimum_required(VERSION 3.19)
|
||||
|
||||
project(StatusQ)
|
||||
|
||||
if (APPLE)
|
||||
set(MACOS_VERSION_MIN_FLAGS -mmacosx-version-min=10.14)
|
||||
set(CMAKE_OSX_ARCHITECTURES "x86_64")
|
||||
endif()
|
||||
|
||||
set(CMAKE_AUTOMOC ON)
|
||||
set(CMAKE_AUTORCC ON)
|
||||
|
||||
set(CMAKE_CXX_STANDARD 17)
|
||||
set(CMAKE_CXX_STANDARD_REQUIRED ON)
|
||||
|
||||
# https://doc.qt.io/qtcreator/creator-qml-modules-with-plugins.html#importing-qml-modules
|
||||
set(QML_IMPORT_PATH
|
||||
${CMAKE_SOURCE_DIR}/src;${QML_IMPORT_PATH}
|
||||
CACHE STRING "")
|
||||
|
||||
add_subdirectory(vendor/SortFilterProxyModel)
|
||||
add_subdirectory(sandbox)
|
||||
add_subdirectory(tests)
|
||||
@@ -36,7 +36,7 @@ To make viewing and testing components easy, we've added a sandbox application t
|
||||
|
||||
### Using Qt Creator
|
||||
|
||||
The easiest way to run the sandbox application is to simply open the provided `CMakeLists.txt` file using Qt Creator.
|
||||
The easiest way to run the sandbox application is to simply open the provided `sandbox.pro` file using Qt Creator.
|
||||
|
||||
### Using command line interface
|
||||
|
||||
@@ -44,13 +44,14 @@ To run the sandbox from within a command line interface, run the following comma
|
||||
|
||||
```
|
||||
$ git clone https://github.com/status-im/StatusQ
|
||||
$ cd StatusQ
|
||||
$ git submodule update --init
|
||||
$ ./sandbox/scripts/build
|
||||
$ cd StatusQ/sandbox
|
||||
$ ./scripts/build
|
||||
```
|
||||
|
||||
Once that is done, the sandbox can be started with the generated executable:
|
||||
|
||||
```
|
||||
$ ./build/sandbox/Sandbox
|
||||
$ ./bin/sandbox
|
||||
```
|
||||
|
||||
More Documentation available on the [wiki](https://hackmd.io/@status-desktop/B1naRjxh_/%2FwFtiXvOiQqCdw2lk6gbOLA)
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 44 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 72 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 35 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 49 KiB |
@@ -1,19 +0,0 @@
|
||||
/*!
|
||||
\page statusq-index.html
|
||||
\title StatusQ
|
||||
\brief A components library for Status desktop client.
|
||||
|
||||
|
||||
StatusQ provides a collection of components....
|
||||
|
||||
StatusQ - Components and Interfaces
|
||||
\list
|
||||
\li \l{StatusQ Components}{Components}
|
||||
\li \l{StatusQ Controls}{Controls}
|
||||
\li \l{StatusQ Core}{Core}
|
||||
\li \l{StatusQ Layout}{Layout}
|
||||
\li \l{StatusQ Platform}{Platform}
|
||||
\li \l{StatusQ Popups}{Popups}
|
||||
\endlist
|
||||
*/
|
||||
|
||||
@@ -1,44 +0,0 @@
|
||||
/*!
|
||||
\qmlmodule StatusQ.Components 0.1
|
||||
\title StatusQ Components
|
||||
\brief Basic set of Components StatusQ components
|
||||
|
||||
This is a listing of all Components components.
|
||||
|
||||
This module is part of the \l{StatusQ}{StatusQ} project.
|
||||
|
||||
\list
|
||||
\li \l{StatusAddress}
|
||||
\li \l{StatusBadge}
|
||||
\li \l{StatusChatInfoToolBar}
|
||||
\li \l{StatusChatList}
|
||||
\li \l{StatusChatListItem}
|
||||
\li \l{StatusImageSettings}
|
||||
\li \l{StatusChatListCategory}
|
||||
\li \l{StatusChatListCategoryItem}
|
||||
\li \l{StatusChatListAndCategories}
|
||||
\li \l{StatusChatToolBar}
|
||||
\li \l{StatusContactRequestsIndicatorListItem}
|
||||
\li \l{StatusDescriptionListItem}
|
||||
\li \l{StatusItemSelector}
|
||||
\li \l{StatusLetterIdenticon}
|
||||
\li \l{StatusListItem}
|
||||
\li \l{StatusListPicker}
|
||||
\li \l{StatusListSectionHeadline}
|
||||
\li \l{StatusLoadingIndicator}
|
||||
\li \l{StatusMemberListItem}
|
||||
\li \l{StatusNavigationListItem}
|
||||
\li \l{StatusNavigationPanelHeadline}
|
||||
\li \l{StatusRoundIcon}
|
||||
\li \l{StatusRoundedImage}
|
||||
\li \l{StatusMacWindowButtons}
|
||||
\li \l{StatusListItemBadge}
|
||||
\li \l{StatusExpandableItem}
|
||||
\li \l{StatusSmartIdenticon}
|
||||
\li \l{StatusMessage}
|
||||
\li \l{StatusMessageDetails}
|
||||
\li \l{StatusTagSelector}
|
||||
\li \l{StatusToastMessage}
|
||||
\li \l{StatusWizardStepper}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,51 +0,0 @@
|
||||
/*!
|
||||
\qmlmodule StatusQ.Controls 0.1
|
||||
\title StatusQ Controls
|
||||
\brief Basic set of Controls StatusQ components
|
||||
|
||||
This is a listing of all Controls components.
|
||||
|
||||
This module is part of the \l{StatusQ}{StatusQ} project.
|
||||
|
||||
\list
|
||||
\li \l{StatusAccountSelector}
|
||||
\li \l{StatusAssetSelector}
|
||||
\li \l{StatusBanner}
|
||||
\li \l{StatusChatCommandButton}
|
||||
\li \l{StatusChatInfoButton}
|
||||
\li \l{StatusChatListCategoryItemButton}
|
||||
\li \l{StatusColorSelector}
|
||||
\li \l{StatusDropdown}
|
||||
\li \l{StatusIconTabButton}
|
||||
\li \l{StatusNavBarTabButton}
|
||||
\li \l{StatusTabBarIconButton}
|
||||
\li \l{StatusToolTip}
|
||||
\li \l{StatusBaseButton}
|
||||
\li \l{StatusButton}
|
||||
\li \l{StatusFlatButton}
|
||||
\li \l{StatusRoundButton}
|
||||
\li \l{StatusFlatRoundButton}
|
||||
\li \l{StatusSwitch}
|
||||
\li \l{StatusRadioButton}
|
||||
\li \l{StatusCheckBox}
|
||||
\li \l{StatusSlider}
|
||||
\li \l{StatusSelect}
|
||||
\li \l{StatusBaseInput}
|
||||
\li \l{StatusIconTextButton}
|
||||
\li \l{StatusIdenticonRing}
|
||||
\li \l{StatusInput}
|
||||
\li \l{StatusItemPicker}
|
||||
\li \l{StatusPickerButton}
|
||||
\li \l{StatusPinInput}
|
||||
\li \l{StatusProgressBar}
|
||||
\li \l{StatusPasswordStrengthIndicator}
|
||||
\li \l{StatusSwitchTabButton}
|
||||
\li \l{StatusSwitchTabBar}
|
||||
\li \l{StatusSelectableText}
|
||||
\li \l{StatusWalletColorButton}
|
||||
\li \l{StatusWalletColorSelect}
|
||||
\li \l{StatusRegularExpressionValidator}
|
||||
\li \l{StatusIntValidator}
|
||||
\li \l{StatusSeedPhraseInput}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,24 +0,0 @@
|
||||
/*!
|
||||
\qmlmodule StatusQ.Core 0.1
|
||||
\title StatusQ Core
|
||||
\brief Basic set of Core StatusQ components
|
||||
|
||||
This is a listing of all Core components. These
|
||||
files are available for general import and they are based off the \l{https://doc.qt.io/qt-5/qtquick-qmlmodule.html}{Qt
|
||||
Quick Primitives} and \l{https://doc.qt.io/archives/qt-5.11/qtquick-controls2-qmlmodule.html}{Qt Quick Controls 2}.
|
||||
|
||||
This module is part of the \l{StatusQ}{StatusQ} project.
|
||||
|
||||
\list
|
||||
\li \l{StatusAppNavBarFilterModel}
|
||||
\li \l{StatusBaseText}
|
||||
\li \l{StatusFontSettings}
|
||||
\li \l{StatusIcon}
|
||||
\li \l{StatusIconBackgroundSettings}
|
||||
\li \l{StatusIconSettings}
|
||||
\li \l{StatusIdenticonRingSettings}
|
||||
\li \l{StatusImageSettings}
|
||||
\li \l{StatusModalHeaderSettings}
|
||||
\li \l{StatusTooltipSettings}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,16 +0,0 @@
|
||||
/*!
|
||||
\qmlmodule StatusQ.Layout 0.1
|
||||
\title StatusQ Layout
|
||||
\brief Basic set of Layout StatusQ components
|
||||
|
||||
This is a listing of all Layout components.
|
||||
|
||||
This module is part of the \l{StatusQ}{StatusQ} project.
|
||||
|
||||
\list
|
||||
\li \l{StatusAppLayout}
|
||||
\li \l{StatusAppNavBar}
|
||||
\li \l{StatusAppTwoPanelLayout}
|
||||
\li \l{StatusAppThreePanelLayout}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,15 +0,0 @@
|
||||
/*!
|
||||
\qmlmodule StatusQ.Platform 0.1
|
||||
\title StatusQ Platform
|
||||
\brief Basic set of Platform StatusQ components
|
||||
|
||||
This is a listing of all Platform components.
|
||||
|
||||
This module is part of the \l{StatusQ}{StatusQ} project.
|
||||
|
||||
\list
|
||||
\li \l{StatusMacTrafficLights}
|
||||
\li \l{StatusMacNotification}
|
||||
\li \l{StatusWindowsTitleBar}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,22 +0,0 @@
|
||||
/*!
|
||||
\qmlmodule StatusQ.Popups 0.1
|
||||
\title StatusQ Popups
|
||||
\brief Basic set of Popups StatusQ components
|
||||
|
||||
This is a listing of all Popups components.
|
||||
|
||||
This module is part of the \l{StatusQ}{StatusQ} project.
|
||||
|
||||
\list
|
||||
\li \l{StatusMenuSeparator}
|
||||
\li \l{StatusPopupMenu}
|
||||
\li \l{StatusMenuItem}
|
||||
\li \l{StatusMenuItemDelegate}
|
||||
\li \l{StatusModal}
|
||||
\li \l{StatusSearchPopup}
|
||||
\li \l{StatusModalDivider}
|
||||
\li \l{StatusSearchPopupMenuItem}
|
||||
\li \l{StatusSearchLocationMenu}
|
||||
\li \l{StatusSpellcheckingMenuItems}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,36 +0,0 @@
|
||||
project = StatusQ
|
||||
version = 0.1
|
||||
description = StatusQ Project
|
||||
url = https://github.com/status-im/StatusQ
|
||||
|
||||
#These are set implictly by qdoc as well, but only with these the module header can be found
|
||||
includepaths = -I . \
|
||||
-I $PWD/../src/StatusQ
|
||||
|
||||
imagedirs = src/images
|
||||
sourcedirs += src \
|
||||
$PWD/../src/StatusQ/Components \
|
||||
$PWD/../src/StatusQ/Controls \
|
||||
$PWD/../src/StatusQ/Core \
|
||||
$PWD/../src/StatusQ/Layout \
|
||||
$PWD/../src/StatusQ/Platform \
|
||||
$PWD/../src/StatusQ/Popups \
|
||||
|
||||
sources.fileextensions = "*.cpp *.qdoc *.qml"
|
||||
|
||||
depends += qtcore \
|
||||
qtquick \
|
||||
qtqml \
|
||||
qtgui \
|
||||
qtdoc \
|
||||
qtquickcontrols2
|
||||
|
||||
navigation.homepage = "StatusQ"
|
||||
|
||||
outputdir = $PWD/html
|
||||
outputformats = HTML
|
||||
|
||||
HTML.stylesheets = style.css
|
||||
HTML.headerstyles = "<link rel=\"stylesheet\" type=\"text/css\" href=\"style/style.css\"/>\n"
|
||||
HTML.postheader = "<p class=\"header\"><small>StatusQ - A Components selection for Status dekstop client. </p></small></p><hr/>"
|
||||
HTML.footer = "<hr/><div class=\"footer\"><p><acronym title=\"Copyright\">©</acronym> 2022 Status. All rights reserved. <a href=\"https://status.im\" target=\"_blank\"><small>status.im</a></small></p></div>"
|
||||
@@ -1,41 +0,0 @@
|
||||
body {
|
||||
font-family: "Verdana";
|
||||
font-size: 14px;
|
||||
max-width: 80%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
color: #4360DF;
|
||||
}
|
||||
|
||||
div.sidebar {
|
||||
float: right;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: 15px;
|
||||
}
|
||||
div.qmlproto {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
pre, div.qmlproto {
|
||||
font-family: "Courier New";
|
||||
font-size: 20px;
|
||||
margin-left: 2em;
|
||||
background-color: #F0F2F5;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
p.header {
|
||||
margin-bottom: -1em;
|
||||
}
|
||||
p.footer {
|
||||
text-align: right;
|
||||
margin-top: -1em;
|
||||
}
|
||||
@@ -3,10 +3,9 @@ import QtQuick.Layouts 1.14
|
||||
import QtQuick.Dialogs 1.3
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
|
||||
Column {
|
||||
spacing: 10
|
||||
Grid {
|
||||
@@ -17,24 +16,6 @@ Column {
|
||||
|
||||
horizontalItemAlignment: Grid.AlignHCenter
|
||||
|
||||
// Primary
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Primary
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
type: StatusBaseButton.Type.Primary
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
loading: true
|
||||
type: StatusBaseButton.Type.Primary
|
||||
}
|
||||
|
||||
// Large
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
@@ -192,25 +173,6 @@ Column {
|
||||
loading: true
|
||||
}
|
||||
|
||||
// transparent
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Tertiary
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Tertiary
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Tertiary
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Rounded blue
|
||||
|
||||
StatusFlatRoundButton {
|
||||
@@ -345,42 +307,12 @@ Column {
|
||||
onClicked: {
|
||||
colorDialog.open();
|
||||
}
|
||||
}
|
||||
|
||||
StatusColorDialog {
|
||||
id: colorDialog
|
||||
anchors.centerIn: parent
|
||||
property bool colorSelected: false
|
||||
onAccepted: {
|
||||
colorSelected = true;
|
||||
}
|
||||
}
|
||||
|
||||
// Button with emoji
|
||||
StatusButton {
|
||||
text: "Button with Emoji"
|
||||
icon.emoji: "🖼️️"
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
spacing: 20
|
||||
|
||||
StatusIconTextButton {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
spacing: 0
|
||||
statusIcon: "next"
|
||||
icon.width: 24
|
||||
icon.height: 24
|
||||
iconRotation: 180
|
||||
text: "Previous page"
|
||||
font.pixelSize: 15
|
||||
onClicked: testText.visible = !testText.visible
|
||||
}
|
||||
StatusBaseText {
|
||||
id: testText
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
text: "Click and hide!"
|
||||
font.pixelSize: 15
|
||||
ColorDialog {
|
||||
id: colorDialog
|
||||
property bool colorSelected: false
|
||||
onAccepted: {
|
||||
colorSelected = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,38 +0,0 @@
|
||||
project(Sandbox)
|
||||
|
||||
find_package(
|
||||
Qt5
|
||||
COMPONENTS Core Quick QuickControls2
|
||||
REQUIRED)
|
||||
|
||||
file(GLOB_RECURSE QML_FILES "../*.qml")
|
||||
file(GLOB_RECURSE JS_FILES "../*.js")
|
||||
file(GLOB_RECURSE HEADERS *.h)
|
||||
if(APPLE)
|
||||
file(GLOB_RECURSE SOURCES *.cpp *.mm)
|
||||
else()
|
||||
file(GLOB_RECURSE SOURCES *.cpp)
|
||||
endif()
|
||||
|
||||
qt5_add_big_resources(QRC_FILES qml.qrc ../src/statusq.qrc ../src/assets.qrc)
|
||||
|
||||
add_executable(
|
||||
${PROJECT_NAME}
|
||||
${HEADERS}
|
||||
${SOURCES}
|
||||
${QRC_FILES}
|
||||
${QML_FILES}
|
||||
${JS_FILES})
|
||||
|
||||
target_compile_definitions(${PROJECT_NAME}
|
||||
PRIVATE SRC_DIR="${CMAKE_CURRENT_LIST_DIR}")
|
||||
target_link_libraries(
|
||||
${PROJECT_NAME} PRIVATE Qt5::Core Qt5::Quick Qt5::QuickControls2
|
||||
SortFilterProxyModel)
|
||||
|
||||
if (APPLE)
|
||||
find_library(AppKit AppKit)
|
||||
find_library(Foundation Foundation)
|
||||
|
||||
target_link_libraries(${PROJECT_NAME} PRIVATE ${AppKit} ${Foundation})
|
||||
endif()
|
||||
@@ -32,14 +32,14 @@ GridLayout {
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
icon.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
icon.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
icon.color: Theme.palette.miscColor9
|
||||
// This icon source is flawed and demonstrates the fallback case
|
||||
// when the image source can't be loaded
|
||||
icon.source: "https://httpstat.us/404"
|
||||
icon.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jp"
|
||||
name: "Pascal"
|
||||
}
|
||||
|
||||
@@ -86,7 +86,7 @@ GridLayout {
|
||||
}
|
||||
|
||||
StatusNavBarTabButton {
|
||||
icon.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
icon.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
tooltip.text: "Some Community"
|
||||
}
|
||||
|
||||
@@ -124,7 +124,7 @@ GridLayout {
|
||||
title: "Iuri Matias"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
muted: true
|
||||
pinnedMessagesCount: 1
|
||||
@@ -137,7 +137,7 @@ GridLayout {
|
||||
title: "Iuri Matias elided"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
muted: true
|
||||
pinnedMessagesCount: 1
|
||||
@@ -152,7 +152,7 @@ GridLayout {
|
||||
title: "Iuri Matias big not elided"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
muted: true
|
||||
pinnedMessagesCount: 1
|
||||
@@ -188,29 +188,4 @@ GridLayout {
|
||||
to: 100
|
||||
value: 40
|
||||
}
|
||||
|
||||
StatusLabeledSlider {
|
||||
width: 360
|
||||
model: [ qsTr("XS"), qsTr("S"), qsTr("M"), qsTr("L"), qsTr("XL"), qsTr("XXL")]
|
||||
}
|
||||
|
||||
StatusLabeledSlider {
|
||||
width: 360
|
||||
model: [ qsTr("50%"), qsTr("100%"), qsTr("150%"), qsTr("200%")]
|
||||
}
|
||||
|
||||
StatusBanner {
|
||||
id: banner
|
||||
width: 360
|
||||
topPadding: 20
|
||||
type: StatusBanner.Type.Danger
|
||||
statusText: "Banner"
|
||||
}
|
||||
|
||||
StatusProgressBar {
|
||||
id: progressBar
|
||||
text: "Weak"
|
||||
value: 0.5
|
||||
fillColor : Theme.palette.pinColor1
|
||||
}
|
||||
}
|
||||
+768
-111
@@ -9,9 +9,6 @@ import StatusQ.Layout 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Platform 0.1
|
||||
|
||||
import "demoapp"
|
||||
import "demoapp/data" 1.0
|
||||
|
||||
Rectangle {
|
||||
id: demoApp
|
||||
height: 602
|
||||
@@ -21,32 +18,6 @@ Rectangle {
|
||||
|
||||
property string titleStyle: "osx"
|
||||
|
||||
QtObject {
|
||||
id: appSectionType
|
||||
readonly property int chat: 0
|
||||
readonly property int community: 1
|
||||
readonly property int communitiesPortal: 2
|
||||
readonly property int wallet: 3
|
||||
readonly property int browser: 3
|
||||
readonly property int nodeManagement: 5
|
||||
readonly property int profileSettings: 6
|
||||
readonly property int apiDocumentation: 100
|
||||
readonly property int demoApp: 101
|
||||
}
|
||||
|
||||
function setActiveItem(sectionId) {
|
||||
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)
|
||||
continue
|
||||
}
|
||||
|
||||
Models.demoAppSectionsModel.setProperty(i, "active", true);
|
||||
}
|
||||
}
|
||||
|
||||
StatusMacTrafficLights {
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
@@ -77,79 +48,32 @@ Rectangle {
|
||||
|
||||
id: navBar
|
||||
|
||||
communityTypeRole: "sectionType"
|
||||
communityTypeValue: appSectionType.community
|
||||
sectionModel: Models.demoAppSectionsModel
|
||||
|
||||
property bool communityAdded: false
|
||||
|
||||
onAboutToUpdateFilteredRegularModel: {
|
||||
communityAdded = false
|
||||
}
|
||||
|
||||
filterRegularItem: function(item) {
|
||||
if(item.sectionType === appSectionType.community)
|
||||
if(communityAdded)
|
||||
return false
|
||||
else
|
||||
communityAdded = true
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
filterCommunityItem: function(item) {
|
||||
return item.sectionType === appSectionType.community
|
||||
}
|
||||
|
||||
regularNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
navBarChatButton: StatusNavBarTabButton {
|
||||
icon.name: "chat"
|
||||
tooltip.text: "Chat"
|
||||
checked: appView.sourceComponent == statusAppChatView
|
||||
onClicked: {
|
||||
if(model.sectionType === appSectionType.chat)
|
||||
{
|
||||
appView.sourceComponent = statusAppChatView
|
||||
demoApp.setActiveItem(model.sectionId)
|
||||
}
|
||||
else if(model.sectionType === appSectionType.communitiesPortal)
|
||||
{
|
||||
appView.sourceComponent = statusCommunityPortalView
|
||||
demoApp.setActiveItem(model.sectionId)
|
||||
}
|
||||
else if(model.sectionType === appSectionType.profileSettings)
|
||||
{
|
||||
appView.sourceComponent = statusAppProfileSettingsView
|
||||
demoApp.setActiveItem(model.sectionId)
|
||||
}
|
||||
appView.sourceComponent = statusAppChatView
|
||||
}
|
||||
}
|
||||
|
||||
communityNavBarButton: StatusNavBarTabButton {
|
||||
navBarCommunityTabButtons.model: ListModel {
|
||||
ListElement {
|
||||
name: "Status Community"
|
||||
tooltipText: "Status Community"
|
||||
}
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.delegate: StatusNavBarTabButton {
|
||||
id: communityBtn
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
name: model.name
|
||||
tooltip.text: model.tooltipText
|
||||
icon.color: Theme.palette.miscColor6
|
||||
icon.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
checked: appView.sourceComponent == statusAppCommunityView
|
||||
onClicked: {
|
||||
if(model.sectionType === appSectionType.community)
|
||||
{
|
||||
appView.sourceComponent = statusAppCommunityView
|
||||
demoApp.setActiveItem(model.sectionId)
|
||||
}
|
||||
appView.sourceComponent = statusAppCommunityView
|
||||
}
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
@@ -174,11 +98,45 @@ Rectangle {
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Leave Community")
|
||||
icon.name: "arrow-left"
|
||||
icon.name: "arrow-right"
|
||||
icon.width: 14
|
||||
iconRotation: 180
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
navBarTabButtons: [
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "wallet"
|
||||
tooltip.text: "Wallet"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "bigger/browser"
|
||||
tooltip.text: "Browser"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "bigger/status-update"
|
||||
tooltip.text: "Timeline"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
id: profileNavButton
|
||||
icon.name: "bigger/settings"
|
||||
badge.visible: true
|
||||
badge.anchors.rightMargin: 4
|
||||
badge.anchors.topMargin: 5
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusAppNavBar.backgroundColor
|
||||
badge.border.width: 2
|
||||
|
||||
tooltip.text: "Profile"
|
||||
|
||||
checked: appView.sourceComponent == statusAppProfileSettingsView
|
||||
onClicked: {
|
||||
appView.sourceComponent = statusAppProfileSettingsView
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
appView: Loader {
|
||||
@@ -190,36 +148,735 @@ Rectangle {
|
||||
|
||||
Component {
|
||||
id: statusAppChatView
|
||||
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
|
||||
|
||||
chatListItems.model: models.demoChatListItems
|
||||
selectedChatId: "0"
|
||||
onChatItemSelected: selectedChatId = id
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusAppCommunityView
|
||||
StatusAppCommunityView {
|
||||
communityDetailModalTitle: demoCommunityDetailModal.header.title
|
||||
communityDetailModalImage: demoCommunityDetailModal.header.image.source
|
||||
onChatInfoButtonClicked: {
|
||||
demoCommunityDetailModal.open();
|
||||
|
||||
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
|
||||
chatList.model: models.demoCommunityChatListItems
|
||||
categoryList.model: models.demoCommunityCategoryItems
|
||||
|
||||
showCategoryActionButtons: true
|
||||
onChatItemSelected: selectedChatId = id
|
||||
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusAppProfileSettingsView
|
||||
StatusAppProfileSettingsView { }
|
||||
|
||||
StatusAppTwoPanelLayout {
|
||||
|
||||
leftPanel: Item {
|
||||
anchors.fill: parent
|
||||
|
||||
StatusNavigationPanelHeadline {
|
||||
id: profileHeadline
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 16
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text: "Profile"
|
||||
}
|
||||
|
||||
ScrollView {
|
||||
anchors.top: profileHeadline.bottom
|
||||
anchors.topMargin: 16
|
||||
anchors.bottom: parent.bottom
|
||||
width: parent.width
|
||||
|
||||
contentHeight: profileMenuItems.height + 8
|
||||
contentWidth: parent.width
|
||||
clip: true
|
||||
|
||||
Column {
|
||||
id: profileMenuItems
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
spacing: 4
|
||||
|
||||
Repeater {
|
||||
model: models.demoProfileGeneralMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
|
||||
StatusListSectionHeadline { text: "Settings" }
|
||||
|
||||
Repeater {
|
||||
model: models.demoProfileSettingsMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: invisibleSeparator
|
||||
height: 16
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
Repeater {
|
||||
model: models.demoProfileOtherMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
rightPanel: Item {
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusCommunityPortalView
|
||||
StatusAppCommunitiesPortalView { }
|
||||
}
|
||||
|
||||
DemoContactRequestsModal {
|
||||
StatusModal {
|
||||
id: demoContactRequestsModal
|
||||
anchors.centerIn: parent
|
||||
|
||||
header.title: "Contact Requests"
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
icon.width: 20
|
||||
icon.height: 20
|
||||
icon.name: "notification"
|
||||
}
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Contact request will be shown here"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Decline all"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
onClicked: demoContactRequestsModal.close()
|
||||
},
|
||||
StatusButton {
|
||||
text: "Accept all"
|
||||
onClicked: demoContactRequestsModal.close()
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
DemoCommunityDetailModal {
|
||||
StatusModal {
|
||||
id: demoCommunityDetailModal
|
||||
|
||||
anchors.centerIn: parent
|
||||
|
||||
header.title: "Cryptokitties"
|
||||
header.subTitle: "Public Community"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
|
||||
contentItem: Column {
|
||||
width: demoCommunityDetailModal.width
|
||||
|
||||
StatusModalDivider {
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
text: "A community of cat lovers, meow!"
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
font.pixelSize: 15
|
||||
height: 46
|
||||
color: Theme.palette.directColor1
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.leftMargin: 16
|
||||
anchors.rightMargin: 16
|
||||
}
|
||||
|
||||
StatusModalDivider {
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Share community"
|
||||
subTitle: "https://join.status.im/u/0x04...45f19"
|
||||
tooltip.text: "Copy to clipboard"
|
||||
icon.name: "copy"
|
||||
iconButton.onClicked: tooltip.visible = !tooltip.visible
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
StatusModalDivider {
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Members"
|
||||
icon.name: "group-chat"
|
||||
label: "184"
|
||||
components: [
|
||||
StatusIcon {
|
||||
icon: "chevron-down"
|
||||
rotation: 270
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Notifications"
|
||||
icon.name: "notification"
|
||||
components: [
|
||||
StatusSwitch {}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModalDivider {
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Edit community"
|
||||
icon.name: "edit"
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Transfer ownership"
|
||||
icon.name: "exchange"
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Leave community"
|
||||
icon.name: "arrow-right"
|
||||
icon.rotation: 180
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Models {
|
||||
id: models
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,295 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Layout 0.1
|
||||
|
||||
Column {
|
||||
spacing: 5
|
||||
|
||||
StatusChatToolBar {
|
||||
chatInfoButton.title: "Some contact"
|
||||
chatInfoButton.subTitle: "Contact"
|
||||
chatInfoButton.icon.color: Theme.palette.miscColor7
|
||||
chatInfoButton.type: StatusChatInfoButton.Type.OneToOneChat
|
||||
}
|
||||
|
||||
StatusChatToolBar {
|
||||
chatInfoButton.title: "Some contact"
|
||||
chatInfoButton.subTitle: "Contact"
|
||||
chatInfoButton.icon.color: Theme.palette.miscColor7
|
||||
chatInfoButton.type: StatusChatInfoButton.Type.PublicChat
|
||||
chatInfoButton.pinnedMessagesCount: 1
|
||||
chatInfoButton.muted: true
|
||||
}
|
||||
|
||||
StatusChatToolBar {
|
||||
chatInfoButton.title: "Some contact"
|
||||
chatInfoButton.subTitle: "Contact"
|
||||
chatInfoButton.icon.color: Theme.palette.miscColor7
|
||||
chatInfoButton.type: StatusChatInfoButton.Type.OneToOneChat
|
||||
chatInfoButton.pinnedMessagesCount: 1
|
||||
notificationCount: 1
|
||||
}
|
||||
|
||||
Row {
|
||||
spacing: 5
|
||||
Button {
|
||||
id: btn
|
||||
text: "Append"
|
||||
onClicked: {
|
||||
buttons.append({
|
||||
name: "Test community",
|
||||
tooltipText: "Test Community"
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
navBarChatButton: StatusNavBarTabButton {
|
||||
icon.name: "chat"
|
||||
badge.value: 33
|
||||
badge.visible: true
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
tooltip.text: "Chat"
|
||||
}
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
navBarChatButton: StatusNavBarTabButton {
|
||||
icon.name: "chat"
|
||||
badge.value: 33
|
||||
badge.visible: true
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
tooltip.text: "Chat"
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.model: ListModel {
|
||||
id: buttons
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.delegate: StatusNavBarTabButton {
|
||||
name: model.name
|
||||
tooltip.text: model.name
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
|
||||
navBarTabButtons: [
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "wallet"
|
||||
tooltip.text: "Wallet"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "browser"
|
||||
tooltip.text: "Browser"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "status-update"
|
||||
tooltip.text: "Timeline"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "profile"
|
||||
badge.visible: true
|
||||
badge.anchors.rightMargin: 4
|
||||
badge.anchors.topMargin: 5
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
|
||||
tooltip.text: "Profile"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
navBarChatButton: StatusNavBarTabButton {
|
||||
icon.name: "chat"
|
||||
badge.value: 33
|
||||
badge.visible: true
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
tooltip.text: "Chat"
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.model: ListModel {
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.delegate: StatusNavBarTabButton {
|
||||
name: model.name
|
||||
tooltip.text: model.name
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
|
||||
navBarTabButtons: [
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "wallet"
|
||||
tooltip.text: "Wallet"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "browser"
|
||||
tooltip.text: "Browser"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
navBarChatButton: StatusNavBarTabButton {
|
||||
icon.name: "chat"
|
||||
badge.value: 33
|
||||
badge.visible: true
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
tooltip.text: "Chat"
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.model: ListModel {
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.delegate: StatusNavBarTabButton {
|
||||
name: model.name
|
||||
tooltip.text: model.name
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
|
||||
navBarTabButtons: [
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "wallet"
|
||||
tooltip.text: "Wallet"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "browser"
|
||||
tooltip.text: "Browser"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "status-update"
|
||||
tooltip.text: "Timeline"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "profile"
|
||||
badge.visible: true
|
||||
badge.anchors.rightMargin: 4
|
||||
badge.anchors.topMargin: 5
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
|
||||
tooltip.text: "Profile"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
id: test
|
||||
navBarChatButton: StatusNavBarTabButton {
|
||||
icon.name: "chat"
|
||||
badge.value: 33
|
||||
badge.visible: true
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
tooltip.text: "Chat"
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.model: ListModel {
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
ListElement {
|
||||
name: "Test community"
|
||||
tooltipText: "Test Community"
|
||||
}
|
||||
}
|
||||
|
||||
navBarCommunityTabButtons.delegate: StatusNavBarTabButton {
|
||||
name: model.name
|
||||
tooltip.text: model.name
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
|
||||
navBarTabButtons: [
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "wallet"
|
||||
tooltip.text: "Wallet"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "browser"
|
||||
tooltip.text: "Browser"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "status-update"
|
||||
tooltip.text: "Timeline"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "profile"
|
||||
badge.visible: true
|
||||
badge.anchors.rightMargin: 4
|
||||
badge.anchors.topMargin: 5
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
|
||||
tooltip.text: "Profile"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,7 +4,6 @@ import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
@@ -26,7 +25,7 @@ GridLayout {
|
||||
badge.value: 1
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item (selected) with very long text"
|
||||
title: "Menu Item (selected)"
|
||||
selected: true
|
||||
icon.name: "info"
|
||||
badge.value: 1
|
||||
@@ -65,21 +64,15 @@ GridLayout {
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "community-channel-emoji"
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
icon.emoji: "😁"
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "community-channel-with-image"
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "Weird Crazy Otter"
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatListItem.Type.OneToOneChat
|
||||
}
|
||||
|
||||
@@ -92,8 +85,7 @@ GridLayout {
|
||||
StatusChatListItem {
|
||||
name: "has-mentions"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
hasUnreadMessages: true
|
||||
notificationsCount: 1
|
||||
badge.value: 1
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
@@ -108,7 +100,7 @@ GridLayout {
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
muted: true
|
||||
hasUnreadMessages: true
|
||||
notificationsCount: 1
|
||||
badge.value: 1
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
@@ -138,7 +130,7 @@ GridLayout {
|
||||
selected: true
|
||||
muted: true
|
||||
hasUnreadMessages: true
|
||||
notificationsCount: 1
|
||||
badge.value: 1
|
||||
}
|
||||
|
||||
|
||||
@@ -179,7 +171,7 @@ GridLayout {
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
@@ -314,7 +306,7 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
badge.image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
badge.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
badge.primaryText: "CryptoKitties"
|
||||
badge.secondaryText: "#test"
|
||||
}
|
||||
@@ -329,43 +321,6 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
|
||||
badge.icon.isLetterIdenticon: true
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "List Item with Tags"
|
||||
icon.isLetterIdenticon: true
|
||||
bottomModel: 3
|
||||
bottomDelegate: StatusListItemTag {
|
||||
title: "tag"
|
||||
icon.isLetterIdenticon: true
|
||||
}
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "List Item with Inline Tags"
|
||||
icon.isLetterIdenticon: true
|
||||
tagsModel : 2
|
||||
tagsDelegate: StatusListItemTag {
|
||||
color: "blue"
|
||||
height: 24
|
||||
radius: 6
|
||||
closeButtonVisible: false
|
||||
icon.emoji: "😁"
|
||||
icon.emojiSize: Emoji.size.verySmall
|
||||
icon.isLetterIdenticon: true
|
||||
title: "helloworld.eth"
|
||||
titleText.font.pixelSize: 12
|
||||
titleText.color: Theme.palette.indirectColor1
|
||||
}
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "List Item with Emoji"
|
||||
subTitle: "Emoji"
|
||||
icon.emoji: "😁"
|
||||
icon.color: "yellow"
|
||||
icon.letterSize: 14
|
||||
icon.isLetterIdenticon: true
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
@@ -390,88 +345,4 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
|
||||
title: "Contact requests"
|
||||
requestsCount: 3
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "This is an example"
|
||||
userName: "annabelle"
|
||||
pubKey: "0x043a7ed0e8752236a4688563652fd0296453cef00a5dcddbe252dc74f72cc1caa97a2b65e4a1a52d9c30a84c9966beaaaf6b333d659cbdd2e486b443ed1012cf04"
|
||||
isVerified: true
|
||||
isContact: true
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
|
||||
nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
status: 1 // FIXME: use enum
|
||||
ringSettings.ringSpecModel:
|
||||
ListModel {
|
||||
ListElement {colorId: 13; segmentLength: 5}
|
||||
ListElement {colorId: 31; segmentLength: 5}
|
||||
ListElement {colorId: 10; segmentLength: 1}
|
||||
ListElement {colorId: 2; segmentLength: 5}
|
||||
ListElement {colorId: 26; segmentLength: 2}
|
||||
ListElement {colorId: 19; segmentLength: 4}
|
||||
ListElement {colorId: 28; segmentLength: 3}
|
||||
}
|
||||
ringSettings.distinctiveColors: Theme.palette.identiconRingColors
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "carmen.eth"
|
||||
isUntrustworthy: true
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "very-long-annoying-nickname.eth"
|
||||
isUntrustworthy: true
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "This girl I know from work"
|
||||
userName: "annabelle"
|
||||
status: 1 // FIXME: use enum
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "Mark Cuban"
|
||||
userName: "annabelle"
|
||||
pubKey: "0x043a7ed0e8752236a4688563652fd0296453cef00a5dcddbe252dc74f72cc1caa97a2b65e4a1a52d9c30a84c9966beaaaf6b333d659cbdd2e486b443ed1012cf04"
|
||||
isContact: true
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
|
||||
nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "admin.guy"
|
||||
isAdmin: true
|
||||
isUntrustworthy: true
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: 16
|
||||
text: "Loading features:"
|
||||
font.pixelSize: 17
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Nokia 3310"
|
||||
subTitle: "Incoming device"
|
||||
label: "loading: true"
|
||||
icon.emoji: "😁"
|
||||
icon.color: "hotpink"
|
||||
icon.letterSize: 14
|
||||
icon.isLetterIdenticon: true
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Nokia 3310"
|
||||
subTitle: "Device"
|
||||
label: "loadingFailed: true"
|
||||
icon.emoji: "😁"
|
||||
icon.color: "hotpink"
|
||||
icon.letterSize: 14
|
||||
icon.isLetterIdenticon: true
|
||||
loadingFailed: true
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,336 @@
|
||||
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"
|
||||
position: 0
|
||||
}
|
||||
ListElement {
|
||||
chatId: "1"
|
||||
name: "status-desktop"
|
||||
chatType: StatusChatListItem.Type.PublicChat
|
||||
muted: false
|
||||
color: "red"
|
||||
unreadMessagesCount: 1
|
||||
mentionsCount: 1
|
||||
position: 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
|
||||
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
|
||||
color: "green"
|
||||
unreadMessagesCount: 0
|
||||
position: 5
|
||||
}
|
||||
}
|
||||
|
||||
property var demoCommunityChatListItems: ListModel {
|
||||
id: demoCommunityChatListItems
|
||||
ListElement {
|
||||
chatId: "0"
|
||||
name: "general"
|
||||
chatType: StatusChatListItem.Type.CommunityChat
|
||||
muted: false
|
||||
unreadMessagesCount: 0
|
||||
color: "orange"
|
||||
position: 0
|
||||
}
|
||||
ListElement {
|
||||
chatId: "1"
|
||||
name: "random"
|
||||
chatType: StatusChatListItem.Type.CommunityChat
|
||||
muted: false
|
||||
unreadMessagesCount: 0
|
||||
color: "orange"
|
||||
categoryId: "public"
|
||||
position: 0
|
||||
}
|
||||
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"
|
||||
name: "Public"
|
||||
position: 0
|
||||
}
|
||||
ListElement {
|
||||
categoryId: "dev"
|
||||
name: "Development"
|
||||
position: 1
|
||||
}
|
||||
}
|
||||
|
||||
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 <font color='#4360DF'>@Nick</font> 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: "<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 ";
|
||||
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
|
||||
}]}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
GridLayout {
|
||||
columns: 6
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusLoadingIndicator {
|
||||
color: Theme.palette.directColor4
|
||||
}
|
||||
|
||||
StatusLetterIdenticon {
|
||||
name: "#status"
|
||||
}
|
||||
|
||||
StatusRoundedImage {
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusBadge {}
|
||||
|
||||
StatusBadge {
|
||||
value: 1
|
||||
}
|
||||
|
||||
StatusBadge {
|
||||
value: 10
|
||||
}
|
||||
|
||||
StatusBadge {
|
||||
value: 100
|
||||
}
|
||||
|
||||
StatusRoundIcon {
|
||||
icon.name: "info"
|
||||
}
|
||||
}
|
||||
@@ -4,8 +4,6 @@ import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
|
||||
Column {
|
||||
spacing: 20
|
||||
@@ -75,22 +73,6 @@ Column {
|
||||
onClicked: spellMenu.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with Editable Title"
|
||||
onClicked: editTitleModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with Advanced Header/Footer"
|
||||
onClicked: advancedHeaderFooterModal.open()
|
||||
}
|
||||
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with Floating header Buttons"
|
||||
onClicked: floatingHeaderModal.open()
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: simpleModal
|
||||
anchors.centerIn: parent
|
||||
@@ -109,7 +91,7 @@ Column {
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
@@ -117,9 +99,12 @@ Column {
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
leftButtons: [
|
||||
StatusBackButton { }
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
@@ -136,7 +121,7 @@ Column {
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
@@ -149,7 +134,10 @@ Column {
|
||||
}
|
||||
|
||||
leftButtons: [
|
||||
StatusBackButton { }
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
@@ -164,7 +152,7 @@ Column {
|
||||
StatusModal {
|
||||
id: modalExample
|
||||
anchors.centerIn: parent
|
||||
header.image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
rightButtons: [
|
||||
@@ -177,7 +165,10 @@ Column {
|
||||
]
|
||||
|
||||
leftButtons: [
|
||||
StatusBackButton { }
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
@@ -350,101 +341,10 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
|
||||
}
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: editTitleModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "This title can be edited"
|
||||
header.editable: true
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: advancedHeaderFooterModal
|
||||
anchors.centerIn: parent
|
||||
showHeader: false
|
||||
showFooter: false
|
||||
showAdvancedHeader: true
|
||||
showAdvancedFooter: true
|
||||
height: 200
|
||||
advancedHeaderComponent: Rectangle {
|
||||
width: parent.width
|
||||
height: 50
|
||||
color: Theme.palette.baseColor1
|
||||
border.width: 1
|
||||
StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Add any header here"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
}
|
||||
advancedFooterComponent: Rectangle {
|
||||
width: parent.width
|
||||
height: 50
|
||||
color: Theme.palette.baseColor1
|
||||
border.width: 1
|
||||
StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Add any footer here"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: floatingHeaderModal
|
||||
anchors.centerIn: parent
|
||||
height: 200
|
||||
showHeader: false
|
||||
showFooter: false
|
||||
showAdvancedHeader: true
|
||||
hasFloatingButtons: true
|
||||
advancedHeaderComponent: StatusFloatingButtonsSelector {
|
||||
id: floatingHeader
|
||||
model: dummyAccountsModel
|
||||
delegate: Rectangle {
|
||||
width: button.width
|
||||
height: button.height
|
||||
radius: 8
|
||||
visible: visibleIndices.includes(index)
|
||||
color: Theme.palette.statusAppLayout.backgroundColor
|
||||
StatusButton {
|
||||
id: button
|
||||
topPadding: 8
|
||||
bottomPadding: 0
|
||||
implicitHeight: 32
|
||||
defaultLeftPadding: 4
|
||||
text: name
|
||||
icon.emoji: !!emoji ? emoji: ""
|
||||
icon.emojiSize: Emoji.size.middle
|
||||
icon.name: !emoji ? "filled-account": ""
|
||||
normalColor: "transparent"
|
||||
highlighted: index === floatingHeader.currentIndex
|
||||
onClicked: {
|
||||
floatingHeader.currentIndex = index
|
||||
}
|
||||
}
|
||||
}
|
||||
popupMenuDelegate: StatusListItem {
|
||||
implicitWidth: 272
|
||||
title: name
|
||||
onClicked: floatingHeader.itemSelected(index)
|
||||
visible: !visibleIndices.includes(index)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: dummyAccountsModel
|
||||
ListElement{name: "Account 1"; iconName: "filled-account"; emoji: "🥑"}
|
||||
ListElement{name: "Account 1"; iconName: "filled-account"}
|
||||
ListElement{name: "Account 2"; iconName: "filled-account"}
|
||||
ListElement{name: "Account 3"; iconName: "filled-account"}
|
||||
ListElement{name: "Account 4"; iconName: "filled-account"}
|
||||
ListElement{name: "Account 5"; iconName: "filled-account"}
|
||||
ListElement{name: "Account 6"; iconName: "filled-account"}
|
||||
ListElement{name: "Account 7"; iconName: "filled-account"}
|
||||
}
|
||||
|
||||
StatusSpellcheckingMenuItems {
|
||||
@@ -0,0 +1,55 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusAccountSelector {
|
||||
accounts: ListModel {
|
||||
ListElement {
|
||||
name: "Pascal"
|
||||
address: "0x1234567891011"
|
||||
iconColor: "red"
|
||||
balance: "0"
|
||||
walletType: "generated"
|
||||
assets: []
|
||||
fiatBalance: "1199.02"
|
||||
}
|
||||
ListElement {
|
||||
name: "Boris"
|
||||
address: "0x123"
|
||||
iconColor: "red"
|
||||
balance: "0"
|
||||
walletType: "generated"
|
||||
assets: []
|
||||
fiatBalance: "0"
|
||||
}
|
||||
ListElement {
|
||||
name: "Alexandra"
|
||||
address: "0x123"
|
||||
iconColor: "yellow"
|
||||
balance: "0"
|
||||
walletType: "generated"
|
||||
assets: []
|
||||
fiatBalance: "0"
|
||||
}
|
||||
ListElement {
|
||||
name: "Khushboo"
|
||||
address: "0x123"
|
||||
iconColor: "blue"
|
||||
balance: "0"
|
||||
walletType: "generated"
|
||||
assets: []
|
||||
fiatBalance: "0"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusAddress {
|
||||
text: "0x9ce0056c5fc6bb9459a4dcfa35eaad8c1fee5ce9"
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 200
|
||||
height: childrenRect.height
|
||||
StatusAddress {
|
||||
text: "0x9ce0056c5fc6bb9459a4dcfa35eaad8c1fee5ce9"
|
||||
expandable: true
|
||||
width: parent.width
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusAssetSelector {
|
||||
assets: ListModel {
|
||||
ListElement {
|
||||
address: "0x1234"
|
||||
name: "Status Network Token"
|
||||
value: "20"
|
||||
symbol: "SNT"
|
||||
fiatBalance: "9992.01"
|
||||
fiatBalanceDisplay: "9992.01"
|
||||
}
|
||||
ListElement {
|
||||
address: "0x1234"
|
||||
name: "DAI Token"
|
||||
value: "20"
|
||||
symbol: "DAI"
|
||||
fiatBalance: "20"
|
||||
fiatBalanceDisplay: "20"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -14,7 +14,7 @@ GridLayout {
|
||||
StatusChatInfoToolBar {
|
||||
chatInfoButton.title: "Cryptokitties"
|
||||
chatInfoButton.subTitle: "128 Members"
|
||||
chatInfoButton.image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
chatInfoButton.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
chatInfoButton.icon.color: Theme.palette.miscColor6
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
@@ -8,7 +8,7 @@ import StatusQ.Controls 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Row {
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusColorSelector {
|
||||
+2
-2
@@ -74,7 +74,7 @@ Column {
|
||||
|
||||
type: StatusExpandableItem.Type.Secondary
|
||||
expandable: true
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
primaryText: "CryptoKitties"
|
||||
additionalText: "1456 USD"
|
||||
expandableComponent: notImplemented
|
||||
@@ -85,7 +85,7 @@ Column {
|
||||
|
||||
type: StatusExpandableItem.Type.Secondary
|
||||
expandable: true
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
primaryText: "Adding Really long text to test scenario of having very long text along with tertiary text"
|
||||
additionalText: "564.90 USD"
|
||||
expandableComponent: notImplemented
|
||||
@@ -0,0 +1,133 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Controls.Validators 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusInput {
|
||||
input.placeholderText: "Placeholder"
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
input.placeholderText: "Disabled"
|
||||
input.enabled: false
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
input.placeholderText: "Clearable"
|
||||
input.clearable: true
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
input.placeholderText: "Invalid"
|
||||
input.valid: false
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
|
||||
input.icon.name: "search"
|
||||
input.placeholderText: "Input with icon"
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
input.placeholderText: "Placeholder"
|
||||
input.clearable: true
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
charLimit: 30
|
||||
input.placeholderText: "Placeholder"
|
||||
input.clearable: true
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
charLimit: 30
|
||||
input.placeholderText: "Placeholder"
|
||||
input.clearable: true
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
charLimit: 30
|
||||
errorMessage: "Error message"
|
||||
|
||||
input.clearable: true
|
||||
input.valid: false
|
||||
input.placeholderText: "Placeholder"
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "StatusInput"
|
||||
secondaryLabel: "with right icon"
|
||||
input.icon.width: 15
|
||||
input.icon.height: 11
|
||||
input.icon.name: text !== "" ? "checkmark" : ""
|
||||
input.leftIcon: false
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
secondaryLabel: "secondary label"
|
||||
input.placeholderText: "Placeholder"
|
||||
input.implicitHeight: 56
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
id: input
|
||||
label: "Label"
|
||||
charLimit: 30
|
||||
input.placeholderText: "Input with validator"
|
||||
|
||||
validators: [
|
||||
StatusMinLengthValidator {
|
||||
minLength: 10
|
||||
errorMessage: {
|
||||
if (input.errors && input.errors.minLength) {
|
||||
return `Value can't be shorter than ${input.errors.minLength.min} but got ${input.errors.minLength.actual}`
|
||||
}
|
||||
return ""
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
input.placeholderText: "Input width component (right side)"
|
||||
input.component: StatusIcon {
|
||||
icon: "cancel"
|
||||
height: 16
|
||||
color: Theme.palette.dangerColor1
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
StatusInput {
|
||||
input.multiline: true
|
||||
input.placeholderText: "Multiline"
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
input.multiline: true
|
||||
input.placeholderText: "Multiline with static height"
|
||||
input.implicitHeight: 100
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
input.multiline: true
|
||||
input.placeholderText: "Multiline with max/min"
|
||||
input.minimumHeight: 80
|
||||
input.maximumHeight: 200
|
||||
}
|
||||
}
|
||||
@@ -22,15 +22,10 @@ GridLayout {
|
||||
onClicked: complexMenu.popup()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
id: customPopupButton
|
||||
text: "Menu with custom images and icons"
|
||||
onClicked: customMenu.popup()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Menu with custom font settings"
|
||||
onClicked: differentFontMenu.popup()
|
||||
text: "Menu with custom images and icons"
|
||||
onClicked: customMenu.popup()
|
||||
}
|
||||
|
||||
|
||||
@@ -51,7 +46,7 @@ GridLayout {
|
||||
|
||||
StatusPopupMenu {
|
||||
id: complexMenu
|
||||
// subMenuItemIcons: [{ icon: 'info' }]
|
||||
subMenuItemIcons: [{ icon: 'info' }]
|
||||
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
@@ -68,13 +63,10 @@ GridLayout {
|
||||
StatusMenuItem {
|
||||
text: "Three"
|
||||
iconSettings.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Four"
|
||||
iconSettings.name: "info"
|
||||
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
iconSettings.name: "info"
|
||||
@@ -88,24 +80,17 @@ GridLayout {
|
||||
|
||||
StatusPopupMenu {
|
||||
id: customMenu
|
||||
width: customPopupButton.width
|
||||
|
||||
// subMenuItemIcons: [
|
||||
// {
|
||||
// icon: "chat"
|
||||
// },
|
||||
// {
|
||||
// source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
// },
|
||||
// {
|
||||
// isLetterIdenticon: true,
|
||||
// color: "red"
|
||||
// }
|
||||
// ]
|
||||
|
||||
MenuItem {
|
||||
text: "Default MenuItem, action: " + action
|
||||
}
|
||||
subMenuItemIcons: [
|
||||
{ icon: "chat" },
|
||||
{
|
||||
source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
},
|
||||
{
|
||||
isLetterIdenticon: true,
|
||||
color: "red"
|
||||
}
|
||||
]
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Anywhere"
|
||||
@@ -114,8 +99,7 @@ GridLayout {
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Chat"
|
||||
iconSettings.name: "chat"
|
||||
title: "Chat"
|
||||
|
||||
StatusMenuItem {
|
||||
text: "vitalik.eth"
|
||||
@@ -126,13 +110,12 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Pascal"
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Cryptokitties"
|
||||
imageSettings.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
|
||||
StatusMenuItem {
|
||||
text: "welcome"
|
||||
@@ -156,8 +139,6 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Another community"
|
||||
iconSettings.isLetterIdenticon: true
|
||||
iconSettings.color: "red"
|
||||
|
||||
StatusMenuItem {
|
||||
text: "welcome"
|
||||
@@ -166,22 +147,4 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
id: differentFontMenu
|
||||
StatusMenuItem {
|
||||
text: "Bold"
|
||||
fontSettings.bold: true
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Italic"
|
||||
fontSettings.italic: true
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "16px"
|
||||
fontSettings.pixelSize: 16
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -8,39 +8,28 @@ import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 20
|
||||
|
||||
ListModel {
|
||||
id: commmonModel
|
||||
ListElement {
|
||||
name: "Pascal"
|
||||
}
|
||||
ListElement {
|
||||
name: "Khushboo"
|
||||
}
|
||||
ListElement {
|
||||
name: "Alexandra"
|
||||
}
|
||||
ListElement {
|
||||
name: "Eric"
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
font.pixelSize: 16
|
||||
color: Theme.palette.dangerColor1
|
||||
text: "This component should no longer be used.<br />Please, use `StatusComboBox` instead."
|
||||
textFormat: Text.MarkdownText
|
||||
}
|
||||
spacing: 8
|
||||
|
||||
StatusSelect {
|
||||
id: select
|
||||
label: "Some label"
|
||||
model: commmonModel
|
||||
|
||||
model: ListModel {
|
||||
ListElement {
|
||||
name: "Pascal"
|
||||
}
|
||||
ListElement {
|
||||
name: "Khushboo"
|
||||
}
|
||||
ListElement {
|
||||
name: "Alexandra"
|
||||
}
|
||||
ListElement {
|
||||
name: "Eric"
|
||||
}
|
||||
}
|
||||
selectMenu.delegate: StatusMenuItemDelegate {
|
||||
statusPopupMenu: select
|
||||
action: StatusMenuItem {
|
||||
iconSettings.name: "filled-account"
|
||||
text: name
|
||||
@@ -49,7 +38,6 @@ Column {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
selectedItemComponent: Item {
|
||||
id: selectedItem
|
||||
anchors.fill: parent
|
||||
+1
-1
@@ -12,6 +12,6 @@ Column {
|
||||
spacing: 8
|
||||
|
||||
StatusWalletColorSelect {
|
||||
model: Theme.palette.userCustomizationColors
|
||||
model: Theme.palette.accountColors
|
||||
}
|
||||
}
|
||||
@@ -7,8 +7,6 @@ Item {
|
||||
id: themeSwitchWrapper
|
||||
signal checkedChanged()
|
||||
|
||||
property alias lightThemeEnabled: switchControl.checked
|
||||
|
||||
width: themeSwitch.width
|
||||
height: themeSwitch.height
|
||||
|
||||
@@ -28,7 +26,6 @@ Item {
|
||||
}
|
||||
|
||||
StatusSwitch {
|
||||
id: switchControl
|
||||
onCheckedChanged: themeSwitchWrapper.checkedChanged()
|
||||
|
||||
StatusToolTip {
|
||||
|
||||
@@ -1,500 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Layout 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
Column {
|
||||
spacing: 10
|
||||
|
||||
StatusChatToolBar {
|
||||
toolbarComponent: chatInfoButton1
|
||||
width: 518
|
||||
|
||||
Component {
|
||||
id: chatInfoButton1
|
||||
|
||||
StatusChatInfoButton {
|
||||
width: Math.min(implicitWidth, parent.width)
|
||||
title: "Some contact"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusChatToolBar {
|
||||
toolbarComponent: chatInfoButton2
|
||||
width: 518
|
||||
|
||||
Component {
|
||||
id: chatInfoButton2
|
||||
StatusChatInfoButton {
|
||||
width: Math.min(implicitWidth, parent.width)
|
||||
title: "Some contact"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
type: StatusChatInfoButton.Type.PublicChat
|
||||
pinnedMessagesCount: 1
|
||||
muted: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
StatusChatToolBar {
|
||||
notificationCount: 1
|
||||
toolbarComponent: chatInfoButton3
|
||||
width: 518
|
||||
|
||||
Component {
|
||||
id: chatInfoButton3
|
||||
|
||||
StatusChatInfoButton {
|
||||
width: Math.min(implicitWidth, parent.width)
|
||||
title: "Some contact"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
pinnedMessagesCount: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusChatToolBar {
|
||||
notificationCount: 1
|
||||
toolbarComponent: tagSelector
|
||||
width: 518
|
||||
|
||||
Component {
|
||||
id: tagSelector
|
||||
|
||||
StatusTagSelector {
|
||||
namesModel: ListModel {
|
||||
ListElement {
|
||||
publicId: "0x0"
|
||||
name: "Maria"
|
||||
icon: ""
|
||||
isIdenticon: false
|
||||
onlineStatus: 3
|
||||
isReadonly: true
|
||||
tagIcon: "crown"
|
||||
}
|
||||
ListElement {
|
||||
publicId: "0x1"
|
||||
name: "James"
|
||||
icon: ""
|
||||
isIdenticon: false
|
||||
onlineStatus: 1
|
||||
isReadonly: false
|
||||
tagIcon: ""
|
||||
}
|
||||
}
|
||||
toLabelText: qsTr("To: ")
|
||||
warningText: qsTr("USER LIMIT REACHED")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Row {
|
||||
spacing: 5
|
||||
Button {
|
||||
id: btn
|
||||
text: "Append"
|
||||
onClicked: {
|
||||
buttons.append({
|
||||
name: "Test community",
|
||||
tooltipText: "Test Community"
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
QtObject {
|
||||
id: appSectionType
|
||||
readonly property int chat: 0
|
||||
readonly property int community: 1
|
||||
readonly property int wallet: 2
|
||||
readonly property int browser: 3
|
||||
readonly property int nodeManagement: 4
|
||||
readonly property int profileSettings: 5
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
|
||||
sectionModel: ListModel {
|
||||
ListElement {sectionId: "chat"; sectionType: 0; name: "Chat"; active: true; image: ""; icon: "chat"; color: ""; hasNotification: true; notificationsCount: 12}
|
||||
}
|
||||
|
||||
regularNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
}
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
|
||||
communityTypeRole: "sectionType"
|
||||
communityTypeValue: appSectionType.community
|
||||
sectionModel: ListModel {
|
||||
ListElement {sectionId: "chat"; sectionType: 0; name: "Chat"; active: true; image: ""; icon: "chat"; color: ""; hasNotification: true; notificationsCount: 12}
|
||||
ListElement {sectionId: "0x0001"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 12}
|
||||
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: 5; name: "Profile"; active: false; image: ""; icon: "bigger/settings"; color: ""; hasNotification: true; notificationsCount: 0}
|
||||
}
|
||||
|
||||
property bool communityAdded: false
|
||||
|
||||
filterRegularItem: function(item) {
|
||||
if(item.sectionType === appSectionType.community)
|
||||
if(communityAdded)
|
||||
return false
|
||||
else
|
||||
communityAdded = true
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
filterCommunityItem: function(item) {
|
||||
return item.sectionType === appSectionType.community
|
||||
}
|
||||
|
||||
regularNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
}
|
||||
|
||||
communityNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Invite People")
|
||||
icon.name: "share-ios"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("View Community")
|
||||
icon.name: "group"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Edit Community")
|
||||
icon.name: "edit"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Leave Community")
|
||||
icon.name: "arrow-left"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
|
||||
communityTypeRole: "sectionType"
|
||||
communityTypeValue: appSectionType.community
|
||||
sectionModel: ListModel {
|
||||
ListElement {sectionId: "chat"; sectionType: 0; name: "Chat"; active: true; image: ""; icon: "chat"; color: ""; hasNotification: true; notificationsCount: 12}
|
||||
ListElement {sectionId: "0x0001"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 12}
|
||||
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}
|
||||
}
|
||||
|
||||
property bool communityAdded: false
|
||||
|
||||
filterRegularItem: function(item) {
|
||||
if(item.sectionType === appSectionType.community)
|
||||
if(communityAdded)
|
||||
return false
|
||||
else
|
||||
communityAdded = true
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
filterCommunityItem: function(item) {
|
||||
return item.sectionType === appSectionType.community
|
||||
}
|
||||
|
||||
regularNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
}
|
||||
|
||||
communityNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Invite People")
|
||||
icon.name: "share-ios"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("View Community")
|
||||
icon.name: "group"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Edit Community")
|
||||
icon.name: "edit"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Leave Community")
|
||||
icon.name: "arrow-left"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
StatusAppNavBar {
|
||||
|
||||
communityTypeRole: "sectionType"
|
||||
communityTypeValue: appSectionType.community
|
||||
sectionModel: ListModel {
|
||||
ListElement {sectionId: "chat"; sectionType: 0; name: "Chat"; active: true; image: ""; icon: "chat"; color: ""; hasNotification: true; notificationsCount: 12}
|
||||
ListElement {sectionId: "0x0001"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: false; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0002"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: false; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0003"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: false; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0004"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; 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: 5; name: "Profile"; active: false; image: ""; icon: "bigger/settings"; color: ""; hasNotification: false; notificationsCount: 0}
|
||||
}
|
||||
|
||||
property bool communityAdded: false
|
||||
|
||||
filterRegularItem: function(item) {
|
||||
if(item.sectionType === appSectionType.community)
|
||||
if(communityAdded)
|
||||
return false
|
||||
else
|
||||
communityAdded = true
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
filterCommunityItem: function(item) {
|
||||
return item.sectionType === appSectionType.community
|
||||
}
|
||||
|
||||
regularNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
}
|
||||
|
||||
communityNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Invite People")
|
||||
icon.name: "share-ios"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("View Community")
|
||||
icon.name: "group"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Edit Community")
|
||||
icon.name: "edit"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Leave Community")
|
||||
icon.name: "arrow-left"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusAppNavBar {
|
||||
|
||||
communityTypeRole: "sectionType"
|
||||
communityTypeValue: appSectionType.community
|
||||
sectionModel: ListModel {
|
||||
ListElement {sectionId: "chat"; sectionType: 0; name: "Chat"; active: true; image: ""; icon: "chat"; color: ""; hasNotification: true; notificationsCount: 12}
|
||||
ListElement {sectionId: "0x0001"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 12}
|
||||
ListElement {sectionId: "0x0002"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: false; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0003"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0004"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 1}
|
||||
ListElement {sectionId: "0x0005"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: false; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0006"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 3}
|
||||
ListElement {sectionId: "0x0007"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 5}
|
||||
ListElement {sectionId: "0x0008"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0009"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: false; notificationsCount: 0}
|
||||
ListElement {sectionId: "0x0010"; sectionType: 1; name: "Test Community"; active: false; image: ""; icon: ""; color: "#00ff00"; hasNotification: true; notificationsCount: 11}
|
||||
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: 5; name: "Profile"; active: false; image: ""; icon: "bigger/settings"; color: ""; hasNotification: true; notificationsCount: 0}
|
||||
}
|
||||
|
||||
property bool communityAdded: false
|
||||
|
||||
filterRegularItem: function(item) {
|
||||
if(item.sectionType === appSectionType.community)
|
||||
if(communityAdded)
|
||||
return false
|
||||
else
|
||||
communityAdded = true
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
filterCommunityItem: function(item) {
|
||||
return item.sectionType === appSectionType.community
|
||||
}
|
||||
|
||||
regularNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
}
|
||||
|
||||
communityNavBarButton: StatusNavBarTabButton {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
name: model.icon.length > 0? "" : model.name
|
||||
icon.name: model.icon
|
||||
icon.source: model.image
|
||||
tooltip.text: model.name
|
||||
autoExclusive: true
|
||||
checked: model.active
|
||||
badge.value: model.notificationsCount
|
||||
badge.visible: model.hasNotification
|
||||
badge.border.color: hovered ? Theme.palette.statusBadge.hoverBorderColor : Theme.palette.statusBadge.borderColor
|
||||
badge.border.width: 2
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Invite People")
|
||||
icon.name: "share-ios"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("View Community")
|
||||
icon.name: "group"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Edit Community")
|
||||
icon.name: "edit"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: qsTr("Leave Community")
|
||||
icon.name: "arrow-left"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,64 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
ColumnLayout {
|
||||
GridLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
||||
columns: 6
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusLoadingIndicator {
|
||||
color: Theme.palette.directColor4
|
||||
}
|
||||
|
||||
StatusLetterIdenticon {
|
||||
name: "#status"
|
||||
}
|
||||
|
||||
StatusRoundedImage {
|
||||
image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
}
|
||||
|
||||
StatusBadge {}
|
||||
|
||||
StatusBadge {
|
||||
value: 1
|
||||
}
|
||||
|
||||
StatusBadge {
|
||||
value: 10
|
||||
}
|
||||
|
||||
StatusBadge {
|
||||
value: 100
|
||||
}
|
||||
|
||||
StatusRoundIcon {
|
||||
icon.name: "info"
|
||||
}
|
||||
}
|
||||
|
||||
Flow {
|
||||
Layout.fillWidth: true
|
||||
spacing: 4
|
||||
|
||||
Repeater {
|
||||
model: 12
|
||||
StatusLetterIdenticon {
|
||||
name: "A"
|
||||
color: Theme.palette.userCustomizationColors[index]
|
||||
letterSize: 16
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusDatePicker {
|
||||
label: "Select date"
|
||||
}
|
||||
}
|
||||
@@ -1,104 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
import QtQml.Models 2.2
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
ListView {
|
||||
id: messageList
|
||||
anchors.fill: parent
|
||||
anchors.margins: 15
|
||||
clip: true
|
||||
delegate: StatusMessage {
|
||||
id: delegate
|
||||
width: parent.width
|
||||
|
||||
audioMessageInfoText: "Audio Message"
|
||||
cancelButtonText: "Cancel"
|
||||
saveButtonText: "Save"
|
||||
loadingImageText: "Loading image..."
|
||||
errorLoadingImageText: "Error loading the image"
|
||||
resendText: "Resend"
|
||||
pinnedMsgInfoText: "Pinned by"
|
||||
|
||||
messageDetails: StatusMessageDetails {
|
||||
contentType: model.contentType
|
||||
messageContent: model.messageContent
|
||||
amISender: model.amIsender
|
||||
displayName: model.userName
|
||||
secondaryName: model.localName !== "" && model.ensName.startsWith("@") ? model.ensName: ""
|
||||
chatID: model.chatKey
|
||||
profileImage: StatusImageSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
source: model.profileImage
|
||||
isIdenticon: model.isIdenticon
|
||||
}
|
||||
messageText: model.message
|
||||
hasMention: model.hasMention
|
||||
isContact: model.isContact
|
||||
trustIndicator: model.trustIndicator
|
||||
isPinned: model.isPinned
|
||||
pinnedBy: model.pinnedBy
|
||||
hasExpired: model.hasExpired
|
||||
}
|
||||
timestamp.text: "10:00 am"
|
||||
timestamp.tooltip.text: "10:01 am"
|
||||
// reply related data
|
||||
isAReply: model.isReply
|
||||
replyDetails: StatusMessageDetails {
|
||||
amISender: model.isReply ? model.replyAmISender : ""
|
||||
displayName: model.isReply ? model.replySenderName: ""
|
||||
profileImage: StatusImageSettings {
|
||||
width: 20
|
||||
height: 20
|
||||
source: model.isReply ? model.replyProfileImage: ""
|
||||
isIdenticon: model.isReply ? model.replyIsIdenticon: ""
|
||||
}
|
||||
messageText: model.isReply ? model.replyMessageText: ""
|
||||
contentType: model.replyContentType
|
||||
messageContent: model.replyMessageContent
|
||||
}
|
||||
quickActions: [
|
||||
StatusFlatRoundButton {
|
||||
id: emojiBtn
|
||||
width: 32
|
||||
height: 32
|
||||
icon.name: "reaction-b"
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
tooltip.text: "Add reaction"
|
||||
},
|
||||
StatusFlatRoundButton {
|
||||
id: replyBtn
|
||||
width: 32
|
||||
height: 32
|
||||
icon.name: "reply"
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
tooltip.text: "Reply"
|
||||
},
|
||||
StatusFlatRoundButton {
|
||||
width: 32
|
||||
height: 32
|
||||
icon.name: "tiny/edit"
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
tooltip.text: "Edit"
|
||||
onClicked: {
|
||||
delegate.editMode = !delegate.editMode
|
||||
}
|
||||
},
|
||||
StatusFlatRoundButton {
|
||||
id: otherBtn
|
||||
width: 32
|
||||
height: 32
|
||||
icon.name: "more"
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
tooltip.text: "More"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -1,121 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Page {
|
||||
id: root
|
||||
anchors.fill: parent
|
||||
anchors.margins: 16
|
||||
property ListModel contactsModel: null
|
||||
background: null
|
||||
|
||||
header: RowLayout {
|
||||
id: headerRow
|
||||
width: parent.width
|
||||
height: tagSelector.height
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 8
|
||||
spacing: 16
|
||||
|
||||
StatusTagSelector {
|
||||
id: tagSelector
|
||||
Layout.fillWidth: true
|
||||
Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
|
||||
Layout.leftMargin: 17
|
||||
maxHeight: root.height
|
||||
toLabelText: qsTr("To: ")
|
||||
warningText: qsTr("USER LIMIT REACHED")
|
||||
listLabel: qsTr("Contacts")
|
||||
ringSpecModelGetter: function(pubKey) {
|
||||
//for simulation purposes only, in real app
|
||||
//this would be Utils.getColorHashAsJson(pubKey)
|
||||
var index = -1;
|
||||
if (!!contactsModel) {
|
||||
for (var i = 0; i < contactsModel.count; i++) {
|
||||
if (contactsModel.get(i).pubKey === pubKey) {
|
||||
index = i;
|
||||
}
|
||||
}
|
||||
return contactsModel.get(index).ringSpecModel;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
compressedKeyGetter: function(pubKey) {
|
||||
//for simulation purposes only, in real app
|
||||
//this would be Utils.getCompressedPk(pubKey);
|
||||
var possibleCharacters = pubKey.split('');
|
||||
var randomStringLength = 12; // assuming you want random strings of 12 characters
|
||||
var randomString = [];
|
||||
for (var i=0; i<randomStringLength; ++i) {
|
||||
var index = (Math.random() * possibleCharacters.length).toFixed(0);
|
||||
var nextChar = possibleCharacters[index];
|
||||
randomString.push(nextChar);
|
||||
}
|
||||
return randomString.join().toString().replace(/,/g, '');
|
||||
}
|
||||
colorIdForPubkeyGetter: function (pubKey) {
|
||||
//for simulation purposes only, in real app
|
||||
//this would be Utils.colorIdForPubkey(pubKey);
|
||||
return Math.floor(Math.random() * 10);
|
||||
}
|
||||
onTextChanged: {
|
||||
sortModel(root.contactsModel);
|
||||
}
|
||||
Component.onCompleted: {
|
||||
textEdit.forceActiveFocus();
|
||||
sortModel(root.contactsModel);
|
||||
}
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
implicitWidth: 106
|
||||
implicitHeight: 44
|
||||
Layout.alignment: Qt.AlignTop
|
||||
enabled: (tagSelector.namesModel.count > 0)
|
||||
text: "Confirm"
|
||||
}
|
||||
|
||||
Item {
|
||||
implicitHeight: 32
|
||||
implicitWidth: 32
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
StatusActivityCenterButton {
|
||||
id: notificationButton
|
||||
anchors.right: parent.right
|
||||
unreadNotificationsCount: 3
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
contentItem: Item {
|
||||
anchors.fill: parent
|
||||
|
||||
StatusBaseText {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 252
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 252
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.verticalCenterOffset: -(headerRow.height/2)
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
visible: contactsModel.count === 0
|
||||
wrapMode: Text.WordWrap
|
||||
color: Theme.palette.baseColor1
|
||||
text: qsTr("You can only send direct messages to your Contacts.\n
|
||||
Send a contact request to the person you would like to chat with, you will be able to chat with them once they have accepted your contact request.")
|
||||
Component.onCompleted: {
|
||||
if (visible) {
|
||||
tagSelector.enabled = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,110 +0,0 @@
|
||||
import QtQuick 2.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
|
||||
|
||||
anchors.centerIn: parent
|
||||
|
||||
header.title: "Cryptokitties"
|
||||
header.subTitle: "Public Community"
|
||||
header.image.source: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
|
||||
contentItem: Column {
|
||||
width: root.width
|
||||
|
||||
StatusModalDivider {
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
text: "A community of cat lovers, meow!"
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
font.pixelSize: 15
|
||||
height: 46
|
||||
color: Theme.palette.directColor1
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.leftMargin: 16
|
||||
anchors.rightMargin: 16
|
||||
}
|
||||
|
||||
StatusModalDivider {
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Share community"
|
||||
subTitle: "https://join.status.im/u/0x04...45f19"
|
||||
tooltip.text: "Copy to clipboard"
|
||||
icon.name: "copy"
|
||||
iconButton.onClicked: tooltip.visible = !tooltip.visible
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
StatusModalDivider {
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Members"
|
||||
icon.name: "group-chat"
|
||||
label: "184"
|
||||
components: [
|
||||
StatusIcon {
|
||||
icon: "chevron-down"
|
||||
rotation: 270
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Notifications"
|
||||
icon.name: "notification"
|
||||
components: [
|
||||
StatusSwitch {}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModalDivider {
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Edit community"
|
||||
icon.name: "edit"
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Transfer ownership"
|
||||
icon.name: "exchange"
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
title: "Leave community"
|
||||
icon.name: "arrow-left"
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,40 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
StatusModal {
|
||||
id: root
|
||||
|
||||
header.title: "Contact Requests"
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
icon.width: 20
|
||||
icon.height: 20
|
||||
icon.name: "notification"
|
||||
}
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Contact request will be shown here"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Decline all"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
onClicked: root.close()
|
||||
},
|
||||
StatusButton {
|
||||
text: "Accept all"
|
||||
onClicked: root.close()
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,221 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Layout 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
import "data" 1.0
|
||||
|
||||
StatusAppThreePanelLayout {
|
||||
id: root
|
||||
property bool createChat: false
|
||||
|
||||
leftPanel: Item {
|
||||
anchors.fill: parent
|
||||
anchors.margins: 16
|
||||
RowLayout {
|
||||
id: searchInputWrapper
|
||||
width: parent.width
|
||||
|
||||
StatusNavigationPanelHeadline {
|
||||
id: headline
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
text: "Chat"
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
|
||||
StatusRoundButton {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
icon.name: "public-chat"
|
||||
icon.color: Theme.palette.directColor1
|
||||
icon.height: editBtn.icon.height
|
||||
icon.width: editBtn.icon.width
|
||||
implicitWidth: editBtn.implicitWidth
|
||||
implicitHeight: editBtn.implicitHeight
|
||||
type: StatusRoundButton.Type.Tertiary
|
||||
StatusToolTip {
|
||||
text: qsTr("Join public chats")
|
||||
visible: parent.hovered
|
||||
orientation: StatusToolTip.Orientation.Bottom
|
||||
y: parent.height + 12
|
||||
}
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
id: editBtn
|
||||
icon.name: "edit"
|
||||
icon.color: Theme.palette.directColor1
|
||||
checked: root.createChat
|
||||
highlighted: checked
|
||||
onClicked: {
|
||||
root.createChat = !root.createChat;
|
||||
}
|
||||
StatusToolTip {
|
||||
text: qsTr("Start chat")
|
||||
visible: parent.hovered
|
||||
orientation: StatusToolTip.Orientation.Bottom
|
||||
y: parent.height + 12
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
id: searchInput
|
||||
anchors.top: searchInputWrapper.bottom
|
||||
anchors.topMargin: 16
|
||||
width: parent.width
|
||||
maximumHeight: 36
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
placeholderText: "Search"
|
||||
input.icon.name: "search"
|
||||
}
|
||||
|
||||
Column {
|
||||
width: parent.width
|
||||
anchors.top: searchInput.bottom
|
||||
anchors.topMargin: 16
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
spacing: 8
|
||||
|
||||
StatusContactRequestsIndicatorListItem {
|
||||
width: parent.width
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
title: "Contact requests"
|
||||
requestsCount: 3
|
||||
sensor.onClicked: demoContactRequestsModal.open()
|
||||
}
|
||||
|
||||
StatusChatList {
|
||||
width: parent.width
|
||||
model: Models.demoChatListItems
|
||||
highlightItem: !root.createChat
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
centerPanel: Loader {
|
||||
anchors.fill: parent
|
||||
sourceComponent: root.createChat ? createChatView : chatChannelView
|
||||
Component {
|
||||
id: createChatView
|
||||
CreateChatView {
|
||||
contactsModel: Models.membersListModel
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: chatChannelView
|
||||
ChatChannelView {
|
||||
model: Models.chatMessagesModel
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
rightPanel: Item {
|
||||
anchors.fill: parent
|
||||
|
||||
StatusChatToolBar {
|
||||
width: parent.width
|
||||
toolbarComponent: statusChatInfoButton
|
||||
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-left"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusChatInfoButton
|
||||
|
||||
StatusChatInfoButton {
|
||||
width: Math.min(implicitWidth, parent.width)
|
||||
title: "Amazing Funny Squirrel"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
pinnedMessagesCount: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,156 +0,0 @@
|
||||
import QtQuick 2.13
|
||||
import QtQuick.Controls 2.13
|
||||
import QtQuick.Layouts 1.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
import "../demoapp/data" 1.0
|
||||
|
||||
|
||||
StatusScrollView {
|
||||
id: root
|
||||
|
||||
QtObject {
|
||||
id: d
|
||||
|
||||
property ListModel featuredCommunitiesModel: Models.featuredCommunitiesModel
|
||||
property ListModel popularCommunitiesModel: Models.curatedCommunitiesModel
|
||||
property ListModel tagsModel: Models.tagsModel
|
||||
|
||||
property string searchText: ""
|
||||
property int layoutVMargin: 70
|
||||
property int layoutHMargin: 64
|
||||
property int titlePixelSize: 28
|
||||
property int subtitlePixelSize: 17
|
||||
property int stylePadding: 16
|
||||
|
||||
function navigateToCommunity(communityId) {
|
||||
console.info("Clicked community ID: " + communityId)
|
||||
}
|
||||
}
|
||||
|
||||
contentHeight: column.height + d.layoutVMargin
|
||||
contentWidth: column.width + d.layoutHMargin
|
||||
clip: true
|
||||
|
||||
ColumnLayout {
|
||||
id: column
|
||||
spacing: 18
|
||||
|
||||
StatusBaseText {
|
||||
Layout.topMargin: d.layoutVMargin
|
||||
Layout.leftMargin: d.layoutHMargin
|
||||
text: qsTr("Find community")
|
||||
font.weight: Font.Bold
|
||||
font.pixelSize: d.titlePixelSize
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
// Tags definition - Now hidden - Out of scope
|
||||
// TODO: Replace by `StatusListItemTagRow`
|
||||
Row {
|
||||
visible: d.tagsModel.count > 0
|
||||
Layout.leftMargin: d.layoutHMargin
|
||||
Layout.rightMargin: d.layoutHMargin
|
||||
width: 1234 // by design
|
||||
spacing: d.stylePadding/2
|
||||
|
||||
Repeater {
|
||||
model: d.tagsModel
|
||||
delegate: StatusListItemTag {
|
||||
border.color: Theme.palette.baseColor2
|
||||
color: "transparent"
|
||||
height: 32
|
||||
radius: 36
|
||||
closeButtonVisible: false
|
||||
icon.emoji: model.emoji
|
||||
icon.height: 32
|
||||
icon.width: icon.height
|
||||
icon.color: "transparent"
|
||||
icon.isLetterIdenticon: true
|
||||
title: model.name
|
||||
titleText.font.pixelSize: 15
|
||||
titleText.color: Theme.palette.primaryColor1
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
Layout.leftMargin: d.layoutHMargin
|
||||
Layout.topMargin: 20
|
||||
text: qsTr("Featured")
|
||||
font.weight: Font.Bold
|
||||
font.pixelSize: d.subtitlePixelSize
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
GridLayout {
|
||||
id: featuredGrid
|
||||
Layout.leftMargin: d.layoutHMargin
|
||||
columns: 3
|
||||
columnSpacing: d.stylePadding
|
||||
rowSpacing: d.stylePadding
|
||||
|
||||
Repeater {
|
||||
model: d.featuredCommunitiesModel
|
||||
delegate: StatusCommunityCard {
|
||||
locale: "es"
|
||||
communityId: model.communityId
|
||||
loaded: model.available
|
||||
logo: model.logo
|
||||
name: model.name
|
||||
description: model.description
|
||||
members: model.members
|
||||
popularity: model.popularity
|
||||
communityColor: model.communityColor
|
||||
categories: ListModel {
|
||||
ListElement { name: "sport"; emoji: "🎾"}
|
||||
ListElement { name: "food"; emoji: "🥑"}
|
||||
ListElement { name: "privacy"; emoji: "👻"}
|
||||
}
|
||||
|
||||
onClicked: { d.navigateToCommunity(communityId) }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
Layout.leftMargin: d.layoutHMargin
|
||||
Layout.topMargin: 20
|
||||
text: qsTr("Popular")
|
||||
font.weight: Font.Bold
|
||||
font.pixelSize: d.subtitlePixelSize
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
GridLayout {
|
||||
Layout.leftMargin: d.layoutHMargin
|
||||
columns: 3
|
||||
columnSpacing: d.stylePadding
|
||||
rowSpacing: d.stylePadding
|
||||
|
||||
Repeater {
|
||||
model: d.popularCommunitiesModel
|
||||
delegate: StatusCommunityCard {
|
||||
locale: "es"
|
||||
communityId: model.communityId
|
||||
loaded: model.available
|
||||
logo: model.logo
|
||||
name: model.name
|
||||
description: model.description
|
||||
members: model.members
|
||||
activeUsers: model.activeUsers
|
||||
popularity: model.popularity
|
||||
tokenLogo: model.tokenLogo
|
||||
isPrivate: model.isPrivate
|
||||
banner: model.banner
|
||||
|
||||
onClicked: { d.navigateToCommunity(communityId) }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,282 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Layout 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
import "data" 1.0
|
||||
|
||||
StatusAppThreePanelLayout {
|
||||
id: root
|
||||
|
||||
property string communityDetailModalTitle: ""
|
||||
property string communityDetailModalImage: ""
|
||||
signal chatInfoButtonClicked()
|
||||
|
||||
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: "qrc:/demoapp/data/profile-image-1.jpeg"
|
||||
chatInfoButton.icon.color: Theme.palette.miscColor6
|
||||
chatInfoButton.onClicked: { chatInfoButtonClicked(); }
|
||||
|
||||
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"
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
StatusScrollView {
|
||||
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
|
||||
|
||||
width: parent.width
|
||||
toolbarComponent: statusChatInfoButton
|
||||
|
||||
onSearchButtonClicked: {
|
||||
searchButton.highlighted = !searchButton.highlighted;
|
||||
searchPopup.setSearchSelection(communityDetailModalTitle,
|
||||
"",
|
||||
communityDetailModalImage);
|
||||
searchPopup.open();
|
||||
}
|
||||
membersButton.onClicked: membersButton.highlighted = !membersButton.highlighted
|
||||
onMembersButtonClicked: {
|
||||
root.showRightPanel = !root.showRightPanel;
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusChatInfoButton
|
||||
|
||||
StatusChatInfoButton {
|
||||
width: Math.min(implicitWidth, parent.width)
|
||||
title: "general"
|
||||
subTitle: "Community Chat"
|
||||
icon.color: Theme.palette.miscColor6
|
||||
type: StatusChatInfoButton.Type.CommunityChat
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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: Models.membersListModel
|
||||
delegate: StatusMemberListItem {
|
||||
implicitWidth: parent.width
|
||||
nickName: model.localNickname
|
||||
userName: model.displayName
|
||||
pubKey: model.pubKey
|
||||
isVerified: model.isVerified
|
||||
isUntrustworthy: model.isUntrustworthy
|
||||
isContact: model.isContact
|
||||
image.source: model.icon
|
||||
image.isIdenticon: false
|
||||
status: model.onlineStatus
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,78 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.14
|
||||
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Layout 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
import "data" 1.0
|
||||
|
||||
StatusAppTwoPanelLayout {
|
||||
id: root
|
||||
|
||||
leftPanel: Item {
|
||||
anchors.fill: parent
|
||||
|
||||
StatusNavigationPanelHeadline {
|
||||
id: profileHeadline
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 16
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text: "Profile"
|
||||
}
|
||||
|
||||
StatusScrollView {
|
||||
anchors.top: profileHeadline.bottom
|
||||
anchors.topMargin: 16
|
||||
anchors.bottom: parent.bottom
|
||||
width: parent.width
|
||||
|
||||
contentHeight: profileMenuItems.height + 8
|
||||
contentWidth: parent.width
|
||||
clip: true
|
||||
|
||||
Column {
|
||||
id: profileMenuItems
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
spacing: 4
|
||||
|
||||
Repeater {
|
||||
model: Models.demoProfileGeneralMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
|
||||
StatusListSectionHeadline { text: "Settings" }
|
||||
|
||||
Repeater {
|
||||
model: Models.demoProfileSettingsMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: invisibleSeparator
|
||||
height: 16
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
Repeater {
|
||||
model: Models.demoProfileOtherMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
rightPanel: Item {
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 190 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB |
@@ -1 +0,0 @@
|
||||
singleton Models 1.0 Models.qml
|
||||
@@ -1,154 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
|
||||
import SortFilterProxyModel 0.2
|
||||
|
||||
ColumnLayout {
|
||||
id: root
|
||||
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
|
||||
StatusIconTextButton {
|
||||
id: sortBtn
|
||||
|
||||
property int sortOrder: -1
|
||||
statusIcon: {
|
||||
if (sortOrder == Qt.AscendingOrder) return "chevron-down"
|
||||
if (sortOrder == Qt.DescendingOrder) return "chevron-up"
|
||||
return "remove"
|
||||
}
|
||||
|
||||
onClicked: {
|
||||
var st = sortOrder + 1
|
||||
sortOrder = st > 1 ? -1 : st
|
||||
}
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
id: searchInput
|
||||
|
||||
Layout.fillWidth: true
|
||||
input.icon.name: "search"
|
||||
placeholderText: "nickname.."
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
id: contactBtn
|
||||
|
||||
icon.name: "tiny/tiny-contact"
|
||||
identicon.icon.color: Theme.palette.primaryColor1
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
id: verifiedBtn
|
||||
|
||||
icon.name: "tiny/tiny-checkmark"
|
||||
identicon.icon.color: Theme.palette.primaryColor1
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
}
|
||||
|
||||
ListView {
|
||||
Layout.fillWidth: true
|
||||
implicitHeight: contentItem.childrenRect.height
|
||||
spacing: 4
|
||||
|
||||
model: SortFilterProxyModel {
|
||||
sourceModel: d.users
|
||||
sorters: StringSorter {
|
||||
enabled: sortBtn.sortOrder !== -1
|
||||
roleName: "nick"
|
||||
sortOrder: sortBtn.sortOrder
|
||||
}
|
||||
filters: [
|
||||
ExpressionFilter {
|
||||
expression: model.nick.startsWith(searchInput.text)
|
||||
},
|
||||
AllOf {
|
||||
enabled: contactBtn.highlighted || verifiedBtn.highlighted
|
||||
ValueFilter {
|
||||
enabled: contactBtn.highlighted
|
||||
roleName: "isContact"
|
||||
value: true
|
||||
}
|
||||
ValueFilter {
|
||||
enabled: verifiedBtn.highlighted
|
||||
roleName: "isVerified"
|
||||
value: true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
delegate: StatusMemberListItem {
|
||||
width: parent.width
|
||||
userName: model.name
|
||||
nickName: model.nick
|
||||
isVerified: model.isVerified
|
||||
isContact: model.isContact
|
||||
}
|
||||
}
|
||||
|
||||
QtObject {
|
||||
id: d
|
||||
|
||||
readonly property ListModel users: ListModel {
|
||||
ListElement {
|
||||
name: "Richard"
|
||||
nick: "Ricky"
|
||||
isVerified: true
|
||||
isContact: true
|
||||
}
|
||||
ListElement {
|
||||
name: "Susan"
|
||||
nick: "Sue"
|
||||
isVerified: false
|
||||
isContact: false
|
||||
}
|
||||
ListElement {
|
||||
name: "Edward"
|
||||
nick: "Ed"
|
||||
isVerified: true
|
||||
isContact: false
|
||||
}
|
||||
ListElement {
|
||||
name: "Toomas"
|
||||
nick: "Tommy"
|
||||
isVerified: false
|
||||
isContact: false
|
||||
}
|
||||
ListElement {
|
||||
name: "Elizabeth"
|
||||
nick: "Bess"
|
||||
isVerified: true
|
||||
isContact: true
|
||||
}
|
||||
ListElement {
|
||||
name: "Thomas"
|
||||
nick: "Tom"
|
||||
isVerified: false
|
||||
isContact: true
|
||||
}
|
||||
ListElement {
|
||||
name: "Fernando"
|
||||
nick: "Alonso"
|
||||
isVerified: false
|
||||
isContact: true
|
||||
}
|
||||
ListElement {
|
||||
name: "Alexander"
|
||||
nick: "Alex"
|
||||
isVerified: true
|
||||
isContact: false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
#include "handler.h"
|
||||
|
||||
Handler::Handler(QObject *parent) : QObject(parent)
|
||||
{
|
||||
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
#ifndef HANDLER_H
|
||||
#define HANDLER_H
|
||||
|
||||
#include <QObject>
|
||||
|
||||
class Handler : public QObject
|
||||
{
|
||||
Q_OBJECT
|
||||
public:
|
||||
explicit Handler(QObject *parent = nullptr);
|
||||
|
||||
signals:
|
||||
void restartQml();
|
||||
};
|
||||
|
||||
#endif // HANDLER_H
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 9.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 838 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 398 B |
Binary file not shown.
|
Before Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 957 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1009 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 730 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user