onDragEnter = e => {
e.dataTransfer.dropEffect = 'copy'
this.messenger.send({
action: 'dragenter',
})
}
onStartDrag = e => {
this.messenger.send({
action: 'drag',
})
e.dataTransfer.effectAllowed = 'copyMove'
if (
typeof e.dataTransfer.getData('text/html') === 'undefined' ||
e.target.tagName === 'IMG'
) {
const targetParent = document.createElement('A')
const parentHTML = targetParent.cloneNode(false)
const targetImage = e.target.cloneNode(false)
parentHTML.appendChild(targetImage)
e.dataTransfer.setData('text/html', parentHTML.outerHTML)
}
// Show the drop target
this.dragTarget.style.display = 'flex'
this.dragTarget.style.opacity = 1
// Hide the underlying iframe
this.hideIframe()
}
sendData = msg => {
const data = new DataExtractor().extractSelection(msg)
if (data.type) {
this.messenger.send({
action: 'drop',
value: data,
})
}
}
onDrop = e => {
e.stopPropagation()
e.preventDefault()
const data = new DataExtractor(e).extract()
this.messenger.send({
action: 'drop',
value: data,
})
return false
}
sendCurrentPage = () => {
let { data } = new DataExtractor()
data = {
...data,
type: 'Link',
value: window.location.href,
url: window.location.href,
title: document.title,
}
this.messenger.send({
action: 'currentPage',
value: data,
})
}
saveCurrentPage = () => {
this.messenger.send({
action: 'saveCurrentPage',
})
}
onDragLeave = () => {
this.messenger.send({
action: 'dragleave',
})
}