83 lines
2.6 KiB
QML
83 lines
2.6 KiB
QML
|
import QtQuick 2.14
|
||
|
|
import QtQuick.Layouts 1.14
|
||
|
|
import QtQuick.Controls 2.14
|
||
|
|
import QtQuick.Dialogs 1.3
|
||
|
|
|
||
|
|
import utils 1.0
|
||
|
|
import shared.panels 1.0
|
||
|
|
import shared.popups 1.0
|
||
|
|
|
||
|
|
import StatusQ.Core 0.1
|
||
|
|
import StatusQ.Core.Theme 0.1
|
||
|
|
import StatusQ.Layout 0.1
|
||
|
|
import StatusQ.Components 0.1
|
||
|
|
import StatusQ.Controls 0.1
|
||
|
|
import StatusQ.Controls.Validators 0.1
|
||
|
|
import StatusQ.Popups 0.1
|
||
|
|
|
||
|
|
Item {
|
||
|
|
id: root
|
||
|
|
|
||
|
|
property bool hasImage: false
|
||
|
|
property bool isDraggable: true
|
||
|
|
property bool containsDrag: dropArea.containsDrag
|
||
|
|
property bool editorAnchorLeft: true
|
||
|
|
property alias uploadTextLabel: textLabel
|
||
|
|
property alias editorRoundedImage: editor.roundedImage
|
||
|
|
property alias artworkSource: editor.source
|
||
|
|
property alias artworkCropRect: editor.cropRect
|
||
|
|
property alias editorTitle: editor.title
|
||
|
|
property alias acceptButtonText: editor.acceptButtonText
|
||
|
|
|
||
|
|
Item {
|
||
|
|
id: dropAreaItem
|
||
|
|
anchors.fill: parent
|
||
|
|
Rectangle {
|
||
|
|
anchors.fill: parent
|
||
|
|
opacity: root.containsDrag ? 1 : 0
|
||
|
|
Behavior on opacity { NumberAnimation { duration: 100 } }
|
||
|
|
color: "#33869eff"
|
||
|
|
border.color: Theme.palette.primaryColor1
|
||
|
|
radius: Style.current.radius
|
||
|
|
NoImageUploadedPanel {
|
||
|
|
visible: !editor.userSelectedImage
|
||
|
|
anchors.centerIn: parent
|
||
|
|
imgColor: Theme.palette.primaryColor1
|
||
|
|
uploadTextColor: Theme.palette.primaryColor1
|
||
|
|
uploadText: qsTr("Drop It!")
|
||
|
|
}
|
||
|
|
}
|
||
|
|
DropArea {
|
||
|
|
id: dropArea
|
||
|
|
anchors.fill: parent
|
||
|
|
enabled: root.isDraggable
|
||
|
|
onEntered: {
|
||
|
|
root.hasImage = (drag.urls.length > 0);
|
||
|
|
}
|
||
|
|
onDropped: {
|
||
|
|
editor.cropImage(drop.urls[0]);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
EditCroppedImagePanel {
|
||
|
|
id: editor
|
||
|
|
width: parent.height
|
||
|
|
height: width
|
||
|
|
anchors.left: root.editorAnchorLeft ? parent.left : undefined
|
||
|
|
anchors.horizontalCenter: !root.editorAnchorLeft ? parent.horizontalCenter : undefined
|
||
|
|
visible: editor.userSelectedImage || !(root.containsDrag && root.hasImage)
|
||
|
|
opacity: visible ? ((root.containsDrag && root.hasImage) ? .4 : 1) : 0
|
||
|
|
Behavior on opacity { NumberAnimation { duration: 100 } }
|
||
|
|
editButtonVisible: !(root.containsDrag && root.hasImage)
|
||
|
|
|
||
|
|
NoImageUploadedPanel {
|
||
|
|
id: textLabel
|
||
|
|
width: parent.width
|
||
|
|
anchors.centerIn: parent
|
||
|
|
visible: !editor.userSelectedImage
|
||
|
|
additionalTextPixelSize: Theme.secondaryTextFontSize
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|