2020-09-29 10:41:27 +02:00
|
|
|
import QtQuick 2.13
|
|
|
|
import QtQuick.Controls 2.13
|
|
|
|
import QtQuick.Layouts 1.3
|
|
|
|
import QtGraphicalEffects 1.0
|
2021-09-28 18:04:06 +03:00
|
|
|
|
|
|
|
import utils 1.0
|
2021-10-28 00:27:49 +03:00
|
|
|
import shared.panels 1.0
|
2021-10-21 17:07:13 +02:00
|
|
|
|
2022-07-13 15:29:38 +03:00
|
|
|
import StatusQ.Core 0.1
|
2022-11-23 14:40:03 +01:00
|
|
|
import StatusQ.Core.Theme 0.1
|
|
|
|
import StatusQ.Controls 0.1
|
2021-10-25 21:37:44 +02:00
|
|
|
import StatusQ.Components 0.1
|
2021-10-01 18:58:36 +03:00
|
|
|
//TODO improve this!
|
2022-03-08 13:49:33 -05:00
|
|
|
import AppLayouts.Chat.stores 1.0
|
2020-09-29 10:41:27 +02:00
|
|
|
|
|
|
|
Popup {
|
2020-12-14 18:01:09 +11:00
|
|
|
id: root
|
2022-11-23 14:40:03 +01:00
|
|
|
|
2022-02-14 19:27:23 -04:00
|
|
|
property var store
|
2022-11-23 14:40:03 +01:00
|
|
|
|
2022-08-10 15:18:20 -04:00
|
|
|
signal stickerSelected(string hashId, string packId, string url)
|
2022-11-23 14:40:03 +01:00
|
|
|
|
|
|
|
QtObject {
|
|
|
|
id: d
|
|
|
|
|
|
|
|
// FIXME: move me to store
|
|
|
|
readonly property int installedPacksCount: root.store.stickersModuleInst.numInstalledStickerPacks
|
|
|
|
readonly property var recentStickers: root.store.stickersModuleInst.recent
|
|
|
|
readonly property var stickerPackList: store.stickersModuleInst.stickerPacks
|
|
|
|
readonly property bool stickerPacksLoaded: store.stickersModuleInst.packsLoaded
|
|
|
|
readonly property bool stickerPacksLoadFailed: store.stickersModuleInst.packsLoadFailed
|
|
|
|
readonly property bool stickerPacksLoading: !stickerPacksLoaded && !stickerPacksLoadFailed
|
|
|
|
|
|
|
|
function loadStickers() {
|
|
|
|
store.stickersModuleInst.loadStickers()
|
|
|
|
}
|
2023-02-08 14:31:14 +01:00
|
|
|
|
|
|
|
function getRecentStickers() {
|
|
|
|
store.stickersModuleInst.getRecentStickers()
|
|
|
|
}
|
2023-02-08 15:05:06 +01:00
|
|
|
|
|
|
|
function getInstalledStickerPacks() {
|
|
|
|
store.stickersModuleInst.getInstalledStickerPacks()
|
|
|
|
}
|
2023-04-17 23:53:55 +02:00
|
|
|
|
|
|
|
readonly property bool online: root.store.networkConnectionStore.isOnline
|
|
|
|
onOnlineChanged: {
|
|
|
|
if (online)
|
|
|
|
d.loadStickers()
|
|
|
|
}
|
2022-11-23 14:40:03 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
enabled: !!d.recentStickers && !!d.stickerPackList
|
2020-12-04 13:14:18 +01:00
|
|
|
width: 360
|
|
|
|
height: 440
|
2020-09-29 10:41:27 +02:00
|
|
|
modal: false
|
|
|
|
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
|
|
|
|
background: Rectangle {
|
|
|
|
radius: Style.current.radius
|
|
|
|
color: Style.current.background
|
|
|
|
border.color: Style.current.border
|
|
|
|
layer.enabled: true
|
|
|
|
layer.effect: DropShadow {
|
|
|
|
verticalOffset: 3
|
|
|
|
radius: 8
|
|
|
|
samples: 15
|
|
|
|
fast: true
|
|
|
|
cached: true
|
|
|
|
color: "#22000000"
|
|
|
|
}
|
|
|
|
}
|
2022-11-23 14:40:03 +01:00
|
|
|
|
2023-02-08 14:31:14 +01:00
|
|
|
onAboutToShow: {
|
2023-02-08 15:05:06 +01:00
|
|
|
d.getInstalledStickerPacks()
|
2023-04-12 12:31:35 +02:00
|
|
|
if (!stickerGrid.packId) {
|
2023-02-08 14:31:14 +01:00
|
|
|
d.getRecentStickers()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-09-29 10:41:27 +02:00
|
|
|
onClosed: {
|
|
|
|
stickerMarket.visible = false
|
|
|
|
footerContent.visible = true
|
|
|
|
stickersContainer.visible = true
|
|
|
|
}
|
2022-11-23 14:40:03 +01:00
|
|
|
|
2023-05-31 23:58:23 +03:00
|
|
|
padding: 0
|
|
|
|
|
|
|
|
ColumnLayout {
|
2020-09-29 10:41:27 +02:00
|
|
|
anchors.fill: parent
|
|
|
|
spacing: 0
|
|
|
|
|
|
|
|
StatusStickerMarket {
|
|
|
|
id: stickerMarket
|
|
|
|
visible: false
|
|
|
|
Layout.fillWidth: true
|
|
|
|
Layout.fillHeight: true
|
2022-02-14 19:27:23 -04:00
|
|
|
store: root.store
|
2022-11-23 14:40:03 +01:00
|
|
|
stickerPacks: d.stickerPackList
|
2021-12-08 23:20:43 +02:00
|
|
|
packId: stickerPackListView.selectedPackId
|
2023-04-17 23:53:55 +02:00
|
|
|
marketVisible: d.stickerPacksLoaded && d.online
|
2020-09-29 10:41:27 +02:00
|
|
|
onInstallClicked: {
|
2022-12-30 21:26:46 +01:00
|
|
|
//starts async task
|
2021-11-25 12:12:19 -05:00
|
|
|
stickersModule.install(packId)
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
onUninstallClicked: {
|
2021-11-25 12:12:19 -05:00
|
|
|
stickersModule.uninstall(packId)
|
2022-11-23 14:40:03 +01:00
|
|
|
stickerGrid.model = d.recentStickers
|
2022-12-01 11:24:25 +01:00
|
|
|
btnHistory.clicked(null)
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
onBackClicked: {
|
|
|
|
stickerMarket.visible = false
|
|
|
|
footerContent.visible = true
|
|
|
|
stickersContainer.visible = true
|
|
|
|
}
|
2021-11-23 14:59:49 +01:00
|
|
|
|
2022-12-30 21:26:46 +01:00
|
|
|
Connections {
|
|
|
|
target: root.store.stickersModuleInst
|
|
|
|
function onStickerPackInstalled(packId) {
|
|
|
|
const idx = stickersModule.stickerPacks.findIndexById(packId, false);
|
|
|
|
if (idx === -1) {
|
|
|
|
return
|
|
|
|
}
|
|
|
|
stickersModule.stickerPacks.findStickersById(packId)
|
|
|
|
stickerGrid.model = stickersModule.stickerPacks.getFoundStickers()
|
|
|
|
stickerPackListView.itemAt(idx).clicked()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-11-23 14:59:49 +01:00
|
|
|
Loader {
|
|
|
|
id: marketLoader
|
|
|
|
anchors.centerIn: parent
|
2022-11-23 14:40:03 +01:00
|
|
|
active: d.stickerPacksLoading
|
|
|
|
sourceComponent: loadingImageComponent
|
2021-11-23 14:59:49 +01:00
|
|
|
}
|
2022-11-23 14:46:02 +01:00
|
|
|
|
|
|
|
ColumnLayout {
|
|
|
|
id: failedToLoadStickersInfo
|
|
|
|
|
|
|
|
anchors.centerIn: parent
|
2023-04-17 23:53:55 +02:00
|
|
|
visible: d.stickerPacksLoadFailed || !d.online
|
2022-11-23 14:46:02 +01:00
|
|
|
|
|
|
|
StatusBaseText {
|
|
|
|
text: qsTr("Failed to load stickers")
|
|
|
|
color: Theme.palette.dangerColor1
|
|
|
|
}
|
|
|
|
|
|
|
|
StatusButton {
|
|
|
|
objectName: "stickersPopupRetryButton"
|
|
|
|
Layout.alignment: Qt.AlignHCenter
|
|
|
|
text: qsTr("Try again")
|
2023-04-17 23:53:55 +02:00
|
|
|
enabled: d.online
|
2022-11-23 14:46:02 +01:00
|
|
|
|
|
|
|
onClicked: d.loadStickers()
|
|
|
|
}
|
|
|
|
}
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
Item {
|
|
|
|
id: stickersContainer
|
|
|
|
Layout.fillWidth: true
|
|
|
|
Layout.leftMargin: 4
|
|
|
|
Layout.topMargin: 4
|
|
|
|
Layout.bottomMargin: 0
|
|
|
|
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
|
|
|
|
Layout.preferredHeight: 400 - 4
|
|
|
|
|
|
|
|
Item {
|
|
|
|
id: noStickerPacks
|
|
|
|
anchors.fill: parent
|
2023-04-17 23:53:55 +02:00
|
|
|
visible: d.installedPacksCount == 0 && stickersModule.recent.rowCount() === 0
|
2020-09-29 10:41:27 +02:00
|
|
|
|
|
|
|
Image {
|
|
|
|
id: imgNoStickers
|
|
|
|
width: 56
|
|
|
|
height: 56
|
|
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
|
|
anchors.top: parent.top
|
|
|
|
anchors.topMargin: 134
|
2021-09-28 18:04:06 +03:00
|
|
|
source: Style.svg("stickers_sad_icon")
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
Item {
|
|
|
|
id: noStickersContainer
|
|
|
|
width: parent.width
|
|
|
|
height: 22
|
|
|
|
anchors.top: imgNoStickers.bottom
|
|
|
|
anchors.topMargin: 8
|
|
|
|
|
|
|
|
StyledText {
|
|
|
|
id: lblNoStickersYet
|
|
|
|
anchors.fill: parent
|
|
|
|
font.pixelSize: 15
|
2023-04-17 23:53:55 +02:00
|
|
|
text: d.installedPacksCount === 0 || !d.online ? qsTr("You don't have any stickers yet")
|
|
|
|
: qsTr("Recently used stickers will appear here")
|
2020-09-29 10:41:27 +02:00
|
|
|
lineHeight: 22
|
|
|
|
horizontalAlignment: Text.AlignHCenter
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-11-23 14:40:03 +01:00
|
|
|
StatusButton {
|
2022-08-11 15:16:59 -04:00
|
|
|
objectName: "stickersPopupGetStickersButton"
|
2023-04-17 23:53:55 +02:00
|
|
|
visible: d.installedPacksCount === 0
|
2022-04-04 13:26:30 +02:00
|
|
|
text: qsTr("Get Stickers")
|
2023-04-17 23:53:55 +02:00
|
|
|
enabled: d.online
|
2020-09-29 10:41:27 +02:00
|
|
|
anchors.top: noStickersContainer.bottom
|
|
|
|
anchors.topMargin: Style.current.padding
|
|
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
|
|
onClicked: {
|
|
|
|
stickersContainer.visible = false
|
|
|
|
stickerMarket.visible = true
|
|
|
|
footerContent.visible = false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2023-04-17 23:53:55 +02:00
|
|
|
|
2020-09-29 10:41:27 +02:00
|
|
|
StatusStickerList {
|
|
|
|
id: stickerGrid
|
2022-08-11 15:16:59 -04:00
|
|
|
objectName: "statusStickerPopupStickerGrid"
|
2023-04-12 14:15:39 +02:00
|
|
|
anchors.fill: parent
|
2022-11-23 14:40:03 +01:00
|
|
|
model: d.recentStickers
|
2021-12-08 23:20:43 +02:00
|
|
|
packId: stickerPackListView.selectedPackId
|
2020-09-29 10:41:27 +02:00
|
|
|
onStickerClicked: {
|
2022-08-10 15:18:20 -04:00
|
|
|
root.stickerSelected(hash, packId, url)
|
2020-12-14 18:01:09 +11:00
|
|
|
root.close()
|
|
|
|
}
|
|
|
|
}
|
2021-02-09 09:57:53 -04:00
|
|
|
|
|
|
|
Component {
|
|
|
|
id: loadingImageComponent
|
2021-04-26 12:25:01 +02:00
|
|
|
StatusLoadingIndicator {
|
2021-02-09 09:57:53 -04:00
|
|
|
width: 50
|
|
|
|
height: 50
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
}
|
2021-02-09 09:57:53 -04:00
|
|
|
|
|
|
|
Loader {
|
|
|
|
id: loadingGrid
|
2022-11-23 14:40:03 +01:00
|
|
|
active: d.stickerPacksLoading
|
2021-02-09 09:57:53 -04:00
|
|
|
sourceComponent: loadingImageComponent
|
|
|
|
anchors.centerIn: parent
|
|
|
|
}
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
|
2023-01-09 13:59:04 -05:00
|
|
|
RowLayout {
|
2020-09-29 10:41:27 +02:00
|
|
|
id: footerContent
|
|
|
|
Layout.fillWidth: true
|
2023-04-12 21:08:42 +02:00
|
|
|
Layout.preferredHeight: 44
|
2023-01-09 13:59:04 -05:00
|
|
|
Layout.rightMargin: Style.current.padding / 2
|
|
|
|
Layout.leftMargin: Style.current.padding / 2
|
2022-04-11 18:17:42 +02:00
|
|
|
spacing: Style.current.padding / 2
|
2020-09-29 10:41:27 +02:00
|
|
|
|
2023-04-12 21:08:42 +02:00
|
|
|
StatusRoundButton {
|
2020-09-29 10:41:27 +02:00
|
|
|
id: btnAddStickerPack
|
2023-04-12 12:38:38 +02:00
|
|
|
Layout.preferredWidth: 24
|
|
|
|
Layout.preferredHeight: 24
|
2021-10-25 21:37:44 +02:00
|
|
|
icon.name: "add"
|
2023-04-12 21:08:42 +02:00
|
|
|
type: StatusFlatRoundButton.Type.Secondary
|
|
|
|
loading: d.stickerPacksLoading
|
2020-09-29 10:41:27 +02:00
|
|
|
onClicked: {
|
|
|
|
stickersContainer.visible = false
|
|
|
|
stickerMarket.visible = true
|
|
|
|
footerContent.visible = false
|
|
|
|
}
|
|
|
|
}
|
2022-04-11 18:17:42 +02:00
|
|
|
|
2022-11-23 14:40:03 +01:00
|
|
|
StatusTabBarIconButton {
|
2020-09-29 10:41:27 +02:00
|
|
|
id: btnHistory
|
2022-04-11 18:17:42 +02:00
|
|
|
icon.name: "time"
|
|
|
|
highlighted: true
|
2020-09-29 10:41:27 +02:00
|
|
|
onClicked: {
|
2022-04-11 18:17:42 +02:00
|
|
|
highlighted = true
|
2023-04-12 12:31:35 +02:00
|
|
|
stickerPackListView.selectedPackId = ""
|
2023-02-08 14:31:14 +01:00
|
|
|
d.getRecentStickers()
|
2022-11-23 14:40:03 +01:00
|
|
|
stickerGrid.model = d.recentStickers
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-07-13 15:29:38 +03:00
|
|
|
StatusScrollView {
|
2023-05-31 23:58:23 +03:00
|
|
|
id: scrollView
|
|
|
|
|
2023-01-09 13:59:04 -05:00
|
|
|
Layout.fillWidth: true
|
2023-01-26 10:41:07 +02:00
|
|
|
Layout.fillHeight: true
|
2023-06-07 16:18:29 +03:00
|
|
|
padding: 0
|
|
|
|
contentHeight: availableHeight
|
2023-01-09 13:59:04 -05:00
|
|
|
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
|
2022-04-11 18:17:42 +02:00
|
|
|
|
2020-11-27 16:51:52 -04:00
|
|
|
RowLayout {
|
2023-06-07 16:18:29 +03:00
|
|
|
height: scrollView.availableHeight
|
2023-04-12 12:31:35 +02:00
|
|
|
spacing: footerContent.spacing
|
2022-07-20 17:54:30 +03:00
|
|
|
|
2020-11-27 16:51:52 -04:00
|
|
|
Repeater {
|
|
|
|
id: stickerPackListView
|
2023-04-12 12:31:35 +02:00
|
|
|
property string selectedPackId
|
2022-11-23 14:40:03 +01:00
|
|
|
model: d.stickerPackList
|
|
|
|
visible: d.stickerPacksLoaded
|
2020-09-29 10:41:27 +02:00
|
|
|
|
2020-11-27 16:51:52 -04:00
|
|
|
delegate: StatusStickerPackIconWithIndicator {
|
|
|
|
id: packIconWithIndicator
|
|
|
|
visible: installed
|
2023-06-07 16:18:29 +03:00
|
|
|
Layout.alignment: Qt.AlignVCenter
|
2020-11-27 16:51:52 -04:00
|
|
|
selected: stickerPackListView.selectedPackId === packId
|
2022-02-14 19:27:23 -04:00
|
|
|
source: thumbnail
|
2020-11-27 16:51:52 -04:00
|
|
|
onClicked: {
|
2022-04-11 18:17:42 +02:00
|
|
|
btnHistory.highlighted = false
|
2020-11-27 16:51:52 -04:00
|
|
|
stickerPackListView.selectedPackId = packId
|
|
|
|
stickerGrid.model = stickers
|
|
|
|
}
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
}
|
2020-12-14 18:01:09 +11:00
|
|
|
Repeater {
|
|
|
|
id: loadingStickerPackListView
|
2022-11-23 14:40:03 +01:00
|
|
|
model: d.stickerPacksLoading ? 7 : 0
|
2020-12-14 18:01:09 +11:00
|
|
|
|
|
|
|
delegate: Rectangle {
|
2023-06-07 16:18:29 +03:00
|
|
|
Layout.alignment: Qt.AlignVCenter
|
2023-04-12 12:38:38 +02:00
|
|
|
Layout.preferredWidth: 24
|
|
|
|
Layout.preferredHeight: 24
|
2020-12-14 18:01:09 +11:00
|
|
|
radius: width / 2
|
|
|
|
color: Style.current.backgroundHover
|
|
|
|
}
|
|
|
|
}
|
2022-08-10 10:51:04 +03:00
|
|
|
Item {
|
|
|
|
Layout.fillWidth: true
|
|
|
|
}
|
2020-09-29 10:41:27 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|