status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(DragnDrop): re-enabled drag and drop 

Closes #7484
This commit is contained in:
Alexandra Betouni 2022-10-06 18:47:55 +03:00 committed by Iuri Matias
parent 6d15f8c16f
commit 6fa4553d08
4 changed files with 91 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

99
ui/app/mainui/AppMain.qml
View File

@ -38,6 +38,7 @@ import AppLayouts.Browser.stores 1.0 as BrowserStores
import AppLayouts.stores 1.0
import "popups"
import "panels"
import "activitycenter/popups"
import "activitycenter/stores" as AC
@ -46,7 +47,6 @@ Item {
anchors.fill: parent
property alias appLayout: appLayout
property alias dragAndDrop: dragTarget
property RootStore rootStore: RootStore {}
property AC.RootStore acStore: AC.RootStore {}
// set from main.qml
@ -954,85 +954,6 @@ Item {
}
}
DropArea {
id: dragTarget
signal droppedOnValidScreen(var drop)
property alias droppedUrls: rptDraggedPreviews.model
property var chatCommunitySectionModule: chatLayoutContainer.rootStore.chatCommunitySectionModule
property int activeChatType: chatCommunitySectionModule && chatCommunitySectionModule.activeItem.type
property bool enabled: !drag.source && !!loader.item && !!loader.item.appLayout
&& (
// in chat view
(mainModule.activeSection.sectionType === Constants.appSection.chat &&
(
// in a one-to-one chat
activeChatType === Constants.chatType.oneToOne ||
// in a private group chat
activeChatType === Constants.chatType.privateGroupChat
)
) ||
// In community section
mainModule.activeSection.sectionType === Constants.appSection.community
)
width: appMain.width
height: appMain.height
function cleanup() {
rptDraggedPreviews.model = []
}
onDropped: (drop) => {
if (enabled) {
droppedOnValidScreen(drop)
} else {
drop.accepted = false
}
cleanup()
}
onEntered: {
if (!enabled || !!drag.source) {
drag.accepted = false
return
}
// needed because drag.urls is not a normal js array
rptDraggedPreviews.model = drag.urls.filter(img => Utils.hasDragNDropImageExtension(img))
}
onPositionChanged: {
rptDraggedPreviews.x = drag.x
rptDraggedPreviews.y = drag.y
}
onExited: cleanup()
Loader {
active: dragTarget.enabled && dragTarget.containsDrag
width: active ? parent.width : 0
height: active ? parent.height : 0
sourceComponent: Rectangle {
id: dropRectangle
color: Style.current.background
opacity: 0.8
}
}
Repeater {
id: rptDraggedPreviews
Image {
source: modelData
width: 80
height: 80
sourceSize.width: 160
sourceSize.height: 160
fillMode: Image.PreserveAspectFit
x: index * 10 + rptDraggedPreviews.x
y: index * 10 + rptDraggedPreviews.y
z: 1
}
}
}
// Add SendModal here as it is used by the Wallet as well as the Browser
Loader {
id: sendModal
@ -1276,4 +1197,22 @@ Item {
keycardPopup.item.open()
}
}
DropAreaPanel {
width: appMain.width
height: appMain.height
activeChatType: chatCommunitySectionModule && chatCommunitySectionModule.activeItem.type
enabled: !drag.source && (
// in chat view
(mainModule.activeSection.sectionType === Constants.appSection.chat &&
(
// in a one-to-one chat
activeChatType === Constants.chatType.oneToOne ||
// in a private group chat
activeChatType === Constants.chatType.privateGroupChat
)
) ||
// In community section
mainModule.activeSection.sectionType === Constants.appSection.community)
}
}

70
ui/app/mainui/panels/DropAreaPanel.qml Normal file
View File

@ -0,0 +1,70 @@
import QtQuick 2.14
import utils 1.0
DropArea {
id: root
property bool enabled: false
property alias droppedUrls: rptDraggedPreviews.model
property int activeChatType
signal droppedOnValidScreen(var drop)
function cleanup() {
rptDraggedPreviews.model = []
}
Component.onCompleted: {
Global.dragArea = this;
}
onDropped: (drop) => {
if (enabled) {
droppedOnValidScreen(drop)
} else {
drop.accepted = false
}
cleanup()
}
onEntered: {
if (!enabled || !!drag.source) {
drag.accepted = false
return
}
// needed because drag.urls is not a normal js array
rptDraggedPreviews.model = drag.urls.filter(img => Utils.hasDragNDropImageExtension(img))
}
onPositionChanged: {
rptDraggedPreviews.x = drag.x
rptDraggedPreviews.y = drag.y
}
onExited: cleanup()
Loader {
active: root.containsDrag
width: active ? parent.width : 0
height: active ? parent.height : 0
sourceComponent: Rectangle {
id: dropRectangle
color: Style.current.background
opacity: 0.8
}
}
Repeater {
id: rptDraggedPreviews
Image {
source: modelData
width: 80
height: 80
sourceSize.width: 160
sourceSize.height: 160
fillMode: Image.PreserveAspectFit
x: index * 10 + rptDraggedPreviews.x
y: index * 10 + rptDraggedPreviews.y
z: 1
}
}
}

2
ui/imports/shared/status/StatusChatInput.qml
View File

@ -827,7 +827,7 @@ Rectangle {
Connections {
enabled: control.isActiveChannel
target: Global.appMain.dragAndDrop
target: Global.dragArea
ignoreUnknownSignals: true
onDroppedOnValidScreen: (drop) => {
let validImages = validateImages(drop.urls)

1
ui/imports/utils/Global.qml
View File

@ -10,6 +10,7 @@ Item {
property var applicationWindow
property var appMain
property var dragArea
property bool popupOpened: false
property int settingsSubsection: Constants.settingsSubsection.profile