import QtQuick 2.13 import QtQuick.Controls 2.13 import QtQuick.Layouts 1.3 import QtGraphicalEffects 1.0 import "../../imports" import "../../shared" import "../../shared/status" import "../../app/AppLayouts/Chat/ChatColumn/samples" Item { id: root property var stickerPacks: StickerPackData {} signal backClicked signal uninstallClicked(int packId) signal installClicked(var stickers, int packId, int index) signal cancelClicked(int packId) signal updateClicked(int packId) signal buyClicked(int packId) GridView { id: availableStickerPacks width: parent.width height: 380 anchors.left: parent.left anchors.leftMargin: Style.current.padding anchors.right: parent.right anchors.rightMargin: Style.current.padding anchors.top: parent.top anchors.topMargin: Style.current.padding cellWidth: parent.width - (Style.current.padding * 2) cellHeight: height - 72 model: stickerPacks focus: true clip: true delegate: Item { width: availableStickerPacks.cellWidth height: availableStickerPacks.cellHeight RoundedImage { id: imgPreview anchors.top: parent.top anchors.left: parent.left anchors.right: parent.right height: 220 width: parent.width radius: 12 source: "https://ipfs.infura.io/ipfs/" + preview onClicked: { stickerPackDetailsPopup.open() } } ModalPopup { id: stickerPackDetailsPopup height: 472 header: StatusStickerPackDetails { height: 46 anchors.top: parent.top anchors.left: parent.left anchors.topMargin: Style.current.padding width: parent.width - (Style.current.padding * 2) packThumb: thumbnail packName: name packAuthor: author packNameFontSize: 17 spacing: Style.current.padding / 2 } footer: StatusStickerButton { height: 76 anchors.right: parent.right style: StatusStickerButton.StyleType.LargeNoIcon packPrice: price isInstalled: installed isBought: bought isPending: pending onInstallClicked: root.installClicked(stickers, packId, index) onUninstallClicked: root.uninstallClicked(packId) onCancelClicked: root.cancelClicked(packId) onUpdateClicked: root.updateClicked(packId) onBuyClicked: { openPopup(stickerPackPurchaseModal) root.buyClicked(packId) } } contentWrapper.anchors.topMargin: 0 contentWrapper.anchors.bottomMargin: 0 StatusStickerList { id: stickerGridInPopup model: stickers height: 350 } } Component { id: stickerPackPurchaseModal StatusStickerPackPurchaseModal { onClosed: { destroy() } stickerPackId: packId packPrice: price width: stickerPackDetailsPopup.width height: stickerPackDetailsPopup.height showBackBtn: stickerPackDetailsPopup.opened } } StatusStickerPackDetails { id: stickerPackDetails height: 64 - (Style.current.smallPadding * 2) width: parent.width - (Style.current.padding * 2) anchors.top: imgPreview.bottom anchors.topMargin: Style.current.smallPadding anchors.bottomMargin: Style.current.smallPadding anchors.left: parent.left anchors.right: parent.right packThumb: thumbnail packName: name packAuthor: author StatusStickerButton { anchors.right: parent.right packPrice: price width: 75 // only needed for Qt Creator isInstalled: installed isBought: bought isPending: pending onInstallClicked: root.installClicked(stickers, packId, index) onUninstallClicked: root.uninstallClicked(packId) onCancelClicked: root.cancelClicked(packId) onUpdateClicked: root.updateClicked(packId) onBuyClicked: { openPopup(stickerPackPurchaseModal) root.buyClicked(packId) } } } } } Item { id: footer height: 44 - Style.current.padding anchors.top: availableStickerPacks.bottom RoundedIcon { id: btnBack anchors.top: parent.top anchors.topMargin: Style.current.padding / 2 anchors.left: parent.left anchors.leftMargin: Style.current.padding / 2 width: 28 height: 28 iconWidth: 17.5 iconHeight: 13.5 iconColor: Style.current.pillButtonTextColor source: "../../app/img/arrowUp.svg" rotation: 270 onClicked: { root.backClicked() } } } } /*##^## Designer { D{i:0;height:440;width:360} } ##^##*/