harbour-fernschreiber/qml/components/StickerPicker.qml
2020-10-15 23:43:55 +02:00

218 lines
8.5 KiB
QML

/*
Copyright (C) 2020 Sebastian J. Wolf
This file is part of Fernschreiber.
Fernschreiber is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Fernschreiber is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Fernschreiber. If not, see <http://www.gnu.org/licenses/>.
*/
import QtQuick 2.5
import QtGraphicalEffects 1.0
import QtMultimedia 5.0
import Sailfish.Silica 1.0
import "../components"
import "../js/twemoji.js" as Emoji
Item {
id: stickerPickerOverlayItem
anchors.fill: parent
property variant recentStickers: stickerManager.getRecentStickers()
property variant installedStickerSets: stickerManager.getInstalledStickerSets()
property bool pickerLoaded: false
Timer {
id: stickerPickerLoadedTimer
interval: 100
running: true
repeat: false
onTriggered: {
stickerPickerOverlayItem.pickerLoaded = true;
}
}
Rectangle {
id: stickerPickerOverlayBackground
anchors.fill: parent
color: Theme.overlayBackgroundColor
opacity: 0.7
}
Flickable {
id: stickerPickerFlickable
anchors.fill: parent
anchors.margins: Theme.paddingMedium
opacity: stickerPickerOverlayItem.pickerLoaded ? 1 : 0
Behavior on opacity { NumberAnimation {} }
visible: stickerPickerOverlayItem.pickerLoaded
contentHeight: stickerPickerColumn.height
clip: true
Column {
id: stickerPickerColumn
spacing: Theme.paddingMedium
width: stickerPickerFlickable.width
Text {
font.pixelSize: Theme.fontSizeMedium
font.bold: true
color: Theme.primaryColor
width: parent.width
maximumLineCount: 1
elide: Text.ElideRight
text: qsTr("Recently used")
}
Flickable {
width: parent.width
height: recentStickersRow.height + Theme.paddingSmall
anchors.horizontalCenter: parent.horizontalCenter
contentWidth: recentStickersRow.width
clip: true
Row {
id: recentStickersRow
spacing: Theme.paddingMedium
Repeater {
model: stickerPickerOverlayItem.recentStickers
Item {
height: singleRecentStickerRow.height
width: singleRecentStickerRow.width
Row {
id: singleRecentStickerRow
spacing: Theme.paddingSmall
Image {
source: modelData.thumbnail.photo.local.path
width: Theme.itemSizeExtraLarge
height: Theme.itemSizeExtraLarge
asynchronous: true
onStatusChanged: {
if (status === Image.Ready) {
stickerPickerLoadedTimer.restart();
}
}
}
}
MouseArea {
anchors.fill: parent
onClicked: {
tdLibWrapper.sendStickerMessage(chatInformation.id, modelData.sticker.remote.id);
stickerPickerOverlayItem.visible = false;
attachmentOptionsRow.visible = false;
stickerPickerLoader.active = false;
}
}
}
}
}
}
Repeater {
model: stickerPickerOverlayItem.installedStickerSets
width: stickerPickerFlickable.width
Column {
spacing: Theme.paddingMedium
width: parent.width
Text {
font.pixelSize: Theme.fontSizeMedium
font.bold: true
color: Theme.primaryColor
width: parent.width
maximumLineCount: 1
elide: Text.ElideRight
text: modelData.title
}
Flickable {
width: parent.width
height: installedStickerSetRow.height + Theme.paddingSmall
anchors.horizontalCenter: parent.horizontalCenter
contentWidth: installedStickerSetRow.width
clip: true
Row {
id: installedStickerSetRow
spacing: Theme.paddingMedium
Repeater {
model: modelData.stickers
Item {
width: Theme.itemSizeExtraLarge
height: Theme.itemSizeExtraLarge
Image {
id: singleStickerImage
source: modelData.thumbnail.photo.local.is_downloading_completed ? modelData.thumbnail.photo.local.path : ""
anchors.fill: parent
visible: modelData.thumbnail.photo.local.is_downloading_completed
asynchronous: true
onStatusChanged: {
if (status === Image.Ready) {
stickerPickerLoadedTimer.restart();
}
}
}
Text {
font.pixelSize: Theme.fontSizeHuge
color: Theme.primaryColor
anchors.fill: parent
maximumLineCount: 1
elide: Text.ElideRight
text: Emoji.emojify(modelData.emoji, font.pixelSize)
visible: !modelData.thumbnail.photo.local.is_downloading_completed
}
MouseArea {
anchors.fill: parent
onClicked: {
tdLibWrapper.sendStickerMessage(chatInformation.id, modelData.sticker.remote.id);
stickerPickerOverlayItem.visible = false;
attachmentOptionsRow.visible = false;
stickerPickerLoader.active = false;
}
}
}
}
}
}
}
}
}
}
Column {
anchors.centerIn: parent
width: parent.width
spacing: Theme.paddingMedium
opacity: stickerPickerOverlayItem.pickerLoaded ? 0 : 1
Behavior on opacity { NumberAnimation {} }
visible: !stickerPickerOverlayItem.pickerLoaded
InfoLabel {
id: loadingLabel
text: qsTr("Loading stickers...")
}
BusyIndicator {
id: loadingBusyIndicator
anchors.horizontalCenter: parent.horizontalCenter
running: !stickerPickerOverlayItem.pickerLoaded
size: BusyIndicatorSize.Large
}
}
}