Compare commits

..
Author SHA1 Message Date
B.Melnik 3a0e54928c wip 2021-07-09 10:41:03 +03:00
114 changed files with 1018 additions and 5504 deletions
-369
View File
@@ -1,369 +0,0 @@
<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))
-1
View File
@@ -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)
+226 -248
View File
@@ -1,261 +1,239 @@
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
Grid {
Column {
spacing: 10
Grid {
id: buttonGridWidth
columns: 3
columnSpacing: 38
rowSpacing: 10
columns: 3
columnSpacing: 38
rowSpacing: 10
horizontalItemAlignment: Grid.AlignHCenter
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
}
// Large
StatusButton {
text: "Button"
}
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;
}
}
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
}
}
+29 -31
View File
@@ -8,7 +8,7 @@ import StatusQ.Controls 0.1
import Sandbox 0.1
GridLayout {
columns: 1
columns: 6
columnSpacing: 5
rowSpacing: 5
@@ -115,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"
@@ -173,4 +143,32 @@ GridLayout {
to: 100
value: 40
}
StatusBaseInput {
placeholderText: "One line"
}
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
}
}
}
+257 -269
View File
@@ -7,36 +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
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
StatusMacTrafficLights {
anchors.left: parent.left
anchors.top: parent.top
anchors.margins: 13
spacing: 6
z: statusAppLayout.z + 1
visible: titleStyle === "osx"
}
StatusWindowsTitleBar {
id: windowsTitle
anchors.top: parent.top
width: parent.width
z: statusAppLayout.z + 1
visible: titleStyle === "windows"
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
}
}
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
@@ -113,16 +123,16 @@ Rectangle {
tooltip.text: "Wallet"
},
StatusNavBarTabButton {
icon.name: "bigger/browser"
icon.name: "browser"
tooltip.text: "Browser"
},
StatusNavBarTabButton {
icon.name: "bigger/status-update"
icon.name: "status-update"
tooltip.text: "Timeline"
},
StatusNavBarTabButton {
id: profileNavButton
icon.name: "bigger/settings"
icon.name: "profile"
badge.visible: true
badge.anchors.rightMargin: 4
badge.anchors.topMargin: 5
@@ -162,119 +172,8 @@ Rectangle {
text: "Chat"
}
Item {
id: searchInputWrapper
anchors.top: headline.bottom
anchors.topMargin: 16
width: parent.width
height: searchInput.height
StatusBaseInput {
id: searchInput
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.right: actionButton.left
anchors.leftMargin: 16
anchors.rightMargin: 16
height: 36
topPadding: 8
bottomPadding: 0
placeholderText: "Search"
icon.name: "search"
}
StatusRoundButton {
id: actionButton
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 8
width: 32
height: 32
type: StatusRoundButton.Type.Secondary
icon.name: "add"
state: "default"
onClicked: chatContextMenu.popup(actionButton.width-chatContextMenu.width, actionButton.height + 4)
states: [
State {
name: "default"
PropertyChanges {
target: actionButton
icon.rotation: 0
highlighted: false
}
},
State {
name: "pressed"
PropertyChanges {
target: actionButton
icon.rotation: 45
highlighted: true
}
}
]
transitions: [
Transition {
from: "default"
to: "pressed"
RotationAnimation {
duration: 150
direction: RotationAnimation.Clockwise
easing.type: Easing.InCubic
}
},
Transition {
from: "pressed"
to: "default"
RotationAnimation {
duration: 150
direction: RotationAnimation.Counterclockwise
easing.type: Easing.OutCubic
}
}
]
StatusPopupMenu {
id: chatContextMenu
onOpened: {
actionButton.state = "pressed"
}
onClosed: {
actionButton.state = "default"
}
StatusMenuItem {
text: "Start new chat"
icon.name: "private-chat"
}
StatusMenuItem {
text: "Start group chat"
icon.name: "group-chat"
}
StatusMenuItem {
text: "Join public chat"
icon.name: "public-chat"
}
StatusMenuItem {
text: "Communities"
icon.name: "communities"
}
}
}
}
Column {
anchors.top: searchInputWrapper.bottom
anchors.top: headline.bottom
anchors.topMargin: 16
width: parent.width
spacing: 8
@@ -289,14 +188,14 @@ Rectangle {
StatusChatList {
anchors.horizontalCenter: parent.horizontalCenter
chatListItems.model: models.demoChatListItems
chatListItems.model: demoChatListItems
selectedChatId: "0"
onChatItemSelected: selectedChatId = id
onChatItemUnmuted: {
for (var i = 0; i < models.demoChatListItems.count; i++) {
let item = models.demoChatListItems.get(i);
for (var i = 0; i < demoChatListItems.count; i++) {
let item = demoChatListItems.get(i);
if (item.chatId === id) {
models.demoChatListItems.setProperty(i, "muted", false)
demoChatListItems.setProperty(i, "muted", false)
}
}
}
@@ -350,14 +249,12 @@ Rectangle {
anchors.top: parent.top
width: parent.width
chatInfoButton.title: "Amazing Funny Squirrel"
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
@@ -396,16 +293,11 @@ Rectangle {
Component {
id: statusAppCommunityView
StatusAppThreePanelLayout {
id: root
StatusAppTwoPanelLayout {
handle: Rectangle {
implicitWidth: 5
color: SplitHandle.pressed ? Theme.palette.baseColor2
: (SplitHandle.hovered ? Qt.darker(Theme.palette.baseColor5, 1.1) : "transparent")
}
leftPanel: Item {
id: leftPanel
anchors.fill: parent
StatusChatInfoToolBar {
id: statusChatInfoToolBar
@@ -454,13 +346,11 @@ Rectangle {
StatusChatListAndCategories {
id: communityCategories
width: leftPanel.width
height: implicitHeight > (leftPanel.height - 64) ? implicitHeight + 8 : leftPanel.height - 64
width: leftPanel.width
draggableItems: true
draggableCategories: false
chatList.model: models.demoCommunityChatListItems
categoryList.model: models.demoCommunityCategoryItems
chatList.model: demoCommunityChatListItems
categoryList.model: demoCommunityCategoryItems
showCategoryActionButtons: true
onChatItemSelected: selectedChatId = id
@@ -478,12 +368,12 @@ Rectangle {
icon.name: "notification"
}
StatusMenuItem {
StatusMenuItem {
text: "Mark as Read"
icon.name: "checkmark-circle"
}
StatusMenuItem {
StatusMenuItem {
text: "Edit Category"
icon.name: "edit"
}
@@ -547,119 +437,17 @@ Rectangle {
}
}
centerPanel: Item {
rightPanel: Item {
anchors.fill: parent
StatusChatToolBar {
id: statusChatToolBar
anchors.top: parent.top
width: parent.width
chatInfoButton.title: "general"
chatInfoButton.title: "general"
chatInfoButton.subTitle: "Community Chat"
chatInfoButton.icon.color: Theme.palette.miscColor6
chatInfoButton.type: StatusChatInfoButton.Type.CommunityChat
onSearchButtonClicked: {
searchButton.highlighted = !searchButton.highlighted;
searchPopup.setSearchSelection(demoCommunityDetailModal.header.title,
"",
demoCommunityDetailModal.header.image.source);
searchPopup.open();
}
membersButton.onClicked: membersButton.highlighted = !membersButton.highlighted
onMembersButtonClicked: {
root.showRightPanel = !root.showRightPanel;
}
}
StatusSearchPopup {
id: searchPopup
searchOptionsPopupMenu: searchPopupMenu
onAboutToHide: {
if (searchPopupMenu.visible) {
searchPopupMenu.close();
}
//clear menu
for (var i = 2; i < searchPopupMenu.count; i++) {
searchPopupMenu.removeItem(searchPopupMenu.takeItem(i));
}
}
onClosed: {
statusChatToolBar.searchButton.highlighted = false
searchPopupMenu.dismiss();
}
onSearchTextChanged: {
if (searchPopup.searchText !== "") {
searchPopup.loading = true;
searchModelSimTimer.start();
} else {
searchPopup.searchResults = [];
searchModelSimTimer.stop();
}
}
Timer {
id: searchModelSimTimer
interval: 500
onTriggered: {
if (searchPopup.searchText.startsWith("c")) {
searchPopup.searchResults = models.searchResultsA;
} else {
searchPopup.searchResults = models.searchResultsB;
}
searchPopup.loading = false;
}
}
}
StatusSearchLocationMenu {
id: searchPopupMenu
searchPopup: searchPopup
locationModel: models.optionsModel
}
}
rightPanel: Item {
id: rightPanel
StatusBaseText {
id: titleText
anchors.top: parent.top
anchors.topMargin:16
anchors.left: parent.left
anchors.leftMargin: 16
opacity: (rightPanel.width > 50) ? 1.0 : 0.0
visible: (opacity > 0.1)
font.pixelSize: 15
text: qsTr("Members")
}
ListView {
anchors.top: titleText.bottom
anchors.topMargin: 16
anchors.left: parent.left
anchors.leftMargin: 8
anchors.right: parent.right
anchors.rightMargin: 8
anchors.bottom: parent.bottom
anchors.bottomMargin: 16
boundsBehavior: Flickable.StopAtBounds
model: ["John", "Nick", "Maria", "Mike"]
delegate: Row {
width: parent.width
height: 30
spacing: 8
Rectangle {
width: 24
height: 24
radius: width/2
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 255)
}
StatusBaseText {
height: parent.height
horizontalAlignment: Text.AlignHCenter
opacity: (rightPanel.width > 50) ? 1.0 : 0.0
visible: (opacity > 0.1)
font.pixelSize: 15
color: Theme.palette.directColor1
text: modelData
}
}
}
}
}
@@ -697,7 +485,7 @@ Rectangle {
spacing: 4
Repeater {
model: models.demoProfileGeneralMenuItems
model: demoProfileGeneralMenuItems
delegate: StatusNavigationListItem {
title: model.title
icon.name: model.icon
@@ -707,21 +495,21 @@ Rectangle {
StatusListSectionHeadline { text: "Settings" }
Repeater {
model: models.demoProfileSettingsMenuItems
model: demoProfileSettingsMenuItems
delegate: StatusNavigationListItem {
title: model.title
icon.name: model.icon
}
}
Item {
Item {
id: invisibleSeparator
height: 16
width: parent.width
}
Repeater {
model: models.demoProfileOtherMenuItems
model: demoProfileOtherMenuItems
delegate: StatusNavigationListItem {
title: model.title
icon.name: model.icon
@@ -752,7 +540,7 @@ Rectangle {
icon.name: "notification"
}
contentItem: StatusBaseText {
content: StatusBaseText {
anchors.centerIn: parent
text: "Contact request will be shown here"
font.pixelSize: 15
@@ -777,15 +565,15 @@ Rectangle {
anchors.centerIn: parent
header.title: "Cryptokitties"
header.title: "Cryptokitties"
header.subTitle: "Public Community"
header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
contentItem: Column {
content: Column {
width: demoCommunityDetailModal.width
StatusModalDivider {
bottomPadding: 8
StatusModalDivider {
bottomPadding: 8
}
StatusBaseText {
@@ -876,7 +664,207 @@ Rectangle {
}
}
Models {
id: models
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"
}
}
}
+1 -99
View File
@@ -95,20 +95,11 @@ GridLayout {
onUnmute: muted = false
}
StatusChatListItem {
name: "muted-with-mentions"
type: StatusChatListItem.Type.PublicChat
muted: true
hasUnreadMessages: true
badge.value: 1
}
StatusChatListItem {
name: "selected-channel"
type: StatusChatListItem.Type.PublicChat
selected: true
}
StatusChatListItem {
name: "selected-muted-channel"
type: StatusChatListItem.Type.PublicChat
@@ -116,24 +107,6 @@ GridLayout {
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
badge.value: 1
}
StatusListItem {
title: "Title"
}
@@ -143,45 +116,19 @@ GridLayout {
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"
@@ -283,56 +230,11 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
type: StatusListItem.Type.Secondary
}
StatusListItem {
title: "Title"
icon.isLetterIdenticon: true
icon.background.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
}
StatusDescriptionListItem {
title: "Title"
subTitle: "Subtitle"
}
StatusDescriptionListItem {
title: "Title"
subTitle: "Subtitle"
value: "None"
sensor.enabled: true
}
StatusDescriptionListItem {
title: "Title"
subTitle: "Subtitle"
-336
View File
@@ -1,336 +0,0 @@
import QtQuick 2.14
import StatusQ.Components 0.1
QtObject {
property var demoChatListItems: ListModel {
id: demoChatListItems
ListElement {
chatId: "0"
name: "#status"
chatType: StatusChatListItem.Type.PublicChat
muted: false
unreadMessagesCount: 0
mentionsCount: 0
color: "blue"
position: 0
}
ListElement {
chatId: "1"
name: "status-desktop"
chatType: StatusChatListItem.Type.PublicChat
muted: false
color: "red"
unreadMessagesCount: 1
mentionsCount: 1
position: 1
}
ListElement {
chatId: "2"
name: "Amazing Funny Squirrel"
chatType: StatusChatListItem.Type.OneToOneChat
muted: false
color: "green"
identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
unreadMessagesCount: 0
position: 2
}
ListElement {
chatId: "3"
name: "Black Ops"
chatType: StatusChatListItem.Type.GroupChat
muted: false
color: "purple"
unreadMessagesCount: 0
position: 3
}
ListElement {
chatId: "4"
name: "Spectacular Growing Otter"
chatType: StatusChatListItem.Type.OneToOneChat
muted: true
color: "Orange"
unreadMessagesCount: 0
position: 4
}
ListElement {
chatId: "5"
name: "channel-with-a-super-duper-long-name"
chatType: StatusChatListItem.Type.PublicChat
muted: false
color: "green"
unreadMessagesCount: 0
position: 5
}
}
property var demoCommunityChatListItems: ListModel {
id: demoCommunityChatListItems
ListElement {
chatId: "0"
name: "general"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
position: 0
}
ListElement {
chatId: "1"
name: "random"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "public"
position: 0
}
ListElement {
chatId: "2"
name: "watercooler"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "public"
position: 1
}
ListElement {
chatId: "3"
name: "language-design"
chatType: StatusChatListItem.Type.CommunityChat
muted: false
unreadMessagesCount: 0
color: "orange"
categoryId: "dev"
position: 0
}
}
property var demoCommunityCategoryItems: ListModel {
id: demoCommunityCategoryItems
ListElement {
categoryId: "public"
name: "Public"
position: 0
}
ListElement {
categoryId: "dev"
name: "Development"
position: 1
}
}
property var demoProfileGeneralMenuItems: ListModel {
id: demoProfileGeneralMenuItems
ListElement {
title: "My Profile"
icon: "profile"
}
ListElement {
title: "Contacts"
icon: "contact"
}
ListElement {
title: "ENS Usernames"
icon: "username"
}
}
property var demoProfileSettingsMenuItems: ListModel {
id: demoProfileSettingsMenuItems
ListElement {
title: "Privacy & Security"
icon: "security"
}
ListElement {
title: "Appearance"
icon: "appearance"
}
ListElement {
title: "Browser"
icon: "browser"
}
ListElement {
title: "Sounds"
icon: "sound"
}
ListElement {
title: "Language"
icon: "language"
}
ListElement {
title: "Notifications"
icon: "notification"
}
ListElement {
title: "Sync settings"
icon: "mobile"
}
ListElement {
title: "Advanced"
icon: "settings"
}
}
property var demoProfileOtherMenuItems: ListModel {
id: demoProfileOtherMenuItems
ListElement {
title: "Need help?"
icon: "help"
}
ListElement {
title: "About"
icon: "info"
}
ListElement {
title: "Sign out & Quit"
icon: "logout"
}
}
//dummy search popup models
property var searchResultsA: ListModel {
ListElement { itemId: "i1"; titleId: "t1"; title: "@Flea"; sectionName: "Messages"; time: "18:55 AM"; content: "lorem ipsum <font color='#4360DF'>@Nick</font> dolor sit amet";
image: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg";
color: "orange";
badgeImage: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg";
badgePrimaryText: "CryptoKities";
badgeSecondaryText: "";
badgeIconColor: "";
badgeIsLetterIdenticon: false }
ListElement { itemId: "i2"; titleId: "t2"; image: ""; color: "blue"; title: "core"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i3"; titleId: "t3"; image: ""; color: "yellow"; title: "communities-phase3"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i4"; titleId: "t4"; image: ""; color: "black"; title: "core-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i5"; titleId: "t5"; image: ""; color: "green"; title: "desktop"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i6"; titleId: "t6"; image: ""; color: "red"; title: "Crocodile Vanilla Bird"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i7"; titleId: "t7"; image: ""; color: "purple"; title: "carmen eth"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i8"; titleId: "t8"; image: ""; color: "red"; title: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i9"; titleId: "t9"; image: ""; color: "blue"; title: "MyCommunity"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i10"; titleId: "t10"; image: ""; color: "green"; title: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
}
property var searchResultsB: ListModel {
ListElement { itemId: "i1"; titleId: "t1"; title: "@Ant"; sectionName: "Messages"; time: "11:43 AM"; content: "<font color='#4360DF'>@John</font>, lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum ";
image: "";
color: "orange";
badgeImage: "";
badgePrimaryText: "CryptoKities";
badgeSecondaryText: "#design";
badgeIconColor: "pink"; badgeIsLetterIdenticon: true }
ListElement { itemId: "i2"; titleId: "t2"; image: ""; color: "blue"; title: "support"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i3"; titleId: "t3"; image: ""; color: "red"; title: "desktop-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i4"; titleId: "t4"; image: ""; color: "orange"; title: "climate-change"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i5"; titleId: "t5"; image: ""; color: "black"; title: "food"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: "pink"; badgeIsLetterIdenticon: true }
ListElement { itemId: "i6"; titleId: "t6"; image: ""; color: "green"; title: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i7"; titleId: "t7"; image: ""; color: "purple"; title: "CryptoRangers"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
ListElement { itemId: "i8"; titleId: "t8"; image: ""; color: "yellow"; title: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: "orange"; badgeIsLetterIdenticon: true }
}
property ListModel optionsModel: ListModel {
ListElement {
value: "item_1"
title: "Item with icon"
imageSource: ""
iconName: "chat"
iconColor: ""
isIdenticon: false
subItems: [
ListElement {
value: "sub_item_1_1"
text: "Profile image item"
imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
iconName: ""
iconColor: ""
isIdenticon: false
},
ListElement {
value: "sub_item_1_2"
text: "identicon item"
imageSource: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
iconName: ""
iconColor: ""
isIdenticon: true
}]}
ListElement {
value: "item_2"
title: "Community item";
imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
iconName: ""
iconColor: ""
isIdenticon: false
subItems: [
ListElement {
value: "sub_item_2_1"
text: "welcome"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
},
ListElement {
value: "sub_item_2_2"
text: "support"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
},
ListElement {
value: "sub_item_2_3"
text: "news"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
}]}
ListElement {
value: "item_3"
title: "Other";
imageSource: "";
iconName: "info"
iconColor: ""
isIdenticon: false
subItems: [
ListElement {
value: "sub_item_3_1"
text: "news"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
}]}
ListElement {
value: "item_4"
title: "Letter identicon";
imageSource: "";
iconName: ""
iconColor: "red"
isIdenticon: false
subItems: [
ListElement {
value: "sub_item_4_1"
text: "news"
imageSource: ""
iconName: "channel"
iconColor: ""
isIdenticon: false
}]}
}
}
+3 -141
View File
@@ -13,11 +13,6 @@ Column {
onClicked: simpleModal.open()
}
StatusButton {
text: "Simple title modal"
onClicked: simpleTitleModal.open()
}
StatusButton {
text: "Modal with header image"
onClicked: headerImageModal.open()
@@ -43,26 +38,6 @@ Column {
onClicked: modalWithContentAccess.open()
}
StatusButton {
text: "Modal with letter identicon"
onClicked: modalWithLetterIdenticon.open()
}
StatusButton {
text: "Modal with identicon"
onClicked: modalWithIdenticon.open()
}
StatusButton {
text: "Modal with long titles"
onClicked: modalWithLongTitles.open()
}
StatusButton {
text: "Modal with Header Popup Menu"
onClicked: modalWithHeaderPopupMenu.open()
}
StatusModal {
id: simpleModal
anchors.centerIn: parent
@@ -70,12 +45,6 @@ Column {
header.subTitle: "Subtitle"
}
StatusModal {
id: simpleTitleModal
anchors.centerIn: parent
header.title: "Some Title"
}
StatusModal {
id: headerImageModal
anchors.centerIn: parent
@@ -161,7 +130,7 @@ Column {
}
]
contentItem: StatusBaseText {
content: StatusBaseText {
anchors.centerIn: parent
text: "Some text content"
font.pixelSize: 15
@@ -185,7 +154,7 @@ Column {
header.title: "Header"
header.subTitle: "SubTitle"
contentItem: StatusBaseText {
content: StatusBaseText {
id: text
anchors.centerIn: parent
text: "Some text content"
@@ -197,116 +166,9 @@ Column {
StatusButton {
text: "Change text"
onClicked: {
modalWithContentAccess.contentItem.text = "Changed!"
modalWithContentAccess.contentComponent.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: 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()
}
}
}
ListModel {
id: dummyAccountsModel
ListElement{name: "Account 1"; iconName: "filled-account"}
ListElement{name: "Account 2"; iconName: "filled-account"}
}
}
@@ -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")
}
}
}
}
-133
View File
@@ -1,133 +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
}
StatusInput {
label: "Label"
charLimit: 30
errorMessage: "Error message"
input.clearable: true
input.valid: false
input.placeholderText: "Placeholder"
}
StatusInput {
label: "StatusInput"
secondaryLabel: "with right icon"
input.icon.width: 15
input.icon.height: 11
input.icon.name: text !== "" ? "checkmark" : ""
input.leftIcon: false
}
StatusInput {
label: "Label"
secondaryLabel: "secondary label"
input.placeholderText: "Placeholder"
input.implicitHeight: 56
}
StatusInput {
id: input
label: "Label"
charLimit: 30
input.placeholderText: "Input with validator"
validators: [
StatusMinLengthValidator {
minLength: 10
errorMessage: {
if (input.errors && input.errors.minLength) {
return `Value can't be shorter than ${input.errors.minLength.min} but got ${input.errors.minLength.actual}`
}
return ""
}
}
]
}
StatusInput {
label: "Label"
input.placeholderText: "Input width component (right side)"
input.component: StatusIcon {
icon: "cancel"
height: 16
color: Theme.palette.dangerColor1
}
}
StatusInput {
input.multiline: true
input.placeholderText: "Multiline"
}
StatusInput {
input.multiline: true
input.placeholderText: "Multiline with static height"
input.implicitHeight: 100
}
StatusInput {
input.multiline: true
input.placeholderText: "Multiline with max/min"
input.minimumHeight: 80
input.maximumHeight: 200
}
}
+6 -84
View File
@@ -22,13 +22,6 @@ GridLayout {
onClicked: complexMenu.popup()
}
StatusButton {
text: "Menu with custom images and icons"
onClicked: customMenu.popup()
}
StatusPopupMenu {
id: simpleMenu
StatusMenuItem {
@@ -46,104 +39,33 @@ GridLayout {
StatusPopupMenu {
id: complexMenu
subMenuItemIcons: [{ icon: 'info' }]
subMenuItemIcons: ['info']
StatusMenuItem {
text: "One"
iconSettings.name: "info"
icon.name: "info"
}
StatusMenuSeparator {}
StatusMenuItem {
text: "Two"
iconSettings.name: "info"
icon.name: "info"
}
StatusMenuItem {
text: "Three"
iconSettings.name: "info"
icon.name: "info"
}
StatusPopupMenu {
title: "Four"
StatusMenuItem {
text: "One"
iconSettings.name: "info"
icon.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"
icon.name: "info"
}
}
}
-24
View File
@@ -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"
}
}
}
+5 -84
View File
@@ -15,7 +15,7 @@ import StatusQ.Platform 0.1
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
@@ -138,21 +138,11 @@ StatusWindow {
selected: page.sourceComponent == buttonsComponent
onClicked: page.sourceComponent = buttonsComponent
}
StatusNavigationListItem {
title: "StatusSwitchTab"
selected: page.sourceComponent == statusTabSwitchesComponent
onClicked: page.sourceComponent = statusTabSwitchesComponent
}
StatusNavigationListItem {
title: "Controls"
selected: page.sourceComponent == controlsComponent
onClicked: page.sourceComponent = controlsComponent
}
StatusNavigationListItem {
title: "StatusInput"
selected: page.sourceComponent == statusInputPageComponent
onClicked: page.sourceComponent = statusInputPageComponent
}
StatusListSectionHeadline { text: "StatusQ.Components" }
StatusNavigationListItem {
title: "List Items"
@@ -169,11 +159,6 @@ StatusWindow {
selected: page.sourceComponent == othersComponent
onClicked: page.sourceComponent = othersComponent
}
StatusNavigationListItem {
title: "StatusExpandableItem"
selected: page.sourceComponent == settingsComponent
onClicked: page.sourceComponent = settingsComponent
}
StatusListSectionHeadline { text: "StatusQ.Popup" }
StatusNavigationListItem {
title: "StatusPopupMenu"
@@ -193,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 {
@@ -251,11 +238,6 @@ StatusWindow {
Controls {}
}
Component {
id: statusInputPageComponent
StatusInputPage {}
}
Component {
id: listItemsComponent
ListItems {}
@@ -291,52 +273,12 @@ StatusWindow {
Popups {}
}
Component {
id: statusTabSwitchesComponent
StatusTabSwitchPage {}
}
Component {
id: settingsComponent
StatusExpandableSettingsItemPage{}
}
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.verticalCenter: parent.verticalCenter
@@ -359,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()
}
-2
View File
@@ -9,10 +9,8 @@
<file>ListItems.qml</file>
<file>StatusChatInfoToolBarPage.qml</file>
<file>StatusPopupMenuPage.qml</file>
<file>StatusInputPage.qml</file>
<file>ThemeSwitch.qml</file>
<file>Layout.qml</file>
<file>Popups.qml</file>
<file>StatusExpandableSettingsItemPage.qml</file>
</qresource>
</RCC>
+11 -20
View File
@@ -12,8 +12,7 @@ DEFINES += QT_DEPRECATED_WARNINGS
SOURCES += \
handler.cpp \
main.cpp \
sandboxapp.cpp \
spellchecker.cpp
sandboxapp.cpp
!macx {
SOURCES += statuswindow.cpp
@@ -25,14 +24,6 @@ macx {
CONFIG -= app_bundle
OBJECTIVE_SOURCES += \
statuswindow_mac.mm
hunspellTarget.depends = FORCE
hunspellTarget.commands = brew install hunspell
QMAKE_EXTRA_TARGETS += hunspellTarget
LIBS += -L"/usr/local/lib" -lhunspell-1.7
INCLUDEPATH += /usr/local/include/hunspell
}
ios {
@@ -51,12 +42,6 @@ RESOURCES += qml.qrc \
DESTDIR = $$PWD/bin
copydata.commands = $(COPY_DIR) $$PWD/dictionaries $$DESTDIR
first.depends = $(first) copydata
export(first.depends)
export(copydata.commands)
QMAKE_EXTRA_TARGETS += first copydata
# Default rules for deployment.
qnx: target.path = /tmp/$${TARGET}/bin
else: unix:!android: target.path = /opt/$${TARGET}/bin
@@ -66,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 {
-2
View File
@@ -5,7 +5,6 @@
#include <QDebug>
#include "statuswindow.h"
#include "spellchecker.h"
SandboxApp::SandboxApp(int &argc, char **argv)
: QGuiApplication(argc, argv),
@@ -17,7 +16,6 @@ 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(applicationDirPath() + "/../main.qml");
+78 -60
View File
@@ -11,48 +11,18 @@
#include <QDir>
SpellChecker::SpellChecker(QObject *parent)
: QObject(parent)
, m_hunspell(nullptr)
, m_userDict("userDict_")
: QSyntaxHighlighter(parent)
{
auto language = QLocale::system().bcp47Name();
}
SpellChecker::~SpellChecker()
{
#ifdef Q_OS_MACOS
delete m_hunspell;
#endif
}
bool SpellChecker::spell(const QString &word)
{
#ifdef Q_OS_MACOS
return m_hunspell->spell(m_codec->fromUnicode(word).toStdString());
#else
return true;
#endif
}
bool SpellChecker::isInit() const
{
return !m_hunspell;
}
void SpellChecker::initHunspell()
{
#ifdef Q_OS_MACOS
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);
@@ -77,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);
@@ -95,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 Q_OS_MACOS
std::vector<std::string> wordlist;
wordlist = m_hunspell->suggest(m_codec->fromUnicode(word).toStdString());
@@ -114,22 +92,20 @@ QVariantList SpellChecker::suggest(const QString &word)
QByteArray::fromStdString(wordlist[i]));
}
}
#endif
return suggestions;
}
void SpellChecker::ignoreWord(const QString &word)
{
#ifdef Q_OS_MACOS
m_hunspell->add(m_codec->fromUnicode(word).constData());
#endif
}
void SpellChecker::addToUserWordlist(const QString &word)
{
#ifdef Q_OS_MACOS
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)) {
@@ -143,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
View File
@@ -6,17 +6,15 @@
#include <QQuickTextDocument>
#include <QSyntaxHighlighter>
#ifdef Q_OS_MACOS
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 Q_OS_MACOS
Hunspell *m_hunspell;
#endif
QTextCodec *m_codec;
};
@@ -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"
}
}
}
+54 -177
View File
@@ -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
@@ -16,8 +13,7 @@ Column {
property string categoryId: ""
property string selectedChatId: ""
property alias chatListItems: delegateModel
property bool draggableItems: false
property alias chatListItems: statusChatListItems
property Component popupMenu
@@ -27,7 +23,6 @@ Column {
signal chatItemSelected(string id)
signal chatItemUnmuted(string id)
signal chatItemReordered(string id, int from, int to)
onPopupMenuChanged: {
if (!!popupMenu) {
@@ -35,189 +30,71 @@ Column {
}
}
DelegateModel {
id: delegateModel
Repeater {
id: statusChatListItems
delegate: StatusChatListItem {
delegate: Item {
id: draggable
width: statusChatListItem.width
height: statusChatListItem.height
id: statusChatListItem
property alias chatListItem: 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, 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
property string profileImage: ""
opacity: dragSensor.active ? 0.0 : 1.0
Component.onCompleted: {
if (typeof statusChatList.profileImageFn === "function") {
profileImage = statusChatList.profileImageFn(model.chatId || model.id) || ""
}
}
originalOrder: model.position
chatId: model.chatId || model.id
categoryId: model.categoryId || ""
name: !!statusChatList.chatNameFn ? statusChatList.chatNameFn(model) : model.name
type: model.chatType
muted: !!model.muted
hasUnreadMessages: !!model.hasUnreadMessages || model.unviewedMessagesCount > 0
hasMention: model.mentionsCount > 0
badge.value: model.chatType === StatusChatListItem.Type.OneToOneChat ?
model.unviewedMessagesCount || 0 :
model.mentionsCount || 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 || ""
sensor.cursorShape: dragSensor.cursorShape
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
}
if (!statusChatListItem.selected) {
statusChatList.chatItemSelected(model.chatId || model.id)
}
}
onUnmute: statusChatList.chatItemUnmuted(model.chatId || model.id)
}
}
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: draggable.chatListItem.hasUnreadMessages
hasMention: draggable.chatListItem.hasMention
badge.value: draggable.chatListItem.badge.value
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,21 +10,11 @@ Item {
implicitHeight: chatListsAndCategories.height
implicitWidth: chatListsAndCategories.width
property StatusTooltipSettings categoryAddButtonToolTip: StatusTooltipSettings {
text: "Add channel inside category"
}
property StatusTooltipSettings categoryMenuButtonToolTip: StatusTooltipSettings {
text: "More"
}
property string selectedChatId: ""
property bool showCategoryActionButtons: false
property bool showPopupMenu: true
property alias chatList: statusChatList.chatListItems
property alias categoryList: delegateModel
property alias categoryList: statusChatListCategories
property alias sensor: sensor
property bool draggableItems: false
property bool draggableCategories: false
property Component categoryPopupMenu
property Component chatListPopupMenu
@@ -35,8 +22,6 @@ Item {
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: {
@@ -52,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
}
@@ -68,143 +53,34 @@ Item {
StatusChatList {
id: statusChatList
anchors.horizontalCenter: parent.horizontalCenter
visible: chatListItems.count > 0
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
filterFn: function (model) {
return !!!model.categoryId
}
popupMenu: statusChatListAndCategories.chatListPopupMenu
}
DelegateModel {
id: delegateModel
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.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)
chatList.onChatItemReordered: statusChatListAndCategories.chatItemReordered(model.categoryId, id, from, to)
chatList.draggableItems: statusChatListAndCategories.draggableItems
popupMenu: statusChatListAndCategories.categoryPopupMenu
chatListPopupMenu: statusChatListAndCategories.chatListPopupMenu
}
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.chatListItems.model: draggable.chatListCategory.chatList.chatListItems.model
chatList.selectedChatId: draggable.chatListCategory.chatList.selectedChatId
}
}
}
}
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
@@ -36,22 +31,17 @@ Column {
id: statusChatListCategoryItem
title: statusChatListCategory.name
opened: statusChatListCategory.opened
sensor.pressAndHoldInterval: 150
showMenuButton: showActionButtons && !!statusChatListCategory.popupMenu
showMenuButton: !!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
}
statusChatListCategory.opened = !opened;
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
@@ -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)
}
]
}
+50 -63
View File
@@ -1,8 +1,4 @@
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.Components 0.1
@@ -11,10 +7,7 @@ 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
@@ -27,8 +20,6 @@ Rectangle {
property int type: StatusChatListItem.Type.PublicChat
property bool highlighted: false
property bool selected: false
property bool dragged: false
property alias sensor: sensor
signal clicked(var mouse)
signal unmute()
@@ -55,13 +46,11 @@ Rectangle {
return sensor.containsMouse || highlighted ? Theme.palette.statusChatListItem.hoverBackgroundColor : Theme.palette.baseColor4
}
opacity: dragged ? 0.7 : 1
MouseArea {
id: sensor
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
cursorShape: Qt.PointingHandCursor
acceptedButtons: Qt.LeftButton | Qt.RightButton
hoverEnabled: true
@@ -74,7 +63,7 @@ Rectangle {
anchors.verticalCenter: parent.verticalCenter
sourceComponent: !!statusChatListItem.image.source.toString() ?
statusRoundedImageCmp : statusLetterIdenticonCmp
statusRoundedImageCmp : statusLetterIdenticonCmp
}
Component {
@@ -100,8 +89,8 @@ Rectangle {
image.source: statusChatListItem.image.source
showLoadingIndicator: true
color: statusChatListItem.image.isIdenticon ?
Theme.palette.statusRoundedImage.backgroundColor :
"transparent"
Theme.palette.statusRoundedImage.backgroundColor :
"transparent"
border.width: statusChatListItem.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
}
@@ -125,27 +114,27 @@ Rectangle {
if (statusChatListItem.muted && !sensor.containsMouse && !statusChatListItem.highlighted) {
return 0.4
}
return statusChatListItem.hasMention ||
statusChatListItem.hasUnreadMessages ||
statusChatListItem.selected ||
statusChatListItem.highlighted ||
statusBadge.visible ||
sensor.containsMouse ? 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"
}
}
}
@@ -154,37 +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 && !sensor.containsMouse && !statusChatListItem.highlighted) {
return Theme.palette.directColor5
}
return statusChatListItem.hasMention ||
statusChatListItem.hasUnreadMessages ||
statusChatListItem.selected ||
statusChatListItem.highlighted ||
sensor.containsMouse ||
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.hasMention ||
statusChatListItem.hasUnreadMessages ||
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
@@ -195,7 +195,7 @@ Rectangle {
MouseArea {
id: mutedIconSensor
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onClicked: statusChatListItem.unmute()
}
@@ -205,18 +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
visible: statusBadge.value > 0
}
}
}
+14 -62
View File
@@ -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,30 +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: {
popupMenuSlot.item.popup(-popupMenuSlot.item.width + menuButton.width, menuButton.height + 4)
statusChatToolBar.menuButtonClicked()
}
Loader {
id: popupMenuSlot
active: !!statusChatToolBar.popupMenu
onLoaded: {
popupMenuSlot.item.closeHandler = function () {
menuButton.highlighted = false
}
popupMenuSlot.item.openHandler = function () {
menuButton.highlighted = true
}
}
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)
}
}
@@ -117,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 {
@@ -130,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 {
@@ -161,5 +103,15 @@ Rectangle {
}
}
Loader {
id: popupMenuSlot
active: !!statusChatToolBar.popupMenu
onLoaded: {
popupMenuSlot.item.closeHandler = function () {
menuButton.highlighted = false
}
}
}
}
@@ -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,229 +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 {
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)
}
Loader {
id: identicon
anchors.top: parent.top
anchors.topMargin: 25
anchors.left: parent.left
anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 0 : 11
active: (statusExpandableItem.type !== StatusExpandableItem.Type.Tertiary)
sourceComponent: !!statusExpandableItem.image.source.toString() ? roundedImage :
!!statusExpandableItem.icon.name.toString() ? roundedIcon : letterIdenticon
}
Component {
id: roundedImage
StatusRoundedImage {
image.source: statusExpandableItem.image.source
}
}
Component {
id: roundedIcon
StatusRoundIcon {
icon.background.width: statusExpandableItem.icon.background.width
icon.background.height: statusExpandableItem.icon.background.height
icon.background.color: statusExpandableItem.icon.background.color
icon.color: statusExpandableItem.icon.color
icon.name: statusExpandableItem.icon.name
}
}
Component {
id: letterIdenticon
StatusLetterIdenticon {
height: 40
width: 40
name: primaryText.text
letterSize: 20
color: Theme.palette.miscColor5
}
}
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: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 23 : 6
visible: expandable && !button.visible
color: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?
Theme.palette.baseColor1 :
Theme.palette.directColor1
}
MouseArea {
anchors.fill: parent
onClicked: {
if(expandable) {
expanded = !expanded
}
}
cursorShape: Qt.PointingHandCursor
visible: !button.visible && expandable
}
Loader {
id: expandableRegion
anchors.top: !!secondaryText.text ? secondaryText.bottom: primaryText.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 }
}
]
}
@@ -5,7 +5,6 @@ import StatusQ.Core.Theme 0.1
Rectangle {
id: statusLetterIdenticon
property alias identiconText: identiconText
property string name
property int letterSize: 21
@@ -15,10 +14,7 @@ Rectangle {
radius: width / 2
StatusBaseText {
id: identiconText
text: ((statusLetterIdenticon.name.charAt(0) === "#")
|| (statusLetterIdenticon.name.charAt(0) === "@") ?
statusLetterIdenticon.name.charAt(1) : statusLetterIdenticon.name.charAt(0)).toUpperCase()
text: (statusLetterIdenticon.name.charAt(0) == "#" ? statusLetterIdenticon.name.charAt(1) : statusLetterIdenticon.name.charAt(0)).toUpperCase()
font.weight: Font.Bold
font.pixelSize: statusLetterIdenticon.letterSize
color: Qt.rgba(255, 255, 255, 0.7)
+17 -136
View File
@@ -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
@@ -10,85 +8,55 @@ Rectangle {
id: statusListItem
implicitWidth: 448
implicitHeight: Math.max(64, statusListItemTitleArea.height + 16)
implicitHeight: 64
enum Type {
Primary,
Secondary,
Danger
Secondary
}
color: {
if (sensor.containsMouse) {
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 type === StatusListItem.Type.Primary ?
Theme.palette.baseColor2 :
Theme.palette.statusListItem.secondaryHoverBackgroundColor
}
return Theme.palette.statusListItem.backgroundColor
}
radius: 8
property string itemId: ""
property string titleId: ""
property string title: ""
property string titleAsideText: ""
property string subTitle: ""
property string tertiaryTitle: ""
property alias badge: statusListItemBadge
property real leftPadding: 16
property real rightPadding: 16
property bool enabled: true
property StatusIconSettings icon: StatusIconSettings {
height: 20
width: 20
rotation: 0
isLetterIdenticon: false
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 string label: ""
property int type: StatusListItem.Type.Primary
property alias sensor: sensor
property alias statusListItemIcon: iconOrImage
property alias statusListItemTitle: statusListItemTitle
property alias statusListItemSubTitle: statusListItemSubTitle
property alias statusListItemTertiaryTitle: statusListItemTertiaryTitle
property alias statusListItemComponentsSlot: statusListItemComponentsSlot
property list<Item> components
signal clicked(string itemId)
signal titleClicked(string titleId)
onComponentsChanged: {
if (components.length) {
for (let idx in components) {
@@ -100,32 +68,18 @@ Rectangle {
MouseArea {
id: sensor
enabled: statusListItem.enabled
anchors.fill: parent
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
acceptedButtons: Qt.LeftButton | Qt.RightButton
hoverEnabled: true
onClicked: {
statusListItem.clicked(statusListItem.itemId)
}
Loader {
id: iconOrImage
anchors.left: parent.left
anchors.leftMargin: statusListItem.leftPadding
anchors.top: parent.top
anchors.topMargin: 12
sourceComponent: {
if (statusListItem.icon.isLetterIdenticon) {
return statusLetterIdenticon
}
return !!statusListItem.icon.name ? statusRoundedIcon : statusRoundedImage
}
active: statusListItem.icon.isLetterIdenticon ||
!!statusListItem.icon.name ||
!!statusListItem.image.source.toString()
anchors.verticalCenter: parent.verticalCenter
sourceComponent: !!statusListItem.icon.name ? statusRoundedIcon : statusRoundedImage
active: !!statusListItem.icon.name || !!statusListItem.image.source.toString()
}
Component {
@@ -135,7 +89,6 @@ Rectangle {
icon.height: statusListItem.icon.height
icon.name: statusListItem.icon.name
icon.rotation: statusListItem.icon.rotation
icon.color: statusListItem.icon.color
color: statusListItem.icon.background.color
width: statusListItem.icon.background.width
height: statusListItem.icon.background.height
@@ -148,111 +101,39 @@ Rectangle {
image.source: statusListItem.image.source
image.height: statusListItem.image.height
image.width: statusListItem.image.width
color: statusListItem.image.isIdenticon ?
Theme.palette.statusRoundedImage.backgroundColor :
"transparent"
border.width: statusListItem.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
}
}
Component {
id: statusLetterIdenticon
StatusLetterIdenticon {
width: statusListItem.icon.background.width
height: statusListItem.icon.background.height
color: statusListItem.icon.background.color
name: statusListItem.title
}
}
Item {
id: statusListItemTitleArea
anchors.left: iconOrImage.active ? iconOrImage.right : parent.left
anchors.right: statusListItemLabel.visible ?
statusListItemLabel.left : statusListItemComponentsSlot.left
anchors.leftMargin: statusListItem.leftPadding
anchors.rightMargin: statusListItem.rightPadding
anchors.verticalCenter: parent.verticalCenter
height: childrenRect.height
height: statusListItemTitle.height + (statusListItemSubTitle.visible ? statusListItemSubTitle.height : 0)
StatusBaseText {
id: statusListItemTitle
text: statusListItem.title
font.pixelSize: 15
height: visible ? contentHeight : 0
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
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
cursorShape: containsMouse? Qt.PointingHandCursor : Qt.ArrowCursor
hoverEnabled: true
propagateComposedEvents: true
onClicked: {
statusListItem.titleClicked(statusListItem.titleId)
mouse.accepted = false
}
}
}
StatusBaseText {
id: statusListItemTitleAsideText
anchors.left: statusListItemTitle.right
anchors.leftMargin: 4
anchors.verticalCenter: statusListItemTitle.verticalCenter
text: statusListItem.titleAsideText
font.pixelSize: 10
color: Theme.palette.baseColor1
visible: !!statusListItem.titleAsideText
}
StatusBaseText {
id: statusListItemSubTitle
anchors.top: statusListItemTitle.bottom
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
visible: !!statusListItem.subTitle
}
}
StatusBaseText {
id: statusListItemLabel
anchors.verticalCenter: parent.verticalCenter
anchors.right: statusListItemComponentsSlot.left
anchors.rightMargin: statusListItemComponentsSlot.width > 0 ? 10 : 0
@@ -1,80 +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
}
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
}
}
}
}
@@ -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) {
+1 -2
View File
@@ -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
}
-2
View File
@@ -19,5 +19,3 @@ StatusNavigationPanelHeadline 0.1 StatusNavigationPanelHeadline.qml
StatusRoundIcon 0.1 StatusRoundIcon.qml
StatusRoundedImage 0.1 StatusRoundedImage.qml
StatusMacWindowButtons 0.1 StatusMacWindowButtons.qml
StatusListItemBadge 0.1 StatusListItemBadge.qml
StatusExpandableItem 0.1 StatusExpandableItem.qml
+80 -199
View File
@@ -20,14 +20,9 @@ Item {
property alias selectedTextColor: edit.selectedTextColor
property alias selectionStart: edit.selectionStart
property alias selectionEnd: edit.selectionEnd
property alias cursorPosition: edit.cursorPosition
property alias edit: edit
property alias text: edit.text
property alias color: edit.color
property alias font: edit.font
property alias focussed: edit.activeFocus
property alias verticalAlignmet: edit.verticalAlignment
property alias horizontalAlignment: edit.horizontalAlignment
@@ -37,229 +32,115 @@ Item {
property real leftPadding: 16
property real rightPadding: 16
property real topPadding: 12
property real bottomPadding: 12
property real topPadding: 11
property real bottomPadding: 11
property real minimumHeight: 0
property real maximumHeight: 0
property int maximumLength: 0
property bool valid: true
property bool pristine: true
property bool dirty: false
property bool pending: false
property bool leftIcon: true
property StatusIconSettings icon: StatusIconSettings {
width: 24
height: 24
name: ""
color: Theme.palette.baseColor1
}
property Item component
onClearableChanged: {
if (clearable && !component) {
clearButtonLoader.active = true
clearButtonLoader.parent = statusBaseInputComponentSlot
} else {
clearButtonLoader.active = false
}
}
onComponentChanged: {
if (!!component) {
component.parent = statusBaseInputComponentSlot
}
}
implicitWidth: 448
implicitHeight: multiline ? Math.max((edit.implicitHeight + topPadding + bottomPadding), 44) : 44
implicitWidth: 200
implicitHeight: multiline ? Math.max(edit.implicitHeight + topPadding + bottomPadding, 40) : 40
Rectangle {
width: parent.width
height: maximumHeight != 0 ? Math.min(
minimumHeight != 0 ? Math.max(statusBaseInput.implicitHeight, minimumHeight)
: statusBaseInput.implicitHeight, maximumHeight) : parent.height
minimumHeight != 0 ? Math.max(statusBaseInput.implicitHeight, minimumHeight)
: implicitHeight,
maximumHeight)
: parent.height
color: Theme.palette.baseColor2
radius: 8
clip: true
border.width: 1
border.color: {
if (!statusBaseInput.valid && statusBaseInput.dirty) {
return Theme.palette.dangerColor1;
}
if (edit.activeFocus) {
return Theme.palette.primaryColor1;
}
return sensor.containsMouse ? Theme.palette.primaryColor2 : "transparent"
}
Flickable {
id: flick
MouseArea {
id: sensor
enabled: !edit.activeFocus
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.IBeamCursor
onClicked: {
edit.forceActiveFocus()
anchors.leftMargin: statusBaseInput.leftPadding
anchors.rightMargin: statusBaseInput.rightPadding + clearable ? clearButtton.width : 0
anchors.topMargin: statusBaseInput.topPadding
anchors.bottomMargin: statusBaseInput.bottomPadding
contentWidth: edit.paintedWidth
contentHeight: edit.paintedHeight
clip: true
QC.ScrollBar.vertical: QC.ScrollBar { interactive: multiline }
function ensureVisible(r) {
if (contentX >= r.x)
contentX = r.x;
else if (contentX+width <= r.x+r.width)
contentX = r.x+r.width-width;
if (contentY >= r.y)
contentY = r.y;
else if (contentY+height <= r.y+r.height)
contentY = r.y+r.height-height;
}
StatusIcon {
id: statusIcon
anchors.topMargin: 10
anchors.left: statusBaseInput.leftIcon ? parent.left : undefined
anchors.right: !statusBaseInput.leftIcon ? parent.right : undefined
anchors.leftMargin: 10
anchors.rightMargin: 10
TextEdit {
id: edit
width: flick.width
selectByMouse: true
anchors.verticalCenter: parent.verticalCenter
icon: statusBaseInput.icon.name
width: statusBaseInput.icon.width
height: statusBaseInput.icon.height
color: statusBaseInput.icon.color
visible: !!statusBaseInput.icon.name
}
focus: true
Flickable {
id: flick
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.left: (statusIcon.visible && statusBaseInput.leftIcon) ?
statusIcon.right : parent.left
anchors.right: {
if (!!statusBaseInput.component) {
return statusBaseInputComponentSlot.left
font.pixelSize: 15
font.family: Theme.palette.baseFont.name
color: Theme.palette.directColor1
onCursorRectangleChanged: flick.ensureVisible(cursorRectangle)
wrapMode: TextEdit.NoWrap
Keys.onReturnPressed: {
if (multiline) {
event.accepted = false
} else {
event.accepted = true
}
return statusIcon.visible && !statusBaseInput.leftIcon ? statusIcon.left : parent.right
}
anchors.leftMargin: statusIcon.visible && statusBaseInput.leftIcon ? 8
: statusBaseInput.leftPadding
anchors.rightMargin: {
return clearable ? clearButtonLoader.width + 12 :
(statusIcon.visible && !leftIcon) || !!statusBaseInput.component ? 8 : 0
Keys.onEnterPressed: {
if (multiline) {
event.accepted = false
} else {
event.accepted = true
}
}
anchors.topMargin: statusBaseInput.topPadding
anchors.bottomMargin: statusBaseInput.bottomPadding
contentWidth: edit.paintedWidth
contentHeight: edit.paintedHeight
boundsBehavior: Flickable.StopAtBounds
QC.ScrollBar.vertical: QC.ScrollBar { interactive: multiline; enabled: multiline }
function ensureVisible(r) {
if (contentX >= r.x)
contentX = r.x;
else if (contentX+width <= r.x+r.width)
contentX = r.x+r.width-width;
if (contentY >= r.y)
contentY = r.y;
else if (contentY+height <= r.y+r.height)
contentY = r.y+r.height-height;
}
TextEdit {
id: edit
property string previousText: text
width: flick.width
height: flick.height
verticalAlignment: Text.AlignVCenter
selectByMouse: true
selectionColor: Theme.palette.primaryColor2
selectedTextColor: color
focus: true
StatusBaseText {
id: placeholder
visible: edit.text.length === 0
anchors.left: parent.left
anchors.right: parent.right
font.pixelSize: 15
elide: StatusBaseText.ElideRight
font.family: Theme.palette.baseFont.name
color: Theme.palette.directColor1
onCursorRectangleChanged: { flick.ensureVisible(cursorRectangle); }
wrapMode: statusBaseInput.multiline ? Text.WrapAtWordBoundaryOrAnywhere : TextEdit.NoWrap
onActiveFocusChanged: {
if (statusBaseInput.pristine) {
statusBaseInput.pristine = false
}
}
Keys.onReturnPressed: {
if (multiline) {
event.accepted = false
} else {
event.accepted = true
}
}
Keys.onEnterPressed: {
if (multiline) {
event.accepted = false
} else {
event.accepted = true
}
}
Keys.forwardTo: [statusBaseInput]
onTextChanged: {
statusBaseInput.dirty = true
if (statusBaseInput.maximumLength > 0) {
if (text.length > statusBaseInput.maximumLength) {
var cursor = cursorPosition;
text = previousText;
if (cursor > text.length) {
cursorPosition = text.length;
} else {
cursorPosition = cursor-1;
}
}
previousText = text
}
}
StatusBaseText {
id: placeholder
visible: (edit.text.length === 0)
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: statusBaseInput.rightPadding
anchors.verticalCenter: parent.verticalCenter
font.pixelSize: 15
elide: StatusBaseText.ElideRight
font.family: Theme.palette.baseFont.name
color: statusBaseInput.enabled ? Theme.palette.baseColor1 :
Theme.palette.directColor6
}
color: Theme.palette.baseColor1
}
} // Flickable
Item {
id: statusBaseInputComponentSlot
anchors.right: parent.right
anchors.rightMargin: 12
width: childrenRect.width
height: childrenRect.height
anchors.verticalCenter: parent.verticalCenter
}
}
} // Flickable
} // Rectangle
Loader {
id: clearButtonLoader
sourceComponent: StatusFlatRoundButton {
id: clearButton
visible: edit.text.length != 0 &&
statusBaseInput.clearable &&
!statusBaseInput.multiline &&
edit.activeFocus
type: StatusFlatRoundButton.Type.Secondary
width: 24
height: 24
icon.name: "clear"
icon.width: 16
icon.height: 16
icon.color: Theme.palette.baseColor1
onClicked: {
edit.clear()
}
StatusFlatRoundButton {
id: clearButtton
visible: edit.text.length != 0 && statusBaseInput.clearable && !statusBaseInput.multiline
anchors.right: parent.right
anchors.rightMargin: 11
anchors.verticalCenter: parent.verticalCenter
type: StatusFlatRoundButton.Type.Secondary
width: 14
height: 14
icon.name: "clear"
icon.width: 14
icon.height: 14
onClicked: {
edit.clear()
}
}
}
+28 -53
View File
@@ -7,11 +7,11 @@ import StatusQ.Components 0.1
Rectangle {
id: statusChatInfoButton
implicitWidth: identicon.width +
Math.max(
statusChatInfoButtonTitle.anchors.leftMargin + statusChatInfoButtonTitle.implicitWidth,
statusChatInfoButtonTitle.anchors.leftMargin + statusChatInfoButtonSubTitle.implicitWidth
) + 8
implicitWidth: identicon.width +
Math.max(
statusChatInfoButtonTitle.anchors.leftMargin + statusChatInfoButtonTitle.width,
statusChatInfoButtonTitle.anchors.leftMargin + statusChatInfoButtonSubTitle.width
) + 8
implicitHeight: 48
property string title: ""
@@ -57,8 +57,8 @@ Rectangle {
anchors.verticalCenter: parent.verticalCenter
sourceComponent: !!statusChatInfoButton.image.source.toString() ?
statusRoundImageComponent :
statusLetterIdenticonComponent
statusRoundImageComponent :
statusLetterIdenticonComponent
}
Component {
@@ -103,16 +103,9 @@ Rectangle {
anchors.left: identicon.right
anchors.leftMargin: 8
width: Math.min(parent.width - anchors.leftMargin
- identicon.width - identicon.anchors.leftMargin,
implicitWidth)
width: statusIcon.width + chatName.anchors.leftMargin + chatName.width + (mutedIcon.visible ? mutedIcon.width + mutedIcon.anchors.leftMargin : 0)
height: chatName.height
implicitWidth: statusIcon.width + chatName.anchors.leftMargin + chatName.implicitWidth
+ mutedDelta
property real mutedDelta: mutedIcon.visible ? mutedIcon.width + 8 : 0
StatusIcon {
id: statusIcon
anchors.top: parent.top
@@ -124,17 +117,17 @@ Rectangle {
color: statusChatInfoButton.muted ? Theme.palette.baseColor1 : Theme.palette.directColor1
icon: {
switch (statusChatInfoButton.type) {
case StatusChatInfoButton.Type.PublicCat:
return "tiny/public-chat"
break;
case StatusChatInfoButton.Type.GroupChat:
return "tiny/group"
break;
case StatusChatInfoButton.Type.CommunityChat:
return "tiny/channel"
break;
default:
return "tiny/public-chat"
case StatusChatInfoButton.Type.PublicCat:
return "tiny/public-chat"
break;
case StatusChatInfoButton.Type.GroupChat:
return "tiny/group"
break;
case StatusChatInfoButton.Type.CommunityChat:
return "tiny/channel"
break;
default:
return "tiny/public-chat"
}
}
}
@@ -146,15 +139,10 @@ Rectangle {
anchors.leftMargin: statusIcon.visible ? 1 : 0
anchors.top: parent.top
elide: Text.ElideRight
width: Math.min(implicitWidth, parent.width
- statusIcon.width
- statusChatInfoButtonTitle.mutedDelta)
text: statusChatInfoButton.type === StatusChatInfoButton.Type.PublicChat &&
!statusChatInfoButton.title.startsWith("#") ?
"#" + statusChatInfoButton.title :
statusChatInfoButton.title
!statusChatInfoButton.title.startsWith("#") ?
"#" + statusChatInfoButton.title :
statusChatInfoButton.title
color: statusChatInfoButton.muted ? Theme.palette.directColor5 : Theme.palette.directColor1
font.pixelSize: 15
font.weight: Font.Medium
@@ -174,7 +162,7 @@ Rectangle {
MouseArea {
id: mutedIconSensor
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onClicked: statusChatInfoButton.unmute()
}
@@ -193,28 +181,15 @@ Rectangle {
id: statusChatInfoButtonSubTitle
anchors.left: statusChatInfoButtonTitle.left
anchors.top: statusChatInfoButtonTitle.bottom
visible: !!statusChatInfoButton.subTitle || statusChatInfoButton.pinnedMessagesCount > 0
visible: !!statusChatInfoButton.subTitle
height: visible ? chatType.height : 0
width: Math.min(parent.width - statusChatInfoButtonTitle.anchors.leftMargin
- identicon.width - identicon.anchors.leftMargin - 8,
implicitWidth)
implicitWidth: chatType.implicitWidth + pinIconDelta + 8
property real pinIconDelta: pinIcon.visible ? pinIcon.width + pinIcon.anchors.leftMargin
+ divider.width + divider.anchors.leftMargin
: 0
width: childrenRect.width
StatusBaseText {
id: chatType
text: statusChatInfoButton.subTitle
color: Theme.palette.baseColor1
font.pixelSize: 12
elide: Text.ElideRight
width: Math.min(parent.width - (pinIcon.visible ? divider.width + divider.anchors.leftMargin + pinIcon.width + pinIcon.anchors.leftMargin : 0),
implicitWidth)
}
Rectangle {
@@ -225,13 +200,13 @@ Rectangle {
anchors.left: chatType.right
anchors.leftMargin: 4
anchors.verticalCenter: chatType.verticalCenter
visible: !!chatType.text && pinIcon.visible
visible: pinIcon.visible
}
StatusIcon {
id: pinIcon
anchors.left: divider.visible ? divider.right : parent.left
anchors.left: divider.right
anchors.leftMargin: -2
anchors.verticalCenter: chatType.verticalCenter
height: 14
@@ -256,7 +231,7 @@ Rectangle {
id: pinCountSensor
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
cursorShape: Qt.PointingHandCursor
onClicked: statusChatInfoButton.pinnedMessagesCountClicked(mouse)
}
}
@@ -1,6 +1,5 @@
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Core 0.1
StatusFlatRoundButton {
id: statusChatListCategoryItemButton
@@ -10,7 +9,7 @@ StatusFlatRoundButton {
radius: 4
property bool highlighted: false
property StatusTooltipSettings tooltip: StatusTooltipSettings {}
property alias tooltip: statusToolTip
type: StatusFlatRoundButton.Type.Secondary
icon.width: 20
@@ -23,9 +22,6 @@ StatusFlatRoundButton {
StatusToolTip {
id: statusToolTip
visible: !!text && parent.hovered
text: tooltip.text
orientation: tooltip.orientation
offset: tooltip.offset
}
}
-1
View File
@@ -36,7 +36,6 @@ CheckBox {
verticalAlignment: Text.AlignVCenter
wrapMode: Text.WordWrap
width: parent.width
color: Theme.palette.directColor1
leftPadding: !!statusCheckBox.text ? statusCheckBox.indicator.width + statusCheckBox.spacing
: statusCheckBox.indicator.width
}
+2 -19
View File
@@ -34,7 +34,6 @@ Rectangle {
property bool loading: false
property alias hovered: sensor.containsMouse
property alias tooltip: statusToolTip
property bool highlighted: false
@@ -79,15 +78,6 @@ Rectangle {
return "transparent";
}
}
property color highlightedColor: {
switch(statusFlatRoundButton.type) {
case StatusFlatRoundButton.Type.Primary:
return Theme.palette.primaryColor3;
case StatusFlatRoundButton.Type.Secondary:
return Theme.palette.baseColor4;
}
}
}
implicitWidth: 44
@@ -96,10 +86,8 @@ Rectangle {
color: {
if (statusFlatRoundButton.enabled) {
if (sensor.containsMouse) {
return backgroundSettings.hoverColor
}
return highlighted ? backgroundSettings.highlightedColor : backgroundSettings.color
return sensor.containsMouse || highlighted ? backgroundSettings.hoverColor
: backgroundSettings.color
} else {
return backgroundSettings.disabledColor
}
@@ -152,9 +140,4 @@ Rectangle {
onReleased: statusFlatRoundButton.released(mouse)
onPressAndHold: statusFlatRoundButton.pressAndHold(mouse)
} // Sensor
StatusToolTip {
id: statusToolTip
visible: !!text && parent.hovered
} // Tooltip
} // Rectangle
-209
View File
@@ -1,209 +0,0 @@
import QtQuick 2.14
import StatusQ.Core 0.1
import StatusQ.Core.Backpressure 1.0
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Controls.Validators 0.1
Item {
id: root
implicitWidth: 480
height: (label.visible ?
label.anchors.topMargin +
label.height :
charLimitLabel.visible ?
charLimitLabel.anchors.topMargin +
charLimitLabel.height :
0) +
statusBaseInput.anchors.topMargin +
statusBaseInput.height +
(errorMessage.visible ?
errorMessage.anchors.topMargin +
errorMessage.height :
0) + 8
property alias input: statusBaseInput
property alias valid: statusBaseInput.valid
property alias pending: statusBaseInput.pending
property alias text: statusBaseInput.text
property string label: ""
property string secondaryLabel: ""
property int charLimit: 0
property string errorMessage: ""
property real leftPadding: 16
property real rightPadding: 16
property list<StatusValidator> validators
property list<StatusAsyncValidator> asyncValidators
property int validationMode: StatusInput.ValidationMode.OnlyWhenDirty
property string validatedValue
property var pendingValidators: []
enum ValidationMode {
OnlyWhenDirty, // validates input only after it has become dirty
Always // validates input even before it has become dirty
}
property var errors: ({})
property var asyncErrors: ({})
function reset() {
statusBaseInput.valid = false
statusBaseInput.pristine = true
statusBaseInput.text = ""
root.errorMessage = ""
}
function validate() {
if (!statusBaseInput.dirty && validationMode === StatusInput.ValidationMode.OnlyWhenDirty) {
return
}
statusBaseInput.valid = true
if (validators.length) {
for (let idx in validators) {
let validator = validators[idx]
let result = validator.validate(statusBaseInput.text)
if (typeof result === "boolean" && result) {
statusBaseInput.valid = statusBaseInput.valid && true
delete errors[validator.name]
} else {
if (!errors) {
errors = {}
}
result.errorMessage = validator.errorMessage
errors[validator.name] = result
statusBaseInput.valid = statusBaseInput.valid && false
}
}
if (errors){
let errs = Object.values(errors)
if (errs && errs[0]) {
errorMessage.text = errs[0].errorMessage || root.errorMessage;
} else {
errorMessage.text = ""
}
}
}
if (asyncValidators.length && !Object.values(errors).length) {
for (let idx in asyncValidators) {
let asyncValidator = asyncValidators[idx]
asyncValidator.validationComplete.connect(function (value, valid) {
updateAsyncValidity(asyncValidator.name, value, valid)
})
root.pending = true
pendingValidators.push(asyncValidator.name)
asyncValidator.asyncOperationInternal(statusBaseInput.text)
}
} else if (!asyncValidators.length && !Object.values(errors).length) {
root.validatedValue = root.text
}
}
function updateAsyncValidity(validatorName, value, result) {
if (!asyncErrors) {
asyncErrors = {}
}
if (typeof result === "boolean" && result) {
if (asyncErrors[validatorName] !== undefined) {
delete asyncErrors[validatorName]
}
errorMessage.text = ""
root.validatedValue = value
} else {
asyncErrors[validatorName] = result
for (let idx in asyncValidators) {
errorMessage.text = asyncValidators[idx].errorMessage || root.errorMessage
break;
}
}
pendingValidators = pendingValidators.filter(v => v !== validatorName)
root.pending = pendingValidators.length > 0
root.valid = Object.values(asyncErrors).length == 0
}
Component.onCompleted: validate()
Row {
id: labelRow
anchors.top: parent.top
anchors.left: parent.left
anchors.topMargin: visible ? 8 : 0
anchors.leftMargin: root.leftPadding
anchors.right: (charLimitLabel.visible ? charLimitLabel.right : parent.right)
anchors.rightMargin: root.rightPadding
height: visible ? 17 : 0
visible: !!root.label
spacing: 5
StatusBaseText {
id: label
elide: Text.ElideRight
text: root.label
font.pixelSize: 15
color: statusBaseInput.enabled ? Theme.palette.directColor1 : Theme.palette.baseColor1
}
StatusBaseText {
id: secondaryLabel
height: visible ? 17 : 0
visible: !!root.secondaryLabel
elide: Text.ElideRight
text: root.secondaryLabel
font.pixelSize: 15
color: Theme.palette.baseColor1
}
}
StatusBaseText {
id: charLimitLabel
height: visible ? implicitHeight : 0
anchors.top: parent.top
anchors.right: parent.right
anchors.topMargin: visible ? 11 : 0
anchors.rightMargin: root.rightPadding
visible: root.charLimit > 0
text: "%1 / %2".arg(statusBaseInput.text.length).arg(root.charLimit)
font.pixelSize: 12
color: statusBaseInput.enabled ? Theme.palette.baseColor1 : Theme.palette.directColor6
}
StatusBaseInput {
id: statusBaseInput
anchors.top: labelRow.visible ? labelRow.bottom :
charLimitLabel.visible ? charLimitLabel.bottom : parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: charLimitLabel.visible ? 11 : 8
anchors.leftMargin: root.leftPadding
anchors.rightMargin: root.rightPadding
maximumLength: root.charLimit
onTextChanged: root.validate()
Keys.forwardTo: [root]
}
StatusBaseText {
id: errorMessage
anchors.top: statusBaseInput.bottom
anchors.topMargin: 11
anchors.right: parent.right
anchors.rightMargin: root.rightPadding
anchors.left: parent.left
anchors.leftMargin: root.leftPadding
height: visible ? implicitHeight : 0
visible: !!text && !statusBaseInput.valid
font.pixelSize: 12
color: Theme.palette.dangerColor1
horizontalAlignment: Text.AlignRight
wrapMode: Text.WordWrap
}
}
@@ -1,59 +0,0 @@
import QtQuick 2.14
import QtQuick.Controls 2.12
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
Button {
id: root
implicitWidth: 446
implicitHeight: 44
property color bgColor: Theme.palette.baseColor2
property color contentColor: Theme.palette.baseColor1
signal clicked()
background: Item {
anchors.fill: parent
Rectangle {
id: background
anchors.fill: parent
radius: 8
color: root.bgColor
}
StatusIcon {
id: nextIcon
anchors.right: parent.right
anchors.rightMargin: 8
anchors.verticalCenter: parent.verticalCenter
icon: "next"
color: !Qt.colorEqual(root.contentColor, Theme.palette.baseColor1)
? root.contentColor : Theme.palette.directColor1
}
}
contentItem: Item {
anchors.fill: parent
StatusBaseText {
id: textLabel
anchors {
fill: parent
leftMargin: 16
}
verticalAlignment: Text.AlignVCenter
font.pixelSize: 15
color: root.contentColor
text: root.text
}
}
MouseArea {
id: mouseArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
root.clicked();
}
}
}
@@ -1,14 +0,0 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import StatusQ.Core.Theme 0.1
TabBar {
id: statusSwitchTabBar
padding: 1
background: Rectangle {
implicitHeight: 36
color: Theme.palette.directColor7
radius: 8
}
}
@@ -1,52 +0,0 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtGraphicalEffects 1.13
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
TabButton {
id: statusSwitchTabButton
contentItem: Item {
height: 36
MouseArea {
id: sensor
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onPressed: mouse.accepted = false
onReleased: mouse.accepted = false
StatusBaseText {
id: label
text: statusSwitchTabButton.text
color: Theme.palette.primaryColor1
font.weight: Font.Medium
font.pixelSize: 15
horizontalAlignment: Text.AlignHCenter
anchors.centerIn: parent
}
}
}
background: Rectangle {
id: controlBackground
implicitHeight: 36
implicitWidth: 148
color: statusSwitchTabButton.checked ?
Theme.palette.statusSwitchTab.backgroundColor :
"transparent"
radius: 8
layer.enabled: true
layer.effect: DropShadow {
horizontalOffset: 0
verticalOffset: 0
radius: 10
samples: 25
spread: 0
color: Theme.palette.dropShadow
}
}
}
+3 -6
View File
@@ -15,8 +15,6 @@ ToolTip {
property int maxWidth: 800
property int orientation: StatusToolTip.Orientation.Top
property int offset: 0
property alias arrow: arrow
implicitWidth: Math.min(maxWidth, textContent.implicitWidth + 16)
leftPadding: 8
@@ -34,7 +32,6 @@ ToolTip {
anchors.bottomMargin: 8
}
Rectangle {
id: arrow
color: statusToolTipContentBackground.color
height: 20
width: 20
@@ -42,13 +39,13 @@ ToolTip {
radius: 1
x: {
if (orientation === StatusToolTip.Orientation.Top || orientation === StatusToolTip.Orientation.Bottom) {
return statusToolTipBackground.width / 2 - width / 2 + offset
return statusToolTipBackground.width / 2 - width / 2
}
if (orientation === StatusToolTip.Orientation.Left) {
return statusToolTipContentBackground.width - (width / 2) - 8 + offset
return statusToolTipContentBackground.width - (width / 2) - 8
}
if (orientation === StatusToolTip.Orientation.Right) {
return -width/2 + 8 + offset
return -width/2 + 8
}
}
y: {
@@ -1,15 +0,0 @@
import StatusQ.Controls 0.1
import StatusQ.Core.Utils 0.1
StatusValidator {
name: "addressOrEns"
errorMessage: "Please enter a valid address or ENS name."
validate: function (t) {
return Utils.isValidAddress(t) || Utils.isValidEns(t) ?
true :
{ actual: t }
}
}
@@ -1,13 +0,0 @@
import StatusQ.Controls 0.1
import StatusQ.Core.Utils 0.1
StatusValidator {
name: "address"
errorMessage: "Please enter a valid address."
validate: function (t) {
return Utils.isValidAddress(t) ? true : { actual: t }
}
}
@@ -1,15 +0,0 @@
import StatusQ.Controls 0.1
import StatusQ.Core.Utils 0.1
StatusAsyncValidator {
readonly property string uuid: Utils.uuid()
name: "asyncEns"
errorMessage: "ENS name could not be resolved in to an address"
validate: function (asyncResult) {
return Utils.isValidAddress(asyncResult)
}
}
@@ -1,32 +0,0 @@
import QtQuick 2.13
import StatusQ.Core.Backpressure 1.0
Item {
id: statusAsyncValidator
property string name: ""
property string errorMessage: "invalid input"
signal asyncComplete(var result)
signal validationComplete(var value, bool valid)
// Prevents firing async operations before time has elapsed. If multiple
// calls are attempted, the timer resets each time.
property int debounceTime: 600
property var validate: function (value) {
return value === "async result"
}
property var asyncOperation: function(inputText) {
// Do something with the input text. Once completed, fire the
// `asyncComplete` signal
asyncComplete("async result")
}
readonly property var asyncOperationInternal: Backpressure.debounce(statusAsyncValidator, debounceTime, function(inputText) {
statusAsyncValidator.asyncOperation(inputText)
})
onAsyncComplete: function(result) {
validationComplete(result, validate(result))
}
}
@@ -1,22 +0,0 @@
import StatusQ.Controls 0.1
StatusValidator {
property int minLength: 0
name: "minLength"
errorMessage: {
minLength === 1 ?
"Please enter a value" :
`The value must be at least ${minLength} characters.`
}
validate: function (value) {
return value.length >= minLength ? true : {
min: minLength,
actual: value.length
}
}
}
@@ -1,13 +0,0 @@
import QtQuick 2.13
import StatusQ.Controls 0.1
QtObject {
id: statusValidator
property string name: ""
property string errorMessage: "invalid input"
property var validate: function (value) {
return true
}
}
-9
View File
@@ -1,9 +0,0 @@
module StatusQ.Controls.Validators
StatusAddressValidator 0.1 StatusAddressValidator.qml
StatusAddressOrEnsValidator 0.1 StatusAddressOrEnsValidator.qml
StatusAsyncValidator 0.1 StatusAsyncValidator.qml
StatusAsyncEnsValidator 0.1 StatusAsyncEnsValidator.qml
StatusMinLengthValidator 0.1 StatusMinLengthValidator.qml
StatusMaxLengthValidator 0.1 StatusMaxLengthValidator.qml
StatusValidator 0.1 StatusValidator.qml
-4
View File
@@ -15,7 +15,3 @@ StatusRadioButton 0.1 StatusRadioButton.qml
StatusCheckBox 0.1 StatusCheckBox.qml
StatusSlider 0.1 StatusSlider.qml
StatusBaseInput 0.1 StatusBaseInput.qml
StatusInput 0.1 StatusInput.qml
StatusPickerButton 0.1 StatusPickerButton.qml
StatusSwitchTabButton 0.1 StatusSwitchTabButton.qml
StatusSwitchTabBar 0.1 StatusSwitchTabBar.qml
@@ -1,123 +0,0 @@
pragma Singleton
import QtQuick 2.0
Item {
id: backpressure
property var _timers: ({})
property int _nextId: 0
function setTimeout(owner, timeout, callback) {
var tid = ++_nextId;
var cleanup = function() {
if (tid !== null) {
clearTimeout(tid);
}
}
if (!owner) {
owner = backpressure;
}
owner.Component.destruction.connect(cleanup);
var obj = Qt.createQmlObject('import QtQuick 2.0; Timer {running: false; repeat: false; interval: ' + timeout + '}', backpressure, "setTimeout");
obj.triggered.connect(function() {
callback();
obj.destroy();
owner.Component.destruction.disconnect(cleanup);
delete _timers[tid];
});
obj.running = true;
_timers[tid] = obj;
return tid;
}
function clearTimeout(timerId) {
if (!_timers.hasOwnProperty(timerId)) {
return;
}
var timer = _timers[timerId];
timer.stop();
timer.destroy();
delete _timers[timerId];
}
function oneInTime(owner, duration, callback) {
var pending = false;
var timerId = null;
return function() {
if (pending) {
return;
}
pending = true;
var args = arguments;
callback.apply(null, args);
timerId = setTimeout(owner, duration , function() {
pending = false;
}, duration);
}
}
function promisedOneInTime(owner, callback) {
var q = priv.loadPromiseLib();
var promise = null;
return function() {
var args = arguments;
if (promise !== null) {
return q.rejected();
}
promise = q.promise(function(fulfill, reject) {
fulfill(callback.apply(null, args));
});
promise.then(function() {
promise = null;
}, function() {
promise = null;
});
return promise;
};
}
function debounce(owner, duration, callback) {
var timerId = null;
return function() {
var args = arguments;
if (timerId !== null) {
clearTimeout(timerId);
}
timerId = setTimeout(owner, duration, function() {
timerId = null;
callback.apply(null, args);
});
}
}
QtObject {
id: priv
property var q: null
function loadPromiseLib() {
if (q !== null) {
return q.q;
}
q = Qt.createQmlObject('import QtQuick 2.0; import QuickPromise 1.0; Item { property var q: Q;}', backpressure);
if (q.hasOwnProperty("qmlErrors")) {
console.error("Backpressure: Failed to load QuickPromise. Please check your installation.");
}
return q.q;
}
}
}
-201
View File
@@ -1,201 +0,0 @@
Apache License
Version 2.0, January 2004
http://www.apache.org/licenses/
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
1. Definitions.
"License" shall mean the terms and conditions for use, reproduction,
and distribution as defined by Sections 1 through 9 of this document.
"Licensor" shall mean the copyright owner or entity authorized by
the copyright owner that is granting the License.
"Legal Entity" shall mean the union of the acting entity and all
other entities that control, are controlled by, or are under common
control with that entity. For the purposes of this definition,
"control" means (i) the power, direct or indirect, to cause the
direction or management of such entity, whether by contract or
otherwise, or (ii) ownership of fifty percent (50%) or more of the
outstanding shares, or (iii) beneficial ownership of such entity.
"You" (or "Your") shall mean an individual or Legal Entity
exercising permissions granted by this License.
"Source" form shall mean the preferred form for making modifications,
including but not limited to software source code, documentation
source, and configuration files.
"Object" form shall mean any form resulting from mechanical
transformation or translation of a Source form, including but
not limited to compiled object code, generated documentation,
and conversions to other media types.
"Work" shall mean the work of authorship, whether in Source or
Object form, made available under the License, as indicated by a
copyright notice that is included in or attached to the work
(an example is provided in the Appendix below).
"Derivative Works" shall mean any work, whether in Source or Object
form, that is based on (or derived from) the Work and for which the
editorial revisions, annotations, elaborations, or other modifications
represent, as a whole, an original work of authorship. For the purposes
of this License, Derivative Works shall not include works that remain
separable from, or merely link (or bind by name) to the interfaces of,
the Work and Derivative Works thereof.
"Contribution" shall mean any work of authorship, including
the original version of the Work and any modifications or additions
to that Work or Derivative Works thereof, that is intentionally
submitted to Licensor for inclusion in the Work by the copyright owner
or by an individual or Legal Entity authorized to submit on behalf of
the copyright owner. For the purposes of this definition, "submitted"
means any form of electronic, verbal, or written communication sent
to the Licensor or its representatives, including but not limited to
communication on electronic mailing lists, source code control systems,
and issue tracking systems that are managed by, or on behalf of, the
Licensor for the purpose of discussing and improving the Work, but
excluding communication that is conspicuously marked or otherwise
designated in writing by the copyright owner as "Not a Contribution."
"Contributor" shall mean Licensor and any individual or Legal Entity
on behalf of whom a Contribution has been received by Licensor and
subsequently incorporated within the Work.
2. Grant of Copyright License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
copyright license to reproduce, prepare Derivative Works of,
publicly display, publicly perform, sublicense, and distribute the
Work and such Derivative Works in Source or Object form.
3. Grant of Patent License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
(except as stated in this section) patent license to make, have made,
use, offer to sell, sell, import, and otherwise transfer the Work,
where such license applies only to those patent claims licensable
by such Contributor that are necessarily infringed by their
Contribution(s) alone or by combination of their Contribution(s)
with the Work to which such Contribution(s) was submitted. If You
institute patent litigation against any entity (including a
cross-claim or counterclaim in a lawsuit) alleging that the Work
or a Contribution incorporated within the Work constitutes direct
or contributory patent infringement, then any patent licenses
granted to You under this License for that Work shall terminate
as of the date such litigation is filed.
4. Redistribution. You may reproduce and distribute copies of the
Work or Derivative Works thereof in any medium, with or without
modifications, and in Source or Object form, provided that You
meet the following conditions:
(a) You must give any other recipients of the Work or
Derivative Works a copy of this License; and
(b) You must cause any modified files to carry prominent notices
stating that You changed the files; and
(c) You must retain, in the Source form of any Derivative Works
that You distribute, all copyright, patent, trademark, and
attribution notices from the Source form of the Work,
excluding those notices that do not pertain to any part of
the Derivative Works; and
(d) If the Work includes a "NOTICE" text file as part of its
distribution, then any Derivative Works that You distribute must
include a readable copy of the attribution notices contained
within such NOTICE file, excluding those notices that do not
pertain to any part of the Derivative Works, in at least one
of the following places: within a NOTICE text file distributed
as part of the Derivative Works; within the Source form or
documentation, if provided along with the Derivative Works; or,
within a display generated by the Derivative Works, if and
wherever such third-party notices normally appear. The contents
of the NOTICE file are for informational purposes only and
do not modify the License. You may add Your own attribution
notices within Derivative Works that You distribute, alongside
or as an addendum to the NOTICE text from the Work, provided
that such additional attribution notices cannot be construed
as modifying the License.
You may add Your own copyright statement to Your modifications and
may provide additional or different license terms and conditions
for use, reproduction, or distribution of Your modifications, or
for any such Derivative Works as a whole, provided Your use,
reproduction, and distribution of the Work otherwise complies with
the conditions stated in this License.
5. Submission of Contributions. Unless You explicitly state otherwise,
any Contribution intentionally submitted for inclusion in the Work
by You to the Licensor shall be under the terms and conditions of
this License, without any additional terms or conditions.
Notwithstanding the above, nothing herein shall supersede or modify
the terms of any separate license agreement you may have executed
with Licensor regarding such Contributions.
6. Trademarks. This License does not grant permission to use the trade
names, trademarks, service marks, or product names of the Licensor,
except as required for reasonable and customary use in describing the
origin of the Work and reproducing the content of the NOTICE file.
7. Disclaimer of Warranty. Unless required by applicable law or
agreed to in writing, Licensor provides the Work (and each
Contributor provides its Contributions) on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied, including, without limitation, any warranties or conditions
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
PARTICULAR PURPOSE. You are solely responsible for determining the
appropriateness of using or redistributing the Work and assume any
risks associated with Your exercise of permissions under this License.
8. Limitation of Liability. In no event and under no legal theory,
whether in tort (including negligence), contract, or otherwise,
unless required by applicable law (such as deliberate and grossly
negligent acts) or agreed to in writing, shall any Contributor be
liable to You for damages, including any direct, indirect, special,
incidental, or consequential damages of any character arising as a
result of this License or out of the use or inability to use the
Work (including but not limited to damages for loss of goodwill,
work stoppage, computer failure or malfunction, or any and all
other commercial damages or losses), even if such Contributor
has been advised of the possibility of such damages.
9. Accepting Warranty or Additional Liability. While redistributing
the Work or Derivative Works thereof, You may choose to offer,
and charge a fee for, acceptance of support, warranty, indemnity,
or other liability obligations and/or rights consistent with this
License. However, in accepting such obligations, You may act only
on Your own behalf and on Your sole responsibility, not on behalf
of any other Contributor, and only if You agree to indemnify,
defend, and hold each Contributor harmless for any liability
incurred by, or claims asserted against, such Contributor by reason
of your accepting any such warranty or additional liability.
END OF TERMS AND CONDITIONS
APPENDIX: How to apply the Apache License to your work.
To apply the Apache License to your work, attach the following
boilerplate notice, with the fields enclosed by brackets "{}"
replaced with your own identifying information. (Don't include
the brackets!) The text should be enclosed in the appropriate
comment syntax for the file format. We also recommend that a
file or class name and description of purpose be included on the
same "printed page" as the copyright notice for easier
identification within third-party archives.
Copyright {yyyy} {name of copyright owner}
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-80
View File
@@ -1,80 +0,0 @@
[![Build Status](https://www.travis-ci.org/e-fever/backpressure.svg?branch=master)](https://www.travis-ci.org/e-fever/backpressure)
[![Build status](https://ci.appveyor.com/api/projects/status/knt6r7gra9dm0oui?svg=true)](https://ci.appveyor.com/project/benlau/backpressure)
Backpressure
============
Backpressure happens on a stream of data where you are not fast enough to process.
This library is designed to provide a few mechanism to handle it.
Installation
============
qpm install net.efever.backpressure
API
===
```
import Backpressure 1.0
```
**Backpressure.oneInTime(owner, duration, callback)**
It will create a wrapper function of the callback. Whatever you have invoked the wrapper function, it will execute the callback immediately. Then it will be blocked within duration period. It could prevent to process the same event twice within the duration period.
Example:
```
Item {
id : item
property var processClick : Backpressure.oneInTime(item, 500, function(value) {
/* Callback */
});
MouseArea {
onClicked: {
processClick(value);
}
}
}
```
If the owner is destroyed, the callback will no longer be able to access.
**Backpressure.debounce(owner, duration, callback)**
If will create a wrapper function of the callback. Whatever you have invoked the wrapper function, it won't execute the callback until the duration period finished. If user invoked the wrapper function again within the period, then the previous call will be dropped, and the timer is restarted.
It will guarantee only the last function call and parameter will be passed to the callback.
Reference: [ReactiveX - Debounce operator](http://reactivex.io/documentation/operators/debounce.html)
**Backpressure.promisedOneInTime(owner, callback)**
This function is similar to oneInTime that will create a wrapper of the callback. But it does not take a timeout value as an argument of the construction function.
Instead, it will convert the return from the callback to a promise object. Then blocks successively calls until the promise is resolved/rejected.
The wrapper function returns a promise represents the result of the callback. If that is blocked, it will simply a rejected promise.
You must install QuickPromise in order to use this funciton.
Example
```
var timeout = Backpressure.promisedOneInTime(anyItem, function(delay) {
return Q.promise(function(fulfill, reject) {
Q.setTimeout(function() {
fulfill();
}, delay);
});
});
var promise1 = timeout(1000); // Pending
var promise2 = timeout(1000); // Rejected
```
-3
View File
@@ -1,3 +0,0 @@
module StatusQ.Core.Backpressure
singleton Backpressure 1.0 Backpressure.qml
-1
View File
@@ -10,6 +10,5 @@ QtObject {
property color color
property url source
property int rotation
property bool isLetterIdenticon
property StatusIconBackgroundSettings background: StatusIconBackgroundSettings {}
}
+1 -10
View File
@@ -3,18 +3,9 @@ import QtQuick 2.14
QtObject {
property string title
property string subTitle
property int titleElide: Text.ElideRight
property int subTitleElide: Text.ElideRight
property Component popupMenu
property StatusImageSettings image: StatusImageSettings {
width: 40
height: 40
isIdenticon: false
}
property StatusIconSettings icon: StatusIconSettings {
width: 40
height: 40
isLetterIdenticon: false
}
}
@@ -1,9 +0,0 @@
import QtQuick 2.14
import StatusQ.Controls 0.1
QtObject {
property string text: ""
property int orientation: StatusToolTip.Orientation.Top
property int offset: 0
}
@@ -68,30 +68,6 @@ ThemePalette {
source: "../../../assets/fonts/InterStatus/InterStatus-Black.otf"
}
property QtObject codeFont: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Regular.ttf"
}
property QtObject codeFontThin: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Thin.ttf"
}
property QtObject codeFontExtraLight: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-ExtraLight.ttf"
}
property QtObject codeFontLight: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Light.ttf"
}
property QtObject codeFontMedium: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Medium.ttf"
}
property QtObject codeFontBold: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Bold.ttf"
}
property color dropShadow: getColor('black', 0.08)
baseColor1: getColor('graphite5')
@@ -128,7 +104,6 @@ ThemePalette {
directColor6: getColor('white', 0.2)
directColor7: getColor('white', 0.1)
directColor8: getColor('white', 0.05)
directColor9: getColor('white', 0.2)
indirectColor1: getColor('black')
indirectColor2: getColor('black', 0.7)
@@ -197,13 +172,5 @@ ThemePalette {
property QtObject statusRoundedImage: QtObject {
property color backgroundColor: baseColor3
}
property QtObject statusChatInput: QtObject {
property color secondaryBackgroundColor: "#414141"
}
property QtObject statusSwitchTab: QtObject {
property color backgroundColor: baseColor3
}
}
@@ -68,30 +68,6 @@ ThemePalette {
source: "../../../assets/fonts/InterStatus/InterStatus-Black.otf"
}
property QtObject codeFont: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Regular.ttf"
}
property QtObject codeFontThin: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Thin.ttf"
}
property QtObject codeFontExtraLight: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-ExtraLight.ttf"
}
property QtObject codeFontLight: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Light.ttf"
}
property QtObject codeFontMedium: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Medium.ttf"
}
property QtObject codeFontBold: FontLoader {
source: "../../../assets/fonts/RobotoMono/RobotoMono-Bold.ttf"
}
baseColor1: getColor('grey5')
baseColor2: getColor('grey4')
baseColor3: getColor('grey3')
@@ -126,7 +102,6 @@ ThemePalette {
directColor6: getColor('black', 0.3)
directColor7: getColor('black', 0.1)
directColor8: getColor('black', 0.05)
directColor9: getColor('black', 0.2)
indirectColor1: getColor('white')
indirectColor2: getColor('white', 0.7)
@@ -195,13 +170,5 @@ ThemePalette {
property QtObject statusRoundedImage: QtObject {
property color backgroundColor: white
}
property QtObject statusChatInput: QtObject {
property color secondaryBackgroundColor: "#E2E6E8"
}
property QtObject statusSwitchTab: QtObject {
property color backgroundColor: white
}
}
-16
View File
@@ -24,13 +24,6 @@ QtObject {
property FontLoader monoFontExtraBold
property FontLoader monoFontBlack
property FontLoader codeFont
property FontLoader codeFontThin
property FontLoader codeFontExtraLight
property FontLoader codeFontLight
property FontLoader codeFontMedium
property FontLoader codeFontBold
property color black: getColor('black')
property color white: getColor('white')
@@ -71,7 +64,6 @@ QtObject {
property color directColor6
property color directColor7
property color directColor8
property color directColor9
property color indirectColor1
property color indirectColor2
@@ -142,14 +134,6 @@ QtObject {
property color backgroundColor
}
property QtObject statusChatInput: QtObject {
property color secondaryBackgroundColor
}
property QtObject statusSwitchTab: QtObject {
property color backgroundColor
}
function alphaColor(color, alpha) {
let actualColor = Qt.darker(color, 1)
actualColor.a = alpha
-35
View File
@@ -1,35 +0,0 @@
pragma Singleton
import QtQuick 2.13
QtObject {
function getAbsolutePosition(node) {
var returnPos = {};
returnPos.x = 0;
returnPos.y = 0;
if (node !== undefined && node !== null) {
var parentValue = getAbsolutePosition(node.parent);
returnPos.x = parentValue.x + node.x;
returnPos.y = parentValue.y + node.y;
}
return returnPos;
}
function isValidAddress(inputValue) {
return inputValue !== "0x" && /^0x[a-fA-F0-9]{40}$/.test(inputValue)
}
function isValidEns(inputValue) {
if (!inputValue) {
return false
}
const isEmail = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/.test(inputValue)
const isDomain = /(?:(?:(?<thld>[\w\-]*)(?:\.))?(?<sld>[\w\-]*))\.(?<tld>[\w\-]*)/.test(inputValue)
return isEmail || isDomain || (inputValue.startsWith("@") && inputValue.length > 1)
}
function uuid() {
return Date.now().toString(36) + Math.random().toString(36).substr(2, 5)
}
}
-4
View File
@@ -1,4 +0,0 @@
module StatusQ.Core.Utils
singleton Utils 0.1 Utils.qml
+1 -1
View File
@@ -6,4 +6,4 @@ StatusIconSettings 0.1 StatusIconSettings.qml
StatusIconBackgroundSettings 0.1 StatusIconBackgroundSettings.qml
StatusImageSettings 0.1 StatusImageSettings.qml
StatusModalHeaderSettings 0.1 StatusModalHeaderSettings.qml
StatusTooltipSettings 0.1 StatusTooltipSettings.qml
+2 -22
View File
@@ -10,8 +10,6 @@ Rectangle {
id: statusAppNavBar
property StatusNavBarTabButton navBarChatButton
property StatusNavBarTabButton navBarProfileButton
property list<StatusNavBarTabButton> navBarTabButtons
property alias navBarCommunityTabButtons: navBarCommunityTabButtons
@@ -36,12 +34,6 @@ Rectangle {
}
}
onNavBarProfileButtonChanged: {
if (!!navBarProfileButton) {
navBarProfileButton.parent = navBarProfileButtonSlot
}
}
onNavBarTabButtonsChanged: {
if (navBarTabButtons.length) {
for (let idx in navBarTabButtons) {
@@ -83,9 +75,7 @@ Rectangle {
if (navBarContentHeight > statusAppNavBar.height) {
height = statusAppNavBar.height -
statusAppNavBar.navBarContentHeightWithoutCommunityButtons -
(!!navBarTabButtonsSlot.anchors.bottom ? navBarTabButtonsSlot.anchors.bottomMargin : navBarTabButtonsSlot.anchors.topMargin) -
navBarProfileButtonSlot.height -
navBarProfileButtonSlot.anchors.bottomMargin
(!!navBarTabButtonsSlot.anchors.bottom ? navBarTabButtonsSlot.anchors.bottomMargin : navBarTabButtonsSlot.anchors.topMargin)
bottomPadding = 16
topPadding = 16
} else {
@@ -132,7 +122,7 @@ Rectangle {
if (navBarContentHeight > statusAppNavBar.height) {
anchors.top = undefined
anchors.topMargin = 0
anchors.bottom = navBarProfileButtonSlot.top
anchors.bottom = statusAppNavBar.bottom
anchors.bottomMargin = 32
} else {
anchors.bottom = undefined
@@ -142,15 +132,5 @@ Rectangle {
}
}
}
Item {
id: navBarProfileButtonSlot
anchors.horizontalCenter: parent.horizontalCenter
height: visible ? statusAppNavBar.navBarProfileButton.height : 0
width: visible ? statusAppNavBar.navBarProfileButton.width : 0
visible: !!statusAppNavBar.navBarProfileButton
anchors.bottom: parent.bottom
anchors.bottomMargin: visible ? 32 : 0
}
}
@@ -1,54 +0,0 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import StatusQ.Core.Theme 0.1
SplitView {
id: root
implicitWidth: 822
implicitHeight: 600
handle: Item { }
property Item leftPanel
property Item centerPanel
property Component rightPanel
property bool showRightPanel
Control {
SplitView.minimumWidth: 300
SplitView.preferredWidth: 300
SplitView.fillHeight: true
contentItem: (!!leftPanel) ? leftPanel : null
background: Rectangle {
anchors.fill: parent
color: Theme.palette.baseColor4
}
}
Control {
SplitView.minimumWidth: 300
SplitView.fillWidth: true
SplitView.fillHeight: true
leftPadding: -5
contentItem: (!!centerPanel) ? centerPanel : null
background: Rectangle {
anchors.fill: parent
color: Theme.palette.statusAppLayout.rightPanelBackgroundColor
}
}
Control {
SplitView.preferredWidth: root.showRightPanel ? 250 : 0
SplitView.minimumWidth: root.showRightPanel ? 58 : 0
opacity: root.showRightPanel ? 1.0 : 0.0
visible: (opacity > 0.1)
contentItem: Loader {
anchors.fill: parent
sourceComponent: (!!rightPanel) ? rightPanel : null
}
background: Rectangle {
anchors.fill: parent
color: Theme.palette.baseColor4
}
}
}
+2 -1
View File
@@ -3,4 +3,5 @@ module StatusQ.Layout
StatusAppLayout 0.1 StatusAppLayout.qml
StatusAppNavBar 0.1 StatusAppNavBar.qml
StatusAppTwoPanelLayout 0.1 StatusAppTwoPanelLayout.qml
StatusAppThreePanelLayout 0.1 StatusAppThreePanelLayout.qml
@@ -1,118 +0,0 @@
import QtQuick 2.14
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Core 0.1
Rectangle {
id: windowsTitleBar
property string title: titleText.text
signal close();
signal minimised();
signal maximized();
implicitHeight: 32
color: Theme.palette.baseColor5
Row {
id: titleLayout
anchors.left: parent.left
anchors.leftMargin: 12
anchors.verticalCenter: parent.verticalCenter
spacing: 4
StatusIcon {
anchors.verticalCenter: parent.verticalCenter
width: 16
height: 16
icon: "windows_titlebar/status"
}
StatusBaseText {
id: titleText
anchors.verticalCenter: parent.verticalCenter
text: qsTr("Status")
color: Theme.palette.directColor1
}
}
Row {
id: buttonsLayout
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
height: parent.height
Rectangle {
width: 48
height: parent.height
color: minimizeSensor.containsMouse ? (minimizeSensor.pressed ? Theme.palette.directColor9 : Theme.palette.directColor8)
: "transparent"
StatusIcon {
anchors.centerIn: parent
width: 10
height: 1
icon: "windows_titlebar/minimise"
color: Theme.palette.directColor1
}
MouseArea {
id: minimizeSensor
anchors.fill: parent
hoverEnabled: true
onClicked: windowsTitleBar.minimised()
}
}
Rectangle {
width: 48
height: parent.height
color: maximizeSensor.containsMouse ? (maximizeSensor.pressed ? Theme.palette.directColor9 : Theme.palette.directColor8)
: "transparent"
StatusIcon {
anchors.centerIn: parent
width: 10
height: 10
icon: "windows_titlebar/maximize"
color: Theme.palette.directColor1
}
MouseArea {
id: maximizeSensor
anchors.fill: parent
hoverEnabled: true
onClicked: windowsTitleBar.maximized()
}
}
Rectangle {
width: 48
height: parent.height
color: closeSensor.containsMouse ? (closeSensor.pressed ? "#DB1518" : "#ED4245")
: "transparent"
StatusIcon {
anchors.centerIn: parent
width: 10
height: 10
icon: "windows_titlebar/close"
color: closeSensor.containsMouse ? Theme.palette.white : Theme.palette.directColor1
}
MouseArea {
id: closeSensor
anchors.fill: parent
hoverEnabled: true
onClicked: windowsTitleBar.closed()
}
}
}
}
+1 -1
View File
@@ -1,5 +1,5 @@
module StatusQ.Platform
StatusMacTrafficLights 0.1 StatusMacTrafficLights.qml
StatusWindowsTitleBar 0.1 StatusWindowsTitleBar.qml
-24
View File
@@ -1,24 +0,0 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
MenuSeparator {
id: root
property string text
height: visible && enabled ? implicitHeight : 0
contentItem: Item {
implicitWidth: 176
implicitHeight: 16
StatusBaseText {
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.leftMargin: 12
color: Theme.palette.baseColor1
font.pixelSize: 12
text: root.text
}
}
}
+1 -11
View File
@@ -9,17 +9,7 @@ Action {
Normal,
Danger
}
icon.color: "transparent"
property int type: StatusMenuItem.Type.Normal
property real iconRotation: 0
property StatusImageSettings image: StatusImageSettings {
height: 16
width: 16
isIdenticon: false
}
property StatusIconSettings iconSettings: StatusIconSettings {
isLetterIdenticon: false
background: StatusIconBackgroundSettings {}
color: "transparent"
}
}
+18 -16
View File
@@ -11,24 +11,24 @@ import "statusModal" as Spares
QC.Popup {
id: statusModal
property Component content
property alias headerActionButton: headerImpl.actionButton
property StatusModalHeaderSettings header: StatusModalHeaderSettings {}
property alias contentComponent: contentLoader.item
property alias rightButtons: footerImpl.rightButtons
property alias leftButtons: footerImpl.leftButtons
property bool showHeader: true
property bool showFooter: true
signal editButtonClicked()
parent: QC.Overlay.overlay
width: 480
height: contentItem.implicitHeight
topPadding: headerImpl.implicitHeight
bottomPadding: footerImpl.implicitHeight
leftPadding: 0
rightPadding: 0
margins: 0
padding: 0
modal: true
@@ -40,30 +40,32 @@ QC.Popup {
background: Rectangle {
color: Theme.palette.statusModal.backgroundColor
radius: 8
}
contentItem: Column {
width: parent.width
Spares.StatusModalHeader {
id: headerImpl
anchors.top: parent.top
width: visible ? parent.width : 0
width: 480
visible: statusModal.showHeader
title: header.title
titleElide: header.titleElide
subTitle: header.subTitle
subTitleElide: header.subTitleElide
image: header.image
icon: header.icon
popupMenu: header.popupMenu
onEditButtonClicked: statusModal.editButtonClicked()
onClose: statusModal.close()
}
Loader {
id: contentLoader
active: true
anchors.horizontalCenter: parent.horizontalCenter
sourceComponent: statusModal.content
}
Spares.StatusModalFooter {
id: footerImpl
anchors.bottom: parent.bottom
width: visible ? parent.width : 0
visible: statusModal.showFooter
width: 480
}
}
}
+18 -107
View File
@@ -4,28 +4,21 @@ import QtGraphicalEffects 1.13
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import StatusQ.Popups 0.1
Menu {
id: statusPopupMenu
closePolicy: Popup.CloseOnPressOutside | Popup.CloseOnEscape
closePolicy: Popup.CloseOnReleaseOutside | Popup.CloseOnEscape
topPadding: 8
bottomPadding: 8
property int menuItemCount: 0
property var subMenuItemIcons: []
property var openHandler
property var closeHandler
dim: true
Overlay.modeless: MouseArea {}
signal menuItemClicked(int menuIndex)
onOpened: {
if (typeof openHandler === "function") {
openHandler()
@@ -40,21 +33,19 @@ Menu {
delegate: MenuItem {
id: statusPopupMenuItem
implicitWidth: parent ? parent.width : 0
implicitHeight: action.enabled ? 38 : 0
property int subMenuIndex
Component.onCompleted: {
if (!!subMenu) {
if (subMenu) {
subMenuIndex = statusPopupMenu.menuItemCount
statusPopupMenu.menuItemCount += 1
}
}
action: StatusMenuItem {
onTriggered: { statusPopupMenu.menuItemClicked(statusPopupMenuItem.subMenuIndex); }
}
action: StatusMenuItem {}
Component {
id: indicatorComponent
@@ -63,32 +54,13 @@ Menu {
implicitHeight: 24
StatusIcon {
anchors.centerIn: parent
width: {
let width = statusPopupMenuItem.action.icon.width ||
statusPopupMenuItem.action.iconSettings.width
return !!width ? width : 18
}
width: !!statusPopupMenuItem.action.icon.width ?
statusPopupMenuItem.action.icon.width : 18
rotation: statusPopupMenuItem.action.iconRotation
icon: {
if (statusPopupMenuItem.subMenu && !!statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex] &&
statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex].icon.toString() !== "") {
return statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex].icon;
} else if (!!statusPopupMenuItem.action && statusPopupMenuItem.action.icon.name !== "") {
return statusPopupMenuItem.action.icon.name;
} else if (statusPopupMenuItem.action.iconSettings.name !== "") {
return statusPopupMenuItem.action.iconSettings.name;
} else {
return "";
}
}
icon: statusPopupMenuItem.subMenu ?
statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex] :
statusPopupMenuItem.action.icon.name
color: {
let c = statusPopupMenuItem.action.iconSettings.color ||
statusPopupMenuItem.action.icon.color
if (!Qt.colorEqual(c, "transparent")) {
return c
}
switch (statusPopupMenuItem.action.type) {
case StatusMenuItem.Type.Danger:
return Theme.palette.dangerColor1
@@ -101,80 +73,18 @@ Menu {
}
}
Component {
id: statusLetterIdenticonCmp
Item {
implicitWidth: 24
implicitHeight: 24
StatusLetterIdenticon {
anchors.centerIn: parent
width: 16
height: 16
color: {
let subMenuItemIcon = statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex]
return subMenuItemIcon && subMenuItemIcon.color ? subMenuItemIcon.color : statusPopupMenuItem.action.iconSettings.background.color
}
name: statusPopupMenuItem.text
letterSize: 11
}
}
}
Component {
id: statusRoundImageCmp
Item {
implicitWidth: 24
implicitHeight: 24
StatusRoundedImage {
anchors.centerIn: parent
width: statusPopupMenuItem.action.image.width
height: statusPopupMenuItem.action.image.height
image.source: statusPopupMenuItem.subMenu ?
statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex].source :
statusPopupMenuItem.action.image.source
border.width: (statusPopupMenuItem.subMenu && statusPopupMenu.subMenuItemIcons[statusPopupMenuItem.subMenuIndex].isIdenticon) ||
statusPopupMenuItem.action.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
}
}
}
indicator: Loader {
sourceComponent: {
let subMenuItemIcon = statusPopupMenu.subMenuItemIcons[parent.subMenuIndex]
if ((parent.subMenu && subMenuItemIcon && subMenuItemIcon.source) ||
statusPopupMenuItem.action.image && !!statusPopupMenuItem.action.image.source.toString()) {
return statusRoundImageCmp
}
return (parent.subMenu && subMenuItemIcon && subMenuItemIcon.isLetterIdenticon) ||
(statusPopupMenuItem.action.iconsSettings && statusPopupMenuItem.action.iconSettings.isLetterIdenticon) ?
statusLetterIdenticonCmp : indicatorComponent
}
sourceComponent: indicatorComponent
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.leftMargin: 8
active: {
if (enabled) {
let hasIconSettings = !!statusPopupMenuItem.action.icon.name ||
(statusPopupMenuItem.action.iconSettings &&
(!!statusPopupMenuItem.action.iconSettings.name || !!statusPopupMenuItem.action.iconSettings.isLetterIdenticon))
let hasImageSettings = statusPopupMenuItem.action.image && !!statusPopupMenuItem.action.image.source.toString()
return enabled && (parent.subMenu && !!statusPopupMenu.subMenuItemIcons[parent.subMenuIndex]) || hasIconSettings || hasImageSettings
}
return false
}
active: (parent.subMenu && !!statusPopupMenu.subMenuItemIcons[parent.subMenuIndex] ||
!!statusPopupMenuItem.action.icon.name) &&
statusPopupMenuItem.action.enabled
}
contentItem: StatusBaseText {
anchors.left: statusPopupMenuItem.indicator.right
anchors.right: arrowIcon.visible ? arrowIcon.left : arrowIcon.right
anchors.rightMargin: 8
anchors.leftMargin: 4
horizontalAlignment: Text.AlignLeft
@@ -196,7 +106,6 @@ Menu {
}
arrow: StatusIcon {
id: arrowIcon
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 8
@@ -208,7 +117,7 @@ Menu {
background: Rectangle {
color: {
if (statusPopupMenuItem.hovered) {
if (hovered) {
return statusPopupMenuItem.action.type === StatusMenuItem.Type.Danger ? Theme.palette.dangerColor3 : Theme.palette.statusPopupMenu.hoverBackgroundColor
}
return "transparent"
@@ -217,8 +126,9 @@ Menu {
MouseArea {
id: sensor
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
cursorShape: Qt.PointingHandCursor
hoverEnabled: statusPopupMenuItem.action.enabled
onPressed: mouse.accepted = false
}
@@ -250,4 +160,5 @@ Menu {
}
}
}
}
@@ -1,144 +0,0 @@
import QtQuick 2.12
import QtQuick.Controls 2.14
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Popups 0.1
StatusPopupMenu {
id: root
property var searchPopup
property var locationModel
signal itemClicked(string firstLevelItemValue, string secondLevelItemValue)
StatusMenuItem {
text: "Anywhere"
onTriggered: {
searchPopup.resetSearchSelection();
root.itemClicked("", "");
}
}
StatusMenuSeparator { }
//Dummy item to keep seperator in right position
MenuItem { implicitHeight: 0.00001 }
Instantiator {
model: root.locationModel
delegate: Loader {
sourceComponent: (!!model.subItems && model.subItems.count > 0) ? subMenus : subMenuItemComponent
onLoaded: {
if (!!model.subItems && model.subItems.count > 0) {
item.parentValue = model.value
item.title = model.title;
item.subItemsModel = model.subItems;
item.parentIconName = model.iconName;
item.parentImageSource = model.imageSource;
item.parentIdenticonColor = !!model.iconColor ? model.iconColor : Theme.palette.primaryColor1;
item.parentIsIdenticon = model.isIdenticon;
root.subMenuItemIcons.push({
source: model.imageSource,
icon: model.iconName,
isIdenticon: model.isIdenticon,
color: model.iconColor,
isLetterIdenticon: !model.imageSource && !model.iconName
});
root.insertMenu(index+2, item);
} else {
item.value = model.value
item.text = model.title;
item.iconSettings.name = model.iconName;
item.iconSettings.color = model.iconColor;
item.iconSettings.isLetterIdenticon = !model.imageSource && !model.iconName
item.image.source = model.imageSource;
item.image.isIdenticon = model.isIdenticon;
root.insertItem(index+2, item);
}
}
}
onObjectRemoved: { root.removeItem(root.takeItem(index+2)); }
}
Component {
id: subMenuItemComponent
StatusSearchPopupMenuItem {
onClicked: {
searchPopup.resetSearchSelection()
searchPopup.setSearchSelection(text,
"",
image.source,
image.isIdenticon,
iconSettings.name,
iconSettings.color)
root.itemClicked(value, "")
}
}
}
Component {
id: subMenus
StatusPopupMenu {
id: menu
property var subItemsModel
property string parentValue
property string parentIconName
property string parentImageSource
property string parentIdenticonColor
property string parentIsIdenticon
Repeater {
id: menuLoader
model: menu.subItemsModel
property string parentValue: menu.parentValue
property string parentTitleText: menu.title
property string parentIconName: menu.parentIconName
property string parentImageSource: menu.parentImageSource
property string parentIdenticonColor: menu.parentIdenticonColor
property string parentIsIdenticon: menu.parentIsIdenticon
Loader {
id: subMenuLoader
sourceComponent: StatusSearchPopupMenuItem {
value: model.value
text: model.text
image.source: model.imageSource
iconSettings.name: model.iconName
iconSettings.color: model.iconColor
image.isIdenticon: model.isIdenticon
onTriggered: {
searchPopup.resetSearchSelection()
if (menuLoader.parentTitleText === "Chat") {
searchPopup.setSearchSelection(model.text,
"",
model.imageSource,
model.isIdenticon,
model.iconName,
model.iconColor)
} else {
searchPopup.setSearchSelection(menuLoader.parentTitleText,
model.text,
menuLoader.parentImageSource,
menuLoader.parentIsIdenticon,
menuLoader.parentIconName,
menuLoader.parentIdenticonColor)
}
root.itemClicked(menuLoader.parentValue, value)
root.dismiss()
}
}
}
}
}
}
onMenuItemClicked: {
searchPopup.resetSearchSelection()
let menuItem = root.menuAt(root.currentIndex)
searchPopup.setSearchSelection(menuItem.title,
"",
menuItem.parentImageSource,
menuItem.parentIsIdenticon,
menuItem.parentIconName,
menuItem.parentIdenticonColor)
root.itemClicked(menuItem.parentValue, "")
//TODO fix error "QML StatusPopupMenu: cannot find any window to open popup in."
root.dismiss()
}
}
-362
View File
@@ -1,362 +0,0 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.12
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Popups 0.1
StatusModal {
id: root
width: 700
height: (!!searchResults && (searchResults.count >= 0) && (searchText !== "")) ? (((searchResults.count < 5)) ? 560 : 770) : 142 //970
anchors.centerIn: parent
showHeader: false
showFooter: false
property string searchText: contentItem.searchText
property string noResultsLabel: "No results"
property string defaultSearchLocationText: "Anywhere"
property bool loading
property Menu searchOptionsPopupMenu: Menu { }
property var searchResults: [ ]
property var searchSelectionButton
signal resultItemClicked(string itemId)
signal resultItemTitleClicked(string titleId)
property var formatTimestampFn: function (ts) {
return ts
}
function setSearchSelection(text = "",
secondaryText = "",
imageSource = "",
isIdenticon = "",
iconName = "",
iconColor = "") {
searchSelectionButton.primaryText = text
searchSelectionButton.secondaryText = secondaryText
searchSelectionButton.image.source = imageSource
searchSelectionButton.image.isIdenticon = isIdenticon
searchSelectionButton.iconSettings.name = iconName
searchSelectionButton.iconSettings.color = iconColor !== ""? iconColor : Theme.palette.primaryColor1
searchSelectionButton.iconSettings.isLetterIdenticon = !iconName && !imageSource
}
function resetSearchSelection() {
setSearchSelection(defaultSearchLocationText, "", "", false, "", "transparent")
}
function forceActiveFocus() {
contentItem.searchInput.forceActiveFocus()
}
onOpened: {
forceActiveFocus();
}
contentItem: Item {
width: parent.width
height: root.height
property alias searchText: inputText.text
property alias searchInput: inputText
ColumnLayout {
id: contentItemColumn
anchors.fill: parent
spacing: 0
Item {
Layout.fillWidth: true
Layout.preferredHeight: 63
StatusIcon {
id: statusIcon
width: 40
height: 40
anchors.left: parent.left
anchors.leftMargin: 12
anchors.verticalCenter: parent.verticalCenter
icon: "search"
color: Theme.palette.baseColor1
}
TextEdit {
id: inputText
anchors.left: statusIcon.right
anchors.leftMargin: 15
anchors.right: parent.right
anchors.rightMargin: 8
anchors.verticalCenter: parent.verticalCenter
focus: true
font.pixelSize: 28
font.family: Theme.palette.baseFont.name
color: Theme.palette.directColor1
}
}
StatusMenuSeparator {
topPadding: 0
Layout.fillWidth: true
}
Item {
Layout.preferredWidth: parent.width
Layout.preferredHeight: 58
Button {
id: searchOptionsMenuButton
Component.onCompleted: {
root.searchSelectionButton = searchOptionsMenuButton
}
property string prefixText: "In"
property string primaryText: ""
property string secondaryText: ""
property StatusIconSettings iconSettings: StatusIconSettings {
name: ""
isLetterIdenticon: false
}
property StatusImageSettings image: StatusImageSettings {
source: ""
isIdenticon: false
}
anchors.left: parent.left
anchors.leftMargin: 16
anchors.verticalCenter: parent.verticalCenter
implicitWidth: (contentItemRowLayout.width + 24)
implicitHeight: 32
background: Rectangle {
anchors.fill: parent
color: Theme.palette.baseColor2
radius: 8
}
contentItem: Item {
anchors.fill: parent
MouseArea {
id: sensor
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: root.searchOptionsPopupMenu.popup();
RowLayout {
id: contentItemRowLayout
anchors.centerIn: parent
spacing: 2
StatusBaseText {
color: Theme.palette.directColor1
text: searchOptionsMenuButton.prefixText + ": "
font.weight: Font.Medium
}
Loader {
Layout.preferredWidth: active ? 16 : 0
Layout.preferredHeight: 16
active: searchOptionsMenuButton.primaryText !== defaultSearchLocationText &&
(searchOptionsMenuButton.iconSettings.name ||
searchOptionsMenuButton.iconSettings.isLetterIdenticon ||
!!searchOptionsMenuButton.image.source.toString())
sourceComponent: {
if (!!searchOptionsMenuButton.image.source.toString()) {
return statusRoundedImageCmp
}
if (!!searchOptionsMenuButton.iconSettings.isLetterIdenticon || !searchOptionsMenuButton.iconSettings.name) {
return statusLetterIdenticonCmp
}
return statusIconCmp
}
}
Component {
id: statusIconCmp
StatusIcon {
width: 16
icon: searchOptionsMenuButton.iconSettings.name
color: searchOptionsMenuButton.iconSettings.color
}
}
Component {
id: statusRoundedImageCmp
Item {
width: 16
height: 16
StatusRoundedImage {
id: statusRoundedImage
implicitWidth: parent.width
implicitHeight: parent.height
image.source: searchOptionsMenuButton.image.source
color: searchOptionsMenuButton.image.isIdenticon ?
Theme.palette.statusRoundedImage.backgroundColor :
"transparent"
border.width: searchOptionsMenuButton.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
}
Loader {
sourceComponent: statusLetterIdenticonCmp
active: statusRoundedImage.image.status === Image.Error
}
}
}
Component {
id: statusLetterIdenticonCmp
StatusLetterIdenticon {
implicitWidth: 16
implicitHeight: 16
letterSize: 11
color: searchOptionsMenuButton.iconSettings.color
name: searchOptionsMenuButton.primaryText
}
}
StatusBaseText {
color: Theme.palette.directColor1
text: searchOptionsMenuButton.primaryText
font.weight: Font.Medium
}
StatusIcon {
Layout.preferredWidth: 14.5
Layout.preferredHeight: 17.5
Layout.alignment: Qt.AlignVCenter
visible: !!searchOptionsMenuButton.secondaryText
color: Theme.palette.baseColor1
icon: "next"
}
StatusIcon {
Layout.preferredWidth: 17.5
Layout.preferredHeight: 17.5
Layout.alignment: Qt.AlignVCenter
visible: !!searchOptionsMenuButton.secondaryText
color: Theme.palette.directColor1
icon: "channel"
}
StatusBaseText {
color: Theme.palette.directColor1
visible: !!searchOptionsMenuButton.secondaryText
text: searchOptionsMenuButton.secondaryText
font.weight: Font.Medium
}
StatusIcon {
Layout.preferredWidth: 17.5
Layout.preferredHeight: 14.5
Layout.alignment: Qt.AlignVCenter
icon: "chevron-down"
color: Theme.palette.directColor1
}
}
}
}
}
StatusFlatRoundButton {
id: closeButton
width: 32
height: 32
anchors.left: searchOptionsMenuButton.right
anchors.leftMargin: 4
anchors.verticalCenter: parent.verticalCenter
opacity: (searchOptionsMenuButton.primaryText === defaultSearchLocationText) ? 0.0 : 1.0
visible: (opacity > 0.1)
type: StatusFlatRoundButton.Type.Secondary
icon.name: "close"
icon.color: Theme.palette.directColor1
icon.width: 20
icon.height: 20
onClicked: { root.resetSearchSelection(); }
}
}
StatusMenuSeparator { Layout.fillWidth: true; visible: (root.height > 142) }
Item {
Layout.fillWidth: true
Layout.fillHeight: true
clip: true
ListView {
id: view
anchors.fill: parent
anchors {
leftMargin: 0
rightMargin: 0
bottomMargin: 67
}
visible: (!root.loading && (count > 0))
model: root.searchResults
ScrollBar.vertical: ScrollBar { }
delegate: StatusListItem {
width: view.width
itemId: model.itemId
titleId: model.titleId
title: model.title
statusListItemTitle.color: model.title.startsWith("@") ? Theme.palette.primaryColor1 : Theme.palette.directColor1
subTitle: model.content
radius: 0
statusListItemSubTitle.height: model.content !== "" ? 20 : 0
statusListItemSubTitle.elide: Text.ElideRight
statusListItemSubTitle.color: Theme.palette.black
icon.isLetterIdenticon: (model.image === "")
icon.background.color: model.color
titleAsideText: root.formatTimestampFn(model.time)
image.source: model.image
badge.primaryText: model.badgePrimaryText
badge.secondaryText: model.badgeSecondaryText
badge.image.source: model.badgeImage
badge.icon.isLetterIdenticon: model.badgeIsLetterIdenticon
badge.icon.color: model.badgeIconColor
onClicked: {
root.resultItemClicked(itemId)
}
onTitleClicked: {
root.resultItemTitleClicked(titleId)
}
}
section.property: "sectionName"
section.criteria: ViewSection.FullString
section.delegate: Item {
height: 34
width: view.width
StatusBaseText {
font.pixelSize: 15
color: Theme.palette.baseColor1
text: section
anchors.left: parent.left
anchors.leftMargin: 16
anchors.bottom: parent.bottom
anchors.bottomMargin: 4
}
}
}
StatusLoadingIndicator {
anchors.centerIn: parent
visible: root.loading
color: Theme.palette.primaryColor1
width: 24
height: 24
}
StatusBaseText {
anchors.centerIn: parent
text: root.noResultsLabel
color: Theme.palette.baseColor1
font.pixelSize: 13
visible: ((inputText.text !== "") && (view.count === 0) && !root.loading)
}
}
}
}
onClosed: {
root.resetSearchSelection();
root.loading = false;
contentItem.searchText = "";
}
}
@@ -1,79 +0,0 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.12
import StatusQ.Components 0.1
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
MenuItem {
id: root
implicitHeight: 38
property string value: ""
property StatusImageSettings image: StatusImageSettings {
height: 16
width: 16
isIdenticon: false
}
property StatusIconSettings iconSettings: StatusIconSettings {
height: 16
width: 16
isLetterIdenticon: (root.image.source.toString() === ""
&& root.iconSettings.name.toString() === "")
background: StatusIconBackgroundSettings {}
color: "transparent"
}
background: Rectangle {
color: root.hovered ? Theme.palette.statusPopupMenu.hoverBackgroundColor : "transparent"
}
contentItem: RowLayout {
anchors.left: parent.left
anchors.leftMargin: 12
StatusIcon {
Layout.preferredWidth: visible ? root.iconSettings.width : 0
Layout.preferredHeight: visible ? root.iconSettings.height : 0
Layout.alignment: Qt.AlignVCenter
visible: !!root.iconSettings.name && !root.image.source.toString()
icon: root.iconSettings.name
color: (icon === "channel")? Theme.palette.directColor1 : root.iconSettings.color
}
StatusRoundedImage {
Layout.preferredWidth: visible ? root.image.width : 0
Layout.preferredHeight: visible ? root.image.height : 0
Layout.alignment: Qt.AlignVCenter
visible: root.image.source.toString() !== ""
image.source: root.image.source
border.width: root.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
}
StatusLetterIdenticon {
Layout.preferredWidth: visible ? root.iconSettings.width : 0
Layout.preferredHeight: visible ? root.iconSettings.height : 0
visible: root.iconSettings.isLetterIdenticon && !root.iconSettings.name && !root.image.source.toString()
color: root.iconSettings.color
name: root.text
letterSize: 11
}
StatusBaseText {
Layout.fillWidth: true
Layout.alignment: Qt.AlignVCenter
text: root.text
color: Theme.palette.directColor1
font.pixelSize: 13
elide: Text.ElideRight
}
Item {
Layout.fillWidth: true
}
}
MouseArea {
id: sensor
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onPressed: mouse.accepted = false
}
}
-4
View File
@@ -3,9 +3,5 @@ module StatusQ.Popups
StatusMenuSeparator 0.1 StatusMenuSeparator.qml
StatusPopupMenu 0.1 StatusPopupMenu.qml
StatusMenuItem 0.1 StatusMenuItem.qml
StatusMenuHeadline 0.1 StatusMenuHeadline.qml
StatusModal 0.1 StatusModal.qml
StatusSearchPopup 0.1 StatusSearchPopup.qml
StatusModalDivider 0.1 StatusModalDivider.qml
StatusSearchPopupMenuItem 0.1 StatusSearchPopupMenuItem.qml
StatusSearchLocationMenu 0.1 StatusSearchLocationMenu.qml
@@ -9,8 +9,6 @@ Row {
property alias title: headerTitle.text
property alias subTitle: headerSubTitle.text
property int titleElide: Text.ElideRight
property int subTitleElide: Text.ElideRight
property bool editable: false
signal editButtonClicked
@@ -18,82 +16,31 @@ Row {
property StatusImageSettings image: StatusImageSettings {
width: 40
height: 40
isIdenticon: false
}
property StatusIconSettings icon: StatusIconSettings {
width: 40
height: 40
isLetterIdenticon: false
}
spacing: 8
Loader {
id: iconOrImage
StatusRoundedImage {
id: headerImage
anchors.verticalCenter: parent.verticalCenter
width: active ? 40 : 0
sourceComponent: {
if (statusImageWithTitle.icon.isLetterIdenticon) {
return statusLetterIdenticon
}
return statusRoundedImageCmp
}
active: statusImageWithTitle.icon.isLetterIdenticon ||
!!statusImageWithTitle.image.source.toString()
}
Component {
id: statusLetterIdenticon
StatusLetterIdenticon {
width: statusImageWithTitle.icon.width
height: statusImageWithTitle.icon.height
color: statusImageWithTitle.icon.background.color
name: statusImageWithTitle.title
}
}
Component {
id: statusRoundedImageCmp
Item {
width: statusImageWithTitle.image.width
height: statusImageWithTitle.image.height
StatusRoundedImage {
id: statusRoundedImage
image.source: statusImageWithTitle.image.source
width: statusImageWithTitle.image.width
height: statusImageWithTitle.image.height
color: statusImageWithTitle.image.isIdenticon ?
Theme.palette.statusRoundedImage.backgroundColor :
"transparent"
border.width: statusImageWithTitle.image.isIdenticon ? 1 : 0
border.color: Theme.palette.directColor7
showLoadingIndicator: true
}
Loader {
sourceComponent: statusLetterIdenticon
active: statusRoundedImage.image.status === Image.Error
}
}
width: statusImageWithTitle.image.width
height: statusImageWithTitle.image.height
image.source: statusImageWithTitle.image.source
showLoadingIndicator: true
visible: !!statusImageWithTitle.image.source.toString()
}
Column {
id: textLayout
width: !iconOrImage.active ? parent.width :
parent.width - iconOrImage.width - parent.spacing
Row {
id: headerTitleRow
width: parent.width
spacing: 4
StatusBaseText {
id: headerTitle
font.family: Theme.palette.baseFont.name
font.pixelSize: 17
font.bold: true
elide: statusImageWithTitle.titleElide
color: Theme.palette.directColor1
width: !editButton.visible ? parent.width :
parent.width - editButton.width - parent.spacing
}
StatusFlatRoundButton {
id: editButton
@@ -117,9 +64,6 @@ Row {
font.family: Theme.palette.baseFont.name
font.pixelSize: 15
color:Theme.palette.baseColor1
width: parent.width
elide: statusImageWithTitle.subTitleElide
visible: !!statusImageWithTitle.subTitle
}
}
}
@@ -5,7 +5,6 @@ import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import StatusQ.Controls 0.1
import StatusQ.Popups 0.1
Rectangle {
@@ -30,7 +29,7 @@ Rectangle {
}
}
implicitHeight: visible ? rootLayout.implicitHeight + 30 : 0
implicitHeight: rootLayout.implicitHeight + 30
RowLayout {
id: rootLayout
@@ -66,11 +65,5 @@ Rectangle {
width: parent.width
height: parent.radius
color: parent.color
StatusModalDivider {
visible: (statusModalFooter.leftButtons.length || statusModalFooter.rightButtons.length) && rootLayout.height > 1
anchors.top: parent.top
width: parent.width
}
}
}
@@ -4,60 +4,38 @@ import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import StatusQ.Controls 0.1
import StatusQ.Popups 0.1
Rectangle {
id: statusModalHeader
property alias title: imageWithTitle.title
property alias subTitle: imageWithTitle.subTitle
property int titleElide
property int subTitleElide
property alias actionButton: actionButtonLoader.sourceComponent
property alias image: imageWithTitle.image
property alias icon: imageWithTitle.icon
property bool editable: false
property Component popupMenu
signal editButtonClicked
signal close
implicitHeight: visible? Math.max(closeButton.height, imageWithTitle.implicitHeight) + 32 : 0
implicitHeight: Math.max(closeButton.height, imageWithTitle.implicitHeight) + 32
implicitWidth: 480
radius: 16
color: Theme.palette.statusModal.backgroundColor
onPopupMenuChanged: {
if (!!popupMenu) {
popupMenuSlot.sourceComponent = popupMenu
}
}
StatusImageWithTitle {
id: imageWithTitle
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.right: actionButtonLoader.left
anchors.leftMargin: 16
editable: statusModalHeader.editable
titleElide: statusModalHeader.titleElide
subTitleElide: statusModalHeader.subTitleElide
onEditButtonClicked: statusModalHeader.editButtonClicked()
}
MouseArea {
anchors.fill: imageWithTitle
visible: !!statusModalHeader.popupMenu
cursorShape: Qt.PointingHandCursor
onClicked: {
popupMenuSlot.item.popup(imageWithTitle.x, imageWithTitle.y + imageWithTitle.height + 8)
}
}
Loader {
id: actionButtonLoader
anchors.right: closeButton.left
@@ -88,15 +66,5 @@ Rectangle {
width: parent.width
height: parent.radius
color: parent.color
StatusModalDivider {
anchors.bottom: parent.bottom
width: parent.width
}
}
Loader {
id: popupMenuSlot
active: !!statusModalHeader.popupMenu
}
}
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
-4
View File
@@ -1,4 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12 21.5C17.2467 21.5 21.5 17.2467 21.5 12C21.5 6.75329 17.2467 2.5 12 2.5C6.75329 2.5 2.5 6.75329 2.5 12C2.5 17.2467 6.75329 21.5 12 21.5ZM12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23Z" fill="#939BA1"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.24014 16.1491C7.1427 16.5194 7.48062 16.8573 7.85093 16.7599L14.6218 14.9781C14.7961 14.9322 14.9322 14.7961 14.9781 14.6218L16.7599 7.85093C16.8573 7.48062 16.5194 7.1427 16.1491 7.24014L9.37823 9.02194C9.20394 9.06781 9.06781 9.20394 9.02194 9.37823L7.24014 16.1491ZM9.25791 14.3756C9.19944 14.5978 9.4022 14.8006 9.62438 14.7421L13.3938 13.7501C13.5681 13.7043 13.7043 13.5681 13.7501 13.3938L14.7421 9.62438C14.8006 9.4022 14.5978 9.19944 14.3756 9.25791L10.6062 10.2499C10.4319 10.2957 10.2957 10.4319 10.2499 10.6062L9.25791 14.3756Z" fill="#939BA1"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

-3
View File
@@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.26285 18.4743C7.26285 19.7317 6.24355 20.751 4.98618 20.751C3.7288 20.751 2.7095 19.7317 2.7095 18.4743C2.7095 17.2169 3.7288 16.1976 4.98618 16.1976C6.24355 16.1976 7.26285 17.2169 7.26285 18.4743ZM4.98618 22.251C6.81518 22.251 8.34052 20.9508 8.68838 19.2243H15.3116C15.6595 20.9508 17.1848 22.251 19.0138 22.251C21.0996 22.251 22.7905 20.5601 22.7905 18.4743C22.7905 16.3885 21.0996 14.6976 19.0138 14.6976C17.1848 14.6976 15.6595 15.9978 15.3116 17.7243H8.68838C8.34052 15.9978 6.81518 14.6976 4.98618 14.6976C2.90038 14.6976 1.2095 16.3885 1.2095 18.4743C1.2095 20.5601 2.90038 22.251 4.98618 22.251ZM21.2905 18.4743C21.2905 19.7317 20.2712 20.751 19.0138 20.751C17.7564 20.751 16.7371 19.7317 16.7371 18.4743C16.7371 17.2169 17.7564 16.1976 19.0138 16.1976C20.2712 16.1976 21.2905 17.2169 21.2905 18.4743ZM14.2767 5.5257C14.2767 6.78307 13.2574 7.80237 12 7.80237C10.7426 7.80237 9.72332 6.78307 9.72332 5.5257C9.72332 4.26832 10.7426 3.24902 12 3.24902C13.2574 3.24902 14.2767 4.26832 14.2767 5.5257ZM15.7767 5.5257C15.7767 6.68953 15.2502 7.73042 14.4225 8.4232L17.9099 14.8615C17.4208 15.0107 16.9739 15.2565 16.5914 15.5767L13.104 9.13846C12.7548 9.24503 12.3841 9.30237 12 9.30237C11.6159 9.30237 11.2452 9.24504 10.896 9.13846L7.40862 15.5767C7.02607 15.2565 6.57917 15.0107 6.09013 14.8615L9.57752 8.42321C8.74977 7.73042 8.22332 6.68954 8.22332 5.5257C8.22332 3.4399 9.91419 1.74902 12 1.74902C14.0858 1.74902 15.7767 3.4399 15.7767 5.5257Z" fill="#939BA1"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.6 KiB

-4
View File
@@ -1,4 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="8.125" y="6.5" width="2.5" height="11" rx="1.25" fill="black"/>
<rect x="13.375" y="6.5" width="2.5" height="11" rx="1.25" fill="black"/>
</svg>

Before

Width:  |  Height:  |  Size: 250 B

-3
View File
@@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 7.5224C8 6.3159 9.30206 5.59038 10.2858 6.24874L17.5201 11.0902C18.16 11.5185 18.16 12.4815 17.5201 12.9098L10.2858 17.7513C9.30206 18.4096 8 17.6841 8 16.4776V7.5224Z" fill="black"/>
</svg>

Before

Width:  |  Height:  |  Size: 339 B

-5
View File
@@ -1,5 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.75 9C15.75 11.0711 14.0711 12.75 12 12.75C9.92893 12.75 8.25 11.0711 8.25 9C8.25 6.92893 9.92893 5.25 12 5.25C14.0711 5.25 15.75 6.92893 15.75 9ZM14.25 9C14.25 10.2426 13.2426 11.25 12 11.25C10.7574 11.25 9.75 10.2426 9.75 9C9.75 7.75736 10.7574 6.75 12 6.75C13.2426 6.75 14.25 7.75736 14.25 9Z" fill="#939BA1"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12ZM21.5 12C21.5 17.2467 17.2467 21.5 12 21.5C6.75329 21.5 2.5 17.2467 2.5 12C2.5 6.75329 6.75329 2.5 12 2.5C17.2467 2.5 21.5 6.75329 21.5 12Z" fill="#939BA1"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.99199 16.3857L6.98744 16.39C6.68505 16.6731 6.6694 17.1477 6.95248 17.4501C7.23544 17.7523 7.70978 17.7681 8.01218 17.4854L8.01129 17.4862L8.02005 17.4783C8.02921 17.4702 8.04496 17.4563 8.06705 17.4376C8.11126 17.4002 8.18068 17.3436 8.27353 17.274C8.45962 17.1346 8.73733 16.9451 9.09253 16.7549C9.80556 16.3731 10.8085 16 12 16C13.1915 16 14.1944 16.3731 14.9075 16.7549C15.2627 16.9451 15.5404 17.1346 15.7265 17.274C15.8193 17.3436 15.8887 17.4002 15.933 17.4376C15.955 17.4563 15.9708 17.4702 15.98 17.4783L15.9887 17.4862C16.2911 17.7685 16.7647 17.7522 17.0475 17.4501C17.3306 17.1477 17.3149 16.6731 17.0126 16.39L17.0117 16.3892L17.0106 16.3882L17.008 16.3857L17.0008 16.3791L16.9782 16.3588C16.9597 16.3422 16.9341 16.3198 16.9016 16.2923C16.8367 16.2374 16.7442 16.1623 16.6259 16.0736C16.3897 15.8967 16.0482 15.6642 15.6156 15.4326C14.753 14.9707 13.5059 14.5 12 14.5C10.4941 14.5 9.24704 14.9707 8.38442 15.4326C7.95179 15.6642 7.61027 15.8967 7.37408 16.0736C7.25578 16.1623 7.1633 16.2374 7.0984 16.2923C7.06593 16.3198 7.04031 16.3422 7.02176 16.3588L6.99924 16.3791L6.99199 16.3857L6.98937 16.3882L6.98832 16.3892L6.99199 16.3857Z" fill="#939BA1"/>
</svg>

Before

Width:  |  Height:  |  Size: 2.0 KiB

-3
View File
@@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.6192 18.1568L5.00164 20.8817C4.45399 21.1072 3.90948 20.553 4.14456 20.0094L11.3015 3.45893C11.422 3.18035 11.6965 3 12 3C12.3035 3 12.578 3.18035 12.6984 3.45893L19.8554 20.0094C20.0905 20.553 19.546 21.1072 18.9983 20.8817L12.3807 18.1568C12.1368 18.0563 11.8631 18.0564 11.6192 18.1568ZM11.25 16.4818C11.25 16.6096 11.1663 16.7211 11.0481 16.7698L7.47933 18.2393C7.06444 18.4101 6.65194 17.9903 6.83002 17.5785L10.7705 8.46607C10.8782 8.21695 11.25 8.29388 11.25 8.5653V16.4818ZM12.75 16.4818C12.75 16.6096 12.8337 16.7211 12.9519 16.7698L16.5206 18.2393C16.9355 18.4101 17.348 17.9903 17.1699 17.5785L13.2294 8.46607C13.1217 8.21695 12.75 8.29388 12.75 8.5653V16.4818Z" fill="#4360DF"/>
</svg>

Before

Width:  |  Height:  |  Size: 847 B

Some files were not shown because too many files have changed in this diff Show More