Compare commits
1
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 B.Melnik
|
3a0e54928c |
@@ -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)
|
||||
@@ -12,8 +12,3 @@ Makefile
|
||||
.qmake.stash
|
||||
*_qml.cpp
|
||||
*_qmlcache.qrc
|
||||
sandbox/qmlcache_loader.cpp
|
||||
doc/html
|
||||
CMakeLists.txt.user
|
||||
.vscode
|
||||
build/
|
||||
|
||||
-664
@@ -1,664 +0,0 @@
|
||||
<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)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusModal:** render footer correctly based on `showFooter` flag ([da9dc2f4](da9dc2f4))
|
||||
* **StatusRoundButton:** ensure disabled state uses correct background color ([eb4aae40](eb4aae40))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusQ.Controls:**
|
||||
* introduce `StatusWalletColorSelect` control ([ea9a5602](ea9a5602), closes [#467](467))
|
||||
* introduce `StatusWalletColorButton` component ([597ae192](597ae192), closes [#466](466))
|
||||
* **StatusQ.Platform:** introduce StatusMacNotification component ([d301b94c](d301b94c))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.15.0 (2021-10-26)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusQ.Controls:**
|
||||
* introduce StatusChatCommandButton ([4cc0d2bb](4cc0d2bb), closes [#429](429))
|
||||
* introduce `StatusTabBarIconButton` component ([4bcd89b3](4bcd89b3), closes [#428](428))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.14.0 (2021-10-25)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **Spellchecking:** Add check for hunspell existence ([ab9ab249](ab9ab249))
|
||||
* **StatusModal:**
|
||||
* ensure `onEditButtonClicked` signal is emitted ([074dc22b](074dc22b), closes [#454](454))
|
||||
* expose `header.editable` property ([9c5f79a6](9c5f79a6), closes [#452](452))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusSmartIdenticon:** Created a new StatusQ componnent to accomodate: ([14527483](14527483))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.13.0 (2021-10-19)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* use proper double checkmark icon ([8aba017c](8aba017c))
|
||||
* **StatusBaseButton:** introduce missing `highlighted` property ([a3748920](a3748920))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusFlatRoundButton:** Update the StatusFlatRoundButton to take over button behaviour from StatusIconButton under ui/shared/status ([71fbdef1](71fbdef1))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.12.0 (2021-10-18)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* Resolve StatusQ modules highlighting and add qml compiler for detecting coompile time errors ([e1b0f2dc](e1b0f2dc))
|
||||
* **StatusModal:** Add edit avatar button ([5043b0b6](5043b0b6))
|
||||
* **StatusQ.Components:** introduce `StatusAddress` component ([6789446d](6789446d), closes [#430](430))
|
||||
* **StatusQ.Controls:**
|
||||
* introduce StatusColorSelector component ([bdd69955](bdd69955), closes [#444](444))
|
||||
* introduce `StatusAssetSelector` component ([9fdc9aea](9fdc9aea), closes [#442](442))
|
||||
* introduce `StatusAccountSelector` component ([5e15cc49](5e15cc49), closes [#435](435))
|
||||
* introduce `StatusSelect` ([6e10959e](6e10959e), closes [#436](436))
|
||||
* **StatusQ.Popups:** introduce `StatusMenuItemDelegate` ([0764e25a](0764e25a))
|
||||
|
||||
#### Breaking Changes
|
||||
|
||||
* **StatusQ.Popups:** introduce `StatusMenuItemDelegate` ([0764e25a](0764e25a))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## Version 0.11.1(2021-10-12)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* Sandbox doesn't build on Linux machines ([dce45c2f](dce45c2f))
|
||||
* **StatusChatInfoButton:** StatusChatInfoButton takes up entire available width ([c276a90e](c276a90e))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.11.0 (2021-09-27)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* track category opened state ([0631d500](0631d500))
|
||||
* **StatusChatList:** ensure right click popup opens in correct position ([a2e3659d](a2e3659d))
|
||||
* **StatusSearchPopup:** use correct theme color for search result text ([654bd9f2](654bd9f2))
|
||||
* **StatusSpellcheckingMenuItems:** Exact menu items order ([478177f2](478177f2))
|
||||
|
||||
#### Features
|
||||
|
||||
* add star icons (#422) ([5c3267f7](5c3267f7))
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.10.0 (2021-09-20)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusChatInfoToolBar:** Right anchored title in StatusChatInfoToolBar ([6e8a36be](6e8a36be))
|
||||
* **StatusChatListCategoryItem:** Disable sensor when chevron clicked ([c83641d2](c83641d2))
|
||||
* **StatusQ.Controls.Validators:** fix bug that addressOrEns validator isn't properly exposed in QML ([1374c193](1374c193))
|
||||
|
||||
#### Features
|
||||
|
||||
* **Spellchecker:** Add Spellchecker class ([c65f80d2](c65f80d2))
|
||||
* **Spellchecking:**
|
||||
* Add dictionaries ([1d12d222](1d12d222))
|
||||
* Add huspell dependency ([f9457ef3](f9457ef3))
|
||||
* **StatusChatList:** expose `statusChatListItems` Repeater ([40c0e48b](40c0e48b))
|
||||
* **StatusExpandableItem:** Correct placement of expandable region in tertiary type ([1f244f62](1f244f62))
|
||||
* **StatusInput:**
|
||||
* add support for asynchronous validators ([8820cd89](8820cd89), closes [#395](395))
|
||||
* introduce `leftPadding` and `rightPadding` properties ([13dc8ae3](13dc8ae3))
|
||||
* introduce `reset` API ([a2ad08e4](a2ad08e4))
|
||||
* **StatusSpellcheckingMenuItems:** Add spellchecking menu ([3e24b710](3e24b710))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.9.0 (2021-09-13)
|
||||
|
||||
|
||||
#### Breaking Changes
|
||||
|
||||
* **StatusExpandableItem:** Refactored the StatusExpandableSettingsItem to support different types ([718171fd](718171fd))
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusAppThreePanelLayout:** Fix margin between left and center panels ([29e9557d](29e9557d))
|
||||
* **StatusChatListAndCategories:** rely on correct tooltip settings prop ([2971c607](2971c607))
|
||||
* **StatusCheckbox:** give checkbox label proper theme color ([88fb57dd](88fb57dd))
|
||||
* **StatusModal:** don't reserve header subtitle space ([eabc62f7](eabc62f7), closes [#378](378))
|
||||
|
||||
#### Features
|
||||
|
||||
* **Status.Core.Theme:** add RobotoMono font ([aab44c1e](aab44c1e), closes [#342](342))
|
||||
* **StatusBaseInput:** introduce `component` property ([019471c8](019471c8), closes [#380](380))
|
||||
* **StatusExpandableItem:** Refactored the StatusExpandableSettingsItem to support different types ([718171fd](718171fd))
|
||||
* **StatusInput:**
|
||||
* introduce `ValidationMode` ([d73a1584](d73a1584))
|
||||
* exposed edit component ([73c77c29](73c77c29))
|
||||
* **StatusQ.Controls.Validators:**
|
||||
* introduce `StatusAddressAndEnsValidator` ([a93ef161](a93ef161))
|
||||
* introduce `StatusAddressValidator` ([77d0e9b8](77d0e9b8))
|
||||
* **StatusSearchPopup:** introduce forceActiveFocus API ([efe31166](efe31166))
|
||||
* **StatusValidator:** allow validators to provide default `errorMessage` ([1a23cc19](1a23cc19))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.8.0 (2021-09-06)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusBaseInput:**
|
||||
* fix one line scroll ([d64aa6de](d64aa6de))
|
||||
* Make clear button bigger ([387bfe77](387bfe77))
|
||||
* **StatusChatToolBar:** Fix mouse event catching after menu closing ([fbecac4a](fbecac4a))
|
||||
* **StatusInput:** Forward keys events to root ([061c7d1c](061c7d1c))
|
||||
* **StatusListItem:** Add propogateCompostedEvents to title mouse area ([5c706fdc](5c706fdc))
|
||||
* **StatusModal:** Remove self-calculating height ([3187de54](3187de54))
|
||||
|
||||
#### Features
|
||||
|
||||
* introduce bigger versions of navbar icons ([0a4d3860](0a4d3860))
|
||||
* **StatusBaseInput:** introduce focussed property ([ddfca7a8](ddfca7a8), closes [#373](373))
|
||||
* **StatusChatListAndCategories:** Add tooltip settings for categories buttons ([64098e84](64098e84))
|
||||
* **StatusDescriptionListItem:**
|
||||
* expose subtitle component for fine control ([1749cc0e](1749cc0e))
|
||||
* introduce support for `value` ([a963ef80](a963ef80))
|
||||
* **StatusExpandableSettingsItem:** Added new component for wallet settings ([f3ab4ce9](f3ab4ce9))
|
||||
* **StatusInput:** Introduced secondaryLabel property ([d648230d](d648230d), closes [#383](383))
|
||||
* **StatusModal:**
|
||||
* Add popup menu support for StatusModal ([8a94fb54](8a94fb54))
|
||||
* add ability to set elide config of header titles ([28e514f9](28e514f9), closes [#353](353))
|
||||
* **StatusQ.Controls:** introduce StatusSwitchTabBar and StatusSwitchTabButton ([d449f0e9](d449f0e9), closes [#365](365))
|
||||
* **StatusSearchPopup:** add function hook to allow timestamp formatting ([b45aba4b](b45aba4b), closes [#363](363))
|
||||
* **qrc:** Add new icon needed for share modal ([38fb8f61](38fb8f61))
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.7.0 (2021-08-30)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusChatListAndCategories:** add drag and drop support for cate… (#349) ([a4178bd6](a4178bd6), closes [#227](227))
|
||||
* **StatusChatListCategoryItem:** Add tooltips settings ([f9775e4d](f9775e4d))
|
||||
* **StatusPopupMenu:** changed close policy ([2d8fd576](2d8fd576))
|
||||
* **StatusWindowsTitleBar:** Add windows title bar ([faca4765](faca4765))
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusAppThreePanelLayout:** increase minimum width in right panel ([7da4bdee](7da4bdee))
|
||||
* **StatusBaseInput:** fix click to focus ([138458d1](138458d1))
|
||||
* **StatusChatInfoButton:** Add self-calculated implicitWIdth and elide to texts ([7ef61ed3](7ef61ed3))
|
||||
* **StatusListItem:** don't set width on title item ([ee5ec7b3](ee5ec7b3))
|
||||
* **StatusModal:** ensure header and subtitles elide if needed ([503a07bf](503a07bf), closes [#256](256))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.6.0 (2021-08-24)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusBaseInput:** introduce `dirty` and `pristine` properties ([ea340801](ea340801), closes [#327](327))
|
||||
* **StatusChatList:** Add drag and drop support of list items ([c679854d](c679854d))
|
||||
* **StatusLetterIdenticon:** Expose the text component ([d16719ad](d16719ad))
|
||||
* **StatusListItem:** introduce itemId and titleId properties and their handlers ([01da7508](01da7508))
|
||||
* **StatusSearchPopupMenuItem:**
|
||||
* New APIs resetSearchSelection and setSearchSelection ([78edcb37](78edcb37))
|
||||
* new API ([b133d10f](b133d10f))
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusBaseInput:**
|
||||
* ensure wrapmode works as expectefd in multiline mode ([0243852c](0243852c), closes [#324](324))
|
||||
* expose cursorPosition ([ea6743a7](ea6743a7), closes [#323](323))
|
||||
* **StatusChatListCategory:** emit original mouse event data in clicked signal ([5da9cb06](5da9cb06), closes [#333](333))
|
||||
* **StatusInput:**
|
||||
* ensure validation is performed on initialization ([4b107a0e](4b107a0e), closes [#326](326))
|
||||
* remove recursive binding in label height ([51d8b55b](51d8b55b))
|
||||
* **StatusSearchLocationMenu:** typo fix ([c306b682](c306b682))
|
||||
* **StatusSearchPopup:** replace "#" character with "channel" icon ([2de261c4](2de261c4))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.5.0 (2021-08-16)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusChatToolBar:** Use updated StatusFlatRoundButton ([d24c2e62](d24c2e62))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusBaseInput:** enforce `maximumLength` if it's set ([f635bad6](f635bad6))
|
||||
* **StatusFlatRoundButton:** Adding tooltip to the button ([5a0489ba](5a0489ba))
|
||||
* **StatusIcon:** add `play-filled` and `pause-filled` icons ([58a30716](58a30716), closes [#310](310))
|
||||
* **StatusInput:** introduce new validator pipeline ([ba4f27f9](ba4f27f9), closes [#298](298))
|
||||
* **StatusToolTip:** Adding an offset property ([ee429683](ee429683))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.4.0 (2021-08-12)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusAppNavBar:** add profile button (#311) ([2e1359c9](2e1359c9))
|
||||
* **StatusChatListItem:** don't signal item selection if already selected ([b345c75a](b345c75a), closes [#303](303))
|
||||
* **StatusPopupMenu:** ensure icon or image settings exist ([90aa9d76](90aa9d76), closes [#295](295))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusListItem:** add enabled prop to StatusListItem (#302) ([7e03daea](7e03daea))
|
||||
* **StatusQ.Theme.Core:** introduce theme colors for StatusChatInput (#299) ([556e5cca](556e5cca))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.3.0 (2021-07-27)
|
||||
|
||||
|
||||
#### Features
|
||||
|
||||
* **Controls:** introduce `StatusInput` ([646c00bd](646c00bd), closes [#288](288))
|
||||
* **Popups:** introduce `StatusMenuHeadline` component ([246bec0d](246bec0d))
|
||||
* **StatusBaseInput:**
|
||||
* add icon support ([c8e90349](c8e90349), closes [#242](242))
|
||||
* add visual validity state ([e8cce72c](e8cce72c), closes [#287](287))
|
||||
* add hover state visuals ([e1ebdaae](e1ebdaae), closes [#285](285))
|
||||
* **StatusInput:** implement error message and charlimit APIs ([3cf53d02](3cf53d02), closes [#290](290))
|
||||
* **StatusPopupMenu:** add support for letter identicons, identicons and images ([3c4c7f04](3c4c7f04), closes [#263](263))
|
||||
* **StatusQ.Layout:** introducing StatusAppThreePanelLayout ([ffc6fcb4](ffc6fcb4), closes [#272](272))
|
||||
* **sandbox:** make use of `StatusInput` in chat view ([731a0f8c](731a0f8c))
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusAppThreePanelLayout:**
|
||||
* limit right panel width to 300px ([d327c515](d327c515))
|
||||
* limit center panel width to 300px ([762ff87b](762ff87b))
|
||||
* hide right panel when closed ([61705990](61705990))
|
||||
* **StatusBaseInput:**
|
||||
* some minor style adjustment to adhere to design ([f16e857c](f16e857c))
|
||||
* ensure input text is selectable with mouse ([ab303593](ab303593))
|
||||
* ensure clear button has the correct color ([de1cec7e](de1cec7e), closes [#286](286))
|
||||
* add visuals for disabled state ([35f20e33](35f20e33), closes [#284](284))
|
||||
* expose text prop alias ([116ddfbb](116ddfbb))
|
||||
* **StatusChatInfoButton:** ensure pin icon button is always rendered ([baefedb8](baefedb8), closes [#278](278))
|
||||
* **StatusListItem:** ensure title area wraps text ([e3f79314](e3f79314))
|
||||
* **StatusModal:** reset image/identicon width when loader state has changed ([e4e7ebe3](e4e7ebe3))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.2.0 (2021-07-21)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* **StatusChatListCategory:** ensures showActionButtons is taken into account ([52cb97e4](52cb97e4))
|
||||
* **StatusPopupMenu:** ensure menu items elide ([d1f8e3e5](d1f8e3e5))
|
||||
|
||||
#### Features
|
||||
|
||||
* **StatusChatInfoToolBar:** make statusMenuButton public ([38c04cb9](38c04cb9))
|
||||
* **StatusChatListAndCategories:** new API showPopupMenu ([9cfcdace](9cfcdace))
|
||||
* **StatusChatListItem:** introduce muted badge visuals ([a404ba07](a404ba07), closes [#259](259))
|
||||
* **StatusListItem:**
|
||||
* support tertiaryTitle ([03131996](03131996), closes [#275](275))
|
||||
* add identicon support ([214ef6b0](214ef6b0), closes [#261](261))
|
||||
* **StatusModal:**
|
||||
* introduce support for identicons and letter identicons ([fda9b71f](fda9b71f), closes [#269](269))
|
||||
* render header and footer border by default ([18dbaadd](18dbaadd), closes [#265](265))
|
||||
* **StatusToolTip:** expose `arrow` for fine-grain control ([51b7c71d](51b7c71d))
|
||||
|
||||
|
||||
|
||||
<a name=""></a>
|
||||
## v0.1.0 (2021-07-15)
|
||||
|
||||
|
||||
#### Bug Fixes
|
||||
|
||||
* Add missing .qml to resources, add qmlcache to gitignore ([71d0ef7f](71d0ef7f))
|
||||
* make release build work ([1a7c2133](1a7c2133))
|
||||
* introduce tiny icon versions and make use of them where needed ([a0fae6ab](a0fae6ab), closes [#128](128))
|
||||
* update position of window to center, add traffic lights ([26aae6d0](26aae6d0))
|
||||
* hover effect for StatusFlatRoundButton ([ee4a7c88](ee4a7c88))
|
||||
* fix crash on removing title bar ([c94b801e](c94b801e))
|
||||
* **Components:**
|
||||
* more popup menu position fine-tuning ([22eaf6fa](22eaf6fa))
|
||||
* add proper foreground color for StatusBadge ([6a92ff68](6a92ff68), closes [#59](59))
|
||||
* **Controls:** ensure round buttons expose `hovered` state ([98b01946](98b01946), closes [#88](88))
|
||||
* **Core:**
|
||||
* add missing `rotation` property to `StatusIconSettings` ([341c0ddd](341c0ddd))
|
||||
* don't rotate `ColorOverlay` of `StatusIcon` ([062fe42a](062fe42a), closes [#109](109))
|
||||
* disable StatusIcon ColorOverlay if no color is supplied ([f1e34e39](f1e34e39))
|
||||
* **Core.Theme:**
|
||||
* ensure proper nav bar colors is used ([6c84fed7](6c84fed7))
|
||||
* remove redundant theme properties ([75e87725](75e87725))
|
||||
* ensure all font weight are available ([0a88e652](0a88e652), closes [#30](30))
|
||||
* **README:** fix module name in readme docs ([f4b5b271](f4b5b271))
|
||||
* **StatusAppNavBar:**
|
||||
* don't rely on `undefined` property ([175d7a19](175d7a19))
|
||||
* don't try to render chat button if it doesn't exist ([d690a0c5](d690a0c5))
|
||||
* **StatusBadge:** use medium font weight for badge text ([cb9492ab](cb9492ab))
|
||||
* **StatusBaseInput:** Fix focus area Closes: #241 ([f2d36d3d](f2d36d3d))
|
||||
* **StatusChatInfoButton:**
|
||||
* make component identicon aware ([7dcec0ca](7dcec0ca), closes [#228](228))
|
||||
* prefix chat name with "#" if needed ([144ac69d](144ac69d), closes [#229](229))
|
||||
* vertically center title if no subtitle is provided ([7b2030c6](7b2030c6), closes [#230](230))
|
||||
* disable hover effects when sensor is disabled ([f7e38c9c](f7e38c9c), closes [#231](231))
|
||||
* **StatusChatList:**
|
||||
* ensure badge is also shown for one to one messages ([ac5c8452](ac5c8452))
|
||||
* ensure popupMenu closeHandler don't break ([722d92c0](722d92c0), closes [#216](216))
|
||||
* use fallback property to determine unread message count ([f7f217ed](f7f217ed))
|
||||
* expect `model.color` instead of `iconColor` prop ([70332a3f](70332a3f))
|
||||
* ensure component provide default `width` ([300536bc](300536bc), closes [#176](176))
|
||||
* **StatusChatListAndCategories:**
|
||||
* make chat list visibily flag work ([53d63a9b](53d63a9b), closes [#217](217))
|
||||
* ensure chatItemUnmuted event is propagated ([a9ae426c](a9ae426c), closes [#219](219))
|
||||
* ensure chat list receives popup menu ([23ddbc2e](23ddbc2e), closes [#218](218))
|
||||
* **StatusChatListCategory:** only try open popup when supplied ([cbdaf128](cbdaf128), closes [#220](220))
|
||||
* **StatusChatListCategoryItem:** don't render menubutton with no popup ([05fc97ca](05fc97ca), closes [#153](153))
|
||||
* **StatusChatListItem:**
|
||||
* ensure chat name elides when it's too long ([34df0f0d](34df0f0d), closes [#151](151))
|
||||
* ensure public chat names are prefixed with '#' ([141872c2](141872c2), closes [#191](191))
|
||||
* use proper font size for chat name ([ac80f7f7](ac80f7f7))
|
||||
* **StatusChatToolBar:**
|
||||
* ensure context menu as proper position ([3ea8da05](3ea8da05))
|
||||
* ensure menu button stays highlighted ([90bad9e3](90bad9e3), closes [#125](125))
|
||||
* **StatusFlatRoundButton:** use correct hover color ([82e34d64](82e34d64))
|
||||
* **StatusListItem:**
|
||||
* ensure icon background in secondary type works correctly ([34b35318](34b35318))
|
||||
* various fixes w.r.t. sensor, icon size etc ([e5e96af5](e5e96af5))
|
||||
* **StatusMenuSeparator:** ensure height is 0 when invisible or disabled ([fd7a5530](fd7a5530), closes [#212](212))
|
||||
* **StatusModal:** ensure modal footer uses correct theme color ([de2c36d0](de2c36d0))
|
||||
* **StatusModalHeader:** ensure header has enough height for children ([75b2f508](75b2f508), closes [#185](185))
|
||||
* **StatusNavBarTabButton:**
|
||||
* fix popup menu positioning ([705f1402](705f1402))
|
||||
* ensure click signal is emitted when not menu is provided ([040da2a4](040da2a4))
|
||||
* don't change checked state implicitly ([b1fe73ba](b1fe73ba))
|
||||
* **StatusNavigationListItem:** make click event work again ([c5ecfe08](c5ecfe08))
|
||||
* **StatusQ.Core.Theme:** use correct dropshadow color in dark theme ([70e17b05](70e17b05))
|
||||
* **StatusRadioButton:** ensure control label as correct color ([1cb0c1d3](1cb0c1d3), closes [#51](51))
|
||||
* **StatusRoundedImage:** ensure images are scaled and positioned properly ([3d0688b7](3d0688b7), closes [#172](172))
|
||||
* **sandbox:** make scrollview content height grow with content ([2f09179f](2f09179f))
|
||||
|
||||
#### Features
|
||||
|
||||
* can be used on tablets (#146) ([63be0144](63be0144))
|
||||
* add StatusSwitch ([52998d68](52998d68), closes [#12](12))
|
||||
* Add buttons components ([91b8d317](91b8d317))
|
||||
* Set up catalog app (sandbox) ([3528b2ff](3528b2ff), closes [#5](5))
|
||||
* introduce theming capability ([608fdbda](608fdbda), closes [#3](3))
|
||||
* **Components:**
|
||||
* introduce `StatusContactRequestsIndicatorListItem` ([baa663ce](baa663ce), closes [#175](175))
|
||||
* introduce `StatusListSectionHeadline` ([507703af](507703af), closes [#164](164))
|
||||
* introduce `StatusNavigationPanelHeadline` ([40617cd7](40617cd7), closes [#162](162))
|
||||
* introduce `StatusChatListAndCategories` component ([7bca2745](7bca2745), closes [#133](133))
|
||||
* introduce `StatusChatInfoToolBar` component ([454e73a8](454e73a8), closes [#141](141))
|
||||
* introduce `StatusChatListCategory` ([f4d211ac](f4d211ac), closes [#123](123))
|
||||
* introduce `StatusChatListCategoryItem` ([916dcc9c](916dcc9c), closes [#117](117))
|
||||
* introduce `StatusChatList` ([1e558b59](1e558b59), closes [#100](100))
|
||||
* Add StatusSlider ([c0ad32a1](c0ad32a1))
|
||||
* introduce `StatusChatToolBar` ([a4421b5b](a4421b5b), closes [#80](80))
|
||||
* introduce `StatusDescriptionListItem` ([4a25ca02](4a25ca02))
|
||||
* introduce StatusNavigationListItem ([63275668](63275668), closes [#72](72))
|
||||
* introduce StatusChatListItem ([b40d427d](b40d427d), closes [#65](65))
|
||||
* introduce `StatusListItem` component ([a3fe02d0](a3fe02d0), closes [#19](19))
|
||||
* introduce `StatusRoundIcon` component ([8639e8cc](8639e8cc), closes [#53](53))
|
||||
* introduce StatusBadge component ([a89e218a](a89e218a), closes [#15](15))
|
||||
* introduce StatusRoundedImage ([09876c1f](09876c1f), closes [#32](32))
|
||||
* introduce StatusLetterIdenticon ([b0155313](b0155313), closes [#28](28))
|
||||
* introduce StatusLoadingIndicator ([3ce1138b](3ce1138b), closes [#7](7))
|
||||
* **Controls:**
|
||||
* introduce StatusBaseInput ([13217604](13217604))
|
||||
* introduce `StatusChatInfoButton` ([8a799182](8a799182))
|
||||
* introduce StatusNavBarTabButton ([ea118d71](ea118d71), closes [#17](17))
|
||||
* introduce StatusToolTip component ([f3a6c9f4](f3a6c9f4), closes [#14](14))
|
||||
* **Core:**
|
||||
* introduce StatusIconBackgroundSettings ([a4e62fb2](a4e62fb2))
|
||||
* introduce `StatusImageSettings` ([d9529883](d9529883))
|
||||
* introduce StatusBaseText component ([c7d533af](c7d533af), closes [#20](20))
|
||||
* **Core.Controls:** introduce StatusIconTabButton component ([b4b1f472](b4b1f472), closes [#16](16))
|
||||
* **Core.Theme:** expose solid black and white on `ThemePalette` ([996ceb2b](996ceb2b))
|
||||
* **Layout:**
|
||||
* introduce `StatusAppTwoPanelLayout` ([af3ca15b](af3ca15b))
|
||||
* introduce StatusAppLayout component ([554998dc](554998dc))
|
||||
* introduce StatusAppNavBar ([0dfd39af](0dfd39af), closes [#18](18))
|
||||
* **Popups:**
|
||||
* Add StatusModal ([e49b58b9](e49b58b9))
|
||||
* introduce StatusModalDivider ([148c30b9](148c30b9))
|
||||
* Add StatusModalFooter ([9c2a5830](9c2a5830))
|
||||
* Add status modal header ([fa9bb7ad](fa9bb7ad))
|
||||
* **StatusBadge:** introduce `borderColor` and `hoverBorderColor` ([041c11fb](041c11fb))
|
||||
* **StatusBaseInput:** Add focused state Closes: #240 ([19349881](19349881))
|
||||
* **StatusChatList:**
|
||||
* expose hook to lazily calculate chat item names ([a664f635](a664f635))
|
||||
* introduce `profileImageFn` property ([cfacd5be](cfacd5be), closes [#174](174))
|
||||
* introduce `popupMenu` property ([a6262f0a](a6262f0a), closes [#171](171))
|
||||
* introduce `filterFn` and `categoryId` ([cb078134](cb078134), closes [#154](154))
|
||||
* **StatusChatListCategory:**
|
||||
* apply chat list filter and expose category id in popup menu ([45775518](45775518))
|
||||
* introduce flag to show/hide buttons ([9982c3df](9982c3df), closes [#150](150))
|
||||
* **StatusChatListCategoryItem:** introduce `highlighted` property ([72bdd2d9](72bdd2d9))
|
||||
* **StatusChatListCategoryItemButton:** introduce `highglighted` property ([645a3b79](645a3b79))
|
||||
* **StatusChatListItem:**
|
||||
* add `highlighted` property ([44343d38](44343d38), closes [#178](178))
|
||||
* accept right clicks ([1f3aa0bb](1f3aa0bb), closes [#131](131))
|
||||
* **StatusChatToolBar:**
|
||||
* add tooltips to action buttons ([86da901e](86da901e), closes [#244](244))
|
||||
* add members and search button ([e93dab2b](e93dab2b), closes [#243](243))
|
||||
* **StatusFlatRoundButton:**
|
||||
* introduce `highlighted` color for secondary type ([58e8f1cd](58e8f1cd), closes [#245](245))
|
||||
* support icon rotation ([3a7a338d](3a7a338d))
|
||||
* **StatusIcon:** Improvement of Icons ([7bc7df8d](7bc7df8d))
|
||||
* **StatusIconTabButton:** introduce image loading state and fallback ([9b99d8a9](9b99d8a9), closes [#37](37))
|
||||
* **StatusListItem:**
|
||||
* add `Danger` type support ([8155d9a2](8155d9a2), closes [#248](248))
|
||||
* support letter identicons ([531e54f2](531e54f2), closes [#239](239))
|
||||
* introduce primary and secondary types ([146218e0](146218e0))
|
||||
* **StatusModal:** expose loaded content ([bd383e87](bd383e87), closes [#237](237))
|
||||
* **StatusNavBarTabButton:** introduce `popupMenu` property ([5e8242df](5e8242df), closes [#137](137))
|
||||
* **StatusPopupMenu:**
|
||||
* introduce `openHandler` ([2427fa2d](2427fa2d))
|
||||
* make menu items invisible when disabled ([c9bc9bab](c9bc9bab), closes [#135](135))
|
||||
* introduce `closeHandler` hook ([fb51e9d7](fb51e9d7))
|
||||
* **StatusQ.Popups:** introduce StatusPopupMenu component ([09a6f418](09a6f418), closes [#96](96))
|
||||
* **StatusRoundButton:** add `highlighted` and `icon.rotation` props ([7c16a9bd](7c16a9bd))
|
||||
* **StatusRoundIcon:** enable `icon.color` support ([70043c5b](70043c5b))
|
||||
* **StatusRoundedImage:**
|
||||
* introduce identicon support ([7a2648f6](7a2648f6), closes [#173](173))
|
||||
* add loading indicator option ([44b275f2](44b275f2), closes [#56](56))
|
||||
* **sandbox:**
|
||||
* introduce first part of profile view for reference app ([4588d597](4588d597))
|
||||
* introduce first version of reference app ([202fb886](202fb886))
|
||||
|
||||
|
||||
|
||||
@@ -9,7 +9,6 @@ These modules are:
|
||||
|
||||
- [StatusQ.Core](https://github.com/status-im/StatusQ/blob/master/src/StatusQ/Core/qmldir)
|
||||
- [StatusQ.Core.Theme](https://github.com/status-im/StatusQ/blob/master/src/StatusQ/Core/Theme/qmldir)
|
||||
- [StatusQ.Core.Utils](https://github.com/status-im/StatusQ/blob/master/src/StatusQ/Core/Utils/qmldir)
|
||||
- [StatusQ.Components](https://github.com/status-im/StatusQ/blob/master/src/StatusQ/Controls/qmldir)
|
||||
- [StatusQ.Controls](https://github.com/status-im/StatusQ/blob/master/src/StatusQ/Components/qmldir)
|
||||
- [StatusQ.Layout](https://github.com/status-im/StatusQ/blob/master/src/StatusQ/Layout/qmldir)
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.2 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,41 +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{StatusLetterIdenticon}
|
||||
\li \l{StatusListItem}
|
||||
\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}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,47 +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{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{StatusIdenticonRing}
|
||||
\li \l{StatusInput}
|
||||
\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}
|
||||
\endlist
|
||||
*/
|
||||
@@ -1,23 +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{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;
|
||||
}
|
||||
@@ -0,0 +1,239 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Grid {
|
||||
|
||||
columns: 3
|
||||
columnSpacing: 38
|
||||
rowSpacing: 10
|
||||
|
||||
horizontalItemAlignment: Grid.AlignHCenter
|
||||
|
||||
// Large
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
loading: true
|
||||
type: StatusBaseButton.Type.Danger
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Small
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
size: StatusBaseButton.Size.Small
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
size: StatusBaseButton.Size.Small
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Icon buttons
|
||||
|
||||
// blue
|
||||
|
||||
StatusRoundButton {
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// black
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Secondary
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Secondary
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Secondary
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Rounded blue
|
||||
|
||||
StatusFlatRoundButton {
|
||||
width: 44
|
||||
height: 44
|
||||
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Rounded white
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 44
|
||||
height: 44
|
||||
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
icon.name: "info"
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
StatusFlatButton {
|
||||
icon.name: "info"
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
icon.name: "info"
|
||||
text: "Button"
|
||||
loading: true
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
}
|
||||
@@ -8,25 +8,10 @@ import StatusQ.Controls 0.1
|
||||
import Sandbox 0.1
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
columns: 6
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusSelectableText {
|
||||
color: Theme.palette.baseColor1
|
||||
text: "This is a multiline paragraph that can be selected and copied. A paragraph is a group of words put together to form a group that is usually longer than a sentence. Paragraphs are often made up of several sentences. There are usually between three and eight sentences. Paragraphs can begin with an indentation (about five spaces), or by missing a line out, and then starting again."
|
||||
font.pixelSize: 15
|
||||
width: 300
|
||||
multiline: true
|
||||
}
|
||||
|
||||
StatusSelectableText {
|
||||
color: Theme.palette.baseColor1
|
||||
text: "<p>This is a selectable link in rich text format to test <a href='www.google.com'>www.google.com</a></p>"
|
||||
font.pixelSize: 15
|
||||
width: 200
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
icon.name: "chat"
|
||||
}
|
||||
@@ -130,36 +115,6 @@ GridLayout {
|
||||
pinnedMessagesCount: 1
|
||||
}
|
||||
|
||||
Item {
|
||||
implicitWidth: 100
|
||||
implicitHeight: 48
|
||||
StatusChatInfoButton {
|
||||
title: "Iuri Matias elided"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
muted: true
|
||||
pinnedMessagesCount: 1
|
||||
width: 100
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
implicitWidth: 100
|
||||
implicitHeight: 48
|
||||
StatusChatInfoButton {
|
||||
title: "Iuri Matias big not elided"
|
||||
subTitle: "Contact"
|
||||
icon.color: Theme.palette.miscColor7
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
muted: true
|
||||
pinnedMessagesCount: 1
|
||||
width: 400
|
||||
}
|
||||
}
|
||||
|
||||
StatusChatInfoButton {
|
||||
title: "group"
|
||||
subTitle: "Group Chat"
|
||||
@@ -189,18 +144,31 @@ GridLayout {
|
||||
value: 40
|
||||
}
|
||||
|
||||
StatusBanner {
|
||||
id: banner
|
||||
width: 360
|
||||
topPadding: 20
|
||||
type: StatusBanner.Type.Danger
|
||||
statusText: "Banner"
|
||||
StatusBaseInput {
|
||||
placeholderText: "One line"
|
||||
}
|
||||
|
||||
StatusProgressBar {
|
||||
id: progressBar
|
||||
text: "Weak"
|
||||
value: 0.5
|
||||
fillColor : Theme.palette.pinColor1
|
||||
StatusBaseInput {
|
||||
multiline: true
|
||||
placeholderText: "Multiline"
|
||||
}
|
||||
|
||||
StatusBaseInput {
|
||||
multiline: true
|
||||
placeholderText: "Multiline with static height"
|
||||
implicitHeight: 100
|
||||
}
|
||||
|
||||
Item {
|
||||
implicitHeight: 300
|
||||
implicitWidth: 300
|
||||
|
||||
StatusBaseInput {
|
||||
anchors.centerIn: parent
|
||||
multiline: true
|
||||
placeholderText: "Multiline with max/min"
|
||||
minimumHeight: 80
|
||||
maximumHeight: 200
|
||||
}
|
||||
}
|
||||
}
|
||||
+769
-115
@@ -7,64 +7,46 @@ import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
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
|
||||
width: 1002
|
||||
width: 902
|
||||
border.width: 1
|
||||
border.color: Theme.palette.baseColor2
|
||||
|
||||
property string titleStyle: "osx"
|
||||
Row {
|
||||
anchors.top: demoApp.top
|
||||
anchors.left: demoApp.left
|
||||
anchors.topMargin: 14
|
||||
anchors.leftMargin: 14
|
||||
|
||||
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
|
||||
readonly property int apiDocumentation: 100
|
||||
readonly property int demoApp: 101
|
||||
}
|
||||
spacing: 6
|
||||
z: statusAppLayout.z + 1
|
||||
|
||||
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);
|
||||
Rectangle {
|
||||
color: "#E24640"
|
||||
height: 12
|
||||
width: 12
|
||||
radius: 6
|
||||
}
|
||||
Rectangle {
|
||||
color: "#FFC12F"
|
||||
height: 12
|
||||
width: 12
|
||||
radius: 6
|
||||
}
|
||||
Rectangle {
|
||||
color: "#2ACB42"
|
||||
height: 12
|
||||
width: 12
|
||||
radius: 6
|
||||
}
|
||||
}
|
||||
|
||||
StatusMacTrafficLights {
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
anchors.margins: 13
|
||||
z: statusAppLayout.z + 1
|
||||
visible: titleStyle === "osx"
|
||||
}
|
||||
|
||||
StatusWindowsTitleBar {
|
||||
id: windowsTitle
|
||||
anchors.top: parent.top
|
||||
width: parent.width
|
||||
z: statusAppLayout.z + 1
|
||||
visible: titleStyle === "windows"
|
||||
}
|
||||
|
||||
StatusAppLayout {
|
||||
id: statusAppLayout
|
||||
anchors.top: windowsTitle.visible ? windowsTitle.bottom : demoApp.top
|
||||
anchors.top: demoApp.top
|
||||
anchors.left: demoApp.left
|
||||
anchors.topMargin: demoApp.border.width
|
||||
anchors.leftMargin: demoApp.border.width
|
||||
@@ -76,74 +58,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.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,7 +114,39 @@ Rectangle {
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
navBarTabButtons: [
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "wallet"
|
||||
tooltip.text: "Wallet"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "browser"
|
||||
tooltip.text: "Browser"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
icon.name: "status-update"
|
||||
tooltip.text: "Timeline"
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
id: profileNavButton
|
||||
icon.name: "profile"
|
||||
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 {
|
||||
@@ -186,31 +158,713 @@ 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"
|
||||
}
|
||||
|
||||
Column {
|
||||
anchors.top: headline.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: demoChatListItems
|
||||
selectedChatId: "0"
|
||||
onChatItemSelected: selectedChatId = id
|
||||
onChatItemUnmuted: {
|
||||
for (var i = 0; i < demoChatListItems.count; i++) {
|
||||
let item = demoChatListItems.get(i);
|
||||
if (item.chatId === id) {
|
||||
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
|
||||
|
||||
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();
|
||||
|
||||
StatusAppTwoPanelLayout {
|
||||
|
||||
leftPanel: Item {
|
||||
id: leftPanel
|
||||
anchors.fill: parent
|
||||
|
||||
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
|
||||
height: implicitHeight > (leftPanel.height - 64) ? implicitHeight + 8 : leftPanel.height - 64
|
||||
width: leftPanel.width
|
||||
|
||||
chatList.model: demoCommunityChatListItems
|
||||
categoryList.model: 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"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
rightPanel: Item {
|
||||
anchors.fill: parent
|
||||
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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: demoProfileGeneralMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
|
||||
StatusListSectionHeadline { text: "Settings" }
|
||||
|
||||
Repeater {
|
||||
model: demoProfileSettingsMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: invisibleSeparator
|
||||
height: 16
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
Repeater {
|
||||
model: demoProfileOtherMenuItems
|
||||
delegate: StatusNavigationListItem {
|
||||
title: model.title
|
||||
icon.name: model.icon
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
rightPanel: Item {
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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"
|
||||
}
|
||||
|
||||
content: 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"
|
||||
|
||||
content: 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
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: demoChatListItems
|
||||
ListElement {
|
||||
chatId: "0"
|
||||
name: "#status"
|
||||
chatType: StatusChatListItem.Type.PublicChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
hasMention: false
|
||||
unreadMessagesCount: 0
|
||||
color: "blue"
|
||||
}
|
||||
ListElement {
|
||||
chatId: "1"
|
||||
name: "status-desktop"
|
||||
chatType: StatusChatListItem.Type.PublicChat
|
||||
muted: false
|
||||
hasUnreadMessages: true
|
||||
color: "red"
|
||||
unreadMessagesCount: 1
|
||||
}
|
||||
ListElement {
|
||||
chatId: "2"
|
||||
name: "Amazing Funny Squirrel"
|
||||
chatType: StatusChatListItem.Type.OneToOneChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
color: "green"
|
||||
identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
unreadMessagesCount: 0
|
||||
}
|
||||
ListElement {
|
||||
chatId: "3"
|
||||
name: "Black Ops"
|
||||
chatType: StatusChatListItem.Type.GroupChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
color: "purple"
|
||||
unreadMessagesCount: 0
|
||||
}
|
||||
ListElement {
|
||||
chatId: "4"
|
||||
name: "Spectacular Growing Otter"
|
||||
chatType: StatusChatListItem.Type.OneToOneChat
|
||||
muted: true
|
||||
hasUnreadMessages: false
|
||||
color: "Orange"
|
||||
unreadMessagesCount: 0
|
||||
}
|
||||
ListElement {
|
||||
chatId: "5"
|
||||
name: "channel-with-a-super-duper-long-name"
|
||||
chatType: StatusChatListItem.Type.PublicChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
color: "green"
|
||||
unreadMessagesCount: 0
|
||||
}
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: demoCommunityChatListItems
|
||||
ListElement {
|
||||
chatId: "0"
|
||||
name: "general"
|
||||
chatType: StatusChatListItem.Type.CommunityChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
hasMention: false
|
||||
unreadMessagesCount: 0
|
||||
color: "orange"
|
||||
}
|
||||
ListElement {
|
||||
chatId: "1"
|
||||
name: "random"
|
||||
chatType: StatusChatListItem.Type.CommunityChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
hasMention: false
|
||||
unreadMessagesCount: 0
|
||||
color: "orange"
|
||||
categoryId: "public"
|
||||
}
|
||||
ListElement {
|
||||
chatId: "2"
|
||||
name: "watercooler"
|
||||
chatType: StatusChatListItem.Type.CommunityChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
hasMention: false
|
||||
unreadMessagesCount: 0
|
||||
color: "orange"
|
||||
categoryId: "public"
|
||||
}
|
||||
ListElement {
|
||||
chatId: "3"
|
||||
name: "language-design"
|
||||
chatType: StatusChatListItem.Type.CommunityChat
|
||||
muted: false
|
||||
hasUnreadMessages: false
|
||||
hasMention: false
|
||||
unreadMessagesCount: 0
|
||||
color: "orange"
|
||||
categoryId: "dev"
|
||||
}
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: demoCommunityCategoryItems
|
||||
ListElement {
|
||||
categoryId: "public"
|
||||
name: "Public"
|
||||
}
|
||||
ListElement {
|
||||
categoryId: "dev"
|
||||
name: "Development"
|
||||
}
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: demoProfileGeneralMenuItems
|
||||
|
||||
ListElement {
|
||||
title: "My Profile"
|
||||
icon: "profile"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Contacts"
|
||||
icon: "contact"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "ENS Usernames"
|
||||
icon: "username"
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: demoProfileSettingsMenuItems
|
||||
|
||||
ListElement {
|
||||
title: "Privacy & Security"
|
||||
icon: "security"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Appearance"
|
||||
icon: "appearance"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Browser"
|
||||
icon: "browser"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Sounds"
|
||||
icon: "sound"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Language"
|
||||
icon: "language"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Notifications"
|
||||
icon: "notification"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Sync settings"
|
||||
icon: "mobile"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Advanced"
|
||||
icon: "settings"
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: demoProfileOtherMenuItems
|
||||
|
||||
ListElement {
|
||||
title: "Need help?"
|
||||
icon: "help"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "About"
|
||||
icon: "info"
|
||||
}
|
||||
|
||||
ListElement {
|
||||
title: "Sign out & Quit"
|
||||
icon: "logout"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,250 @@
|
||||
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
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item"
|
||||
}
|
||||
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item"
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item"
|
||||
icon.name: "info"
|
||||
badge.value: 1
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item (selected)"
|
||||
selected: true
|
||||
icon.name: "info"
|
||||
badge.value: 1
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
id: test
|
||||
name: "public-channel"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
}
|
||||
|
||||
StatusChatListCategoryItem {
|
||||
title: "Chat list category"
|
||||
opened: false
|
||||
showActionButtons: true
|
||||
}
|
||||
|
||||
StatusChatListCategoryItem {
|
||||
title: "Chat list category (opened)"
|
||||
opened: true
|
||||
showActionButtons: true
|
||||
}
|
||||
|
||||
StatusChatListCategoryItem {
|
||||
title: "Chat list category (no buttons)"
|
||||
opened: true
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "group-chat"
|
||||
type: StatusChatListItem.Type.GroupChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "community-channel"
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "community-channel-with-image"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "Weird Crazy Otter"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatListItem.Type.OneToOneChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "has-unread-messages"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
hasUnreadMessages: true
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "has-mentions"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
badge.value: 1
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "is-muted"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
muted: true
|
||||
onUnmute: muted = false
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "selected-channel"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
selected: true
|
||||
}
|
||||
StatusChatListItem {
|
||||
name: "selected-muted-channel"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
selected: true
|
||||
muted: true
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusSwitch {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusRadioButton {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusCheckBox {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [StatusSwitch {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [
|
||||
StatusRadioButton {}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [StatusCheckBox {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [
|
||||
StatusBadge {
|
||||
value: 1
|
||||
},
|
||||
StatusIcon {
|
||||
icon: "info"
|
||||
color: Theme.palette.baseColor1
|
||||
width: 20
|
||||
height: 20
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
icon.name: "info"
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
tooltip.text: "Tooltip"
|
||||
icon.name: "info"
|
||||
iconButton.onClicked: tooltip.visible = !tooltip.visible
|
||||
}
|
||||
|
||||
StatusContactRequestsIndicatorListItem {
|
||||
title: "Contact requests"
|
||||
requestsCount: 3
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,174 @@
|
||||
import QtQuick 2.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
Column {
|
||||
spacing: 20
|
||||
|
||||
StatusButton {
|
||||
text: "Simple modal"
|
||||
onClicked: simpleModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with header image"
|
||||
onClicked: headerImageModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with footer buttons"
|
||||
onClicked: footerButtonsModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with header action button"
|
||||
onClicked: headerActionButtonModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with content"
|
||||
onClicked: modalExample.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with changable content"
|
||||
onClicked: modalWithContentAccess.open()
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: simpleModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: headerImageModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: footerButtonsModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
leftButtons: [
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
},
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: headerActionButtonModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
icon.width: 20
|
||||
icon.height: 20
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
leftButtons: [
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
},
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalExample
|
||||
anchors.centerIn: parent
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
},
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
]
|
||||
|
||||
leftButtons: [
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
|
||||
content: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
icon.width: 20
|
||||
icon.height: 20
|
||||
icon.name: "info"
|
||||
}
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalWithContentAccess
|
||||
anchors.centerIn: parent
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
|
||||
content: StatusBaseText {
|
||||
id: text
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Change text"
|
||||
onClicked: {
|
||||
modalWithContentAccess.contentComponent.text = "Changed!"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,72 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
import QtQuick.Controls 2.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusButton {
|
||||
text: "Simple"
|
||||
onClicked: simpleMenu.popup()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Complex"
|
||||
onClicked: complexMenu.popup()
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
id: simpleMenu
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Two"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Three"
|
||||
}
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
id: complexMenu
|
||||
subMenuItemIcons: ['info']
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Two"
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Three"
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Four"
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
icon.name: "info"
|
||||
}
|
||||
StatusMenuItem {
|
||||
text: "Three"
|
||||
icon.name: "info"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,318 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
import QtQuick.Dialogs 1.3
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
|
||||
Column {
|
||||
spacing: 10
|
||||
Grid {
|
||||
id: buttonGridWidth
|
||||
columns: 3
|
||||
columnSpacing: 38
|
||||
rowSpacing: 10
|
||||
|
||||
horizontalItemAlignment: Grid.AlignHCenter
|
||||
|
||||
// Large
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
loading: true
|
||||
type: StatusBaseButton.Type.Danger
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Small
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
size: StatusBaseButton.Size.Small
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
type: StatusBaseButton.Type.Danger
|
||||
size: StatusBaseButton.Size.Small
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Icon buttons
|
||||
|
||||
// blue
|
||||
|
||||
StatusRoundButton {
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// black
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Secondary
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Secondary
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
type: StatusRoundButton.Type.Secondary
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Rounded blue
|
||||
|
||||
StatusFlatRoundButton {
|
||||
width: 44
|
||||
height: 44
|
||||
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Rounded white
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 44
|
||||
height: 44
|
||||
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 44
|
||||
height: 44
|
||||
icon.name: "info"
|
||||
loading: true
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
icon.name: "info"
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
StatusFlatButton {
|
||||
icon.name: "info"
|
||||
text: "Button"
|
||||
enabled: false
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
StatusFlatButton {
|
||||
icon.name: "info"
|
||||
text: "Button"
|
||||
loading: true
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
|
||||
// Tertiary
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
icon.name: "gif"
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
icon.name: "gif"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
icon.name: "gif"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// No background Tertiary
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
color: "transparent"
|
||||
icon.name: "gif"
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
icon.name: "gif"
|
||||
color: "transparent"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
icon.name: "gif"
|
||||
color: "transparent"
|
||||
loading: true
|
||||
}
|
||||
|
||||
// Quartenery
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Quaternary
|
||||
icon.name: "gif"
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Quaternary
|
||||
icon.name: "gif"
|
||||
enabled: false
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Quaternary
|
||||
icon.name: "gif"
|
||||
loading: true
|
||||
}
|
||||
}
|
||||
|
||||
StatusPickerButton {
|
||||
width: buttonGridWidth.width
|
||||
bgColor: colorDialog.colorSelected ? colorDialog.color : Theme.palette.baseColor2
|
||||
contentColor: colorDialog.colorSelected ? Theme.palette.indirectColor1 : Theme.palette.baseColor1
|
||||
text: colorDialog.colorSelected ? colorDialog.color.toString().toUpperCase() : "Pick a color"
|
||||
onClicked: {
|
||||
colorDialog.open();
|
||||
}
|
||||
ColorDialog {
|
||||
id: colorDialog
|
||||
property bool colorSelected: false
|
||||
onAccepted: {
|
||||
colorSelected = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,443 +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: 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"
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
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-right"
|
||||
icon.width: 14
|
||||
iconRotation: 180
|
||||
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-right"
|
||||
icon.width: 14
|
||||
iconRotation: 180
|
||||
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-right"
|
||||
icon.width: 14
|
||||
iconRotation: 180
|
||||
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-right"
|
||||
icon.width: 14
|
||||
iconRotation: 180
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,419 +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
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item"
|
||||
}
|
||||
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item"
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item"
|
||||
icon.name: "info"
|
||||
badge.value: 1
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "Menu Item (selected)"
|
||||
selected: true
|
||||
icon.name: "info"
|
||||
badge.value: 1
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
id: test
|
||||
name: "public-channel"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
}
|
||||
|
||||
StatusChatListCategoryItem {
|
||||
title: "Chat list category"
|
||||
opened: false
|
||||
showActionButtons: true
|
||||
}
|
||||
|
||||
StatusChatListCategoryItem {
|
||||
title: "Chat list category (opened)"
|
||||
opened: true
|
||||
showActionButtons: true
|
||||
}
|
||||
|
||||
StatusChatListCategoryItem {
|
||||
title: "Chat list category (no buttons)"
|
||||
opened: true
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "group-chat"
|
||||
type: StatusChatListItem.Type.GroupChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "community-channel"
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "community-channel-emoji"
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
icon.emoji: "😁"
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "community-channel-with-image"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatListItem.Type.CommunityChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "Weird Crazy Otter"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
type: StatusChatListItem.Type.OneToOneChat
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "has-unread-messages"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
hasUnreadMessages: true
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "has-mentions"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
hasUnreadMessages: true
|
||||
notificationsCount: 1
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "is-muted"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
muted: true
|
||||
onUnmute: muted = false
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "muted-with-mentions"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
muted: true
|
||||
hasUnreadMessages: true
|
||||
notificationsCount: 1
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "selected-channel"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
selected: true
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "selected-muted-channel"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
selected: true
|
||||
muted: true
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "selected-muted-channel-with-unread-messages"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
selected: true
|
||||
muted: true
|
||||
hasUnreadMessages: true
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
name: "selected-muted-with-mentions"
|
||||
type: StatusChatListItem.Type.PublicChat
|
||||
selected: true
|
||||
muted: true
|
||||
hasUnreadMessages: true
|
||||
notificationsCount: 1
|
||||
}
|
||||
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
tertiaryTitle: "Tertiary title"
|
||||
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
statusListItemTitle.font.weight: Font.Bold
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Super long description that causes a multiline paragraph and makes the size of the component grow. Let's see how it behaves."
|
||||
tertiaryTitle: "Tertiary title"
|
||||
icon.name: "info"
|
||||
|
||||
statusListItemTitle.font.pixelSize: 17
|
||||
statusListItemTitle.font.weight: Font.Bold
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusSwitch {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusRadioButton {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
components: [StatusCheckBox {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
size: StatusBaseButton.Size.Small
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [StatusSwitch {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [
|
||||
StatusRadioButton {}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [StatusCheckBox {}]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
icon.name: "info"
|
||||
label: "Text"
|
||||
components: [
|
||||
StatusBadge {
|
||||
value: 1
|
||||
},
|
||||
StatusIcon {
|
||||
icon: "info"
|
||||
color: Theme.palette.baseColor1
|
||||
width: 20
|
||||
height: 20
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
icon.name: "info"
|
||||
type: StatusListItem.Type.Secondary
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
icon.isLetterIdenticon: true
|
||||
icon.color: "orange"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
titleAsideText: "test"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "Title"
|
||||
icon.name: "delete"
|
||||
type: StatusListItem.Type.Danger
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "List Item with Badge"
|
||||
subTitle: "Subtitle"
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
badge.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
badge.primaryText: "CryptoKitties"
|
||||
badge.secondaryText: "#test"
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "List Item with Badge 2"
|
||||
subTitle: "Subtitle"
|
||||
icon.isLetterIdenticon: true
|
||||
badge.primaryText: "CryptoKitties"
|
||||
badge.secondaryText: "#test"
|
||||
badge.icon.color: "orange"
|
||||
badge.icon.isLetterIdenticon: true
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "List Item with Tags"
|
||||
icon.isLetterIdenticon: true
|
||||
bottomModel: 3
|
||||
bottomDelegate: StatusListItemTag {
|
||||
title: "tag"
|
||||
icon.isLetterIdenticon: true
|
||||
}
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
title: "List Item with Emoji"
|
||||
subTitle: "Emoji"
|
||||
icon.emoji: "😁"
|
||||
icon.color: "yellow"
|
||||
icon.letterSize: 14
|
||||
icon.isLetterIdenticon: true
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
value: "None"
|
||||
sensor.enabled: true
|
||||
}
|
||||
|
||||
StatusDescriptionListItem {
|
||||
title: "Title"
|
||||
subTitle: "Subtitle"
|
||||
tooltip.text: "Tooltip"
|
||||
icon.name: "info"
|
||||
iconButton.onClicked: tooltip.visible = !tooltip.visible
|
||||
}
|
||||
|
||||
StatusContactRequestsIndicatorListItem {
|
||||
title: "Contact requests"
|
||||
requestsCount: 3
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "This is an example"
|
||||
userName: "annabelle"
|
||||
chatKey: "0x043a7ed0e8752236a4688563652fd0296453cef00a5dcddbe252dc74f72cc1caa97a2b65e4a1a52d9c30a84c9966beaaaf6b333d659cbdd2e486b443ed1012cf04"
|
||||
trustIndicator: StatusContactVerificationIcons.TrustedType.Verified
|
||||
isMutualContact: true
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
|
||||
nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
isOnline: true
|
||||
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"
|
||||
isOnline: false
|
||||
trustIndicator: StatusContactVerificationIcons.TrustedType.Untrustworthy
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "This girl I know from work"
|
||||
userName: "annabelle"
|
||||
isOnline: true
|
||||
}
|
||||
|
||||
StatusMemberListItem {
|
||||
nickName: "Mark Cuban"
|
||||
userName: "annabelle"
|
||||
chatKey: "0x043a7ed0e8752236a4688563652fd0296453cef00a5dcddbe252dc74f72cc1caa97a2b65e4a1a52d9c30a84c9966beaaaf6b333d659cbdd2e486b443ed1012cf04"
|
||||
isMutualContact: true
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
|
||||
nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
}
|
||||
}
|
||||
@@ -1,408 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
Column {
|
||||
spacing: 20
|
||||
|
||||
StatusButton {
|
||||
text: "Simple modal"
|
||||
onClicked: simpleModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Simple title modal"
|
||||
onClicked: simpleTitleModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with header image"
|
||||
onClicked: headerImageModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with footer buttons"
|
||||
onClicked: footerButtonsModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with header action button"
|
||||
onClicked: headerActionButtonModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with content"
|
||||
onClicked: modalExample.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with changable content"
|
||||
onClicked: modalWithContentAccess.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with letter identicon"
|
||||
onClicked: modalWithLetterIdenticon.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with identicon"
|
||||
onClicked: modalWithIdenticon.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with editable identicon"
|
||||
onClicked: modalWithEditableIdenticon.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with long titles"
|
||||
onClicked: modalWithLongTitles.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with Header Popup Menu"
|
||||
onClicked: modalWithHeaderPopupMenu.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Spellchecking menu"
|
||||
onClicked: spellMenu.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with Editable Title"
|
||||
onClicked: editTitleModal.open()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Modal with Advanced Header/Footer"
|
||||
onClicked: advancedHeaderFooterModal.open()
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: simpleModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: simpleTitleModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: headerImageModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: footerButtonsModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
leftButtons: [
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
},
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: headerActionButtonModal
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some Title"
|
||||
header.subTitle: "Subtitle"
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
icon.width: 20
|
||||
icon.height: 20
|
||||
icon.name: "info"
|
||||
}
|
||||
|
||||
leftButtons: [
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
},
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalExample
|
||||
anchors.centerIn: parent
|
||||
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
},
|
||||
StatusButton {
|
||||
text: "Button"
|
||||
}
|
||||
]
|
||||
|
||||
leftButtons: [
|
||||
StatusRoundButton {
|
||||
icon.name: "arrow-right"
|
||||
rotation: 180
|
||||
}
|
||||
]
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
headerActionButton: StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
icon.width: 20
|
||||
icon.height: 20
|
||||
icon.name: "info"
|
||||
}
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalWithContentAccess
|
||||
anchors.centerIn: parent
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
id: text
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Change text"
|
||||
onClicked: {
|
||||
modalWithContentAccess.contentItem.text = "Changed!"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalWithLetterIdenticon
|
||||
anchors.centerIn: parent
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
header.icon.isLetterIdenticon: true
|
||||
header.icon.background.color: "red"
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Change text"
|
||||
onClicked: {
|
||||
modalWithLetterIdenticon.contentItem.text = "Changed!"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalWithIdenticon
|
||||
anchors.centerIn: parent
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
header.image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
header.image.isIdenticon: true
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Change text"
|
||||
onClicked: {
|
||||
modalWithIdenticon.contentItem.text = "Changed!"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalWithEditableIdenticon
|
||||
anchors.centerIn: parent
|
||||
header.title: "Header"
|
||||
header.subTitle: "SubTitle"
|
||||
header.headerImageEditable: true
|
||||
header.image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
header.image.isIdenticon: true
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Change text"
|
||||
onClicked: {
|
||||
modalWithIdenticon.contentItem.text = "Changed!"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalWithLongTitles
|
||||
anchors.centerIn: parent
|
||||
header.title: "Some super long text here that exceeds the available space"
|
||||
header.subTitle: "Some super long text here that exceeds the available space"
|
||||
header.subTitleElide: Text.ElideMiddle
|
||||
header.image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
header.image.isIdenticon: true
|
||||
|
||||
contentItem: StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: "Some text content"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
rightButtons: [
|
||||
StatusButton {
|
||||
text: "Change text"
|
||||
onClicked: {
|
||||
modalWithLongTitles.contentItem.text = "Changed!"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusModal {
|
||||
id: modalWithHeaderPopupMenu
|
||||
anchors.centerIn: parent
|
||||
header.title: "helloworld.eth"
|
||||
header.subTitle: "Basic address"
|
||||
header.popupMenu: StatusPopupMenu {
|
||||
id: popupMenu
|
||||
Repeater {
|
||||
model: dummyAccountsModel
|
||||
delegate: Loader {
|
||||
sourceComponent: popupMenu.delegate
|
||||
onLoaded: {
|
||||
item.action.text = model.name
|
||||
item.action.iconSettings.name = model.iconName
|
||||
}
|
||||
}
|
||||
}
|
||||
onMenuItemClicked: {
|
||||
popupMenu.dismiss()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: dummyAccountsModel
|
||||
ListElement{name: "Account 1"; iconName: "filled-account"}
|
||||
ListElement{name: "Account 2"; iconName: "filled-account"}
|
||||
}
|
||||
|
||||
StatusSpellcheckingMenuItems {
|
||||
id: spellMenu
|
||||
anchors.centerIn: parent
|
||||
suggestions: ["suggestion1", "suggestion2", "suggestion3", "suggestion4"]
|
||||
}
|
||||
}
|
||||
@@ -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
|
||||
isMutualContact: model.isMutualContact
|
||||
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,68 +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
|
||||
|
||||
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")
|
||||
onTextChanged: {
|
||||
sortModel(root.contactsModel);
|
||||
}
|
||||
Component.onCompleted: { sortModel(root.contactsModel); }
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
implicitHeight: 44
|
||||
Layout.alignment: Qt.AlignTop
|
||||
enabled: (tagSelector.namesModel.count > 0)
|
||||
text: "Confirm"
|
||||
}
|
||||
}
|
||||
|
||||
contentItem: Item {
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 68
|
||||
|
||||
StatusBaseText {
|
||||
visible: (contactsModel.count === 0)
|
||||
anchors.centerIn: parent
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.baseColor1
|
||||
text: qsTr("You can only send direct messages to your Contacts. \n\n
|
||||
Send a contact request to the person you would like to chat with, you will be\n able to
|
||||
chat with them once they have accepted your contact request.")
|
||||
Component.onCompleted: {
|
||||
if (visible) {
|
||||
tagSelector.enabled = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,111 +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: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
|
||||
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-right"
|
||||
icon.rotation: 180
|
||||
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,194 +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
|
||||
|
||||
StatusNavigationPanelHeadline {
|
||||
id: headline
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 16
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text: "Chat"
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: searchInputWrapper
|
||||
width: parent.width
|
||||
height: searchInput.height
|
||||
anchors.top: headline.bottom
|
||||
anchors.topMargin: 16
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 8
|
||||
|
||||
StatusBaseInput {
|
||||
id: searchInput
|
||||
Layout.fillWidth: true
|
||||
Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
|
||||
Layout.leftMargin: 17
|
||||
implicitHeight: 36
|
||||
topPadding: 8
|
||||
bottomPadding: 0
|
||||
placeholderText: "Search"
|
||||
icon.name: "search"
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
icon.name: "public-chat"
|
||||
}
|
||||
|
||||
StatusIconTabButton {
|
||||
icon.name: "edit"
|
||||
onClicked: {
|
||||
root.createChat = !root.createChat;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Column {
|
||||
anchors.top: searchInputWrapper.bottom
|
||||
anchors.topMargin: 16
|
||||
width: parent.width
|
||||
spacing: 8
|
||||
|
||||
StatusContactRequestsIndicatorListItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
title: "Contact requests"
|
||||
requestsCount: 3
|
||||
sensor.onClicked: demoContactRequestsModal.open()
|
||||
}
|
||||
|
||||
StatusChatList {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
model: Models.demoChatListItems
|
||||
onChatItemUnmuted: {
|
||||
for (var i = 0; i < Models.demoChatListItems.count; i++) {
|
||||
let item = Models.demoChatListItems.get(i);
|
||||
if (item.chatId === id) {
|
||||
Models.demoChatListItems.setProperty(i, "muted", false)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
|
||||
property string chatId
|
||||
|
||||
openHandler: function (id) {
|
||||
chatId = id
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "View Profile"
|
||||
icon.name: "group-chat"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mute chat"
|
||||
icon.name: "notification"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mark as Read"
|
||||
icon.name: "checkmark-circle"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Clear history"
|
||||
icon.name: "close-circle"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Delete chat"
|
||||
icon.name: "delete"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
centerPanel: Loader {
|
||||
anchors.fill: parent
|
||||
sourceComponent: root.createChat ? createChatView : chatChannelView
|
||||
}
|
||||
|
||||
Component {
|
||||
id: createChatView
|
||||
CreateChatView {
|
||||
contactsModel: Models.dummyContactsModel
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: chatChannelView
|
||||
ChatChannelView {
|
||||
model: Models.chatMessagesModel
|
||||
}
|
||||
}
|
||||
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,274 +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: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
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"
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
ScrollView {
|
||||
id: scrollView
|
||||
|
||||
anchors.top: statusChatInfoToolBar.bottom
|
||||
anchors.topMargin: 8
|
||||
anchors.bottom: parent.bottom
|
||||
width: leftPanel.width
|
||||
|
||||
contentHeight: communityCategories.height
|
||||
clip: true
|
||||
|
||||
StatusChatListAndCategories {
|
||||
id: communityCategories
|
||||
width: leftPanel.width
|
||||
height: implicitHeight > (leftPanel.height - 64) ? implicitHeight + 8 : leftPanel.height - 64
|
||||
|
||||
draggableItems: true
|
||||
draggableCategories: false
|
||||
model: Models.demoCommunityChatListItems
|
||||
|
||||
showCategoryActionButtons: true
|
||||
|
||||
categoryPopupMenu: StatusPopupMenu {
|
||||
|
||||
property string categoryId
|
||||
|
||||
openHandler: function (id) {
|
||||
categoryId = id
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mute Category"
|
||||
icon.name: "notification"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mark as Read"
|
||||
icon.name: "checkmark-circle"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Edit Category"
|
||||
icon.name: "edit"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Delete Category"
|
||||
icon.name: "delete"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
|
||||
chatListPopupMenu: StatusPopupMenu {
|
||||
|
||||
property string chatId
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mute chat"
|
||||
icon.name: "notification"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Mark as Read"
|
||||
icon.name: "checkmark-circle"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Clear history"
|
||||
icon.name: "close-circle"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Delete chat"
|
||||
icon.name: "delete"
|
||||
type: StatusMenuItem.Type.Danger
|
||||
}
|
||||
}
|
||||
|
||||
popupMenu: StatusPopupMenu {
|
||||
StatusMenuItem {
|
||||
text: "Create channel"
|
||||
icon.name: "channel"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Create category"
|
||||
icon.name: "channel-category"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Invite people"
|
||||
icon.name: "share-ios"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
centerPanel: Item {
|
||||
StatusChatToolBar {
|
||||
id: statusChatToolBar
|
||||
anchors.top: parent.top
|
||||
width: parent.width
|
||||
|
||||
chatInfoButton.title: "general"
|
||||
chatInfoButton.subTitle: "Community Chat"
|
||||
chatInfoButton.icon.color: Theme.palette.miscColor6
|
||||
chatInfoButton.type: StatusChatInfoButton.Type.CommunityChat
|
||||
onSearchButtonClicked: {
|
||||
searchButton.highlighted = !searchButton.highlighted;
|
||||
searchPopup.setSearchSelection(communityDetailModalTitle,
|
||||
"",
|
||||
communityDetailModalImage);
|
||||
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: Models.membersListModel
|
||||
delegate: StatusMemberListItem {
|
||||
implicitWidth: parent.width
|
||||
nickName: model.nickName
|
||||
userName: model.userName
|
||||
chatKey: model.chatKey
|
||||
trustIndicator: model.trustIndicator
|
||||
isMutualContact: model.isMutualContact
|
||||
image.source: model.source
|
||||
image.isIdenticon: model.isIdenticon
|
||||
isOnline: model.isOnline
|
||||
ringSettings.ringSpecModel: model.ringSpecModel
|
||||
ringSettings.distinctiveColors: Theme.palette.identiconRingColors
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,77 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.14
|
||||
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Layout 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"
|
||||
}
|
||||
|
||||
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
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -1 +0,0 @@
|
||||
singleton Models 1.0 Models.qml
|
||||
+105
-239
@@ -12,12 +12,10 @@ import StatusQ.Components 0.1
|
||||
import StatusQ.Layout 0.1
|
||||
import StatusQ.Platform 0.1
|
||||
|
||||
import "demoapp/data" 1.0
|
||||
|
||||
StatusWindow {
|
||||
id: rootWindow
|
||||
width: Qt.platform.os == "ios" || Qt.platform.os == "android" ? Screen.width
|
||||
: 1224
|
||||
: 1024
|
||||
height: Qt.platform.os == "ios" || Qt.platform.os == "android" ? Screen.height
|
||||
:840
|
||||
visible: true
|
||||
@@ -33,33 +31,11 @@ StatusWindow {
|
||||
|
||||
Component.onCompleted: {
|
||||
Theme.palette = lightTheme
|
||||
apiDocsButton.checked = true
|
||||
|
||||
rootWindow.updatePosition();
|
||||
}
|
||||
|
||||
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
|
||||
readonly property int apiDocumentation: 100
|
||||
readonly property int demoApp: 101
|
||||
}
|
||||
|
||||
function setActiveItem(sectionId) {
|
||||
for (var i = 0; i < Models.mainAppSectionsModel.count; i++) {
|
||||
let item = Models.mainAppSectionsModel.get(i)
|
||||
if (item.sectionId !== sectionId) {
|
||||
Models.mainAppSectionsModel.setProperty(i, "active", false);
|
||||
continue
|
||||
}
|
||||
|
||||
Models.mainAppSectionsModel.setProperty(i, "active", true);
|
||||
}
|
||||
}
|
||||
|
||||
StatusAppLayout {
|
||||
id: appLayout
|
||||
anchors.fill: parent
|
||||
@@ -67,36 +43,37 @@ StatusWindow {
|
||||
appNavBar: StatusAppNavBar {
|
||||
height: rootWindow.height
|
||||
|
||||
communityTypeRole: "sectionType"
|
||||
communityTypeValue: appSectionType.community
|
||||
sectionModel: Models.mainAppSectionsModel
|
||||
navBarChatButton: StatusNavBarTabButton {
|
||||
icon.name: "refresh"
|
||||
tooltip.text: "Reload App"
|
||||
onClicked: app.restartQml()
|
||||
}
|
||||
|
||||
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
|
||||
onClicked: {
|
||||
stackView.clear()
|
||||
if(model.sectionType === appSectionType.apiDocumentation)
|
||||
{
|
||||
navBarTabButtons: [
|
||||
StatusNavBarTabButton {
|
||||
id: apiDocsButton
|
||||
icon.name: "edit"
|
||||
tooltip.text: "API Documentation"
|
||||
onClicked: {
|
||||
stackView.clear()
|
||||
stackView.push(libraryDocumentationCmp)
|
||||
rootWindow.setActiveItem(sectionId)
|
||||
checked = !checked
|
||||
demoAppButton.checked = false
|
||||
}
|
||||
else if(model.sectionType === appSectionType.demoApp)
|
||||
{
|
||||
},
|
||||
StatusNavBarTabButton {
|
||||
id: demoAppButton
|
||||
icon.name: "status"
|
||||
tooltip.text: "Demo Application"
|
||||
checked: stackView.currentItem == demoAppCmp
|
||||
onClicked: {
|
||||
stackView.clear()
|
||||
stackView.push(demoAppCmp)
|
||||
rootWindow.setActiveItem(model.sectionId)
|
||||
checked = !checked
|
||||
apiDocsButton.checked = false
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
appView: StackView {
|
||||
@@ -124,14 +101,6 @@ StatusWindow {
|
||||
id: libraryDocumentationCmp
|
||||
|
||||
StatusAppTwoPanelLayout {
|
||||
id: mainPageView
|
||||
|
||||
function page(name) {
|
||||
viewLoader.source = Qt.resolvedUrl("./pages/" + name + "Page.qml");
|
||||
}
|
||||
function control(name) {
|
||||
viewLoader.source = Qt.resolvedUrl("./controls/" + name + ".qml");
|
||||
}
|
||||
|
||||
leftPanel: Item {
|
||||
anchors.fill: parent
|
||||
@@ -151,152 +120,56 @@ StatusWindow {
|
||||
|
||||
StatusListSectionHeadline { text: "StatusQ.Core" }
|
||||
StatusNavigationListItem {
|
||||
title: "Icons"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.control(title);
|
||||
title: "Icons"
|
||||
selected: page.sourceComponent == iconsComponent
|
||||
onClicked: page.sourceComponent = iconsComponent
|
||||
}
|
||||
|
||||
StatusListSectionHeadline { text: "StatusQ.Layout" }
|
||||
StatusNavigationListItem {
|
||||
title: "Layouts"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.control(title.substring(0, title.length - 1));
|
||||
title: "Layouts"
|
||||
selected: page.sourceComponent == layoutComponent
|
||||
onClicked: page.sourceComponent = layoutComponent
|
||||
}
|
||||
|
||||
StatusListSectionHeadline { text: "StatusQ.Controls" }
|
||||
StatusNavigationListItem {
|
||||
title: "Buttons"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.control(title);
|
||||
title: "Buttons"
|
||||
selected: page.sourceComponent == buttonsComponent
|
||||
onClicked: page.sourceComponent = buttonsComponent
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusSwitchTab"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page("StatusTabSwitch");
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusChatCommandButton"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "Controls"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.control(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusTabBarIconButton"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusInput"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusSelect"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusAccountSelector"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusAssetSelector"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusColorSelector"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusWalletColorButton"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusWalletColorSelect"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusPasswordStrengthIndicator"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusPinInput"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
title: "Controls"
|
||||
selected: page.sourceComponent == controlsComponent
|
||||
onClicked: page.sourceComponent = controlsComponent
|
||||
}
|
||||
StatusListSectionHeadline { text: "StatusQ.Components" }
|
||||
StatusNavigationListItem {
|
||||
title: "StatusAddress"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "List Items"
|
||||
selected: viewLoader.source.toString().includes(title.replace(/\s+/g, ''))
|
||||
onClicked: mainPageView.control(title.replace(/\s+/g, ''));
|
||||
selected: page.sourceComponent == listItemsComponent
|
||||
onClicked: page.sourceComponent = listItemsComponent
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusChatInfoToolBar"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
selected: page.sourceComponent == chatInfoToolBarComponent
|
||||
onClicked: page.sourceComponent = chatInfoToolBarComponent
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "Others"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.control(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusExpandableItem"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page("StatusExpandableSettingsItem");
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusTagSelector"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusToastMessage"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusWizardStepper"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
selected: page.sourceComponent == othersComponent
|
||||
onClicked: page.sourceComponent = othersComponent
|
||||
}
|
||||
StatusListSectionHeadline { text: "StatusQ.Popup" }
|
||||
StatusNavigationListItem {
|
||||
title: "StatusPopupMenu"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
selected: page.sourceComponent == popupMenuComponent
|
||||
onClicked: page.sourceComponent = popupMenuComponent
|
||||
}
|
||||
|
||||
StatusNavigationListItem {
|
||||
title: "StatusModal"
|
||||
selected: viewLoader.source.toString().includes("Popups")
|
||||
onClicked: mainPageView.control("Popups");
|
||||
}
|
||||
StatusListSectionHeadline { text: "StatusQ.Platform" }
|
||||
StatusNavigationListItem {
|
||||
title: "StatusMacNotification"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusColorSelectorGrid"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
selected: page.sourceComponent == statusModalComponent
|
||||
onClicked: page.sourceComponent = statusModalComponent
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -305,10 +178,12 @@ StatusWindow {
|
||||
rightPanel: Item {
|
||||
id: rightPanel
|
||||
anchors.fill: parent
|
||||
|
||||
ScrollView {
|
||||
anchors.fill: parent
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
contentHeight: (pageWrapper.height + pageWrapper.anchors.topMargin) * rootWindow.factor
|
||||
contentWidth: (pageWrapper.width * rootWindow.factor)
|
||||
contentWidth: pageWrapper.width * rootWindow.factor
|
||||
clip: true
|
||||
|
||||
Item {
|
||||
@@ -316,17 +191,13 @@ StatusWindow {
|
||||
width: rightPanel.width
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 64
|
||||
height: Math.max(rootWindow.height, viewLoader.height + 128)
|
||||
height: Math.max(rootWindow.height, page.height + 128)
|
||||
scale: rootWindow.factor
|
||||
Loader {
|
||||
id: viewLoader
|
||||
id: page
|
||||
active: true
|
||||
anchors.centerIn: parent
|
||||
source: mainPageView.control("Icons")
|
||||
onSourceChanged: {
|
||||
if (source.toString().includes("Icons")) {
|
||||
item.iconColor = Theme.palette.primaryColor1;
|
||||
}
|
||||
}
|
||||
sourceComponent: iconsComponent
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -357,45 +228,61 @@ StatusWindow {
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: iconsComponent
|
||||
Icons { iconColor: Theme.palette.primaryColor1 }
|
||||
}
|
||||
|
||||
Component {
|
||||
id: controlsComponent
|
||||
Controls {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: listItemsComponent
|
||||
ListItems {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: layoutComponent
|
||||
Layout {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: othersComponent
|
||||
Others {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: buttonsComponent
|
||||
Buttons {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: popupMenuComponent
|
||||
StatusPopupMenuPage {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: chatInfoToolBarComponent
|
||||
StatusChatInfoToolBarPage {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusModalComponent
|
||||
Popups {}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: demoAppCmp
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Theme.palette.baseColor3
|
||||
|
||||
Row {
|
||||
id: platformSwitch
|
||||
anchors.left: demoApp.left
|
||||
anchors.bottom: demoApp.top
|
||||
anchors.bottomMargin: 20
|
||||
spacing: 2
|
||||
|
||||
Text {
|
||||
text: "OSX"
|
||||
font.pixelSize: 15
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
StatusSwitch {
|
||||
onCheckedChanged: {
|
||||
if (checked) {
|
||||
demoApp.titleStyle = "windows"
|
||||
} else {
|
||||
demoApp.titleStyle = "osx"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Text {
|
||||
text: "Win"
|
||||
font.pixelSize: 15
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
DemoApp {
|
||||
id: demoApp
|
||||
anchors.centerIn: parent
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
DropShadow {
|
||||
anchors.fill: demoApp
|
||||
@@ -414,27 +301,6 @@ StatusWindow {
|
||||
anchors.top: parent.top
|
||||
anchors.margins: 13
|
||||
|
||||
visible: Qt.platform.os == "osx"
|
||||
|
||||
onClose: {
|
||||
rootWindow.close()
|
||||
}
|
||||
|
||||
onMinimised: {
|
||||
rootWindow.showMinimized()
|
||||
}
|
||||
|
||||
onMaximized: {
|
||||
rootWindow.toggleFullScreen()
|
||||
}
|
||||
}
|
||||
|
||||
StatusWindowsTitleBar {
|
||||
anchors.top: parent.top
|
||||
width: parent.width
|
||||
|
||||
visible: Qt.platform.os == "windows"
|
||||
|
||||
onClose: {
|
||||
rootWindow.close()
|
||||
}
|
||||
|
||||
@@ -1,64 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import Sandbox 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusAccountSelector {
|
||||
id: accountSelector
|
||||
accounts: ListModel {
|
||||
ListElement {
|
||||
name: "Pascal"
|
||||
address: "0x1234567891011"
|
||||
path: ""
|
||||
color: "red"
|
||||
publicKey: ""
|
||||
walletType: "generated"
|
||||
isChat: ""
|
||||
currencyBalance: "1199.02"
|
||||
assets: []
|
||||
}
|
||||
ListElement {
|
||||
name: "Boris"
|
||||
address: "0x123"
|
||||
path: ""
|
||||
color: "red"
|
||||
publicKey: ""
|
||||
walletType: "generated"
|
||||
isChat: ""
|
||||
currencyBalance: "0"
|
||||
assets: []
|
||||
}
|
||||
ListElement {
|
||||
name: "Alexandra"
|
||||
address: "0x123"
|
||||
path: ""
|
||||
color: "yellow"
|
||||
publicKey: ""
|
||||
walletType: "generated"
|
||||
isChat: ""
|
||||
currencyBalance: "0"
|
||||
assets: []
|
||||
}
|
||||
ListElement {
|
||||
name: "Khushboo"
|
||||
address: "0x123"
|
||||
path: ""
|
||||
color: "blue"
|
||||
publicKey: ""
|
||||
walletType: "generated"
|
||||
isChat: ""
|
||||
currencyBalance: "0"
|
||||
assets: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,25 +0,0 @@
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,40 +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.Popups 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusAssetSelector {
|
||||
getCurrencyBalanceString: function (currencyBalance) {
|
||||
return currencyBalance.toFixed(2) + " USD"
|
||||
}
|
||||
tokenAssetSourceFn: function (symbol) {
|
||||
return "../../assets/img/icons/snt.svg"
|
||||
}
|
||||
assets: ListModel {
|
||||
ListElement {
|
||||
address: "0x1234"
|
||||
name: "Status Network Token"
|
||||
balance: "20"
|
||||
symbol: "SNT"
|
||||
currencyBalance: 9992.01
|
||||
}
|
||||
ListElement {
|
||||
address: "0x1234"
|
||||
name: "DAI Token"
|
||||
balance: "15"
|
||||
symbol: "DAI"
|
||||
currencyBalance: 20.00001
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,26 +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 Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusChatCommandButton {
|
||||
icon.name: "send"
|
||||
icon.color: Theme.palette.miscColor2
|
||||
text: "Send transaction"
|
||||
}
|
||||
|
||||
StatusChatCommandButton {
|
||||
icon.name: "send"
|
||||
icon.rotation: 180
|
||||
icon.color: Theme.palette.miscColor8
|
||||
text: "Receive transaction"
|
||||
}
|
||||
}
|
||||
@@ -1,36 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Item {
|
||||
id: root
|
||||
width: 800
|
||||
height: 100
|
||||
|
||||
Row {
|
||||
id: selectedColor
|
||||
anchors.top: parent.top
|
||||
anchors.left: colorSelectionGrid.left
|
||||
spacing: 10
|
||||
StatusBaseText {
|
||||
text: "SelectedColor is"
|
||||
}
|
||||
Rectangle {
|
||||
width: 100
|
||||
height: 20
|
||||
radius: width/2
|
||||
color: colorSelectionGrid.selectedColor
|
||||
}
|
||||
}
|
||||
|
||||
StatusColorSelectorGrid {
|
||||
id: colorSelectionGrid
|
||||
anchors.top: selectedColor.bottom
|
||||
anchors.topMargin: 10
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
titleText: "COLOR"
|
||||
selectedColorIndex: 2
|
||||
}
|
||||
}
|
||||
@@ -1,17 +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 Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusColorSelector {
|
||||
model: ["red", "blue", "green"]
|
||||
}
|
||||
}
|
||||
@@ -1,152 +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
|
||||
|
||||
Column {
|
||||
spacing: 12
|
||||
width: 800
|
||||
anchors.top:parent.top
|
||||
leftPadding: 20
|
||||
rightPadding: 20
|
||||
|
||||
Rectangle {
|
||||
width: parent.width
|
||||
height: 30
|
||||
color: Theme.palette.baseColor2
|
||||
StatusBaseText {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: "Type Primary"
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
expandable: false
|
||||
icon.name: "seed-phrase"
|
||||
primaryText: "Back up seed phrase"
|
||||
secondaryText: "Back up your seed phrase now to secure this account ajhaDH SDHSAHDLSADBSA,DLISAHDLASD ADASDHASLDHALSDHAS DAS,DASJDGLIASGD"
|
||||
button.text: qsTr("Back up seed phrase")
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
expandable: true
|
||||
icon.name: "secret"
|
||||
primaryText: "Account signing phrase"
|
||||
secondaryText: "View your signing phrase and ensure that you never get scammed. View your signing phrase and ensure that you never get scammed."
|
||||
expandableComponent: notImplemented
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
expandable: true
|
||||
icon.name: "seed-phrase"
|
||||
primaryText: "View private key"
|
||||
secondaryText: "Back up your seed phrase now to secure this account"
|
||||
expandableComponent: notImplemented
|
||||
button.text: "View private key"
|
||||
button.icon.name: "tiny/public-chat"
|
||||
button.onClicked: {
|
||||
// To-do open enter password Modal
|
||||
expanded = !expanded
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
width: parent.width
|
||||
height: 30
|
||||
color: Theme.palette.baseColor2
|
||||
StatusBaseText {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: "Type Secondary"
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
type: StatusExpandableItem.Type.Secondary
|
||||
expandable: true
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
primaryText: "CryptoKitties"
|
||||
additionalText: "1456 USD"
|
||||
expandableComponent: notImplemented
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
type: StatusExpandableItem.Type.Secondary
|
||||
expandable: true
|
||||
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
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
type: StatusExpandableItem.Type.Secondary
|
||||
expandable: true
|
||||
primaryText: "CryptoKitties"
|
||||
additionalText: "1456 USD"
|
||||
expandableComponent: notImplemented
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
width: parent.width
|
||||
height: 30
|
||||
color: Theme.palette.baseColor2
|
||||
StatusBaseText {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: "Type Tertiary"
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
type: StatusExpandableItem.Type.Tertiary
|
||||
expandable: true
|
||||
primaryText: "CryptoKitties"
|
||||
expandableComponent: notImplemented
|
||||
}
|
||||
|
||||
StatusExpandableItem {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
type: StatusExpandableItem.Type.Tertiary
|
||||
expandable: true
|
||||
primaryText: "Rescue Moon"
|
||||
expandableComponent: notImplemented
|
||||
}
|
||||
|
||||
Component {
|
||||
id: notImplemented
|
||||
Rectangle {
|
||||
anchors.centerIn: parent
|
||||
width: 654
|
||||
height: infoText.implicitHeight
|
||||
color: Theme.palette.baseColor5
|
||||
StatusBaseText {
|
||||
id: infoText
|
||||
anchors.centerIn: parent
|
||||
color: Theme.palette.directColor4
|
||||
font.pixelSize: 15
|
||||
lineHeight: 22
|
||||
lineHeightMode: Text.FixedHeight
|
||||
font.weight: Font.Medium
|
||||
text: qsTr("Not Implemented")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,215 +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.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
|
||||
}
|
||||
|
||||
Item {
|
||||
implicitWidth: 480
|
||||
implicitHeight: 102
|
||||
z: 100000
|
||||
StatusSeedPhraseInput {
|
||||
id: statusSeedInput
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
textEdit.input.anchors.leftMargin: 16
|
||||
textEdit.input.anchors.rightMargin: 16
|
||||
textEdit.input.anchors.topMargin: 11
|
||||
textEdit.label: "Input with drop down selection list"
|
||||
leftComponentText: "1"
|
||||
inputList: ListModel {
|
||||
ListElement {
|
||||
seedWord: "panda"
|
||||
}
|
||||
ListElement {
|
||||
seedWord: "posible"
|
||||
}
|
||||
ListElement {
|
||||
seedWord: "wing"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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: "Input with <i>StatusRegularExpressionValidator</i>"
|
||||
charLimit: 30
|
||||
input.placeholderText: `Must match regex(${validators[0].regularExpression.toString()}) and <= 30 chars`
|
||||
validationMode: StatusInput.ValidationMode.IgnoreInvalidInput
|
||||
|
||||
validators: [
|
||||
StatusRegularExpressionValidator {
|
||||
regularExpression: /^[0-9A-Za-z_\$-\s]*$/
|
||||
errorMessage: "Bad input!"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Label"
|
||||
input.placeholderText: "Input width component (right side)"
|
||||
input.rightComponent: 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
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
property bool toggled: true
|
||||
label: "Input with emoji icon"
|
||||
input.placeholderText: "Enter Name"
|
||||
input.icon.emoji: toggled ? "😁" : "🧸"
|
||||
input.icon.color: "blue"
|
||||
input.isIconSelectable: true
|
||||
onIconClicked: {
|
||||
toggled = !toggled
|
||||
}
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
property bool toggled: true
|
||||
label: "Input with selectable icon which is not an emoji"
|
||||
input.placeholderText: "Enter Name"
|
||||
input.icon.emoji: ""
|
||||
input.icon.name: toggled ? "filled-account" : "image"
|
||||
input.icon.color: "blue"
|
||||
input.isIconSelectable: true
|
||||
onIconClicked: {
|
||||
toggled = !toggled
|
||||
}
|
||||
}
|
||||
|
||||
StatusInput {
|
||||
label: "Input with inline token selector"
|
||||
input.leftComponent: StatusTokenInlineSelector {
|
||||
tokens: [{amount: 0.1, token: "ETH"},
|
||||
{amount: 10, token: "SNT"},
|
||||
{amount: 15, token: "MANA"}]
|
||||
|
||||
StatusToolTip {
|
||||
id: toolTip
|
||||
text: "posted"
|
||||
}
|
||||
onTriggered: toolTip.visible = true
|
||||
}
|
||||
input.edit.readOnly: true
|
||||
}
|
||||
}
|
||||
@@ -1,16 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Platform 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusMacNotification {
|
||||
name: "Some name"
|
||||
message: "Some message here"
|
||||
}
|
||||
}
|
||||
@@ -1,38 +0,0 @@
|
||||
import QtQuick.Layouts 1.14
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusPasswordStrengthIndicator {
|
||||
id: veryweakPw
|
||||
strength: StatusPasswordStrengthIndicator.Strength.VeryWeak
|
||||
value: 0.75
|
||||
}
|
||||
|
||||
StatusPasswordStrengthIndicator {
|
||||
id: weakPw
|
||||
strength: StatusPasswordStrengthIndicator.Strength.Weak
|
||||
value: 0.5
|
||||
}
|
||||
|
||||
StatusPasswordStrengthIndicator {
|
||||
id: sosoPw
|
||||
strength: StatusPasswordStrengthIndicator.Strength.SoSo
|
||||
value: 0.25
|
||||
}
|
||||
|
||||
StatusPasswordStrengthIndicator {
|
||||
id: goodPw
|
||||
strength: StatusPasswordStrengthIndicator.Strength.Good
|
||||
value: 1
|
||||
}
|
||||
|
||||
StatusPasswordStrengthIndicator {
|
||||
id: greatPw
|
||||
strength: StatusPasswordStrengthIndicator.Strength.Great
|
||||
value: 0.3
|
||||
}
|
||||
}
|
||||
@@ -1,75 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Controls.Validators 0.1
|
||||
|
||||
Column {
|
||||
id: root
|
||||
spacing: 25
|
||||
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
|
||||
|
||||
// PIN input that accepts only numbers
|
||||
StatusBaseText {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.palette.directColor1
|
||||
text: "Enter Keycard PIN"
|
||||
font.pixelSize: 30
|
||||
font.bold: true
|
||||
}
|
||||
|
||||
StatusPinInput {
|
||||
id: numbersPinInput
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
validator: StatusIntValidator{bottom: 0; top: 999999;}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.palette.dangerColor1
|
||||
text: "Only numbers allowed"
|
||||
font.pixelSize: 16
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.palette.directColor1
|
||||
text: "Introduced PIN: " + numbersPinInput.pinInput
|
||||
font.pixelSize: 12
|
||||
}
|
||||
|
||||
// PIN input that accepts input depending on the regular expression definition
|
||||
StatusBaseText {
|
||||
topPadding: 100
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.palette.directColor1
|
||||
text: "Enter another Keycard PIN"
|
||||
font.pixelSize: 30
|
||||
font.bold: true
|
||||
}
|
||||
|
||||
StatusPinInput {
|
||||
id: regexPinInput
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
validator: StatusRegularExpressionValidator { regularExpression: /[0-9A-Za-z@]+/ }
|
||||
circleDiameter: 22
|
||||
circleSpacing: 22
|
||||
pinLen: 7
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.palette.dangerColor1
|
||||
text: "Only alphanumeric characters and '@' allowed"
|
||||
font.pixelSize: 16
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.palette.directColor1
|
||||
text: "Introduced PIN: " + regexPinInput.pinInput
|
||||
font.pixelSize: 12
|
||||
}
|
||||
}
|
||||
@@ -1,150 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
import QtQuick.Controls 2.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusButton {
|
||||
text: "Simple"
|
||||
onClicked: simpleMenu.popup()
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
text: "Complex"
|
||||
onClicked: complexMenu.popup()
|
||||
}
|
||||
|
||||
|
||||
StatusButton {
|
||||
text: "Menu with custom images and icons"
|
||||
onClicked: customMenu.popup()
|
||||
}
|
||||
|
||||
|
||||
StatusPopupMenu {
|
||||
id: simpleMenu
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Two"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Three"
|
||||
}
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
id: complexMenu
|
||||
subMenuItemIcons: [{ icon: 'info' }]
|
||||
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
iconSettings.name: "info"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Two"
|
||||
iconSettings.name: "info"
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Three"
|
||||
iconSettings.name: "info"
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Four"
|
||||
StatusMenuItem {
|
||||
text: "One"
|
||||
iconSettings.name: "info"
|
||||
}
|
||||
StatusMenuItem {
|
||||
text: "Three"
|
||||
iconSettings.name: "info"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
id: customMenu
|
||||
|
||||
subMenuItemIcons: [
|
||||
{ icon: "chat" },
|
||||
{
|
||||
source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
},
|
||||
{
|
||||
isLetterIdenticon: true,
|
||||
color: "red"
|
||||
}
|
||||
]
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Anywhere"
|
||||
}
|
||||
|
||||
StatusMenuSeparator {}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Chat"
|
||||
|
||||
StatusMenuItem {
|
||||
text: "vitalik.eth"
|
||||
image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
|
||||
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
image.isIdenticon: true
|
||||
}
|
||||
|
||||
StatusMenuItem {
|
||||
text: "Pascal"
|
||||
image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
}
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Cryptokitties"
|
||||
|
||||
StatusMenuItem {
|
||||
text: "welcome"
|
||||
iconSettings.name: "channel"
|
||||
iconSettings.color: Theme.palette.directColor1
|
||||
}
|
||||
StatusMenuItem {
|
||||
text: "support"
|
||||
iconSettings.name: "channel"
|
||||
iconSettings.color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
StatusMenuHeadline { text: "Public" }
|
||||
|
||||
StatusMenuItem {
|
||||
text: "news"
|
||||
iconSettings.name: "channel"
|
||||
iconSettings.color: Theme.palette.directColor1
|
||||
}
|
||||
}
|
||||
|
||||
StatusPopupMenu {
|
||||
title: "Another community"
|
||||
|
||||
StatusMenuItem {
|
||||
text: "welcome"
|
||||
iconSettings.isLetterIdenticon: true
|
||||
iconSettings.background.color: "red"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,54 +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.Popups 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusSelect {
|
||||
id: select
|
||||
label: "Some label"
|
||||
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
|
||||
onTriggered: {
|
||||
selectedItem.text = name
|
||||
}
|
||||
}
|
||||
}
|
||||
selectedItemComponent: Item {
|
||||
id: selectedItem
|
||||
anchors.fill: parent
|
||||
property string text: ""
|
||||
|
||||
StatusBaseText {
|
||||
text: selectedItem.text
|
||||
anchors.centerIn: parent
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,50 +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 Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
Row {
|
||||
StatusTabBarIconButton {
|
||||
icon.name: "smileys-and-people"
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
|
||||
StatusTabBarIconButton {
|
||||
icon.name: "animals-and-nature"
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
|
||||
StatusTabBarIconButton {
|
||||
icon.name: "activity"
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
|
||||
StatusTabBarIconButton {
|
||||
icon.name: "travel-and-places"
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
|
||||
StatusTabBarIconButton {
|
||||
icon.name: "objects"
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
|
||||
StatusTabBarIconButton {
|
||||
icon.name: "symbols"
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
|
||||
StatusTabBarIconButton {
|
||||
icon.name: "flags"
|
||||
onClicked: highlighted = !highlighted
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
import QtQuick.Controls 2.13
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
GridLayout {
|
||||
columns: 1
|
||||
columnSpacing: 5
|
||||
rowSpacing: 5
|
||||
|
||||
StatusSwitchTabBar {
|
||||
StatusSwitchTabButton {
|
||||
text: "Swap"
|
||||
}
|
||||
StatusSwitchTabButton {
|
||||
text: "Swap & Send"
|
||||
}
|
||||
StatusSwitchTabButton {
|
||||
text: "Send"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,56 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
Item {
|
||||
id: root
|
||||
anchors.fill: parent
|
||||
|
||||
property ListModel asortedContacts: ListModel {
|
||||
ListElement {
|
||||
publicId: "0x0"
|
||||
name: "Maria"
|
||||
icon: ""
|
||||
isIdenticon: false
|
||||
onlineStatus: 3
|
||||
}
|
||||
ListElement {
|
||||
publicId: "0x1"
|
||||
name: "James"
|
||||
icon: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
|
||||
isIdenticon: false
|
||||
onlineStatus: 1
|
||||
}
|
||||
ListElement {
|
||||
publicId: "0x2"
|
||||
name: "Paul"
|
||||
icon: ""
|
||||
isIdenticon: false
|
||||
onlineStatus: 2
|
||||
}
|
||||
ListElement {
|
||||
publicId: "0x3"
|
||||
name: "Tracy"
|
||||
icon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
isIdenticon: true
|
||||
onlineStatus: 3
|
||||
}
|
||||
ListElement {
|
||||
publicId: "0x4"
|
||||
name: "Nick"
|
||||
icon: ""
|
||||
isIdenticon: false
|
||||
onlineStatus: 3
|
||||
}
|
||||
}
|
||||
|
||||
StatusTagSelector {
|
||||
id: tagSelector
|
||||
width: 650
|
||||
height: 44
|
||||
anchors.centerIn: parent
|
||||
namesModel: root.asortedContacts
|
||||
toLabelText: qsTr("To: ")
|
||||
warningText: qsTr("USER LIMIT REACHED")
|
||||
}
|
||||
}
|
||||
@@ -1,40 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
Item {
|
||||
id: root
|
||||
anchors.fill: parent
|
||||
|
||||
Column {
|
||||
id: toastArea
|
||||
anchors.centerIn: parent
|
||||
spacing: 8
|
||||
Repeater {
|
||||
id: toastRepeater
|
||||
width: parent.width
|
||||
height: childrenRect.height
|
||||
model: [
|
||||
{"title":"anna.eth wants to verify your identity", "subTitle":"Provide the code in the letter I sent to you on February 1st.", "icon":"contact", "loading":false, "type":0,"url":""},
|
||||
{"title":"Verification Request Sent", "subTitle":"", "icon":"checkmark-circle", "loading":false, "type":1,"url":""},
|
||||
{"title":"Collectible is being minted...", "subTitle":"View on Etherscan", "icon":"", "loading":true, "type":0,"url":"http://google.com"},
|
||||
{"title":"Contact request sent", "subTitle":"", "icon":"checkmark-circle", "loading":false, "type":1,"url":""}
|
||||
]
|
||||
delegate: StatusToastMessage {
|
||||
primaryText: modelData.title
|
||||
secondaryText: modelData.subTitle
|
||||
icon.name: modelData.icon
|
||||
loading: modelData.loading
|
||||
type: modelData.type
|
||||
linkUrl: modelData.url
|
||||
onLinkActivated: {
|
||||
Qt.openUrlExternally(link);
|
||||
}
|
||||
//simulate open
|
||||
Component.onCompleted: {
|
||||
open = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,38 +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 Sandbox 0.1
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
Row {
|
||||
spacing: 4
|
||||
StatusWalletColorButton {
|
||||
icon.color: Theme.palette.miscColor1
|
||||
selected: true
|
||||
}
|
||||
StatusWalletColorButton {
|
||||
icon.color: Theme.palette.miscColor2
|
||||
}
|
||||
StatusWalletColorButton {
|
||||
icon.color: Theme.palette.miscColor3
|
||||
}
|
||||
StatusWalletColorButton {
|
||||
icon.color: Theme.palette.miscColor4
|
||||
}
|
||||
StatusWalletColorButton {
|
||||
icon.color: Theme.palette.miscColor5
|
||||
}
|
||||
StatusWalletColorButton {
|
||||
icon.color: Theme.palette.miscColor6
|
||||
}
|
||||
StatusWalletColorButton {
|
||||
icon.color: Theme.palette.miscColor7
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,17 +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 Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusWalletColorSelect {
|
||||
model: Theme.palette.accountColors
|
||||
}
|
||||
}
|
||||
@@ -1,100 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Item {
|
||||
id: root
|
||||
width: 800
|
||||
height: 100
|
||||
|
||||
//Simulate animation between steps
|
||||
property bool stepsCompleted: false
|
||||
function reset() {
|
||||
for (var i = 0; i < stepsListModel.count; i++) {
|
||||
stepsListModel.setProperty(i, "loading", false);
|
||||
stepsListModel.setProperty(i, "stepCompleted", false);
|
||||
step1.loadingTime = 0;
|
||||
step2.loadingTime = 0;
|
||||
root.stepsCompleted = false;
|
||||
}
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: stepsListModel
|
||||
ListElement {description:"Send Request"; loadingTime: 0; stepCompleted: false}
|
||||
ListElement {description:"Receive Response"; loadingTime: 0; stepCompleted: false}
|
||||
ListElement {description:"Confirm Identity"; loadingTime: 0; stepCompleted: false}
|
||||
}
|
||||
|
||||
Shortcut {
|
||||
sequence: "Ctrl+R"
|
||||
onActivated: {
|
||||
if (!root.stepsCompleted) {
|
||||
animate.running = true;
|
||||
} else {
|
||||
root.reset();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: indicLabel
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.palette.directColor1
|
||||
text: "Press Ctrl+R to run the animation"
|
||||
font.pixelSize: 17
|
||||
}
|
||||
|
||||
SequentialAnimation {
|
||||
id: animate
|
||||
ScriptAction {
|
||||
id: step1
|
||||
property int loadingTime: 0
|
||||
Behavior on loadingTime { NumberAnimation { duration: 2000 }}
|
||||
onLoadingTimeChanged: {
|
||||
stepsListModel.setProperty(1, "loadingTime", step1.loadingTime);
|
||||
}
|
||||
script: {
|
||||
step1.loadingTime = 2000;
|
||||
stepsListModel.setProperty(0, "loadingTime", step1.loadingTime);
|
||||
stepsListModel.setProperty(0, "stepCompleted", true);
|
||||
}
|
||||
}
|
||||
PauseAnimation {
|
||||
duration: 2100
|
||||
}
|
||||
ScriptAction {
|
||||
id: step2
|
||||
property int loadingTime: 0
|
||||
Behavior on loadingTime { NumberAnimation { duration: 2000 } }
|
||||
onLoadingTimeChanged: {
|
||||
stepsListModel.setProperty(2, "loadingTime", step2.loadingTime);
|
||||
}
|
||||
script: {
|
||||
step2.loadingTime = 2000;
|
||||
stepsListModel.setProperty(1, "stepCompleted", true);
|
||||
}
|
||||
}
|
||||
PauseAnimation {
|
||||
duration: 2100
|
||||
}
|
||||
ScriptAction {
|
||||
script: {
|
||||
stepsListModel.setProperty(2, "stepCompleted", true);
|
||||
root.stepsCompleted = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
//simulation code
|
||||
|
||||
StatusWizardStepper {
|
||||
id: wizardStepper
|
||||
width: (parent.width - 50)
|
||||
anchors.top: indicLabel.bottom
|
||||
anchors.topMargin: 16
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
stepsModel: stepsListModel
|
||||
}
|
||||
}
|
||||
+12
-31
@@ -1,35 +1,16 @@
|
||||
<RCC>
|
||||
<qresource prefix="/">
|
||||
<file>main.qml</file>
|
||||
<file>pages/StatusAccountSelectorPage.qml</file>
|
||||
<file>pages/StatusAddressPage.qml</file>
|
||||
<file>pages/StatusAssetSelectorPage.qml</file>
|
||||
<file>pages/StatusChatCommandButtonPage.qml</file>
|
||||
<file>pages/StatusChatInfoToolBarPage.qml</file>
|
||||
<file>pages/StatusColorSelectorPage.qml</file>
|
||||
<file>pages/StatusExpandableSettingsItemPage.qml</file>
|
||||
<file>pages/StatusInputPage.qml</file>
|
||||
<file>pages/StatusMacNotificationPage.qml</file>
|
||||
<file>pages/StatusPopupMenuPage.qml</file>
|
||||
<file>pages/StatusSelectPage.qml</file>
|
||||
<file>pages/StatusTabBarIconButtonPage.qml</file>
|
||||
<file>pages/StatusTabSwitchPage.qml</file>
|
||||
<file>pages/StatusWalletColorButtonPage.qml</file>
|
||||
<file>pages/StatusWalletColorSelectPage.qml</file>
|
||||
<file>pages/StatusPasswordStrengthIndicatorPage.qml</file>
|
||||
<file>controls/Buttons.qml</file>
|
||||
<file>controls/Controls.qml</file>
|
||||
<file>controls/Icons.qml</file>
|
||||
<file>controls/Layout.qml</file>
|
||||
<file>controls/ListItems.qml</file>
|
||||
<file>controls/Others.qml</file>
|
||||
<file>controls/Popups.qml</file>
|
||||
<file>demoapp/DemoCommunityDetailModal.qml</file>
|
||||
<file>demoapp/DemoContactRequestsModal.qml</file>
|
||||
<file>demoapp/StatusAppChatView.qml</file>
|
||||
<file>demoapp/StatusAppCommunityView.qml</file>
|
||||
<file>demoapp/StatusAppProfileSettingsView.qml</file>
|
||||
<file>demoapp/data/Models.qml</file>
|
||||
<file>demoapp/data/qmldir</file>
|
||||
<file>Controls.qml</file>
|
||||
<file>Icons.qml</file>
|
||||
<file>Others.qml</file>
|
||||
<file>Buttons.qml</file>
|
||||
<file>DemoApp.qml</file>
|
||||
<file>ListItems.qml</file>
|
||||
<file>StatusChatInfoToolBarPage.qml</file>
|
||||
<file>StatusPopupMenuPage.qml</file>
|
||||
<file>ThemeSwitch.qml</file>
|
||||
<file>Layout.qml</file>
|
||||
<file>Popups.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
</RCC>
|
||||
|
||||
+14
-29
@@ -1,8 +1,6 @@
|
||||
QT += quick svg
|
||||
|
||||
CONFIG += c++11 warn_on qtquickcompiler
|
||||
|
||||
QML_IMPORT_PATH= $$PWD/../src
|
||||
CONFIG += c++11 warn_on
|
||||
|
||||
DEFINES += QT_DEPRECATED_WARNINGS
|
||||
|
||||
@@ -14,39 +12,18 @@ DEFINES += QT_DEPRECATED_WARNINGS
|
||||
SOURCES += \
|
||||
handler.cpp \
|
||||
main.cpp \
|
||||
sandboxapp.cpp \
|
||||
spellchecker.cpp \
|
||||
sandboxapp.cpp
|
||||
|
||||
!macx {
|
||||
SOURCES += statuswindow.cpp
|
||||
}
|
||||
|
||||
TARGET = sandboxapp
|
||||
DESTDIR = $$PWD/bin
|
||||
|
||||
DESTDIR = $$PWD/bin
|
||||
|
||||
macx {
|
||||
CONFIG -= app_bundle
|
||||
OBJECTIVE_SOURCES += \
|
||||
statuswindow_mac.mm
|
||||
|
||||
hunspellTarget.depends = FORCE
|
||||
hunspellTarget.commands = brew install hunspell
|
||||
QMAKE_EXTRA_TARGETS += hunspellTarget
|
||||
|
||||
exists (/usr/local/lib/libhunspell-1.7.a) {
|
||||
LIBS += -L"/usr/local/lib" -lhunspell-1.7
|
||||
INCLUDEPATH += /usr/local/include/hunspell
|
||||
DEFINES += USE_HUNSPELL
|
||||
message("hunspell exists in /usr/local/lib")
|
||||
}
|
||||
|
||||
copydata.commands = $(COPY_DIR) $$PWD/dictionaries $$DESTDIR
|
||||
first.depends = $(first) copydata
|
||||
export(first.depends)
|
||||
export(copydata.commands)
|
||||
QMAKE_EXTRA_TARGETS += first copydata
|
||||
}
|
||||
|
||||
ios {
|
||||
@@ -63,6 +40,8 @@ ios {
|
||||
RESOURCES += qml.qrc \
|
||||
$$PWD/../statusq.qrc
|
||||
|
||||
DESTDIR = $$PWD/bin
|
||||
|
||||
# Default rules for deployment.
|
||||
qnx: target.path = /tmp/$${TARGET}/bin
|
||||
else: unix:!android: target.path = /opt/$${TARGET}/bin
|
||||
@@ -72,11 +51,17 @@ else: unix:!android: target.path = /opt/$${TARGET}/bin
|
||||
HEADERS += \
|
||||
handler.h \
|
||||
sandboxapp.h \
|
||||
statuswindow.h \
|
||||
spellchecker.h
|
||||
statuswindow.h
|
||||
|
||||
OTHER_FILES += $$files($$PWD/../*.qml, true)
|
||||
OTHER_FILES += $$files($$PWD/*.qml, true)
|
||||
DISTFILES += \
|
||||
../src/StatusQ/Components/StatusMacWindowButtons.qml \
|
||||
../src/StatusQ/Controls/StatusBaseButton.qml \
|
||||
../src/StatusQ/Controls/StatusButton.qml \
|
||||
../src/StatusQ/Controls/StatusCheckBox.qml \
|
||||
../src/StatusQ/Controls/StatusFlatRoundButton.qml \
|
||||
../src/StatusQ/Controls/StatusRadioButton.qml \
|
||||
../src/StatusQ/Controls/StatusSlider.qml \
|
||||
../src/StatusQ/Controls/StatusSwitch.qml
|
||||
|
||||
android {
|
||||
|
||||
|
||||
@@ -5,7 +5,6 @@
|
||||
#include <QDebug>
|
||||
|
||||
#include "statuswindow.h"
|
||||
#include "spellchecker.h"
|
||||
|
||||
SandboxApp::SandboxApp(int &argc, char **argv)
|
||||
: QGuiApplication(argc, argv),
|
||||
@@ -17,10 +16,9 @@ SandboxApp::SandboxApp(int &argc, char **argv)
|
||||
void SandboxApp::startEngine()
|
||||
{
|
||||
qmlRegisterType<StatusWindow>("Sandbox", 0, 1, "StatusWindow");
|
||||
qmlRegisterType<SpellChecker>("Sandbox", 0, 1, "Spellchecker");
|
||||
|
||||
#ifdef QT_DEBUG
|
||||
const QUrl url = QUrl::fromLocalFile(applicationDirPath() + "/../main.qml");
|
||||
const QUrl url(applicationDirPath() + "/../main.qml");
|
||||
#else
|
||||
const QUrl url(QStringLiteral("qrc:/main.qml"));
|
||||
#endif
|
||||
|
||||
@@ -1,10 +1,4 @@
|
||||
#!/bin/bash
|
||||
|
||||
make clean
|
||||
if [[ $OSTYPE == 'darwin'* ]]
|
||||
then
|
||||
qmake sandbox.pro -spec macx-clang CONFIG+=debug CONFIG+=x86_64 && /usr/bin/make qmake_all
|
||||
else
|
||||
qmake sandbox.pro CONFIG+=debug CONFIG+=x86_64 && /usr/bin/make qmake_all
|
||||
fi
|
||||
make
|
||||
qmake sandbox.pro -spec macx-clang CONFIG+=debug CONFIG+=x86_64 && /usr/bin/make qmake_all
|
||||
make
|
||||
|
||||
|
||||
+78
-67
@@ -1,8 +1,6 @@
|
||||
#include "spellchecker.h"
|
||||
|
||||
#ifdef USE_HUNSPELL
|
||||
#include "hunspell.hxx"
|
||||
#endif
|
||||
#include <QTextCodec>
|
||||
#include <QFile>
|
||||
#include <QDebug>
|
||||
@@ -13,53 +11,18 @@
|
||||
#include <QDir>
|
||||
|
||||
SpellChecker::SpellChecker(QObject *parent)
|
||||
: QObject(parent)
|
||||
, m_userDict("userDict_")
|
||||
#ifdef USE_HUNSPELL
|
||||
, m_hunspell(nullptr)
|
||||
#endif
|
||||
: QSyntaxHighlighter(parent)
|
||||
{
|
||||
auto language = QLocale::system().bcp47Name();
|
||||
|
||||
}
|
||||
|
||||
SpellChecker::~SpellChecker()
|
||||
{
|
||||
#ifdef USE_HUNSPELL
|
||||
delete m_hunspell;
|
||||
#endif
|
||||
}
|
||||
|
||||
bool SpellChecker::spell(const QString &word)
|
||||
{
|
||||
#ifdef USE_HUNSPELL
|
||||
return m_hunspell->spell(m_codec->fromUnicode(word).toStdString());
|
||||
#else
|
||||
return true;
|
||||
#endif
|
||||
}
|
||||
|
||||
bool SpellChecker::isInit() const
|
||||
{
|
||||
#ifdef USE_HUNSPELL
|
||||
return !m_hunspell;
|
||||
#endif
|
||||
return false;
|
||||
}
|
||||
|
||||
void SpellChecker::initHunspell()
|
||||
{
|
||||
#ifdef USE_HUNSPELL
|
||||
if (m_hunspell) {
|
||||
delete m_hunspell;
|
||||
}
|
||||
|
||||
QString dictFile = QApplication::applicationDirPath() + "/dictionaries/" + m_lang + "/index.dic";
|
||||
QString affixFile = QApplication::applicationDirPath() + "/dictionaries/" + m_lang + "/index.aff";
|
||||
QString dictFile = QDir::homePath() + "/Status/StatusQ/sandbox/dictionaries/" + language + "/index.dic";
|
||||
QString affixFile = QDir::homePath() + "/Status/StatusQ/sandbox/dictionaries/" + language + "/index.aff";
|
||||
QByteArray dictFilePathBA = dictFile.toLocal8Bit();
|
||||
QByteArray affixFilePathBA = affixFile.toLocal8Bit();
|
||||
m_hunspell = new Hunspell(affixFilePathBA.constData(),
|
||||
dictFilePathBA.constData());
|
||||
|
||||
qDebug() << "TEST" << dictFile;
|
||||
// detect encoding analyzing the SET option in the affix file
|
||||
auto encoding = QStringLiteral("ISO8859-15");
|
||||
QFile _affixFile(affixFile);
|
||||
@@ -84,7 +47,7 @@ void SpellChecker::initHunspell()
|
||||
}
|
||||
m_codec = QTextCodec::codecForName(encoding.toLatin1().constData());
|
||||
|
||||
QString userDict = m_userDict + m_lang + ".txt";
|
||||
QString userDict = "userDict_" + language + ".txt";
|
||||
|
||||
if (!userDict.isEmpty()) {
|
||||
QFile userDictonaryFile(userDict);
|
||||
@@ -102,14 +65,22 @@ void SpellChecker::initHunspell()
|
||||
} else {
|
||||
qDebug() << "User dictionary not set.";
|
||||
}
|
||||
#endif
|
||||
}
|
||||
|
||||
SpellChecker::~SpellChecker()
|
||||
{
|
||||
delete m_hunspell;
|
||||
}
|
||||
|
||||
bool SpellChecker::spell(const QString &word)
|
||||
{
|
||||
return m_hunspell->spell(m_codec->fromUnicode(word).toStdString());
|
||||
}
|
||||
|
||||
QVariantList SpellChecker::suggest(const QString &word)
|
||||
{
|
||||
int numSuggestions = 0;
|
||||
QVariantList suggestions;
|
||||
#ifdef USE_HUNSPELL
|
||||
std::vector<std::string> wordlist;
|
||||
wordlist = m_hunspell->suggest(m_codec->fromUnicode(word).toStdString());
|
||||
|
||||
@@ -121,22 +92,20 @@ QVariantList SpellChecker::suggest(const QString &word)
|
||||
QByteArray::fromStdString(wordlist[i]));
|
||||
}
|
||||
}
|
||||
#endif
|
||||
|
||||
return suggestions;
|
||||
}
|
||||
|
||||
void SpellChecker::ignoreWord(const QString &word)
|
||||
{
|
||||
#ifdef USE_HUNSPELL
|
||||
m_hunspell->add(m_codec->fromUnicode(word).constData());
|
||||
#endif
|
||||
}
|
||||
|
||||
void SpellChecker::addToUserWordlist(const QString &word)
|
||||
{
|
||||
#ifdef USE_HUNSPELL
|
||||
QString userDict = m_userDict + m_lang + ".txt";
|
||||
auto language = QLocale::scriptToString(QLocale::system().script());
|
||||
|
||||
QString userDict = "userDict_" + language + ".txt";
|
||||
if (!userDict.isEmpty()) {
|
||||
QFile userDictonaryFile(userDict);
|
||||
if (userDictonaryFile.open(QIODevice::Append)) {
|
||||
@@ -150,32 +119,74 @@ void SpellChecker::addToUserWordlist(const QString &word)
|
||||
} else {
|
||||
qDebug() << "User dictionary not set.";
|
||||
}
|
||||
#endif
|
||||
}
|
||||
|
||||
const QString& SpellChecker::lang() const
|
||||
void SpellChecker::setText(const QString &text)
|
||||
{
|
||||
return m_lang;
|
||||
}
|
||||
|
||||
void SpellChecker::setLang(const QString& lang)
|
||||
{
|
||||
if (m_lang != lang) {
|
||||
m_lang = lang;
|
||||
initHunspell();
|
||||
emit langChanged();
|
||||
if (m_text != text) {
|
||||
m_text = text;
|
||||
emit textChanged();
|
||||
makeDisplayText(m_text);
|
||||
}
|
||||
}
|
||||
|
||||
const QString& SpellChecker::userDict() const
|
||||
const QString &SpellChecker::text() const
|
||||
{
|
||||
return m_userDict;
|
||||
return m_text;
|
||||
}
|
||||
|
||||
void SpellChecker::setUserDict(const QString& userDict)
|
||||
const QString &SpellChecker::displayText() const
|
||||
{
|
||||
if (m_userDict != userDict) {
|
||||
m_userDict = userDict;
|
||||
emit userDictChanged();
|
||||
return m_displayText;
|
||||
}
|
||||
|
||||
QQuickTextDocument *SpellChecker::textDocument() const
|
||||
{
|
||||
return m_document;
|
||||
}
|
||||
|
||||
void SpellChecker::setTextDocument(QQuickTextDocument *document)
|
||||
{
|
||||
if (m_document != document) {
|
||||
m_document = document;
|
||||
setDocument(m_document->textDocument());
|
||||
emit textDocumentChanged();
|
||||
}
|
||||
}
|
||||
|
||||
void SpellChecker::highlightBlock(const QString &text)
|
||||
{
|
||||
QTextCharFormat format;
|
||||
format.setUnderlineColor(Qt::red);
|
||||
format.setFontUnderline(true);
|
||||
// format.setUnderlineStyle(QTextCharFormat::DotLine);
|
||||
format.merge(currentBlock().charFormat());
|
||||
|
||||
|
||||
|
||||
QRegularExpression expression("\\S+");
|
||||
QRegularExpressionMatchIterator i = expression.globalMatch(text);
|
||||
while(i.hasNext()) {
|
||||
QRegularExpressionMatch match = i.next();
|
||||
if (!spell(match.captured())) {
|
||||
setFormat(match.capturedStart(), match.capturedLength(), format);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
void SpellChecker::makeDisplayText(const QString &text)
|
||||
{
|
||||
auto words = text.split(" ");
|
||||
QString gPattern = "<u style=\"color: red;\">%1</u>";
|
||||
|
||||
m_displayText = ""; // todo optimize delta
|
||||
for (const auto& word: qAsConst(words)) {
|
||||
if (!spell(word)) {
|
||||
m_displayText.append(" " + gPattern.arg(word));
|
||||
} else {
|
||||
m_displayText.append(" " + word);
|
||||
}
|
||||
}
|
||||
|
||||
emit displayTextChanged();
|
||||
}
|
||||
|
||||
+21
-18
@@ -6,17 +6,15 @@
|
||||
#include <QQuickTextDocument>
|
||||
#include <QSyntaxHighlighter>
|
||||
|
||||
#ifdef USE_HUNSPELL
|
||||
class Hunspell;
|
||||
#endif
|
||||
class QTextCodec;
|
||||
|
||||
class SpellChecker : public QObject
|
||||
class SpellChecker : public QSyntaxHighlighter
|
||||
{
|
||||
Q_OBJECT
|
||||
Q_PROPERTY(QString lang READ lang WRITE setLang NOTIFY langChanged)
|
||||
Q_PROPERTY(QString userDict READ userDict WRITE setUserDict NOTIFY userDictChanged)
|
||||
|
||||
Q_PROPERTY(QString text READ text WRITE setText NOTIFY textChanged)
|
||||
Q_PROPERTY(QString displayText READ displayText NOTIFY displayTextChanged)
|
||||
Q_PROPERTY(QQuickTextDocument* document READ textDocument WRITE setTextDocument NOTIFY textDocumentChanged)
|
||||
public:
|
||||
explicit SpellChecker(QObject *parent = nullptr);
|
||||
~SpellChecker();
|
||||
@@ -25,29 +23,34 @@ public:
|
||||
Q_INVOKABLE QVariantList suggest(const QString &word);
|
||||
Q_INVOKABLE void ignoreWord(const QString &word);
|
||||
Q_INVOKABLE void addToUserWordlist(const QString &word);
|
||||
Q_INVOKABLE bool isInit() const;
|
||||
|
||||
const QString& lang() const;
|
||||
void setLang(const QString& lang);
|
||||
void setText(const QString& text);
|
||||
const QString& text() const;
|
||||
|
||||
const QString& userDict() const;
|
||||
void setUserDict(const QString& userDict);
|
||||
const QString& displayText() const;
|
||||
|
||||
QQuickTextDocument* textDocument() const;
|
||||
void setTextDocument(QQuickTextDocument* document);
|
||||
|
||||
signals:
|
||||
void langChanged();
|
||||
void userDictChanged();
|
||||
void textChanged();
|
||||
void displayTextChanged();
|
||||
void textDocumentChanged();
|
||||
|
||||
protected:
|
||||
void highlightBlock(const QString &text) final;
|
||||
|
||||
private:
|
||||
void initHunspell();
|
||||
void makeDisplayText(const QString& text);
|
||||
|
||||
private:
|
||||
QString m_lang;
|
||||
QString m_userDict;
|
||||
QString m_text;
|
||||
QString m_displayText;
|
||||
QString m_dictionaryPath;
|
||||
|
||||
QQuickTextDocument *m_document;
|
||||
#ifdef USE_HUNSPELL
|
||||
|
||||
Hunspell *m_hunspell;
|
||||
#endif
|
||||
QTextCodec *m_codec;
|
||||
};
|
||||
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
StatusBaseText {
|
||||
id: root
|
||||
|
||||
property bool expandable: false
|
||||
property bool expanded: false
|
||||
readonly property real actualWidth: implicitWidth
|
||||
property real maxWidth: width
|
||||
|
||||
font.family: Theme.palette.monoFont.name
|
||||
font.pixelSize: 13
|
||||
elide: Text.ElideMiddle
|
||||
color: Theme.palette.baseColor1
|
||||
|
||||
Component.onCompleted: {
|
||||
maxWidth = width
|
||||
expanded = actualWidth <= maxWidth
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
cursorShape: root.expandable ? Qt.PointingHandCursor : Qt.arrowCursor
|
||||
enabled: root.expandable
|
||||
|
||||
onClicked: {
|
||||
if (root.expanded) {
|
||||
width = root.width = root.maxWidth
|
||||
} else {
|
||||
width = root.width = root.actualWidth
|
||||
}
|
||||
root.expanded = !root.expanded
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -11,7 +11,6 @@ Item {
|
||||
implicitHeight: 56
|
||||
|
||||
property alias chatInfoButton: statusChatInfoButton
|
||||
property alias menuButton: statusMenuButton
|
||||
property Component popupMenu
|
||||
|
||||
signal chatInfoButtonClicked()
|
||||
@@ -28,20 +27,18 @@ Item {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 5
|
||||
anchors.right: (implicitWidth > parent.width - 50) ? statusMenuButton.left : undefined
|
||||
anchors.rightMargin: 5
|
||||
type: StatusChatInfoButton.Type.OneToOneChat
|
||||
onClicked: statusChatInfoToolBar.chatInfoButtonClicked()
|
||||
}
|
||||
|
||||
StatusRoundButton {
|
||||
id: statusMenuButton
|
||||
id: menuButton
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 8
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
visible: popupMenuSlot.active
|
||||
width: visible ? 32 : 0
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
type: StatusRoundButton.Type.Secondary
|
||||
@@ -52,14 +49,14 @@ Item {
|
||||
State {
|
||||
name: "default"
|
||||
PropertyChanges {
|
||||
target: statusMenuButton
|
||||
target: menuButton
|
||||
icon.rotation: 0
|
||||
}
|
||||
},
|
||||
State {
|
||||
name: "pressed"
|
||||
PropertyChanges {
|
||||
target: statusMenuButton
|
||||
target: menuButton
|
||||
icon.rotation: 45
|
||||
highlighted: true
|
||||
}
|
||||
@@ -90,8 +87,8 @@ Item {
|
||||
|
||||
onClicked: {
|
||||
statusChatInfoToolBar.addButtonClicked(mouse)
|
||||
statusMenuButton.state = "pressed"
|
||||
popupMenuSlot.item.popup(statusMenuButton.width-popupMenuSlot.item.width, statusMenuButton.height + 4)
|
||||
menuButton.state = "pressed"
|
||||
popupMenuSlot.item.popup(menuButton.width-popupMenuSlot.item.width, menuButton.height + 4)
|
||||
}
|
||||
|
||||
Loader {
|
||||
@@ -99,7 +96,7 @@ Item {
|
||||
active: !!statusChatInfoToolBar.popupMenu
|
||||
onLoaded: {
|
||||
popupMenuSlot.item.closeHandler = function () {
|
||||
statusMenuButton.state = "default"
|
||||
menuButton.state = "default"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,10 +1,7 @@
|
||||
import QtQuick 2.13
|
||||
import QtQml.Models 2.14
|
||||
import QtQuick.Controls 2.13 as QC
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
@@ -15,18 +12,17 @@ Column {
|
||||
width: 288
|
||||
|
||||
property string categoryId: ""
|
||||
property var model: null
|
||||
property bool draggableItems: false
|
||||
|
||||
property alias statusChatListItems: statusChatListItems
|
||||
property string selectedChatId: ""
|
||||
property alias chatListItems: statusChatListItems
|
||||
|
||||
property Component popupMenu
|
||||
|
||||
property var filterFn
|
||||
property var profileImageFn
|
||||
property var chatNameFn
|
||||
|
||||
signal chatItemSelected(string categoryId, string id)
|
||||
signal chatItemSelected(string id)
|
||||
signal chatItemUnmuted(string id)
|
||||
signal chatItemReordered(string id, int from, int to)
|
||||
|
||||
onPopupMenuChanged: {
|
||||
if (!!popupMenu) {
|
||||
@@ -34,181 +30,71 @@ Column {
|
||||
}
|
||||
}
|
||||
|
||||
DelegateModel {
|
||||
id: delegateModel
|
||||
model: statusChatList.model
|
||||
delegate: Item {
|
||||
id: draggable
|
||||
width: statusChatListItem.width
|
||||
height: statusChatListItem.height
|
||||
property alias chatListItem: statusChatListItem
|
||||
Repeater {
|
||||
id: statusChatListItems
|
||||
delegate: StatusChatListItem {
|
||||
|
||||
id: statusChatListItem
|
||||
|
||||
property string profileImage: ""
|
||||
|
||||
Component.onCompleted: {
|
||||
if (typeof statusChatList.profileImageFn === "function") {
|
||||
profileImage = statusChatList.profileImageFn(model.chatId || model.id) || ""
|
||||
}
|
||||
}
|
||||
|
||||
chatId: model.chatId || model.id
|
||||
name: !!statusChatList.chatNameFn ? statusChatList.chatNameFn(model) : model.name
|
||||
type: model.chatType
|
||||
muted: !!model.muted
|
||||
hasUnreadMessages: !!model.hasUnreadMessages || model.unviewedMessagesCount > 0
|
||||
hasMention: !!model.hasMention
|
||||
badge.value: model.unviewedMessagesCount || 0
|
||||
selected: (model.chatId || model.id) === statusChatList.selectedChatId
|
||||
|
||||
icon.color: model.color || ""
|
||||
image.isIdenticon: !!!profileImage && !!!model.identityImage && !!model.identicon
|
||||
image.source: profileImage || model.identityImage || model.identicon || ""
|
||||
|
||||
onClicked: {
|
||||
if (mouse.button === Qt.RightButton && !!statusChatList.popupMenu) {
|
||||
statusChatListItem.highlighted = true
|
||||
|
||||
let originalOpenHandler = popupMenuSlot.item.openHandler
|
||||
let originalCloseHandler = popupMenuSlot.item.closeHandler
|
||||
|
||||
popupMenuSlot.item.openHandler = function () {
|
||||
if (!!originalOpenHandler) {
|
||||
originalOpenHandler((model.chatId || model.id))
|
||||
}
|
||||
}
|
||||
|
||||
popupMenuSlot.item.closeHandler = function () {
|
||||
if (statusChatListItem) {
|
||||
statusChatListItem.highlighted = false
|
||||
}
|
||||
if (!!originalCloseHandler) {
|
||||
originalCloseHandler()
|
||||
}
|
||||
}
|
||||
|
||||
popupMenuSlot.item.popup(mouse.x + 4, statusChatListItem.y + mouse.y + 6)
|
||||
popupMenuSlot.item.openHandler = originalOpenHandler
|
||||
return
|
||||
}
|
||||
statusChatList.chatItemSelected(model.chatId || model.id)
|
||||
}
|
||||
onUnmute: statusChatList.chatItemUnmuted(model.chatId || model.id)
|
||||
visible: {
|
||||
if (!!statusChatList.filterFn) {
|
||||
return statusChatList.filterFn(model)
|
||||
return statusChatList.filterFn(model, statusChatList.categoryId)
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: dragSensor
|
||||
|
||||
anchors.fill: parent
|
||||
cursorShape: active ? Qt.ClosedHandCursor : Qt.PointingHandCursor
|
||||
hoverEnabled: true
|
||||
pressAndHoldInterval: 150
|
||||
enabled: statusChatList.draggableItems
|
||||
|
||||
property bool active: false
|
||||
property real startY: 0
|
||||
property real startX: 0
|
||||
|
||||
drag.target: draggedListItemLoader.item
|
||||
drag.threshold: 0.1
|
||||
drag.filterChildren: true
|
||||
|
||||
onPressed: {
|
||||
startY = mouseY
|
||||
startX = mouseX
|
||||
}
|
||||
onPressAndHold: active = true
|
||||
onReleased: {
|
||||
if (active) {
|
||||
statusChatList.chatItemReordered(statusChatListItem.chatId, statusChatListItem.originalOrder, statusChatListItem.originalOrder)
|
||||
}
|
||||
active = false
|
||||
}
|
||||
onMouseYChanged: {
|
||||
if ((Math.abs(startY - mouseY) > 1) && pressed) {
|
||||
active = true
|
||||
}
|
||||
}
|
||||
onMouseXChanged: {
|
||||
if ((Math.abs(startX - mouseX) > 1) && pressed) {
|
||||
active = true
|
||||
}
|
||||
}
|
||||
|
||||
StatusChatListItem {
|
||||
|
||||
id: statusChatListItem
|
||||
opacity: dragSensor.active ? 0.0 : 1.0
|
||||
originalOrder: model.position
|
||||
chatId: model.itemId
|
||||
categoryId: model.parentItemId? model.parentItemId : ""
|
||||
name: model.name
|
||||
icon.emoji: model.emoji
|
||||
type: !!model.type ? model.type : StatusChatListItem.Type.CommunityChat
|
||||
muted: model.muted
|
||||
hasUnreadMessages: model.hasUnreadMessages
|
||||
notificationsCount: model.notificationsCount
|
||||
highlightWhenCreated: !!model.highlight
|
||||
selected: model.active
|
||||
icon.color: model.color
|
||||
image.isIdenticon: model.isIdenticon
|
||||
image.source: model.icon
|
||||
|
||||
sensor.cursorShape: dragSensor.cursorShape
|
||||
onClicked: {
|
||||
highlightWhenCreated = false
|
||||
|
||||
if (mouse.button === Qt.RightButton && !!statusChatList.popupMenu) {
|
||||
statusChatListItem.highlighted = true
|
||||
|
||||
let originalOpenHandler = popupMenuSlot.item.openHandler
|
||||
let originalCloseHandler = popupMenuSlot.item.closeHandler
|
||||
|
||||
popupMenuSlot.item.openHandler = function () {
|
||||
if (!!originalOpenHandler) {
|
||||
originalOpenHandler(model.itemId)
|
||||
}
|
||||
}
|
||||
|
||||
popupMenuSlot.item.closeHandler = function () {
|
||||
if (statusChatListItem) {
|
||||
statusChatListItem.highlighted = false
|
||||
}
|
||||
if (!!originalCloseHandler) {
|
||||
originalCloseHandler()
|
||||
}
|
||||
}
|
||||
|
||||
let p = statusChatListItem.mapToItem(statusChatList, mouse.x, mouse.y)
|
||||
|
||||
popupMenuSlot.item.popup(p.x + 4, p.y + 6)
|
||||
popupMenuSlot.item.openHandler = originalOpenHandler
|
||||
return
|
||||
}
|
||||
if (!statusChatListItem.selected) {
|
||||
statusChatList.chatItemSelected(model.parentItemId, model.itemId)
|
||||
}
|
||||
}
|
||||
onUnmute: statusChatList.chatItemUnmuted(model.itemId)
|
||||
}
|
||||
}
|
||||
|
||||
DropArea {
|
||||
id: dropArea
|
||||
width: dragSensor.active ? 0 : parent.width
|
||||
height: dragSensor.active ? 0 : parent.height
|
||||
keys: ["chat-item-category-" + statusChatListItem.categoryId]
|
||||
|
||||
onEntered: reorderDelay.start()
|
||||
onDropped: statusChatList.chatItemReordered(statusChatListItem.chatId, drag.source.originalOrder, statusChatListItem.DelegateModel.itemsIndex)
|
||||
|
||||
Timer {
|
||||
id: reorderDelay
|
||||
interval: 100
|
||||
repeat: false
|
||||
onTriggered: {
|
||||
if (dropArea.containsDrag) {
|
||||
dropArea.drag.source.chatListItem.originalOrder = statusChatListItem.originalOrder
|
||||
delegateModel.items.move(dropArea.drag.source.DelegateModel.itemsIndex, draggable.DelegateModel.itemsIndex)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: draggedListItemLoader
|
||||
active: dragSensor.active
|
||||
sourceComponent: StatusChatListItem {
|
||||
property var globalPosition: Utils.getAbsolutePosition(draggable)
|
||||
parent: QC.Overlay.overlay
|
||||
sensor.cursorShape: dragSensor.cursorShape
|
||||
Drag.active: dragSensor.active
|
||||
Drag.hotSpot.x: width / 2
|
||||
Drag.hotSpot.y: height / 2
|
||||
Drag.keys: ["chat-item-category-" + categoryId]
|
||||
Drag.source: draggable
|
||||
|
||||
Component.onCompleted: {
|
||||
x = globalPosition.x
|
||||
y = globalPosition.y
|
||||
}
|
||||
chatId: draggable.chatListItem.chatId
|
||||
categoryId: draggable.chatListItem.categoryId
|
||||
name: draggable.chatListItem.name
|
||||
type: draggable.chatListItem.type
|
||||
muted: draggable.chatListItem.muted
|
||||
dragged: true
|
||||
hasUnreadMessages: model.hasUnreadMessages
|
||||
notificationsCount: model.notificationsCount
|
||||
selected: draggable.chatListItem.selected
|
||||
|
||||
icon.color: draggable.chatListItem.icon.color
|
||||
image.isIdenticon: draggable.chatListItem.image.isIdenticon
|
||||
image.source: draggable.chatListItem.image.source
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Repeater {
|
||||
id: statusChatListItems
|
||||
model: delegateModel
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: popupMenuSlot
|
||||
active: !!statusChatList.popupMenu
|
||||
|
||||
@@ -1,11 +1,8 @@
|
||||
import QtQuick 2.14
|
||||
import QtQml.Models 2.14
|
||||
import QtQuick.Controls 2.14 as QC
|
||||
import QtQuick.Controls 2.14
|
||||
|
||||
import StatusQ.Core.Utils 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
import StatusQ.Core 0.1
|
||||
|
||||
Item {
|
||||
id: statusChatListAndCategories
|
||||
@@ -13,31 +10,18 @@ Item {
|
||||
implicitHeight: chatListsAndCategories.height
|
||||
implicitWidth: chatListsAndCategories.width
|
||||
|
||||
property StatusTooltipSettings categoryAddButtonToolTip: StatusTooltipSettings {
|
||||
text: "Add channel inside category"
|
||||
}
|
||||
property StatusTooltipSettings categoryMenuButtonToolTip: StatusTooltipSettings {
|
||||
text: "More"
|
||||
}
|
||||
|
||||
property var model: []
|
||||
property string selectedChatId: ""
|
||||
property bool showCategoryActionButtons: false
|
||||
property bool showPopupMenu: true
|
||||
property alias chatList: statusChatList.chatListItems
|
||||
property alias categoryList: statusChatListCategories
|
||||
property alias sensor: sensor
|
||||
property bool draggableItems: false
|
||||
property bool draggableCategories: false
|
||||
// Keeps track of expanded category state. Should only be modified
|
||||
// internally at runtime.
|
||||
property var openedCategoryState: new Object({})
|
||||
|
||||
property Component categoryPopupMenu
|
||||
property Component chatListPopupMenu
|
||||
property Component popupMenu
|
||||
|
||||
signal chatItemSelected(string categoryId, string id)
|
||||
signal chatItemSelected(string id)
|
||||
signal chatItemUnmuted(string id)
|
||||
signal chatItemReordered(string categoryId, string chatId, int from, int to)
|
||||
signal chatListCategoryReordered(string categoryId, int from, int to)
|
||||
signal categoryAddButtonClicked(string id)
|
||||
|
||||
onPopupMenuChanged: {
|
||||
@@ -53,7 +37,7 @@ Item {
|
||||
height: statusChatListAndCategories.height
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
onClicked: {
|
||||
if (mouse.button === Qt.RightButton && showPopupMenu && !!statusChatListAndCategories.popupMenu) {
|
||||
if (mouse.button === Qt.RightButton && !!statusChatListAndCategories.popupMenu) {
|
||||
popupMenuSlot.item.popup(mouse.x + 4, mouse.y + 6)
|
||||
return
|
||||
}
|
||||
@@ -69,155 +53,34 @@ Item {
|
||||
StatusChatList {
|
||||
id: statusChatList
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
visible: statusChatList.model.count > 0
|
||||
onChatItemSelected: statusChatListAndCategories.chatItemSelected(categoryId, id)
|
||||
visible: !!chatListItems.model && chatListItems.count > 0
|
||||
selectedChatId: statusChatListAndCategories.selectedChatId
|
||||
onChatItemSelected: statusChatListAndCategories.chatItemSelected(id)
|
||||
onChatItemUnmuted: statusChatListAndCategories.chatItemUnmuted(id)
|
||||
onChatItemReordered: statusChatListAndCategories.chatItemReordered(categoryId, id, from, to)
|
||||
draggableItems: statusChatListAndCategories.draggableItems
|
||||
model: statusChatListAndCategories.model
|
||||
filterFn: function (model) {
|
||||
return !model.isCategory
|
||||
return !!!model.categoryId
|
||||
}
|
||||
popupMenu: statusChatListAndCategories.chatListPopupMenu
|
||||
}
|
||||
|
||||
DelegateModel {
|
||||
id: delegateModel
|
||||
model: statusChatListAndCategories.model
|
||||
delegate: Item {
|
||||
id: draggable
|
||||
width: statusChatListCategory.width
|
||||
height: statusChatListCategory.height
|
||||
property alias chatListCategory: statusChatListCategory
|
||||
|
||||
StatusChatListCategory {
|
||||
id: statusChatListCategory
|
||||
|
||||
property bool dragActive: false
|
||||
property real startY: 0
|
||||
property real startX: 0
|
||||
|
||||
opacity: dragActive ? 0.0 : 1.0
|
||||
|
||||
dragSensor.drag.target: draggedListCategoryLoader.item
|
||||
dragSensor.drag.threshold: 0.1
|
||||
dragSensor.drag.filterChildren: true
|
||||
dragSensor.onPressAndHold: {
|
||||
if (statusChatListAndCategories.draggableCategories) {
|
||||
dragActive = true
|
||||
}
|
||||
}
|
||||
dragSensor.onReleased: {
|
||||
if (dragActive) {
|
||||
statusChatListAndCategories.chatListCategoryReordered(statusChatListCategory.categoryId, statusChatListCategory.originalOrder, statusChatListCategory.originalOrder)
|
||||
}
|
||||
dragActive = false
|
||||
}
|
||||
dragSensor.cursorShape: dragActive ? Qt.ClosedHandCursor : Qt.PointingHandCursor
|
||||
dragSensor.onPressed: {
|
||||
startY = dragSensor.mouseY
|
||||
startX = dragSensor.mouseX
|
||||
}
|
||||
dragSensor.onMouseYChanged: {
|
||||
if (statusChatListAndCategories.draggableCategories && (Math.abs(startY - dragSensor.mouseY) > 1) && dragSensor.pressed) {
|
||||
dragActive = true
|
||||
}
|
||||
}
|
||||
dragSensor.onMouseXChanged: {
|
||||
if (statusChatListAndCategories.draggableCategories && (Math.abs(startX - dragSensor.mouseX) > 1) && dragSensor.pressed) {
|
||||
dragActive = true
|
||||
}
|
||||
}
|
||||
|
||||
addButton.tooltip: statusChatListAndCategories.categoryAddButtonToolTip
|
||||
menuButton.tooltip: statusChatListAndCategories.categoryMenuButtonToolTip
|
||||
|
||||
originalOrder: model.position
|
||||
categoryId: model.itemId
|
||||
name: model.name
|
||||
showActionButtons: statusChatListAndCategories.showCategoryActionButtons
|
||||
addButton.onClicked: statusChatListAndCategories.categoryAddButtonClicked(model.itemId)
|
||||
|
||||
chatList.model: model.subItems
|
||||
chatList.onChatItemSelected: statusChatListAndCategories.chatItemSelected(categoryId, id)
|
||||
chatList.onChatItemUnmuted: statusChatListAndCategories.chatItemUnmuted(id)
|
||||
chatList.onChatItemReordered: statusChatListAndCategories.chatItemReordered(model.itemId, id, from, to)
|
||||
chatList.draggableItems: statusChatListAndCategories.draggableItems
|
||||
|
||||
popupMenu: statusChatListAndCategories.categoryPopupMenu
|
||||
chatListPopupMenu: statusChatListAndCategories.chatListPopupMenu
|
||||
|
||||
// Used to set the initial value of "opened" when the
|
||||
// model is bound/changed.
|
||||
opened: {
|
||||
let openedState = statusChatListAndCategories.openedCategoryState[model.itemId]
|
||||
return openedState !== undefined ? openedState : true // defaults to open
|
||||
}
|
||||
|
||||
// Used to track the internal changes of the `opened`
|
||||
// property. This cannot be brought inside the component
|
||||
// as the state would be lost each time the model is
|
||||
// changed.
|
||||
onOpenedChanged: {
|
||||
statusChatListAndCategories.openedCategoryState[model.itemId] = statusChatListCategory.opened
|
||||
}
|
||||
}
|
||||
|
||||
DropArea {
|
||||
id: dropArea
|
||||
width: draggable.chatListCategory.dragActive ? 0 : parent.width
|
||||
height: draggable.chatListCategory.dragActive ? 0 : parent.height
|
||||
keys: ["chat-category"]
|
||||
|
||||
onEntered: reorderDelay.start()
|
||||
onDropped: statusChatListAndCategories.chatListCategoryReordered(statusChatListCategory.categoryId, drag.source.originalOrder, statusChatListCategory.DelegateModel.itemsIndex)
|
||||
|
||||
Timer {
|
||||
id: reorderDelay
|
||||
interval: 100
|
||||
repeat: false
|
||||
onTriggered: {
|
||||
if (dropArea.containsDrag) {
|
||||
dropArea.drag.source.chatListCategory.originalOrder = statusChatListCategory.originalOrder
|
||||
delegateModel.items.move(dropArea.drag.source.DelegateModel.itemsIndex, draggable.DelegateModel.itemsIndex)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: draggedListCategoryLoader
|
||||
active: draggable.chatListCategory.dragActive
|
||||
sourceComponent: StatusChatListCategory {
|
||||
property var globalPosition: Utils.getAbsolutePosition(draggable)
|
||||
parent: QC.Overlay.overlay
|
||||
|
||||
dragSensor.cursorShape: draggable.chatListCategory.dragSensor.cursorShape
|
||||
Drag.active: draggable.chatListCategory.dragActive
|
||||
Drag.hotSpot.x: width / 2
|
||||
Drag.hotSpot.y: height / 2
|
||||
Drag.keys: ["chat-category"]
|
||||
Drag.source: draggable
|
||||
|
||||
Component.onCompleted: {
|
||||
x = globalPosition.x
|
||||
y = globalPosition.y
|
||||
}
|
||||
dragged: true
|
||||
categoryId: draggable.chatListCategory.categoryId
|
||||
name: draggable.chatListCategory.name
|
||||
showActionButtons: draggable.chatListCategory.showActionButtons
|
||||
|
||||
chatList.model: draggable.chatListCategory.chatList.model
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Repeater {
|
||||
id: statusChatListCategories
|
||||
visible: !!model && model.count > 0
|
||||
model: delegateModel
|
||||
|
||||
delegate: StatusChatListCategory {
|
||||
categoryId: model.categoryId
|
||||
name: model.name
|
||||
showActionButtons: statusChatListAndCategories.showCategoryActionButtons
|
||||
addButton.onClicked: statusChatListAndCategories.categoryAddButtonClicked(model.categoryId)
|
||||
|
||||
chatList.chatListItems.model: statusChatListAndCategories.chatList.model
|
||||
chatList.selectedChatId: statusChatListAndCategories.selectedChatId
|
||||
chatList.onChatItemSelected: statusChatListAndCategories.chatItemSelected(id)
|
||||
chatList.onChatItemUnmuted: statusChatListAndCategories.chatItemUnmuted(id)
|
||||
|
||||
popupMenu: statusChatListAndCategories.categoryPopupMenu
|
||||
chatListPopupMenu: statusChatListAndCategories.chatListPopupMenu
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,21 +7,16 @@ Column {
|
||||
id: statusChatListCategory
|
||||
|
||||
spacing: 0
|
||||
opacity: dragged ? 0.5 : 1
|
||||
|
||||
objectName: "chatListCategory"
|
||||
property int originalOrder: -1
|
||||
property string categoryId: ""
|
||||
property string name: ""
|
||||
property bool opened: true
|
||||
property bool dragged: false
|
||||
|
||||
property alias showActionButtons: statusChatListCategoryItem.showActionButtons
|
||||
property alias addButton: statusChatListCategoryItem.addButton
|
||||
property alias menuButton: statusChatListCategoryItem.menuButton
|
||||
property alias toggleButton: statusChatListCategoryItem.toggleButton
|
||||
property alias chatList: statusChatList
|
||||
property alias dragSensor: statusChatListCategoryItem.sensor
|
||||
|
||||
property Component chatListPopupMenu
|
||||
property Component popupMenu
|
||||
@@ -35,22 +30,18 @@ Column {
|
||||
StatusChatListCategoryItem {
|
||||
id: statusChatListCategoryItem
|
||||
title: statusChatListCategory.name
|
||||
visible: model.isCategory
|
||||
opened: statusChatListCategory.opened
|
||||
sensor.pressAndHoldInterval: 150
|
||||
|
||||
showMenuButton: showActionButtons && !!statusChatListCategory.popupMenu
|
||||
highlighted: statusChatListCategory.dragged
|
||||
sensor.onClicked: {
|
||||
if (sensor.enabled) {
|
||||
if (mouse.button === Qt.RightButton && showActionButtons && !!statusChatListCategory.popupMenu) {
|
||||
highlighted = true;
|
||||
popupMenuSlot.item.popup(mouse.x + 4, mouse.y + 6);
|
||||
return
|
||||
}
|
||||
showMenuButton: !!statusChatListCategory.popupMenu
|
||||
|
||||
onClicked: {
|
||||
if (mouse.button === Qt.RightButton && !!statusChatListCategory.popupMenu) {
|
||||
highlighted = true
|
||||
popupMenuSlot.item.popup(mouse.x + 4, mouse.y + 6)
|
||||
return
|
||||
}
|
||||
statusChatListCategory.opened = !opened
|
||||
}
|
||||
onTitleClicked: statusChatListCategory.opened = !opened
|
||||
onToggleButtonClicked: statusChatListCategory.opened = !opened
|
||||
onMenuButtonClicked: {
|
||||
highlighted = true
|
||||
@@ -67,7 +58,7 @@ Column {
|
||||
visible: statusChatListCategory.opened
|
||||
categoryId: statusChatListCategory.categoryId
|
||||
filterFn: function (model) {
|
||||
return !!model.parentItemId && model.parentItemId === statusChatList.categoryId
|
||||
return !!model.categoryId && model.categoryId == statusChatList.categoryId
|
||||
}
|
||||
|
||||
popupMenu: statusChatListCategory.chatListPopupMenu
|
||||
|
||||
@@ -23,12 +23,15 @@ StatusListItem {
|
||||
property alias menuButton: menuButton
|
||||
property alias toggleButton: toggleButton
|
||||
|
||||
signal clicked(var mouse)
|
||||
signal addButtonClicked(var mouse)
|
||||
signal menuButtonClicked(var mouse)
|
||||
signal toggleButtonClicked(var mouse)
|
||||
|
||||
color: sensor.containsMouse || highlighted ? Theme.palette.baseColor2 : "transparent"
|
||||
|
||||
sensor.onClicked: statusChatListCategoryItem.clicked(mouse)
|
||||
|
||||
statusListItemTitle.color: Theme.palette.directColor4
|
||||
statusListItemTitle.font.weight: Font.Medium
|
||||
|
||||
@@ -60,15 +63,7 @@ StatusListItem {
|
||||
icon.name: "chevron-down"
|
||||
icon.width: 18
|
||||
icon.rotation: statusChatListCategoryItem.opened ? 0 : 270
|
||||
onPressed: {
|
||||
sensor.enabled = false;
|
||||
}
|
||||
onClicked: {
|
||||
statusChatListCategoryItem.toggleButtonClicked(mouse);
|
||||
}
|
||||
onReleased: {
|
||||
sensor.enabled = true;
|
||||
}
|
||||
onClicked: statusChatListCategoryItem.toggleButtonClicked(mouse)
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -1,45 +1,25 @@
|
||||
import QtQuick 2.13
|
||||
import QtQml.Models 2.13
|
||||
import QtQuick.Controls 2.13 as QC
|
||||
import QtGraphicalEffects 1.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
Rectangle {
|
||||
id: statusChatListItem
|
||||
|
||||
objectName: "chatItem"
|
||||
property int originalOrder: -1
|
||||
property string chatId: ""
|
||||
property string categoryId: ""
|
||||
property string name: ""
|
||||
property alias badge: statusBadge
|
||||
property bool hasUnreadMessages: false
|
||||
property int notificationsCount: 0
|
||||
property bool hasMention: false
|
||||
property bool muted: false
|
||||
property StatusImageSettings image: StatusImageSettings {
|
||||
width: 24
|
||||
height: 24
|
||||
}
|
||||
property StatusImageSettings image: StatusImageSettings {}
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
width: 24
|
||||
height: 24
|
||||
color: Theme.palette.miscColor5
|
||||
letterSize: emoji ? 11 : 15
|
||||
emoji: ""
|
||||
emojiSize: Emoji.size.verySmall
|
||||
charactersLen: 1
|
||||
}
|
||||
property int type: StatusChatListItem.Type.PublicChat
|
||||
property bool highlighted: false
|
||||
property bool highlightWhenCreated: false
|
||||
property bool selected: false
|
||||
property bool dragged: false
|
||||
property alias sensor: sensor
|
||||
|
||||
signal clicked(var mouse)
|
||||
signal unmute()
|
||||
@@ -63,32 +43,63 @@ Rectangle {
|
||||
if (selected) {
|
||||
return Theme.palette.statusChatListItem.selectedBackgroundColor
|
||||
}
|
||||
return hoverHander.hovered || highlighted ? Theme.palette.statusChatListItem.hoverBackgroundColor : Theme.palette.baseColor4
|
||||
return sensor.containsMouse || highlighted ? Theme.palette.statusChatListItem.hoverBackgroundColor : Theme.palette.baseColor4
|
||||
}
|
||||
|
||||
opacity: dragged ? 0.7 : 1
|
||||
|
||||
MouseArea {
|
||||
id: sensor
|
||||
|
||||
HoverHandler {
|
||||
id: hoverHander
|
||||
}
|
||||
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
hoverEnabled: true
|
||||
|
||||
onClicked: statusChatListItem.clicked(mouse)
|
||||
|
||||
StatusSmartIdenticon {
|
||||
Loader {
|
||||
id: identicon
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 8
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
image: statusChatListItem.image
|
||||
icon: statusChatListItem.icon
|
||||
name: statusChatListItem.name
|
||||
|
||||
sourceComponent: !!statusChatListItem.image.source.toString() ?
|
||||
statusRoundedImageCmp : statusLetterIdenticonCmp
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusLetterIdenticonCmp
|
||||
StatusLetterIdenticon {
|
||||
height: 24
|
||||
width: 24
|
||||
name: statusChatListItem.name
|
||||
letterSize: 15
|
||||
color: statusChatListItem.icon.color
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusRoundedImageCmp
|
||||
Item {
|
||||
height: 24
|
||||
width: 24
|
||||
StatusRoundedImage {
|
||||
id: statusRoundedImage
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
image.source: statusChatListItem.image.source
|
||||
showLoadingIndicator: true
|
||||
color: statusChatListItem.image.isIdenticon ?
|
||||
Theme.palette.statusRoundedImage.backgroundColor :
|
||||
"transparent"
|
||||
border.width: statusChatListItem.image.isIdenticon ? 1 : 0
|
||||
border.color: Theme.palette.directColor7
|
||||
}
|
||||
|
||||
Loader {
|
||||
sourceComponent: statusLetterIdenticonCmp
|
||||
active: statusRoundedImage.image.status === Image.Error
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusIcon {
|
||||
@@ -100,30 +111,30 @@ Rectangle {
|
||||
width: 14
|
||||
visible: statusChatListItem.type !== StatusChatListItem.Type.OneToOneChat
|
||||
opacity: {
|
||||
if (statusChatListItem.muted && !hoverHander.hovered && !statusChatListItem.highlighted) {
|
||||
if (statusChatListItem.muted && !sensor.containsMouse && !statusChatListItem.highlighted) {
|
||||
return 0.4
|
||||
}
|
||||
return statusChatListItem.hasUnreadMessages ||
|
||||
statusChatListItem.notificationsCount > 0 ||
|
||||
statusChatListItem.selected ||
|
||||
statusChatListItem.highlighted ||
|
||||
statusBadge.visible ||
|
||||
hoverHander.hovered ? 1.0 : 0.7
|
||||
return statusChatListItem.hasMention ||
|
||||
statusChatListItem.hasUnreadMessages ||
|
||||
statusChatListItem.selected ||
|
||||
statusChatListItem.highlighted ||
|
||||
statusBadge.visible ||
|
||||
sensor.containsMouse ? 1.0 : 0.7
|
||||
}
|
||||
|
||||
icon: {
|
||||
switch (statusChatListItem.type) {
|
||||
case StatusChatListItem.Type.PublicCat:
|
||||
return Theme.palette.name == "light" ? "tiny/public-chat" : "tiny/public-chat-white"
|
||||
break;
|
||||
case StatusChatListItem.Type.GroupChat:
|
||||
return Theme.palette.name == "light" ? "tiny/group" : "tiny/group-white"
|
||||
break;
|
||||
case StatusChatListItem.Type.CommunityChat:
|
||||
return Theme.palette.name == "light" ? "tiny/channel" : "tiny/channel-white"
|
||||
break;
|
||||
default:
|
||||
return Theme.palette.name == "light" ? "tiny/public-chat" : "tiny/public-chat-white"
|
||||
case StatusChatListItem.Type.PublicCat:
|
||||
return Theme.palette.name == "light" ? "tiny/public-chat" : "tiny/public-chat-white"
|
||||
break;
|
||||
case StatusChatListItem.Type.GroupChat:
|
||||
return Theme.palette.name == "light" ? "tiny/group" : "tiny/group-white"
|
||||
break;
|
||||
case StatusChatListItem.Type.CommunityChat:
|
||||
return Theme.palette.name == "light" ? "tiny/channel" : "tiny/channel-white"
|
||||
break;
|
||||
default:
|
||||
return Theme.palette.name == "light" ? "tiny/public-chat" : "tiny/public-chat-white"
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -132,39 +143,48 @@ Rectangle {
|
||||
id: chatName
|
||||
anchors.left: statusIcon.visible ? statusIcon.right : identicon.right
|
||||
anchors.leftMargin: statusIcon.visible ? 1 : 8
|
||||
anchors.right: mutedIcon.visible ? mutedIcon.left :
|
||||
statusBadge.visible ? statusBadge.left : parent.right
|
||||
anchors.right: statusBadge.visible ? statusBadge.left :
|
||||
mutedIcon.visible ? mutedIcon.left : parent.right
|
||||
anchors.rightMargin: 6
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
text: (statusChatListItem.type === StatusChatListItem.Type.PublicChat &&
|
||||
!statusChatListItem.name.startsWith("#") ?
|
||||
"#" + statusChatListItem.name :
|
||||
statusChatListItem.name)
|
||||
text: statusChatListItem.type === StatusChatListItem.Type.PublicChat &&
|
||||
!statusChatListItem.name.startsWith("#") ?
|
||||
"#" + statusChatListItem.name :
|
||||
statusChatListItem.name
|
||||
elide: Text.ElideRight
|
||||
color: {
|
||||
if (statusChatListItem.muted && !hoverHander.hovered && !statusChatListItem.highlighted) {
|
||||
if (statusChatListItem.muted && !sensor.containsMouse && !statusChatListItem.highlighted) {
|
||||
return Theme.palette.directColor5
|
||||
}
|
||||
return statusChatListItem.hasUnreadMessages ||
|
||||
statusChatListItem.notificationsCount > 0 ||
|
||||
statusChatListItem.selected ||
|
||||
statusChatListItem.highlighted ||
|
||||
statusChatListItem.highlightWhenCreated ||
|
||||
hoverHander.hovered ||
|
||||
statusBadge.visible ? Theme.palette.directColor1 : Theme.palette.directColor4
|
||||
return statusChatListItem.hasMention ||
|
||||
statusChatListItem.hasUnreadMessages ||
|
||||
statusChatListItem.selected ||
|
||||
statusChatListItem.highlighted ||
|
||||
sensor.containsMouse ||
|
||||
statusBadge.visible ? Theme.palette.directColor1 : Theme.palette.directColor4
|
||||
}
|
||||
font.weight: !statusChatListItem.muted &&
|
||||
(statusChatListItem.hasUnreadMessages ||
|
||||
statusChatListItem.notificationsCount > 0 ||
|
||||
statusChatListItem.highlightWhenCreated ||
|
||||
statusBadge.visible) ? Font.Bold : Font.Medium
|
||||
font.weight: statusChatListItem.hasMention ||
|
||||
statusChatListItem.hasUnreadMessages ||
|
||||
statusBadge.visible ? Font.Bold : Font.Medium
|
||||
font.pixelSize: 15
|
||||
}
|
||||
|
||||
StatusBadge {
|
||||
id: statusBadge
|
||||
|
||||
anchors.right: mutedIcon.visible ? mutedIcon.left : parent.right
|
||||
anchors.rightMargin: 8
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
border.width: 4
|
||||
border.color: color
|
||||
visible: statusBadge.value > 0
|
||||
}
|
||||
|
||||
StatusIcon {
|
||||
id: mutedIcon
|
||||
anchors.right: statusBadge.visible ? statusBadge.left : parent.right
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 8
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 14
|
||||
@@ -175,7 +195,7 @@ Rectangle {
|
||||
MouseArea {
|
||||
id: mutedIconSensor
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
onClicked: statusChatListItem.unmute()
|
||||
}
|
||||
@@ -185,19 +205,5 @@ Rectangle {
|
||||
visible: mutedIconSensor.containsMouse
|
||||
}
|
||||
}
|
||||
|
||||
StatusBadge {
|
||||
id: statusBadge
|
||||
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 8
|
||||
|
||||
color: statusChatListItem.muted ? Theme.palette.primaryColor2 : Theme.palette.primaryColor1
|
||||
border.width: 4
|
||||
border.color: color
|
||||
value: statusChatListItem.notificationsCount
|
||||
visible: statusChatListItem.notificationsCount > 0
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -14,8 +14,6 @@ Rectangle {
|
||||
property alias chatInfoButton: statusChatInfoButton
|
||||
property alias menuButton: menuButton
|
||||
property alias notificationButton: notificationButton
|
||||
property alias membersButton: membersButton
|
||||
property alias searchButton: searchButton
|
||||
property int notificationCount: 0
|
||||
|
||||
property Component popupMenu
|
||||
@@ -23,8 +21,6 @@ Rectangle {
|
||||
signal chatInfoButtonClicked()
|
||||
signal menuButtonClicked()
|
||||
signal notificationButtonClicked()
|
||||
signal membersButtonClicked()
|
||||
signal searchButtonClicked()
|
||||
|
||||
onPopupMenuChanged: {
|
||||
if (!!popupMenu) {
|
||||
@@ -37,7 +33,6 @@ Rectangle {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 12
|
||||
width: Math.min(implicitWidth, parent.width - actionButtons.implicitWidth - anchors.leftMargin * 2)
|
||||
onClicked: statusChatToolBar.chatInfoButtonClicked()
|
||||
}
|
||||
|
||||
@@ -49,34 +44,6 @@ Rectangle {
|
||||
|
||||
spacing: 8
|
||||
|
||||
StatusFlatRoundButton {
|
||||
id: searchButton
|
||||
width: 32
|
||||
height: 32
|
||||
icon.name: "search"
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
onClicked: statusChatToolBar.searchButtonClicked()
|
||||
|
||||
// initializing the tooltip
|
||||
tooltip.text: "Search"
|
||||
tooltip.orientation: StatusToolTip.Orientation.Bottom
|
||||
tooltip.y: parent.height + 12
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
id: membersButton
|
||||
width: 32
|
||||
height: 32
|
||||
icon.name: "group-chat"
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
onClicked: statusChatToolBar.membersButtonClicked()
|
||||
|
||||
// initializing the tooltip
|
||||
tooltip.text: "Members"
|
||||
tooltip.orientation: StatusToolTip.Orientation.Bottom
|
||||
tooltip.y: parent.height + 12
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
id: menuButton
|
||||
width: 32
|
||||
@@ -85,40 +52,11 @@ Rectangle {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
visible: !!statusChatToolBar.popupMenu
|
||||
|
||||
// initializing the tooltip
|
||||
tooltip.visible: !!tooltip.text && menuButton.hovered && !popupMenuSlot.item.opened
|
||||
tooltip.text: "More"
|
||||
tooltip.orientation: StatusToolTip.Orientation.Bottom
|
||||
tooltip.y: parent.height + 12
|
||||
|
||||
property bool showMoreMenu: false
|
||||
onClicked: {
|
||||
menuButton.highlighted = true
|
||||
|
||||
let originalOpenHandler = popupMenuSlot.item.openHandler
|
||||
let originalCloseHandler = popupMenuSlot.item.closeHandler
|
||||
|
||||
popupMenuSlot.item.openHandler = function () {
|
||||
if (!!originalOpenHandler) {
|
||||
originalOpenHandler()
|
||||
}
|
||||
}
|
||||
|
||||
popupMenuSlot.item.closeHandler = function () {
|
||||
menuButton.highlighted = false
|
||||
if (!!originalCloseHandler) {
|
||||
originalCloseHandler()
|
||||
}
|
||||
}
|
||||
|
||||
popupMenuSlot.item.openHandler = originalOpenHandler
|
||||
popupMenuSlot.item.popup(-popupMenuSlot.item.width + menuButton.width, menuButton.height + 4)
|
||||
statusChatToolBar.menuButtonClicked()
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: popupMenuSlot
|
||||
active: !!statusChatToolBar.popupMenu
|
||||
highlighted = true
|
||||
let p = menuButton.mapToItem(statusChatToolBar, menuButton.x, menuButton.y)
|
||||
popupMenuSlot.item.popup(p.x + menuButton.width - popupMenuSlot.item.width, p.y + 4 + menuButton.height)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -127,8 +65,7 @@ Rectangle {
|
||||
width: 1
|
||||
color: Theme.palette.directColor7
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
visible: notificationButton.visible &&
|
||||
(menuButton.visible || membersButton.visible || searchButton.visible)
|
||||
visible: menuButton.visible && notificationButton.visible
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
@@ -140,11 +77,6 @@ Rectangle {
|
||||
icon.height: 21
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
|
||||
// initializing the tooltip
|
||||
tooltip.text: "Activity"
|
||||
tooltip.orientation: StatusToolTip.Orientation.Bottom
|
||||
tooltip.y: parent.height + 12
|
||||
|
||||
onClicked: statusChatToolBar.notificationButtonClicked()
|
||||
|
||||
StatusBadge {
|
||||
@@ -171,5 +103,15 @@ Rectangle {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: popupMenuSlot
|
||||
active: !!statusChatToolBar.popupMenu
|
||||
onLoaded: {
|
||||
popupMenuSlot.item.closeHandler = function () {
|
||||
menuButton.highlighted = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -14,7 +14,6 @@ StatusListItem {
|
||||
|
||||
components: [
|
||||
StatusBadge {
|
||||
visible: statusContactRequestsListItem.requestsCount > 0
|
||||
value: statusContactRequestsListItem.requestsCount
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
border.width: 4
|
||||
|
||||
@@ -1,79 +0,0 @@
|
||||
import QtQuick 2.0
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Row {
|
||||
id: root
|
||||
|
||||
property bool isMutualContact: false
|
||||
property var trustIndicator: StatusContactVerificationIcons.TrustedType.None
|
||||
|
||||
property StatusIconSettings mutualConnectionIcon: StatusIconSettings {
|
||||
name: "tiny/tiny-contact"
|
||||
color: Theme.palette.indirectColor1
|
||||
width: dummyImage.width
|
||||
height: dummyImage.height
|
||||
background: StatusIconBackgroundSettings {
|
||||
width: 10
|
||||
height: 10
|
||||
color: Theme.palette.primaryColor1
|
||||
}
|
||||
// Only used to get implicit width and height from the actual image
|
||||
property Image dummyImage: Image {
|
||||
source: mutualConnectionIcon.name ? "../../assets/img/icons/" + mutualConnectionIcon.name + ".svg": ""
|
||||
visible: false
|
||||
}
|
||||
}
|
||||
|
||||
property StatusIconSettings trustContactIcon: StatusIconSettings {
|
||||
// None and Untrustworthy types, same aspect (Icon will not be visible in case of None type):
|
||||
name: root.trustIndicator === StatusContactVerificationIcons.TrustedType.Verified ? "tiny/tiny-checkmark" : "tiny/subtract"
|
||||
color: Theme.palette.indirectColor1
|
||||
width: dummyImage.width
|
||||
height: dummyImage.height
|
||||
background: StatusIconBackgroundSettings {
|
||||
width: 10
|
||||
height: 10
|
||||
color: root.trustIndicator === StatusContactVerificationIcons.TrustedType.Verified ? Theme.palette.primaryColor1 : Theme.palette.dangerColor1
|
||||
}
|
||||
// Only used to get implicit width and height from the actual image
|
||||
property Image dummyImage: Image {
|
||||
source: trustContactIcon.name ? "../../assets/img/icons/" + trustContactIcon.name + ".svg": ""
|
||||
visible: false
|
||||
}
|
||||
}
|
||||
|
||||
enum TrustedType {
|
||||
None, //0
|
||||
Verified, //1
|
||||
Untrustworthy //2
|
||||
}
|
||||
|
||||
spacing: 4
|
||||
visible: root.isMutualContact || (root.trustIndicator !== StatusContactVerificationIcons.TrustedType.None)
|
||||
|
||||
StatusRoundIcon {
|
||||
visible: root.isMutualContact
|
||||
icon.name: root.mutualConnectionIcon.name
|
||||
icon.width: root.mutualConnectionIcon.width
|
||||
icon.height: root.mutualConnectionIcon.height
|
||||
icon.rotation: root.mutualConnectionIcon.rotation
|
||||
icon.color: root.mutualConnectionIcon.color
|
||||
icon.background.color: root.mutualConnectionIcon.background.color
|
||||
icon.background.width: root.mutualConnectionIcon.background.width
|
||||
icon.background.height: root.mutualConnectionIcon.background.height
|
||||
}
|
||||
|
||||
StatusRoundIcon {
|
||||
visible: root.trustIndicator !== StatusContactVerificationIcons.TrustedType.None
|
||||
icon.name: root.trustContactIcon.name
|
||||
icon.width: root.trustContactIcon.width
|
||||
icon.height: root.trustContactIcon.height
|
||||
icon.rotation: root.trustContactIcon.rotation
|
||||
icon.color: root.trustContactIcon.color
|
||||
icon.background.color: root.trustContactIcon.background.color
|
||||
icon.background.width: root.trustContactIcon.background.width
|
||||
icon.background.height: root.trustContactIcon.background.height
|
||||
}
|
||||
}
|
||||
@@ -8,15 +8,12 @@ Rectangle {
|
||||
|
||||
property string title: ""
|
||||
property string subTitle: ""
|
||||
property alias subTitleComponent: statusDescriptionListItemSubTitle
|
||||
property string value: ""
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
width: 23
|
||||
height: 23
|
||||
}
|
||||
property alias tooltip: statusToolTip
|
||||
property alias iconButton: statusFlatRoundButton
|
||||
property alias sensor: sensor
|
||||
|
||||
implicitWidth: 448
|
||||
implicitHeight: 56
|
||||
@@ -24,77 +21,48 @@ Rectangle {
|
||||
|
||||
color: Theme.palette.statusListItem.backgroundColor
|
||||
|
||||
MouseArea {
|
||||
id: sensor
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
enabled: false
|
||||
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
StatusBaseText {
|
||||
id: statusDescriptionListItemTitle
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.topMargin: 5
|
||||
|
||||
StatusBaseText {
|
||||
id: statusDescriptionListItemTitle
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.topMargin: 5
|
||||
color: Theme.palette.baseColor1
|
||||
text: statusDescriptionListItem.title
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Medium
|
||||
}
|
||||
|
||||
color: Theme.palette.baseColor1
|
||||
text: statusDescriptionListItem.title
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Medium
|
||||
}
|
||||
StatusBaseText {
|
||||
id: statusDescriptionListItemSubTitle
|
||||
anchors.top: statusDescriptionListItemTitle.bottom
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.topMargin: 4
|
||||
|
||||
StatusBaseText {
|
||||
id: statusDescriptionListItemSubTitle
|
||||
anchors.top: statusDescriptionListItemTitle.bottom
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.topMargin: 4
|
||||
text: statusDescriptionListItem.subTitle
|
||||
color: Theme.palette.directColor1
|
||||
font.pixelSize: 15
|
||||
font.weight: Font.Normal
|
||||
}
|
||||
|
||||
text: statusDescriptionListItem.subTitle
|
||||
color: Theme.palette.directColor1
|
||||
font.pixelSize: 15
|
||||
font.weight: Font.Normal
|
||||
}
|
||||
StatusFlatRoundButton {
|
||||
id: statusFlatRoundButton
|
||||
visible: !!statusDescriptionListItem.icon.name
|
||||
anchors.verticalCenter: statusDescriptionListItemSubTitle.verticalCenter
|
||||
anchors.left: statusDescriptionListItemSubTitle.right
|
||||
anchors.leftMargin: 4
|
||||
|
||||
StatusFlatRoundButton {
|
||||
id: statusFlatRoundButton
|
||||
visible: !!statusDescriptionListItem.icon.name
|
||||
anchors.verticalCenter: statusDescriptionListItemSubTitle.verticalCenter
|
||||
anchors.left: statusDescriptionListItemSubTitle.right
|
||||
anchors.leftMargin: 4
|
||||
width: 32
|
||||
height: 32
|
||||
|
||||
width: 32
|
||||
height: 32
|
||||
icon.name: statusDescriptionListItem.icon.name
|
||||
icon.width: statusDescriptionListItem.icon.width
|
||||
icon.height: statusDescriptionListItem.icon.height
|
||||
|
||||
icon.name: statusDescriptionListItem.icon.name
|
||||
icon.width: statusDescriptionListItem.icon.width
|
||||
icon.height: statusDescriptionListItem.icon.height
|
||||
|
||||
StatusToolTip {
|
||||
id: statusToolTip
|
||||
}
|
||||
}
|
||||
|
||||
Row {
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
visible: !!statusDescriptionListItem.value
|
||||
spacing: 8
|
||||
|
||||
StatusBaseText {
|
||||
text: statusDescriptionListItem.value
|
||||
color: Theme.palette.baseColor1
|
||||
font.pixelSize: 15
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
StatusIcon {
|
||||
icon: "chevron-down"
|
||||
rotation: 270
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
StatusToolTip {
|
||||
id: statusToolTip
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,227 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
Rectangle {
|
||||
id: statusExpandableItem
|
||||
|
||||
property alias primaryText: primaryText.text
|
||||
property alias secondaryText: secondaryText.text
|
||||
property alias additionalText: additionalText.text
|
||||
property alias button: button
|
||||
property alias expandableComponent: expandableRegion.sourceComponent
|
||||
|
||||
property int type: StatusExpandableItem.Type.Primary
|
||||
property bool expandable: true
|
||||
property bool expanded: false
|
||||
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
width: !!statusExpandableItem.icon.name.toString() ? 24 : 40
|
||||
height: !!statusExpandableItem.icon.name.toString() ? 24 : 40
|
||||
color: Theme.palette.directColor1
|
||||
background: StatusIconBackgroundSettings {
|
||||
width: 32
|
||||
height: 32
|
||||
color: Theme.palette.primaryColor2
|
||||
}
|
||||
}
|
||||
property StatusImageSettings image: StatusImageSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
}
|
||||
|
||||
enum Type {
|
||||
Primary, // 0
|
||||
Secondary, // 1
|
||||
Tertiary // 2
|
||||
}
|
||||
|
||||
implicitWidth: 718
|
||||
|
||||
radius: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 8 : 0
|
||||
color: "transparent"
|
||||
border.color: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? Theme.palette.baseColor2 : "transparent"
|
||||
state: "COLLAPSED"
|
||||
clip: true
|
||||
|
||||
Rectangle {
|
||||
id: separatorRect
|
||||
anchors.top: parent.top
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
width: parent.width
|
||||
height: 1
|
||||
|
||||
color: Theme.palette.baseColor2
|
||||
visible: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary)
|
||||
}
|
||||
|
||||
|
||||
Rectangle {
|
||||
id: header
|
||||
anchors.top: parent.top
|
||||
width: parent.width
|
||||
height: 64
|
||||
radius: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 8 : 0
|
||||
color: statusExpandableItem.type === StatusExpandableItem.Type.Secondary && sensor.containsMouse ? Theme.palette.baseColor2 : "transparent"
|
||||
|
||||
StatusSmartIdenticon {
|
||||
id: identicon
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 12.5 : 25
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 16 : 11
|
||||
image: statusExpandableItem.image
|
||||
icon: statusExpandableItem.icon
|
||||
name: primaryText.text
|
||||
active: (statusExpandableItem.type !== StatusExpandableItem.Type.Tertiary)
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: primaryText
|
||||
anchors.top: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ||
|
||||
(statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? parent.top : undefined
|
||||
anchors.topMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? 29 : 17
|
||||
anchors.left: identicon.active ? identicon.right : parent.left
|
||||
anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 10 : 16
|
||||
|
||||
anchors.verticalCenter: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? identicon.verticalCenter : undefined
|
||||
|
||||
width: !!additionalText.text ? (button.visible ? parent.width - icon.background.width - button.width - additionalText.contentWidth - 110 :
|
||||
parent.width - icon.background.width - additionalText.contentWidth - 110) :
|
||||
(button.visible ? parent.width - icon.background.width - button.width - 70 :
|
||||
parent.width - icon.background.width - 70)
|
||||
|
||||
font.weight: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? Font.Medium : Font.Normal
|
||||
font.pixelSize: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 15 : 17
|
||||
lineHeight: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 22 : 24
|
||||
lineHeightMode: Text.FixedHeight
|
||||
elide: Text.ElideRight
|
||||
color: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? Theme.palette.baseColor1 : Theme.palette.directColor1
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: secondaryText
|
||||
anchors.top: primaryText.bottom
|
||||
anchors.topMargin: 4
|
||||
anchors.left: primaryText.left
|
||||
anchors.right: primaryText.right
|
||||
|
||||
font.pixelSize: 15
|
||||
lineHeight: 22
|
||||
lineHeightMode: Text.FixedHeight
|
||||
elide: Text.ElideRight
|
||||
color: Theme.palette.directColor3
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: additionalText
|
||||
anchors.verticalCenter: primaryText.verticalCenter
|
||||
anchors.verticalCenterOffset: 2
|
||||
anchors.right: expandImage.left
|
||||
anchors.rightMargin: 16
|
||||
|
||||
font.pixelSize: 15
|
||||
lineHeight: 24
|
||||
lineHeightMode: Text.FixedHeight
|
||||
elide: Text.ElideRight
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
|
||||
StatusButton {
|
||||
id: button
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 19
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 16
|
||||
visible: !!text
|
||||
}
|
||||
|
||||
StatusIcon {
|
||||
id: expandImage
|
||||
anchors.verticalCenter: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?
|
||||
primaryText.verticalCenter : identicon.verticalCenter
|
||||
anchors.verticalCenterOffset:(statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? -3 : -1
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: {
|
||||
switch (statusExpandableItem.type) {
|
||||
case StatusExpandableItem.Type.Primary:
|
||||
return 23
|
||||
break;
|
||||
case StatusExpandableItem.Type.Secondary:
|
||||
return 16
|
||||
break;
|
||||
default:
|
||||
return 6
|
||||
|
||||
}
|
||||
}
|
||||
visible: expandable && !button.visible
|
||||
color: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?
|
||||
Theme.palette.baseColor1 :
|
||||
Theme.palette.directColor1
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: sensor
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
if(expandable) {
|
||||
expanded = !expanded
|
||||
}
|
||||
}
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
visible: !button.visible && expandable
|
||||
hoverEnabled: true
|
||||
}
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: expandableRegion
|
||||
anchors.top: header.bottom
|
||||
anchors.topMargin: 16
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 48 : 0
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 16 : 0
|
||||
active: false
|
||||
}
|
||||
|
||||
onExpandedChanged: {
|
||||
if(expanded) {
|
||||
state = "EXPANDED"
|
||||
}
|
||||
else {
|
||||
state = "COLLAPSED"
|
||||
}
|
||||
}
|
||||
|
||||
states: [
|
||||
State {
|
||||
name: "EXPANDED"
|
||||
PropertyChanges {target: expandImage; icon: "chevron-up"}
|
||||
PropertyChanges {target: statusExpandableItem; height: 82 + expandableRegion.height + 22}
|
||||
PropertyChanges {target: expandableRegion; active: true}
|
||||
},
|
||||
State {
|
||||
name: "COLLAPSED"
|
||||
PropertyChanges {target: expandImage; icon: "chevron-down"}
|
||||
PropertyChanges {target: statusExpandableItem; height: 82}
|
||||
PropertyChanges {target: expandableRegion; active: false}
|
||||
}
|
||||
]
|
||||
|
||||
transitions: [
|
||||
Transition {
|
||||
from: "COLLAPSED"
|
||||
to: "EXPANDED"
|
||||
NumberAnimation { properties: "height"; duration: 200 }
|
||||
},
|
||||
Transition {
|
||||
from: "EXPANDED"
|
||||
to: "COLLAPSED"
|
||||
NumberAnimation { properties: "height"; duration: 200 }
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,17 +1,12 @@
|
||||
import QtQuick 2.13
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
|
||||
Rectangle {
|
||||
id: root
|
||||
id: statusLetterIdenticon
|
||||
|
||||
property alias identiconText: identiconText
|
||||
property string name
|
||||
property string emoji
|
||||
property string emojiSize
|
||||
property int letterSize: 21
|
||||
property int charactersLen: 1
|
||||
|
||||
color: Theme.palette.miscColor5
|
||||
width: 40
|
||||
@@ -19,31 +14,13 @@ Rectangle {
|
||||
radius: width / 2
|
||||
|
||||
StatusBaseText {
|
||||
id: identiconText
|
||||
|
||||
anchors.alignWhenCentered: false
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
|
||||
text: (statusLetterIdenticon.name.charAt(0) == "#" ? statusLetterIdenticon.name.charAt(1) : statusLetterIdenticon.name.charAt(0)).toUpperCase()
|
||||
font.weight: Font.Bold
|
||||
font.pixelSize: root.letterSize
|
||||
font.pixelSize: statusLetterIdenticon.letterSize
|
||||
color: Qt.rgba(255, 255, 255, 0.7)
|
||||
|
||||
text: {
|
||||
if (emoji) {
|
||||
if(Utils.isHtml(emoji))
|
||||
return emoji
|
||||
else
|
||||
return Emoji.parse(emoji, emojiSize || undefined)
|
||||
}
|
||||
|
||||
const shift = (root.name.charAt(0) === "#") ||
|
||||
(root.name.charAt(0) === "@")
|
||||
|
||||
return root.name.substring(shift, shift + charactersLen).toUpperCase()
|
||||
}
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -1,6 +1,4 @@
|
||||
import QtQuick 2.13
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Components 0.1
|
||||
@@ -9,99 +7,55 @@ import StatusQ.Controls 0.1
|
||||
Rectangle {
|
||||
id: statusListItem
|
||||
|
||||
property string itemId: ""
|
||||
property string titleId: ""
|
||||
implicitWidth: 448
|
||||
implicitHeight: 64
|
||||
|
||||
enum Type {
|
||||
Primary,
|
||||
Secondary
|
||||
}
|
||||
|
||||
color: {
|
||||
if (sensor.containsMouse) {
|
||||
return type === StatusListItem.Type.Primary ?
|
||||
Theme.palette.baseColor2 :
|
||||
Theme.palette.statusListItem.secondaryHoverBackgroundColor
|
||||
}
|
||||
return Theme.palette.statusListItem.backgroundColor
|
||||
}
|
||||
|
||||
radius: 8
|
||||
|
||||
property string title: ""
|
||||
property string titleAsideText: ""
|
||||
property string subTitle: ""
|
||||
property string tertiaryTitle: ""
|
||||
property string label: ""
|
||||
property real leftPadding: 16
|
||||
property real rightPadding: 16
|
||||
property bool enabled: true
|
||||
property bool highlighted: false
|
||||
property bool propagateTitleClicks: true
|
||||
property int type: StatusListItem.Type.Primary
|
||||
property list<Item> components
|
||||
property var bottomModel: []
|
||||
property Component bottomDelegate
|
||||
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
height: isLetterIdenticon ? 40 : 20
|
||||
width: isLetterIdenticon ? 40 : 20
|
||||
height: 20
|
||||
width: 20
|
||||
rotation: 0
|
||||
isLetterIdenticon: false
|
||||
letterSize: 21
|
||||
charactersLen: 1
|
||||
color: isLetterIdenticon ? background.color : type === StatusListItem.Type.Danger ?
|
||||
Theme.palette.dangerColor1 : Theme.palette.primaryColor1
|
||||
background: StatusIconBackgroundSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
color: {
|
||||
if (sensor.containsMouse) {
|
||||
return type === StatusListItem.Type.Secondary ||
|
||||
type === StatusListItem.Type.Danger ? "transparent" :
|
||||
Theme.palette.primaryColor3
|
||||
}
|
||||
return type === StatusListItem.Type.Danger ?
|
||||
Theme.palette.dangerColor3 : Theme.palette.primaryColor3
|
||||
}
|
||||
color: sensor.containsMouse && type === StatusListItem.Type.Secondary ?
|
||||
"transparent" :
|
||||
Theme.palette.primaryColor3
|
||||
}
|
||||
}
|
||||
property StatusImageSettings image: StatusImageSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
isIdenticon: false
|
||||
}
|
||||
property StatusIdenticonRingSettings ringSettings: StatusIdenticonRingSettings {
|
||||
initalAngleRad: 0
|
||||
ringPxSize: 1.5
|
||||
distinctiveColors: Theme.palette.identiconRingColors
|
||||
}
|
||||
property string label: ""
|
||||
|
||||
property int type: StatusListItem.Type.Primary
|
||||
|
||||
property alias sensor: sensor
|
||||
property alias badge: statusListItemBadge
|
||||
property alias statusListItemIcon: iconOrImage
|
||||
property alias statusListItemTitle: statusListItemTitle
|
||||
property alias statusListItemTitleAside: statusListItemTitleAsideText
|
||||
property alias statusListItemTitleIcons: titleIconsRow
|
||||
property alias statusListItemTitleArea: statusListItemTitleArea
|
||||
property alias statusListItemSubTitle: statusListItemSubTitle
|
||||
property alias statusListItemTertiaryTitle: statusListItemTertiaryTitle
|
||||
property alias statusListItemComponentsSlot: statusListItemComponentsSlot
|
||||
property alias statusListItemTagsSlot: statusListItemTagsSlot
|
||||
|
||||
signal clicked(string itemId)
|
||||
signal titleClicked(string titleId)
|
||||
|
||||
enum Type {
|
||||
Primary,
|
||||
Secondary,
|
||||
Danger
|
||||
}
|
||||
|
||||
implicitWidth: 448
|
||||
implicitHeight: {
|
||||
if (bottomModel.length === 0) {
|
||||
return Math.max(64, statusListItemTitleArea.height + 16)
|
||||
}
|
||||
return Math.max(64, statusListItemTitleArea.height + 90)
|
||||
}
|
||||
color: {
|
||||
if (sensor.containsMouse || statusListItem.highlighted) {
|
||||
switch(type) {
|
||||
case StatusListItem.Type.Primary:
|
||||
return Theme.palette.baseColor2
|
||||
case StatusListItem.Type.Secondary:
|
||||
return Theme.palette.statusListItem.secondaryHoverBackgroundColor
|
||||
case StatusListItem.Type.Danger:
|
||||
return Theme.palette.dangerColor3
|
||||
}
|
||||
}
|
||||
return Theme.palette.statusListItem.backgroundColor
|
||||
}
|
||||
radius: 8
|
||||
property list<Item> components
|
||||
|
||||
onComponentsChanged: {
|
||||
if (components.length) {
|
||||
@@ -114,163 +68,73 @@ Rectangle {
|
||||
MouseArea {
|
||||
id: sensor
|
||||
|
||||
enabled: statusListItem.enabled
|
||||
anchors.fill: parent
|
||||
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
hoverEnabled: true
|
||||
preventStealing: true
|
||||
|
||||
onClicked: {
|
||||
statusListItem.clicked(statusListItem.itemId)
|
||||
}
|
||||
|
||||
StatusSmartIdenticon {
|
||||
Loader {
|
||||
id: iconOrImage
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: statusListItem.leftPadding
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 12
|
||||
image: statusListItem.image
|
||||
icon: statusListItem.icon
|
||||
name: statusListItem.title
|
||||
active: statusListItem.icon.isLetterIdenticon ||
|
||||
!!statusListItem.icon.name ||
|
||||
!!statusListItem.image.source.toString()
|
||||
badge.border.color: statusListItem.color
|
||||
ringSettings: statusListItem.ringSettings
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
sourceComponent: !!statusListItem.icon.name ? statusRoundedIcon : statusRoundedImage
|
||||
active: !!statusListItem.icon.name || !!statusListItem.image.source.toString()
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusRoundedIcon
|
||||
StatusRoundIcon {
|
||||
icon.width: statusListItem.icon.width
|
||||
icon.height: statusListItem.icon.height
|
||||
icon.name: statusListItem.icon.name
|
||||
icon.rotation: statusListItem.icon.rotation
|
||||
color: statusListItem.icon.background.color
|
||||
width: statusListItem.icon.background.width
|
||||
height: statusListItem.icon.background.height
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: statusRoundedImage
|
||||
StatusRoundedImage {
|
||||
image.source: statusListItem.image.source
|
||||
image.height: statusListItem.image.height
|
||||
image.width: statusListItem.image.width
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: statusListItemTitleArea
|
||||
|
||||
function getStatusListItemTitleAnchorsRight() {
|
||||
let isIconsRowVisible = false
|
||||
if(titleIconsRow.item) {
|
||||
isIconsRowVisible = true//titleIconsRow.item.visible
|
||||
}
|
||||
return !statusListItem.titleAsideText && !isIconsRowVisible ? statusListItemTitleArea.right : undefined
|
||||
}
|
||||
|
||||
anchors.left: iconOrImage.active ? iconOrImage.right : parent.left
|
||||
anchors.right: statusListItemLabel.visible ? statusListItemLabel.left : statusListItemComponentsSlot.left
|
||||
anchors.leftMargin: iconOrImage.active ? 16 : statusListItem.leftPadding
|
||||
anchors.rightMargin: statusListItem.rightPadding
|
||||
anchors.verticalCenter: bottomModel.length === 0 ? parent.verticalCenter : undefined
|
||||
|
||||
height: childrenRect.height
|
||||
anchors.leftMargin: statusListItem.leftPadding
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
height: statusListItemTitle.height + (statusListItemSubTitle.visible ? statusListItemSubTitle.height : 0)
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemTitle
|
||||
text: statusListItem.title
|
||||
font.pixelSize: 15
|
||||
height: visible ? contentHeight : 0
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
anchors.left: parent.left
|
||||
anchors.right: !statusListItem.titleAsideText && !titleIconsRow.sourceComponent ? parent.right : undefined
|
||||
anchors.top: bottomModel.length === 0 ? undefined: parent.top
|
||||
anchors.topMargin: bottomModel.length === 0 ? undefined : 20
|
||||
color: {
|
||||
if (!statusListItem.enabled) {
|
||||
return Theme.palette.baseColor1
|
||||
}
|
||||
switch (statusListItem.type) {
|
||||
case StatusListItem.Type.Primary:
|
||||
return Theme.palette.directColor1
|
||||
case StatusListItem.Type.Secondary:
|
||||
return Theme.palette.primaryColor1
|
||||
case StatusListItem.Type.Danger:
|
||||
return Theme.palette.dangerColor1
|
||||
if (statusListItem.type === StatusListItem.Type.Primary) {
|
||||
return Theme.palette.directColor1
|
||||
}
|
||||
return Theme.palette.primaryColor1
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
enabled: statusListItem.enabled
|
||||
cursorShape: sensor.enabled && containsMouse ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
hoverEnabled: true
|
||||
propagateComposedEvents: statusListItem.propagateTitleClicks
|
||||
onClicked: {
|
||||
statusListItem.titleClicked(statusListItem.titleId)
|
||||
mouse.accepted = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemTitleAsideText
|
||||
anchors.left: statusListItemTitle.right
|
||||
anchors.leftMargin: 4
|
||||
anchors.verticalCenter: statusListItemTitle.verticalCenter
|
||||
anchors.top: bottomModel.length === 0 ? undefined: parent.top
|
||||
anchors.topMargin: bottomModel.length === 0 ? undefined : 20
|
||||
text: statusListItem.titleAsideText
|
||||
font.pixelSize: 10
|
||||
color: Theme.palette.baseColor1
|
||||
visible: !!statusListItem.titleAsideText
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: titleIconsRow
|
||||
anchors.left: !statusListItem.titleAsideText ? statusListItemTitle.right : statusListItemTitleAsideText.right
|
||||
anchors.verticalCenter: statusListItemTitle.verticalCenter
|
||||
anchors.leftMargin: 4
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemSubTitle
|
||||
anchors.top: statusListItemTitle.bottom
|
||||
width: parent.width
|
||||
|
||||
text: statusListItem.subTitle
|
||||
font.pixelSize: 15
|
||||
color: !statusListItem.enabled || !statusListItem.tertiaryTitle ? Theme.palette.baseColor1 : Theme.palette.directColor1
|
||||
height: visible ? contentHeight : 0
|
||||
visible: !!statusListItem.subTitle
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemTertiaryTitle
|
||||
anchors.top: statusListItemSubTitle.bottom
|
||||
width: parent.width
|
||||
height: visible ? contentHeight : 0
|
||||
text: statusListItem.tertiaryTitle
|
||||
color: Theme.palette.baseColor1
|
||||
font.pixelSize: 13
|
||||
visible: !!statusListItem.tertiaryTitle
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
}
|
||||
|
||||
StatusListItemBadge {
|
||||
id: statusListItemBadge
|
||||
anchors.top: statusListItemTertiaryTitle.bottom
|
||||
width: contentItem.width
|
||||
implicitHeight: visible ? 22 : 0
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Row {
|
||||
id: statusListItemTagsSlot
|
||||
anchors.topMargin: 16
|
||||
anchors.top: iconOrImage.bottom
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
width: statusListItemBadge.width
|
||||
spacing: 10
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
Repeater {
|
||||
model: bottomModel
|
||||
delegate: bottomDelegate
|
||||
visible: !!statusListItem.subTitle
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemLabel
|
||||
anchors.verticalCenter: bottomModel.length === 0 ? parent.verticalCenter : undefined
|
||||
anchors.top: bottomModel.length === 0 ? undefined: parent.top
|
||||
anchors.topMargin: bottomModel.length === 0 ? undefined : 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: statusListItemComponentsSlot.left
|
||||
anchors.rightMargin: statusListItemComponentsSlot.width > 0 ? 10 : 0
|
||||
|
||||
@@ -280,13 +144,12 @@ Rectangle {
|
||||
visible: !!statusListItem.label
|
||||
}
|
||||
|
||||
|
||||
Row {
|
||||
id: statusListItemComponentsSlot
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: statusListItem.rightPadding
|
||||
anchors.verticalCenter: bottomModel.length === 0 ? parent.verticalCenter : undefined
|
||||
anchors.top: bottomModel.length === 0 ? undefined: parent.top
|
||||
anchors.topMargin: bottomModel.length === 0 ? undefined : 12
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
spacing: 10
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,82 +0,0 @@
|
||||
import QtQuick 2.13
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Control {
|
||||
id: root
|
||||
implicitWidth: contentItem.width
|
||||
implicitHeight: visible ? 22 : 0
|
||||
visible: !!root.primaryText
|
||||
|
||||
property string primaryText: ""
|
||||
property string secondaryText: ""
|
||||
|
||||
property StatusImageSettings image: StatusImageSettings {
|
||||
height: 16
|
||||
width: 16
|
||||
isIdenticon: false
|
||||
}
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
height: 16
|
||||
width: 16
|
||||
isLetterIdenticon: false
|
||||
background: StatusIconBackgroundSettings {}
|
||||
color: "transparent"
|
||||
}
|
||||
|
||||
background: Rectangle {
|
||||
anchors.fill: parent
|
||||
color: "transparent"
|
||||
radius: 11
|
||||
border.color: Theme.palette.directColor7
|
||||
}
|
||||
|
||||
contentItem: Item {
|
||||
id: contentItem
|
||||
width: (contentItemRow.width + 10)
|
||||
height: parent.height
|
||||
RowLayout {
|
||||
id: contentItemRow
|
||||
anchors.centerIn: parent
|
||||
anchors.horizontalCenterOffset: -spacing
|
||||
spacing: 2
|
||||
StatusRoundedImage {
|
||||
implicitWidth: root.image.width
|
||||
implicitHeight: root.image.height
|
||||
visible: !root.icon.isLetterIdenticon
|
||||
image.source: root.image.source
|
||||
border.color: Theme.palette.baseColor1
|
||||
border.width: root.image.isIdenticon ? 1 : 0
|
||||
}
|
||||
StatusLetterIdenticon {
|
||||
implicitWidth: root.icon.width
|
||||
implicitHeight: root.icon.width
|
||||
letterSize: 11
|
||||
visible: root.icon.isLetterIdenticon
|
||||
color: root.icon.color
|
||||
name: root.primaryText
|
||||
emoji: root.icon.emoji
|
||||
emojiSize: root.icon.emojiSize
|
||||
}
|
||||
StatusBaseText {
|
||||
font.weight: Font.Medium
|
||||
color: Theme.palette.baseColor1
|
||||
text: root.primaryText
|
||||
}
|
||||
StatusIcon {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
visible: !!root.secondaryText
|
||||
color: Theme.palette.baseColor1
|
||||
icon: "next"
|
||||
}
|
||||
StatusBaseText {
|
||||
font.weight: Font.Medium
|
||||
color: Theme.palette.baseColor1
|
||||
visible: !!root.secondaryText
|
||||
text: root.secondaryText
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,81 +0,0 @@
|
||||
import QtQuick 2.13
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Rectangle {
|
||||
id: root
|
||||
width: layout.width
|
||||
height: 30
|
||||
color: Theme.palette.primaryColor3
|
||||
radius: 15
|
||||
|
||||
property alias titleText: titleText
|
||||
|
||||
property string title: ""
|
||||
property bool closeButtonVisible: true
|
||||
signal clicked()
|
||||
|
||||
property StatusImageSettings image: StatusImageSettings {
|
||||
width: 20
|
||||
height: 20
|
||||
isIdenticon: false
|
||||
}
|
||||
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
height: 20
|
||||
width: 20
|
||||
rotation: 0
|
||||
isLetterIdenticon: false
|
||||
letterSize: 10
|
||||
color: Theme.palette.primaryColor1
|
||||
background: StatusIconBackgroundSettings {
|
||||
width: 15
|
||||
height: 15
|
||||
color: Theme.palette.primaryColor3
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: layout
|
||||
|
||||
height: parent.height
|
||||
spacing: 5
|
||||
|
||||
StatusSmartIdenticon {
|
||||
id: iconOrImage
|
||||
Layout.leftMargin: 5
|
||||
image: root.image
|
||||
icon: root.icon
|
||||
name: root.title
|
||||
active: root.icon.isLetterIdenticon ||
|
||||
!!root.icon.name ||
|
||||
!!root.image.source.toString()
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: titleText
|
||||
color: Theme.palette.primaryColor1
|
||||
text: root.title
|
||||
Layout.rightMargin: closeButtonVisible ? 0 : 5
|
||||
}
|
||||
|
||||
StatusIcon {
|
||||
id: closeIcon
|
||||
color: Theme.palette.primaryColor1
|
||||
icon: "close-circle"
|
||||
visible: closeButtonVisible
|
||||
Layout.rightMargin: 5
|
||||
MouseArea {
|
||||
id: mouseArea
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: {
|
||||
root.clicked()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
import QtQuick 2.0
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Core 0.1
|
||||
|
||||
|
||||
StatusListItem {
|
||||
id: root
|
||||
|
||||
property string nickName: ""
|
||||
property string userName: ""
|
||||
property string chatKey: ""
|
||||
property bool isMutualContact: false
|
||||
property var trustIndicator: StatusContactVerificationIcons.TrustedType.None
|
||||
property bool isOnline: false
|
||||
|
||||
// Subtitle composition:
|
||||
function composeSubtitile() {
|
||||
var compose = ""
|
||||
if(root.userName !== "")
|
||||
compose = "(" + root.userName + ")"
|
||||
|
||||
if(compose !== "" && root.chatKey !== "")
|
||||
// Composition
|
||||
compose += " • " + composeShortKeyChat(root.chatKey)
|
||||
|
||||
else if(root.chatKey !== "")
|
||||
compose = composeShortKeyChat(root.chatKey)
|
||||
|
||||
return compose
|
||||
}
|
||||
|
||||
// Short keychat composition:
|
||||
function composeShortKeyChat(chatKey) {
|
||||
return chatKey.substring(0, 5) + "..." + chatKey.substring(chatKey.length - 3)
|
||||
}
|
||||
|
||||
// root object settings:
|
||||
title: root.nickName
|
||||
statusListItemTitleIcons.sourceComponent: StatusContactVerificationIcons {
|
||||
isMutualContact: root.isMutualContact
|
||||
trustIndicator: root.trustIndicator
|
||||
}
|
||||
subTitle: composeSubtitile()
|
||||
statusListItemSubTitle.font.pixelSize: 10
|
||||
icon.isLetterIdenticon: !root.image.source.toString()
|
||||
statusListItemIcon.badge.visible: true
|
||||
statusListItemIcon.badge.color: root.isOnline ? Theme.palette.successColor1 : Theme.palette.baseColor1
|
||||
color: sensor.containsMouse ? Theme.palette.baseColor2 : Theme.palette.baseColor4
|
||||
|
||||
// Default sizes / positions by design
|
||||
implicitWidth: 256
|
||||
implicitHeight: Math.max(56, statusListItemTitleArea.height + leftPadding)
|
||||
leftPadding: 8
|
||||
image.width: 32
|
||||
image.height: 32
|
||||
icon.width: 32
|
||||
icon.height: 32
|
||||
statusListItemIcon.anchors.verticalCenter: sensor.verticalCenter
|
||||
statusListItemIcon.anchors.top: undefined
|
||||
statusListItemIcon.badge.border.width: 2
|
||||
statusListItemIcon.badge.implicitHeight: 12 // 8 px + 2 px * 2 borders
|
||||
statusListItemIcon.badge.implicitWidth: 12 // 8 px + 2 px * 2 borders
|
||||
}
|
||||
@@ -1,200 +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 "./private/statusMessage"
|
||||
|
||||
Rectangle {
|
||||
id: statusMessage
|
||||
|
||||
enum ContentType {
|
||||
Unknown = 0,
|
||||
Text = 1,
|
||||
Emoji = 2,
|
||||
Image = 3,
|
||||
Sticker = 4,
|
||||
Audio = 5,
|
||||
Transaction = 6,
|
||||
Invitation = 7
|
||||
}
|
||||
|
||||
property alias messageHeader: messageHeader
|
||||
property alias quickActions:quickActionsPanel.quickActions
|
||||
property alias statusChatInput: editComponent.inputComponent
|
||||
property alias linksComponent: linksLoader.sourceComponent
|
||||
property alias footerComponent: footer.sourceComponent
|
||||
property alias timestamp: messageHeader.timestamp
|
||||
|
||||
property string resendText: ""
|
||||
property string cancelButtonText: ""
|
||||
property string saveButtonText: ""
|
||||
property string loadingImageText: ""
|
||||
property string errorLoadingImageText: ""
|
||||
property string audioMessageInfoText: ""
|
||||
property string pinnedMsgInfoText: ""
|
||||
|
||||
property bool isAppWindowActive: false
|
||||
property bool editMode: false
|
||||
property bool isAReply: false
|
||||
property StatusMessageDetails messageDetails: StatusMessageDetails {}
|
||||
property StatusMessageDetails replyDetails: StatusMessageDetails {}
|
||||
|
||||
signal profilePictureClicked()
|
||||
signal senderNameClicked()
|
||||
signal editCompleted(var newMsgText)
|
||||
signal replyProfileClicked()
|
||||
signal stickerLoaded()
|
||||
signal imageClicked(var imageSource)
|
||||
signal resendClicked()
|
||||
|
||||
height: childrenRect.height
|
||||
color: hoverHandler.hovered ? (messageDetails.hasMention ? Theme.palette.mentionColor3 : messageDetails.isPinned ? Theme.palette.pinColor2 : Theme.palette.baseColor2) : messageDetails.hasMention ? Theme.palette.mentionColor4 : messageDetails.isPinned ? Theme.palette.pinColor3 : "transparent"
|
||||
|
||||
HoverHandler {
|
||||
id: hoverHandler
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
id: messageLayout
|
||||
width: parent.width
|
||||
StatusMessageReply {
|
||||
Layout.fillWidth: true
|
||||
visible: isAReply
|
||||
replyDetails: statusMessage.replyDetails
|
||||
onReplyProfileClicked: statusMessage.replyProfileClicked()
|
||||
audioMessageInfoText: statusMessage.audioMessageInfoText
|
||||
}
|
||||
RowLayout {
|
||||
spacing: 8
|
||||
Layout.fillWidth: true
|
||||
StatusSmartIdenticon {
|
||||
id: profileImage
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.topMargin: 10
|
||||
Layout.leftMargin: 16
|
||||
image: messageDetails.profileImage
|
||||
name: messageHeader.displayName
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
anchors.fill: parent
|
||||
onClicked: statusMessage.profilePictureClicked()
|
||||
}
|
||||
}
|
||||
Column {
|
||||
spacing: 4
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.topMargin: 10
|
||||
Layout.fillWidth: true
|
||||
StatusPinMessageDetails {
|
||||
visible: messageDetails.isPinned && !editMode
|
||||
pinnedMsgInfoText: statusMessage.pinnedMsgInfoText
|
||||
pinnedBy: messageDetails.pinnedBy
|
||||
}
|
||||
StatusMessageHeader {
|
||||
id: messageHeader
|
||||
width: parent.width
|
||||
displayName: messageDetails.displayName
|
||||
secondaryName: messageDetails.secondaryName
|
||||
tertiaryDetail: messageDetails.chatID
|
||||
isMutualContact: messageDetails.isMutualContact
|
||||
trustIndicator: messageDetails.trustIndicator
|
||||
resendText: statusMessage.resendText
|
||||
showResendButton: messageDetails.hasExpired && messageDetails.amISender
|
||||
onClicked: statusMessage.senderNameClicked()
|
||||
onResendClicked: statusMessage.resendClicked()
|
||||
visible: !editMode
|
||||
}
|
||||
Loader {
|
||||
active: !editMode && !!messageDetails.messageText
|
||||
width: parent.width
|
||||
visible: active
|
||||
sourceComponent: StatusTextMessage {
|
||||
width: parent.width
|
||||
textField.text: messageDetails.messageText
|
||||
}
|
||||
}
|
||||
Loader {
|
||||
active: messageDetails.contentType === StatusMessage.ContentType.Image && !editMode
|
||||
visible: active
|
||||
sourceComponent: StatusImageMessage {
|
||||
source: messageDetails.contentType === StatusMessage.ContentType.Image ? messageDetails.messageContent : ""
|
||||
onClicked: statusMessage.imageClicked()
|
||||
shapeType: messageDetails.amISender ? StatusImageMessage.ShapeType.RIGHT_ROUNDED : StatusImageMessage.ShapeType.LEFT_ROUNDED
|
||||
}
|
||||
}
|
||||
StatusSticker {
|
||||
visible: messageDetails.contentType === StatusMessage.ContentType.Sticker && !editMode
|
||||
image.source: messageDetails.messageContent
|
||||
onLoaded: statusMessage.stickerLoaded()
|
||||
}
|
||||
Loader {
|
||||
active: messageDetails.contentType === StatusMessage.ContentType.Audio && !editMode
|
||||
visible: active
|
||||
sourceComponent: StatusAudioMessage {
|
||||
audioSource: messageDetails.messageContent
|
||||
hovered: hoverHandler.hovered
|
||||
audioMessageInfoText: statusMessage.audioMessageInfoText
|
||||
}
|
||||
}
|
||||
Loader {
|
||||
id: linksLoader
|
||||
active: !!linksLoader.sourceComponent
|
||||
visible: active
|
||||
}
|
||||
Loader {
|
||||
id: transactionBubbleLoader
|
||||
active: messageDetails.contentType === StatusMessage.ContentType.Transaction && !editMode
|
||||
visible: active
|
||||
}
|
||||
Loader {
|
||||
id: invitationBubbleLoader
|
||||
active: messageDetails.contentType === StatusMessage.ContentType.Invitation && !editMode
|
||||
visible: active
|
||||
}
|
||||
StatusEditMessage {
|
||||
id: editComponent
|
||||
width: parent.width
|
||||
msgText: messageDetails.messageText
|
||||
visible: editMode
|
||||
saveButtonText: statusMessage.saveButtonText
|
||||
cancelButtonText: statusMessage.cancelButtonText
|
||||
onCancelEditClicked: editMode = false
|
||||
onEditCompleted: {
|
||||
editMode = false
|
||||
statusMessage.editCompleted(newMsgText)
|
||||
}
|
||||
}
|
||||
StatusBaseText {
|
||||
id: retryLbl
|
||||
color: Theme.palette.dangerColor1
|
||||
text: statusMessage.resendText
|
||||
font.pixelSize: 12
|
||||
visible: messageDetails.hasExpired && messageDetails.amISender && !messageDetails.timestamp && !editMode
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
onClicked: statusMessage.resendClicked()
|
||||
}
|
||||
}
|
||||
Loader {
|
||||
id: footer
|
||||
active: sourceComponent && !editMode
|
||||
visible: active
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusMessageQuickActions {
|
||||
id: quickActionsPanel
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 20
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: -8
|
||||
visible: hoverHandler.hovered && !editMode
|
||||
}
|
||||
}
|
||||
@@ -1,29 +0,0 @@
|
||||
import QtQuick 2.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
|
||||
QtObject {
|
||||
id: msgDetails
|
||||
|
||||
property bool amISender: false
|
||||
property string displayName: ""
|
||||
property string secondaryName: ""
|
||||
property string chatID: ""
|
||||
property StatusImageSettings profileImage: StatusImageSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
}
|
||||
property bool isEdited: false
|
||||
property string messageText: ""
|
||||
property int contentType: 0
|
||||
property string messageContent: ""
|
||||
property bool isMutualContact: false
|
||||
property var trustIndicator: StatusContactVerificationIcons.TrustedType.None
|
||||
property bool hasMention: false
|
||||
property bool isPinned: false
|
||||
property string pinnedBy: ""
|
||||
property bool hasExpired: false
|
||||
property string timestamp: ""
|
||||
}
|
||||
|
||||
|
||||
@@ -6,6 +6,7 @@ import StatusQ.Components 0.1
|
||||
StatusListItem {
|
||||
id: statusNavigationListItem
|
||||
|
||||
signal clicked(var mouse)
|
||||
property bool selected: false
|
||||
property alias badge: statusBadge
|
||||
|
||||
@@ -16,7 +17,6 @@ StatusListItem {
|
||||
icon.background.height: 20
|
||||
icon.background.color: "transparent"
|
||||
|
||||
statusListItemIcon.anchors.topMargin: 14
|
||||
|
||||
color: {
|
||||
if (selected) {
|
||||
|
||||
@@ -9,7 +9,6 @@ Rectangle {
|
||||
width: 24
|
||||
height: 24
|
||||
rotation: 0
|
||||
color: Theme.palette.primaryColor1
|
||||
background: StatusIconBackgroundSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
@@ -30,7 +29,7 @@ Rectangle {
|
||||
width: statusRoundedIcon.icon.width
|
||||
height: statusRoundedIcon.icon.height
|
||||
|
||||
color: statusRoundedIcon.icon.color
|
||||
color: Theme.palette.primaryColor1
|
||||
icon: statusRoundedIcon.icon.name
|
||||
rotation: statusRoundedIcon.icon.rotation
|
||||
}
|
||||
|
||||
@@ -1,113 +0,0 @@
|
||||
import QtQuick 2.13
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
Loader {
|
||||
id: statusSmartIdenticon
|
||||
|
||||
property string name: ""
|
||||
property int dZ: 100
|
||||
|
||||
// Badge color properties must be set if badgeItem.visible = true
|
||||
property alias badge: statusBadge
|
||||
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
charactersLen: 1
|
||||
}
|
||||
|
||||
property StatusImageSettings image: StatusImageSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
}
|
||||
|
||||
property StatusIdenticonRingSettings ringSettings: StatusIdenticonRingSettings {
|
||||
initalAngleRad: 0
|
||||
ringPxSize: 1.5
|
||||
distinctiveColors: Theme.palette.identiconRingColors
|
||||
}
|
||||
|
||||
sourceComponent: statusSmartIdenticon.icon.isLetterIdenticon ? letterIdenticon :
|
||||
!!statusSmartIdenticon.image.source.toString() ? roundedImage :
|
||||
!!statusSmartIdenticon.icon.name.toString() ? roundedIcon : letterIdenticon
|
||||
|
||||
Component {
|
||||
id: roundedImage
|
||||
Item {
|
||||
width: statusSmartIdenticon.image.width
|
||||
height: statusSmartIdenticon.image.height
|
||||
StatusRoundedImage {
|
||||
id: statusRoundImage
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
image.source: statusSmartIdenticon.image.source
|
||||
showLoadingIndicator: true
|
||||
border.width: statusSmartIdenticon.image.isIdenticon ? 1 : 0
|
||||
border.color: Theme.palette.directColor7
|
||||
color: statusSmartIdenticon.image.isIdenticon ?
|
||||
Theme.palette.statusRoundedImage.backgroundColor :
|
||||
"transparent"
|
||||
}
|
||||
Loader {
|
||||
anchors.centerIn: parent
|
||||
active: statusRoundImage.image.status === Image.Error
|
||||
sourceComponent: letterIdenticon
|
||||
onLoaded: {
|
||||
item.color = Theme.palette.miscColor5
|
||||
item.width = statusSmartIdenticon.image.width
|
||||
item.height = statusSmartIdenticon.image.height
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: roundedIcon
|
||||
StatusRoundIcon {
|
||||
icon.background.width: statusSmartIdenticon.icon.background.width
|
||||
icon.background.height: statusSmartIdenticon.icon.background.height
|
||||
icon.background.color: statusSmartIdenticon.icon.background.color
|
||||
icon.width: statusSmartIdenticon.icon.width
|
||||
icon.height: statusSmartIdenticon.icon.height
|
||||
icon.name: statusSmartIdenticon.icon.name
|
||||
icon.rotation: statusSmartIdenticon.icon.rotation
|
||||
icon.color: statusSmartIdenticon.icon.color
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: letterIdenticon
|
||||
StatusLetterIdenticon {
|
||||
width: statusSmartIdenticon.icon.width
|
||||
height: statusSmartIdenticon.icon.height
|
||||
color: statusSmartIdenticon.icon.color
|
||||
name: statusSmartIdenticon.name
|
||||
emoji: statusSmartIdenticon.icon.emoji
|
||||
emojiSize: statusSmartIdenticon.icon.emojiSize
|
||||
letterSize: statusSmartIdenticon.icon.letterSize
|
||||
identiconText.color: statusSmartIdenticon.icon.textColor
|
||||
charactersLen: statusSmartIdenticon.icon.charactersLen
|
||||
}
|
||||
}
|
||||
|
||||
// Next components are painted above main sourceComponent
|
||||
StatusIdenticonRing {
|
||||
settings: statusSmartIdenticon.ringSettings
|
||||
anchors.fill: parent
|
||||
z: statusSmartIdenticon.dZ/2
|
||||
}
|
||||
|
||||
// State component
|
||||
StatusBadge {
|
||||
id: statusBadge
|
||||
visible: false
|
||||
anchors.bottom: statusSmartIdenticon.bottom
|
||||
anchors.right: statusSmartIdenticon.right
|
||||
border.width: 3
|
||||
implicitHeight: 15
|
||||
implicitWidth: 15
|
||||
z: statusSmartIdenticon.dZ
|
||||
}
|
||||
}
|
||||
@@ -1,285 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.12
|
||||
import QtQuick.Controls 2.14
|
||||
import QtGraphicalEffects 1.0
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Item {
|
||||
id: root
|
||||
|
||||
implicitWidth: 448
|
||||
implicitHeight: 44 + ((userListView.count > 0) ? 44 + ((((userListView.count * 64) > root.maxHeight)
|
||||
? root.maxHeight : (userListView.count * 64))) :0)
|
||||
|
||||
property real maxHeight
|
||||
property alias textEdit: edit
|
||||
property alias text: edit.text
|
||||
property string warningText: ""
|
||||
property string toLabelText: ""
|
||||
property string listLabel: ""
|
||||
property int nameCountLimit: 5
|
||||
|
||||
property ListModel sortedList: ListModel { }
|
||||
property ListModel namesModel: ListModel { }
|
||||
|
||||
function find(model, criteria) {
|
||||
for (var i = 0; i < model.count; ++i) if (criteria(model.get(i))) return model.get(i);
|
||||
return null;
|
||||
}
|
||||
|
||||
function insertTag(name, id) {
|
||||
if (!find(namesModel, function(item) { return item.publicId === id }) && namesModel.count < root.nameCountLimit) {
|
||||
namesModel.insert(namesModel.count, {"name": name, "publicId": id});
|
||||
addMember(id);
|
||||
edit.clear();
|
||||
}
|
||||
}
|
||||
|
||||
function sortModel(inputModel) {
|
||||
sortedList.clear();
|
||||
if (text !== "") {
|
||||
for (var i = 0; i < inputModel.count; i++ ) {
|
||||
var entry = inputModel.get(i);
|
||||
if (entry.name.toLowerCase().includes(text.toLowerCase())) {
|
||||
sortedList.insert(sortedList.count, {"publicId": entry.publicId, "name": entry.name,
|
||||
"icon": entry.icon, "isIdenticon": entry.isIdenticon,
|
||||
"onlineStatus": entry.onlineStatus});
|
||||
userListView.model = sortedList;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
userListView.model = inputModel;
|
||||
}
|
||||
}
|
||||
|
||||
signal addMember(string memberId)
|
||||
signal removeMember(string memberId)
|
||||
|
||||
Rectangle {
|
||||
id: tagSelectorRect
|
||||
width: parent.width
|
||||
height: 44
|
||||
radius: 8
|
||||
color: Theme.palette.baseColor2
|
||||
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
anchors.leftMargin: 16
|
||||
anchors.rightMargin: 16
|
||||
spacing: 8
|
||||
StatusBaseText {
|
||||
Layout.preferredWidth: 22
|
||||
Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
|
||||
color: Theme.palette.baseColor1
|
||||
text: root.toLabelText
|
||||
}
|
||||
|
||||
ScrollView {
|
||||
Layout.preferredWidth: (namesList.contentWidth > (parent.width - 142)) ?
|
||||
(parent.width - 142) : namesList.contentWidth
|
||||
implicitHeight: 30
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
visible: (namesList.count > 0)
|
||||
contentWidth: namesList.contentWidth
|
||||
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
|
||||
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
||||
clip: true
|
||||
ListView {
|
||||
id: namesList
|
||||
anchors.fill: parent
|
||||
model: namesModel
|
||||
orientation: ListView.Horizontal
|
||||
spacing: 8
|
||||
onCountChanged: {
|
||||
contentX = contentWidth;
|
||||
}
|
||||
delegate: Rectangle {
|
||||
id: nameDelegate
|
||||
width: (nameText.contentWidth + 34)
|
||||
height: 30
|
||||
color: mouseArea.containsMouse ? Theme.palette.miscColor1 : Theme.palette.primaryColor1
|
||||
radius: 8
|
||||
StatusBaseText {
|
||||
id: nameText
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 8
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
color: Theme.palette.indirectColor1
|
||||
text: name
|
||||
}
|
||||
StatusIcon {
|
||||
anchors.left: nameText.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
color: Theme.palette.indirectColor1
|
||||
icon: "close"
|
||||
}
|
||||
MouseArea {
|
||||
id: mouseArea
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: {
|
||||
removeMember(publicId);
|
||||
namesModel.remove(index, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
TextEdit {
|
||||
id: edit
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 44
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
visible: (namesModel.count < 5)
|
||||
enabled: visible
|
||||
focus: true
|
||||
font.pixelSize: 15
|
||||
font.family: Theme.palette.baseFont.name
|
||||
color: Theme.palette.directColor1
|
||||
Keys.onPressed: {
|
||||
if ((event.key === Qt.Key_Backspace || event.key === Qt.Key_Escape)
|
||||
&& getText(cursorPosition, (cursorPosition-1)) === "") {
|
||||
removeMember(namesModel.get(namesList.count-1).publicId);
|
||||
namesModel.remove((namesList.count-1), 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: warningTextLabel
|
||||
visible: (namesModel.count === root.nameCountLimit)
|
||||
Layout.preferredWidth: 120
|
||||
Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
|
||||
font.pixelSize: 10
|
||||
color: Theme.palette.dangerColor1
|
||||
text: root.nameCountLimit + " " + root.warningText
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: contactsLabel
|
||||
font.pixelSize: 15
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 8
|
||||
anchors.top: tagSelectorRect.bottom
|
||||
anchors.topMargin: 32
|
||||
visible: (namesModel.count === 0)
|
||||
color: Theme.palette.baseColor1
|
||||
text: root.listLabel
|
||||
}
|
||||
|
||||
Control {
|
||||
id: suggestionsContainer
|
||||
width: 360
|
||||
anchors {
|
||||
top: (root.sortedList.count > 0) ? tagSelectorRect.bottom : contactsLabel.bottom
|
||||
topMargin: 8//Style.current.padding
|
||||
bottom: parent.bottom
|
||||
bottomMargin: 20//Style.current.bigPadding
|
||||
}
|
||||
visible: ((root.namesModel.count === 0) || (root.sortedList.count > 0))
|
||||
x: ((root.namesModel.count > 0) && ((edit.x + 8) <= (root.width - suggestionsContainer.width)))
|
||||
? (edit.x + 8) : 0
|
||||
background: Rectangle {
|
||||
id: bgRect
|
||||
anchors.fill: parent
|
||||
visible: (root.sortedList.count > 0)
|
||||
color: Theme.palette.statusPopupMenu.backgroundColor
|
||||
radius: 8
|
||||
layer.enabled: true
|
||||
layer.effect: DropShadow {
|
||||
width: bgRect.width
|
||||
height: bgRect.height
|
||||
x: bgRect.x
|
||||
source: bgRect
|
||||
horizontalOffset: 0
|
||||
verticalOffset: 4
|
||||
radius: 12
|
||||
samples: 25
|
||||
spread: 0.2
|
||||
color: Theme.palette.dropShadow
|
||||
}
|
||||
}
|
||||
contentItem: ListView {
|
||||
id: userListView
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 8
|
||||
anchors.bottomMargin: 8
|
||||
clip: true
|
||||
ScrollBar.vertical: ScrollBar {
|
||||
policy: ScrollBar.AsNeeded
|
||||
}
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
delegate: Item {
|
||||
id: wrapper
|
||||
anchors.right: parent.right
|
||||
anchors.left: parent.left
|
||||
height: 64
|
||||
property bool hovered: false
|
||||
Rectangle {
|
||||
id: rectangle
|
||||
anchors.fill: parent
|
||||
anchors.rightMargin: 8
|
||||
anchors.leftMargin: 8
|
||||
radius: 8
|
||||
visible: (root.sortedList.count > 0)
|
||||
color: (wrapper.hovered) ? Theme.palette.baseColor2 : "transparent"
|
||||
}
|
||||
|
||||
StatusSmartIdenticon {
|
||||
id: contactImage
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16//Style.current.padding
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
name: model.name
|
||||
icon: StatusIconSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
letterSize: 15
|
||||
}
|
||||
image: StatusImageSettings {
|
||||
width: 40
|
||||
height: 40
|
||||
source: model.icon
|
||||
isIdenticon: model.isIdenticon
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: contactInfo
|
||||
text: model.name
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 8
|
||||
anchors.left: contactImage.right
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
elide: Text.ElideRight
|
||||
color: Theme.palette.directColor1
|
||||
font.weight: Font.Medium
|
||||
font.pixelSize: 15
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onEntered: {
|
||||
wrapper.hovered = true;
|
||||
}
|
||||
onExited: {
|
||||
wrapper.hovered = false;
|
||||
}
|
||||
onClicked: {
|
||||
root.insertTag(model.name, model.publicId);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,182 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
|
||||
import QtGraphicalEffects 1.13
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Control {
|
||||
id: root
|
||||
width: 343
|
||||
height: !!secondaryText ? 68 : 48
|
||||
anchors.right: parent.right
|
||||
|
||||
property bool open: false
|
||||
property string primaryText: ""
|
||||
property string secondaryText: ""
|
||||
property bool loading: false
|
||||
property string iconName: ""
|
||||
property string linkUrl: ""
|
||||
|
||||
property StatusIconSettings icon: StatusIconSettings {
|
||||
width: 23
|
||||
height: 23
|
||||
}
|
||||
|
||||
property int type: StatusToastMessage.Type.Default
|
||||
enum Type {
|
||||
Default,
|
||||
Success
|
||||
}
|
||||
|
||||
function open(title, subTitle, iconName, type, loading, url) {
|
||||
root.primaryText = title;
|
||||
root.secondaryText = subTitle;
|
||||
root.icon.name = iconName;
|
||||
root.type = type;
|
||||
root.loading = loading;
|
||||
root.linkUrl = url;
|
||||
root.open = true;
|
||||
}
|
||||
|
||||
signal close()
|
||||
signal linkActivated(var link)
|
||||
|
||||
states: [
|
||||
State {
|
||||
name: "opened"
|
||||
when: root.open
|
||||
PropertyChanges {
|
||||
target: root
|
||||
anchors.rightMargin: 0
|
||||
opacity: 1.0
|
||||
}
|
||||
},
|
||||
State {
|
||||
name: "closed"
|
||||
when: !root.open
|
||||
PropertyChanges {
|
||||
target: root
|
||||
anchors.rightMargin: -width
|
||||
opacity: 0.0
|
||||
}
|
||||
StateChangeScript {
|
||||
script: { root.close(); }
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
transitions: [
|
||||
Transition {
|
||||
to: "*"
|
||||
NumberAnimation { properties: "anchors.rightMargin,opacity"; duration: 400 }
|
||||
}
|
||||
]
|
||||
|
||||
background: Rectangle {
|
||||
id: background
|
||||
anchors.fill: parent
|
||||
color: Theme.palette.statusToastMessage.backgroundColor
|
||||
radius: 8
|
||||
border.color: Theme.palette.baseColor2
|
||||
layer.enabled: true
|
||||
layer.effect: DropShadow {
|
||||
verticalOffset: 3
|
||||
radius: 8
|
||||
samples: 15
|
||||
fast: true
|
||||
cached: true
|
||||
color: Theme.palette.dropShadow
|
||||
}
|
||||
}
|
||||
|
||||
contentItem: Item {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 4
|
||||
height: parent.height
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onMouseXChanged: {
|
||||
root.open = (mouseX < (root.width/3));
|
||||
}
|
||||
}
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
spacing: 16
|
||||
Rectangle {
|
||||
implicitWidth: 32
|
||||
implicitHeight: 32
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
radius: (root.width/2)
|
||||
color: (root.type === StatusToastMessage.Type.Success) ?
|
||||
Theme.palette.successColor2 : Theme.palette.primaryColor3
|
||||
Loader {
|
||||
anchors.centerIn: parent
|
||||
sourceComponent: root.loading ? loadingInd : statusIcon
|
||||
Component {
|
||||
id: loadingInd
|
||||
StatusLoadingIndicator {
|
||||
color: (root.type === StatusToastMessage.Type.Success) ?
|
||||
Theme.palette.successColor1 : Theme.palette.primaryColor1
|
||||
}
|
||||
}
|
||||
Component {
|
||||
id: statusIcon
|
||||
StatusIcon {
|
||||
anchors.centerIn: parent
|
||||
width: root.icon.width
|
||||
height: root.icon.height
|
||||
color: (root.type === StatusToastMessage.Type.Success) ?
|
||||
Theme.palette.successColor1 : Theme.palette.primaryColor1
|
||||
icon: root.icon.name
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Column {
|
||||
Layout.fillWidth: true
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
StatusBaseText {
|
||||
width: parent.width
|
||||
font.pixelSize: 13
|
||||
color: Theme.palette.directColor1
|
||||
elide: Text.ElideRight
|
||||
text: root.primaryText
|
||||
}
|
||||
StatusBaseText {
|
||||
width: parent.width
|
||||
visible: (!root.linkUrl && !!root.secondaryText)
|
||||
height: visible ? contentHeight : 0
|
||||
font.pixelSize: 13
|
||||
color: Theme.palette.baseColor1
|
||||
text: root.secondaryText
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
StatusSelectableText {
|
||||
visible: (!!root.linkUrl)
|
||||
height: visible ? implicitHeight : 0
|
||||
font.pixelSize: 13
|
||||
hoveredLinkColor: Theme.palette.primaryColor1
|
||||
text: "<p><a style=\"text-decoration:none\" href=\'" + root.linkUrl + " \'>" + root.secondaryText + "</a></p>"
|
||||
onLinkActivated: {
|
||||
root.linkActivated(root.linkUrl);
|
||||
}
|
||||
}
|
||||
}
|
||||
StatusFlatRoundButton {
|
||||
type: StatusFlatRoundButton.Type.Secondary
|
||||
icon.name: "close"
|
||||
icon.color: Theme.palette.directColor1
|
||||
implicitWidth: 30
|
||||
implicitHeight: 30
|
||||
onClicked: {
|
||||
root.open = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,78 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Layouts 1.12
|
||||
import QtQuick.Controls 2.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Item {
|
||||
id: wizardWrapper
|
||||
width: parent.width
|
||||
height: 56
|
||||
property ListModel stepsModel: ListModel { }
|
||||
|
||||
ListView {
|
||||
id: repeat
|
||||
width: childrenRect.width
|
||||
height: parent.height
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
orientation: ListView.Horizontal
|
||||
model: stepsModel
|
||||
delegate: Item {
|
||||
id: wrapperItem
|
||||
width: (index === 0) ? descriptionLabel.contentWidth : (wizardWrapper.width / repeat.count)
|
||||
height: 56
|
||||
onXChanged: {
|
||||
//as x changes while delegates are created, direct assignment doesn't work
|
||||
x = (index === (repeat.count-1)) ? (width+32) : (label.width/2) + 8
|
||||
}
|
||||
StatusProgressBar {
|
||||
id: barBorder
|
||||
width: visible ? (parent.width - (label.width/2 + 24)) : 0
|
||||
height: visible ? 8 : 0
|
||||
visible: (index > 0)
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.verticalCenterOffset: -12
|
||||
from: 0
|
||||
//TODO what is to: here?
|
||||
to: 2000
|
||||
value: loadingTime
|
||||
backgroundColor: "transparent"
|
||||
backgroundBorderColor: Theme.palette.primaryColor1
|
||||
fillColor: Theme.palette.primaryColor1
|
||||
}
|
||||
Item {
|
||||
id: label
|
||||
width: descriptionLabel.contentWidth
|
||||
height: 56
|
||||
anchors.left: (index > 0) ? barBorder.right : parent.left
|
||||
anchors.leftMargin: (index > 0) ? -((width/2) - 24) : 0
|
||||
Rectangle {
|
||||
width: 32
|
||||
height: 32
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
radius: width/2
|
||||
color: stepCompleted ? Theme.palette.primaryColor1 : "transparent"
|
||||
border.color: (stepCompleted && (barBorder.visible ? (barBorder.value === barBorder.to) : true))
|
||||
? "transparent" : Theme.palette.primaryColor1
|
||||
border.width: 2
|
||||
StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: index+1
|
||||
font.pixelSize: 17
|
||||
color: (stepCompleted && (barBorder.visible ? (barBorder.value === barBorder.to) : true))
|
||||
? Theme.palette.indirectColor1 : Theme.palette.primaryColor1
|
||||
}
|
||||
}
|
||||
StatusBaseText {
|
||||
id: descriptionLabel
|
||||
anchors.bottom: parent.bottom
|
||||
text: description
|
||||
color: Theme.palette.directColor1
|
||||
font.pixelSize: 13
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,143 +0,0 @@
|
||||
import QtQuick 2.3
|
||||
import QtMultimedia 5.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
// To-do update as per latest design -> Audio graphs. Also the player should ideally be in the BE?
|
||||
Rectangle {
|
||||
id: audioChatMessage
|
||||
|
||||
property string audioMessageInfoText: ""
|
||||
property bool isPreview: false
|
||||
property bool hovered: false
|
||||
property string audioSource: ""
|
||||
|
||||
width: 320
|
||||
height: 32
|
||||
radius: 20
|
||||
|
||||
color: hovered ? Theme.palette.directColor8 : Theme.palette.baseColor2
|
||||
|
||||
Audio {
|
||||
id: audioMessage
|
||||
source: audioSource
|
||||
notifyInterval: 150
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: preview
|
||||
visible: isPreview
|
||||
spacing: 5
|
||||
anchors.centerIn: parent
|
||||
StatusIcon {
|
||||
id: icon
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredWidth: 14
|
||||
Layout.preferredHeight: 14
|
||||
icon: "audio"
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
StatusBaseText {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
color: Theme.palette.baseColor1
|
||||
text: audioMessageInfoText
|
||||
font.pixelSize: 13
|
||||
}
|
||||
}
|
||||
|
||||
StatusFlatRoundButton {
|
||||
id: playButton
|
||||
width: 15
|
||||
height: 15
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
visible: !isPreview
|
||||
|
||||
type: StatusFlatRoundButton.Type.Tertiary
|
||||
color: "transparent"
|
||||
icon.name: audioMessage.playbackState == Audio.PlayingState ? "pause-filled" : "play-filled"
|
||||
icon.color: Theme.palette.directColor1
|
||||
|
||||
onClicked: {
|
||||
if(audioMessage.playbackState === Audio.PlayingState){
|
||||
audioMessage.pause();
|
||||
} else {
|
||||
audioMessage.play();
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
height: 2
|
||||
width: 240
|
||||
color: Theme.palette.directColor5
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: playButton.right
|
||||
anchors.leftMargin: 10
|
||||
visible: !isPreview
|
||||
Rectangle {
|
||||
id: progress
|
||||
height: 2
|
||||
width: {
|
||||
if(audioMessage.duration === 0) return 0;
|
||||
if(audioMessage.playbackState === Audio.StoppedState) return 0;
|
||||
return parent.width * audioMessage.position / audioMessage.duration;
|
||||
}
|
||||
color: Theme.palette.directColor5
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: handle
|
||||
width: 10
|
||||
height: 10
|
||||
color: Theme.palette.directColor1
|
||||
radius: 10
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
x: progress.width
|
||||
state: "default"
|
||||
|
||||
states: State {
|
||||
name: "pressed"
|
||||
when: handleMouseArea.pressed
|
||||
PropertyChanges {
|
||||
target: handle;
|
||||
scale: 1.2
|
||||
}
|
||||
}
|
||||
transitions: Transition {
|
||||
NumberAnimation {
|
||||
properties: "scale";
|
||||
duration: 100;
|
||||
easing.type: Easing.InOutQuad
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: handleMouseArea
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
drag.target: parent
|
||||
drag.axis: Drag.XAxis
|
||||
drag.minimumX: 0
|
||||
drag.maximumX: parent.parent.width
|
||||
onPressed: {
|
||||
handle.state = "pressed"
|
||||
if(audioMessage.playbackState === Audio.PlayingState) {
|
||||
audioMessage.pause();
|
||||
}
|
||||
}
|
||||
onReleased: {
|
||||
handle.state = "default"
|
||||
audioMessage.seek(audioMessage.duration * handle.x / parent.parent.width)
|
||||
audioMessage.play()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,51 +0,0 @@
|
||||
import QtQuick 2.3
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
Item {
|
||||
id: editText
|
||||
|
||||
property alias inputComponent: chatInputLoader.sourceComponent
|
||||
|
||||
property string cancelButtonText: ""
|
||||
property string saveButtonText: ""
|
||||
property string msgText: ""
|
||||
|
||||
signal cancelEditClicked()
|
||||
signal editCompleted(var newMsgText)
|
||||
|
||||
height: childrenRect.height
|
||||
|
||||
ColumnLayout {
|
||||
spacing: 4
|
||||
Loader {
|
||||
id: chatInputLoader
|
||||
// To-Do: Move to StatusChatInput once its moved to StatusQ
|
||||
sourceComponent: StatusInput {
|
||||
width: editText.width
|
||||
input.placeholderText: ""
|
||||
input.text: msgText
|
||||
input.implicitHeight: 40
|
||||
}
|
||||
}
|
||||
RowLayout {
|
||||
spacing: 4
|
||||
StatusFlatButton {
|
||||
id: cancelBtn
|
||||
text: cancelButtonText
|
||||
size: StatusBaseButton.Size.Small
|
||||
onClicked: cancelEditClicked()
|
||||
}
|
||||
StatusButton {
|
||||
id: saveBtn
|
||||
text: saveButtonText
|
||||
size: StatusBaseButton.Size.Small
|
||||
enabled: chatInputLoader.item.input.text.trim().length > 0
|
||||
onClicked: editCompleted(chatInputLoader.item.input.text)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,114 +0,0 @@
|
||||
import QtQuick 2.3
|
||||
import QtGraphicalEffects 1.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Item {
|
||||
id: imageContainer
|
||||
|
||||
enum ShapeType {
|
||||
ROUNDED = 0,
|
||||
LEFT_ROUNDED = 1,
|
||||
RIGHT_ROUNDED = 2
|
||||
}
|
||||
|
||||
property alias imageAlias: imageMessage
|
||||
|
||||
property bool isAppWindowActive: false
|
||||
property url source: ""
|
||||
property bool allCornersRounded: false
|
||||
property bool isLeftCorner: true
|
||||
property int imageWidth: 350
|
||||
property int shapeType: -1
|
||||
|
||||
property string loadingImageText: ""
|
||||
property string errorLoadingImageText: ""
|
||||
|
||||
signal clicked(var image, var mouse)
|
||||
|
||||
width: loadingImage.visible ? loadingImage.width : imageMessage.width
|
||||
height: loadingImage.visible ? loadingImage.height : imageMessage.paintedHeight
|
||||
|
||||
QtObject {
|
||||
id: _internal
|
||||
property bool isAnimated: !!source && source.toString().endsWith('.gif')
|
||||
property bool pausePlaying: false
|
||||
}
|
||||
|
||||
AnimatedImage {
|
||||
id: imageMessage
|
||||
|
||||
width: sourceSize.width > imageWidth ? imageWidth : sourceSize.width
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: imageContainer.source
|
||||
playing: _internal.isAnimated && isAppWindowActive && !_internal.pausePlaying
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
maskSource: Item {
|
||||
width: imageMessage.width
|
||||
height: imageMessage.height
|
||||
|
||||
Rectangle {
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
width: imageMessage.width
|
||||
height: imageMessage.height
|
||||
radius: 16
|
||||
}
|
||||
Rectangle {
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.left: parent.left
|
||||
width: 32
|
||||
height: 32
|
||||
radius: 4
|
||||
visible: shapeType === StatusImageMessage.ShapeType.LEFT_ROUNDED //!isLeftCorner && !allCornersRounded
|
||||
}
|
||||
Rectangle {
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.right: parent.right
|
||||
width: 32
|
||||
height: 32
|
||||
radius: 4
|
||||
visible: shapeType === StatusImageMessage.ShapeType.RIGHT_ROUNDED //isLeftCorner && !allCornersRounded
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
if (imageContainer.isAnimated) {
|
||||
// FIXME the ListView completely removes Items that scroll out of view
|
||||
// so when we scroll backto the image, it gets reloaded and playing is reset
|
||||
_internal.pausePlaying = ! _internal.pausePlaying
|
||||
return
|
||||
}
|
||||
imageContainer.clicked(imageMessage, mouse)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: loadingImage
|
||||
visible: imageMessage.status === Image.Loading
|
||||
|| imageMessage.status === Image.Error
|
||||
width: parent.width
|
||||
height: width
|
||||
border.width: 1
|
||||
border.color: Theme.palette.baseColor2
|
||||
radius: 8
|
||||
|
||||
StatusBaseText {
|
||||
anchors.centerIn: parent
|
||||
text: imageMessage.status === Image.Error ? errorLoadingImageText: loadingImageText
|
||||
color: imageMessage.status === Image.Error?
|
||||
Theme.palette.dangerColor1 :
|
||||
Theme.palette.directColor1
|
||||
font.pixelSize: 15
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,110 +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
|
||||
import StatusQ.Controls 0.1
|
||||
|
||||
Item {
|
||||
id: statusMessageHeader
|
||||
|
||||
property alias displayNameLabel: primaryDisplayName
|
||||
property alias secondaryNameLabel: secondaryDisplayName
|
||||
property alias tertiaryDetailsLabel: tertiaryDetailText
|
||||
property alias timestamp: timestampText
|
||||
|
||||
property string displayName: ""
|
||||
property string secondaryName: ""
|
||||
property string tertiaryDetail: ""
|
||||
property string resendText: ""
|
||||
property bool showResendButton: false
|
||||
property bool isMutualContact: false
|
||||
property var trustIndicator: StatusContactVerificationIcons.TrustedType.None
|
||||
|
||||
signal clicked()
|
||||
signal resendClicked()
|
||||
|
||||
height: childrenRect.height
|
||||
width: primaryDisplayName.width + (secondaryDisplayName.visible ? secondaryDisplayName.width + header.spacing : 0)
|
||||
|
||||
RowLayout {
|
||||
id: header
|
||||
spacing: 4
|
||||
TextEdit {
|
||||
id: primaryDisplayName
|
||||
font.family: Theme.palette.baseFont.name
|
||||
font.weight: Font.Medium
|
||||
font.pixelSize: 15
|
||||
font.underline: mouseArea.containsMouse
|
||||
readOnly: true
|
||||
wrapMode: Text.WordWrap
|
||||
selectByMouse: true
|
||||
color: Theme.palette.primaryColor1
|
||||
text: displayName
|
||||
MouseArea {
|
||||
id: mouseArea
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
statusMessageHeader.clicked()
|
||||
}
|
||||
}
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
}
|
||||
StatusContactVerificationIcons {
|
||||
isMutualContact: statusMessageHeader.isMutualContact
|
||||
trustIndicator: statusMessageHeader.trustIndicator
|
||||
}
|
||||
StatusBaseText {
|
||||
id: secondaryDisplayName
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
color: Theme.palette.baseColor1
|
||||
font.pixelSize: 10
|
||||
text: secondaryName
|
||||
visible: !!text
|
||||
}
|
||||
StatusBaseText {
|
||||
id: dotSeparator1
|
||||
Layout.fillHeight: true
|
||||
font.pixelSize: 10
|
||||
color: Theme.palette.baseColor1
|
||||
text: "."
|
||||
visible: secondaryDisplayName.visible
|
||||
}
|
||||
StatusBaseText {
|
||||
id: tertiaryDetailText
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.maximumWidth: 58
|
||||
font.pixelSize: 10
|
||||
elide: Text.ElideMiddle
|
||||
color: Theme.palette.baseColor1
|
||||
text: tertiaryDetail
|
||||
}
|
||||
StatusBaseText {
|
||||
id: dotSeparator2
|
||||
Layout.fillHeight: true
|
||||
font.pixelSize: 10
|
||||
color: Theme.palette.baseColor1
|
||||
text: "."
|
||||
visible: tertiaryDetailText.visible
|
||||
}
|
||||
StatusTimeStampLabel {
|
||||
id: timestampText
|
||||
}
|
||||
StatusBaseText {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
color: Theme.palette.dangerColor1
|
||||
font.pixelSize: 12
|
||||
text: statusMessageHeader.resendText
|
||||
visible: showResendButton && !!timestampText.text
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
onClicked: statusMessageHeader.resendClicked()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,51 +0,0 @@
|
||||
import QtQuick 2.13
|
||||
import QtGraphicalEffects 1.13
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Rectangle {
|
||||
id: buttonsContainer
|
||||
|
||||
property list<Item> quickActions
|
||||
|
||||
QtObject {
|
||||
id: _internal
|
||||
readonly property int containerMargin: 2
|
||||
}
|
||||
|
||||
width: buttonRow.width + _internal.containerMargin * 2
|
||||
height: 36
|
||||
radius: 8
|
||||
color: Theme.palette.statusSelect.menuItemBackgroundColor
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: DropShadow {
|
||||
width: buttonsContainer.width
|
||||
height: buttonsContainer.height
|
||||
x: buttonsContainer.x
|
||||
y: buttonsContainer.y + 10
|
||||
horizontalOffset: 0
|
||||
verticalOffset: 2
|
||||
source: buttonsContainer
|
||||
radius: 10
|
||||
samples: 15
|
||||
color: Theme.palette.dropShadow
|
||||
}
|
||||
|
||||
Row {
|
||||
id: buttonRow
|
||||
spacing: _internal.containerMargin
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: _internal.containerMargin
|
||||
anchors.verticalCenter: buttonsContainer.verticalCenter
|
||||
height: parent.height - 2 * _internal.containerMargin
|
||||
}
|
||||
|
||||
onQuickActionsChanged: {
|
||||
for (let idx in quickActions) {
|
||||
quickActions[idx].parent = buttonRow
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,125 +0,0 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Shapes 1.13
|
||||
import QtGraphicalEffects 1.13
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
Loader {
|
||||
id: chatReply
|
||||
|
||||
property StatusMessageDetails replyDetails
|
||||
property string audioMessageInfoText: ""
|
||||
|
||||
signal replyProfileClicked()
|
||||
|
||||
active: visible
|
||||
|
||||
sourceComponent: RowLayout {
|
||||
id: replyLayout
|
||||
spacing: 8
|
||||
Shape {
|
||||
id: replyCorner
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.leftMargin: 35
|
||||
Layout.topMargin: profileImage.height/2
|
||||
Layout.preferredWidth: 20
|
||||
Layout.preferredHeight: messageLayout.height - replyCorner.Layout.topMargin
|
||||
asynchronous: true
|
||||
antialiasing: true
|
||||
ShapePath {
|
||||
strokeColor: Qt.hsla(Theme.palette.baseColor1.hslHue, Theme.palette.baseColor1.hslSaturation, Theme.palette.baseColor1.hslLightness, 0.4)
|
||||
strokeWidth: 3
|
||||
fillColor: "transparent"
|
||||
capStyle: ShapePath.RoundCap
|
||||
joinStyle: ShapePath.RoundJoin
|
||||
startX: 20
|
||||
startY: 0
|
||||
PathLine { x: 10; y: 0 }
|
||||
PathArc {
|
||||
x: 0; y: 10
|
||||
radiusX: 13
|
||||
radiusY: 13
|
||||
direction: PathArc.Counterclockwise
|
||||
}
|
||||
PathLine { x: 0; y: messageLayout.height}
|
||||
}
|
||||
}
|
||||
ColumnLayout {
|
||||
id: messageLayout
|
||||
Layout.fillWidth: true
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.topMargin: 4
|
||||
RowLayout {
|
||||
StatusSmartIdenticon {
|
||||
id: profileImage
|
||||
Layout.alignment: Qt.AlignTop
|
||||
image: replyDetails.profileImage
|
||||
name: replyDetails.displayName
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
anchors.fill: parent
|
||||
onClicked: replyProfileClicked()
|
||||
}
|
||||
}
|
||||
TextEdit {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
color: Theme.palette.baseColor1
|
||||
selectionColor: Theme.palette.primaryColor3
|
||||
selectedTextColor: Theme.palette.directColor1
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Medium
|
||||
selectByMouse: true
|
||||
readOnly: true
|
||||
text: replyDetails.displayName
|
||||
}
|
||||
}
|
||||
StatusTextMessage {
|
||||
Layout.fillWidth: true
|
||||
textField.text: replyDetails.messageText
|
||||
textField.font.pixelSize: 13
|
||||
textField.color: Theme.palette.baseColor1
|
||||
textField.height: 18
|
||||
clip: true
|
||||
visible: !!replyDetails.messageText
|
||||
}
|
||||
StatusImageMessage {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: imageAlias.paintedHeight
|
||||
imageWidth: 56
|
||||
source: replyDetails.contentType === StatusMessage.ContentType.Image ? replyDetails.messageContent : ""
|
||||
visible: replyDetails.contentType === StatusMessage.ContentType.Image
|
||||
shapeType: StatusImageMessage.ShapeType.ROUNDED
|
||||
}
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 48
|
||||
Layout.alignment: Qt.AlignLeft
|
||||
visible: replyDetails.contentType === StatusMessage.ContentType.Sticker
|
||||
StatusSticker {
|
||||
image.width: 48
|
||||
image.height: 48
|
||||
image.source: replyDetails.messageContent
|
||||
}
|
||||
}
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 22
|
||||
visible: replyDetails.contentType === StatusMessage.ContentType.Audio
|
||||
StatusAudioMessage {
|
||||
id: audioMessage
|
||||
anchors.left: parent.left
|
||||
width: 125
|
||||
height: 22
|
||||
isPreview: true
|
||||
audioSource: replyDetails.messageContent
|
||||
audioMessageInfoText: chatReply.audioMessageInfoText
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,46 +0,0 @@
|
||||
import QtQuick 2.13
|
||||
import QtQuick.Layouts 1.14
|
||||
import QtGraphicalEffects 1.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Loader {
|
||||
property string pinnedMsgInfoText: ""
|
||||
property string pinnedBy: ""
|
||||
|
||||
active: visible
|
||||
|
||||
sourceComponent: Rectangle {
|
||||
height: 24
|
||||
width: layout.width + 16
|
||||
color: Theme.palette.pinColor2
|
||||
radius: 12
|
||||
RowLayout {
|
||||
id: layout
|
||||
anchors.centerIn: parent
|
||||
StatusIcon {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredWidth: 16
|
||||
Layout.preferredHeight: 16
|
||||
color: Theme.palette.pinColor1
|
||||
icon: "tiny/pin"
|
||||
}
|
||||
StatusBaseText {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.leftMargin: -4
|
||||
color: Theme.palette.directColor1
|
||||
font.pixelSize: 13
|
||||
text: pinnedMsgInfoText
|
||||
}
|
||||
StatusBaseText {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.leftMargin: -4
|
||||
color: Theme.palette.directColor1
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Medium
|
||||
text: pinnedBy
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,125 +0,0 @@
|
||||
import QtQuick 2.3
|
||||
import QtGraphicalEffects 1.13
|
||||
|
||||
import StatusQ.Components 0.1
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
|
||||
Loader {
|
||||
id: statusSticker
|
||||
|
||||
property bool noHover: false
|
||||
property bool noMouseArea: false
|
||||
property StatusImageSettings image: StatusImageSettings {
|
||||
width: 140
|
||||
height: 140
|
||||
}
|
||||
|
||||
signal loaded()
|
||||
signal clicked()
|
||||
|
||||
active: visible
|
||||
|
||||
sourceComponent: Rectangle {
|
||||
id: root
|
||||
|
||||
color: Theme.palette.baseColor2
|
||||
radius: 16
|
||||
|
||||
width: image.width
|
||||
height: image.height
|
||||
|
||||
function reload() {
|
||||
// From the documentation (https://doc.qt.io/qt-5/qml-qtquick-image.html#sourceSize-prop)
|
||||
// Note: Changing this property dynamically causes the image source to
|
||||
// be reloaded, potentially even from the network, if it is not in the
|
||||
// disk cache.
|
||||
const oldSource = sticker.source
|
||||
sticker.cache = false
|
||||
sticker.sourceSize.width += 1
|
||||
sticker.sourceSize.width -= 1
|
||||
sticker.cache = true
|
||||
}
|
||||
|
||||
Loader {
|
||||
id: loader
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
|
||||
Image {
|
||||
id: sticker
|
||||
anchors.fill: parent
|
||||
horizontalAlignment: Image.AlignHCenter
|
||||
verticalAlignment: Image.AlignVCenter
|
||||
cache: true
|
||||
source: image.source
|
||||
|
||||
onStatusChanged: {
|
||||
if (status === Image.Ready) {
|
||||
statusSticker.loaded()
|
||||
}
|
||||
}
|
||||
MouseArea {
|
||||
enabled: !noMouseArea && (sticker.status === Image.Ready)
|
||||
cursorShape: noHover ? Qt.ArrowCursor : Qt.PointingHandCursor
|
||||
anchors.fill: parent
|
||||
onClicked: statusSticker.clicked()
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: loadingIndicator
|
||||
StatusLoadingIndicator {
|
||||
width: 24
|
||||
height: 24
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: reload
|
||||
StatusIcon {
|
||||
icon: "refresh"
|
||||
color: Theme.palette.directColor1
|
||||
mipmap: false
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: root.reload()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
states: [
|
||||
State {
|
||||
name: "loading"
|
||||
when: sticker.status === Image.Loading
|
||||
PropertyChanges {
|
||||
target: loader
|
||||
sourceComponent: loadingIndicator
|
||||
}
|
||||
},
|
||||
State {
|
||||
name: "error"
|
||||
when: sticker.status === Image.Error
|
||||
PropertyChanges {
|
||||
target: loader
|
||||
sourceComponent: reload
|
||||
}
|
||||
},
|
||||
State {
|
||||
name: "ready"
|
||||
when: sticker.status === Image.Ready
|
||||
PropertyChanges {
|
||||
target: root
|
||||
color: "transparent"
|
||||
}
|
||||
PropertyChanges {
|
||||
target: loader
|
||||
sourceComponent: undefined
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user