linphone-desktop/linphone-app/ui/modules/Common/Form/DroppableTextArea.qml

174 lines
4.6 KiB
QML

import QtQuick 2.7
import QtQuick.Controls 2.2
import QtQuick.Dialogs 1.2
import Common 1.0
import Common.Styles 1.0
import Utils 1.0
// =============================================================================
Item {
id: droppableTextArea
property alias placeholderText: textArea.placeholderText
property alias text: textArea.text
property alias cursorPosition: textArea.cursorPosition
property bool dropEnabled: true
property string dropDisabledReason
// ---------------------------------------------------------------------------
signal dropped (var files)
signal validText (string text)
// ---------------------------------------------------------------------------
function _emitFiles (files) {
// Filtering files, other urls are forbidden.
files = files.reduce(function (files, file) {
if (file.startsWith('file:')) {
files.push(Utils.getSystemPathFromUri(file))
}
return files
}, [])
if (files.length > 0) {
dropped(files)
}
}
// ---------------------------------------------------------------------------
// Text area.
Flickable {
anchors.fill: parent
boundsBehavior: Flickable.StopAtBounds
ScrollBar.vertical: ForceScrollBar {
id: scrollBar
}
TextArea.flickable: TextArea {
id: textArea
function handleValidation () {
if (text.length !== 0) {
validText(text)
}
}
background: Rectangle {
color: DroppableTextAreaStyle.backgroundColor
}
color: DroppableTextAreaStyle.text.color
font.pointSize: DroppableTextAreaStyle.text.pointSize
rightPadding: fileChooserButton.width +
fileChooserButton.anchors.rightMargin +
DroppableTextAreaStyle.fileChooserButton.margins
selectByMouse: true
wrapMode: TextArea.Wrap
// Workaround. Without this line, the scrollbar is not linked correctly
// to the text area.
width: parent.width
Component.onCompleted: forceActiveFocus()
property var isAutoRepeating : false // shutdown repeating key feature to let optional menu appears and do normal stuff (like accents menu)
Keys.onReleased: {
if( event.isAutoRepeat){// We begin or are currently repeating a key
if(!isAutoRepeating){// We start repeat. Check if this is an "ignore" character
if(event.key > Qt.Key_Any && event.key <= Qt.Key_ydiaeresis)// Remove the previous character if it is a printable character
textArea.remove(cursorPosition-1, cursorPosition)
}
}else
isAutoRepeating = false// We are no more repeating. Final decision is done on Releasing
}
Keys.onPressed: {
if(event.isAutoRepeat){
isAutoRepeating = true// Where are repeating the key. Set the state.
if(event.key > Qt.Key_Any && event.key <= Qt.Key_ydiaeresis){// Ignore character if it is repeating and printable character
event.accepted = true
}
}else if (event.matches(StandardKey.InsertLineSeparator)) {
insert(cursorPosition, '')
} else if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
handleValidation()
event.accepted = true
}
}
}
}
// Handle click to select files.
ActionButton {
id: fileChooserButton
anchors {
right: parent.right
rightMargin: scrollBar.width +
DroppableTextAreaStyle.fileChooserButton.margins
verticalCenter: parent.verticalCenter
}
enabled: droppableTextArea.dropEnabled
icon: 'attachment'
iconSize: DroppableTextAreaStyle.fileChooserButton.size
onClicked: fileDialog.open()
FileDialog {
id: fileDialog
folder: shortcuts.home
title: qsTr('fileChooserTitle')
onAccepted: _emitFiles(fileDialog.fileUrls)
}
TooltipArea {
text: droppableTextArea.dropEnabled
? qsTr('attachmentTooltip')
: droppableTextArea.dropDisabledReason
}
}
// Hovered style.
Rectangle {
id: hoverContent
anchors.fill: parent
color: DroppableTextAreaStyle.hoverContent.backgroundColor
visible: false
Text {
anchors.centerIn: parent
color: DroppableTextAreaStyle.hoverContent.text.color
font.pointSize: DroppableTextAreaStyle.hoverContent.text.pointSize
text: qsTr('dropYourAttachment')
}
}
DropArea {
anchors.fill: parent
keys: [ 'text/uri-list' ]
visible: droppableTextArea.dropEnabled
onDropped: {
state = ''
if (drop.hasUrls) {
_emitFiles(drop.urls)
}
}
onEntered: state = 'hover'
onExited: state = ''
states: State {
name: 'hover'
PropertyChanges { target: hoverContent; visible: true }
}
}
}