mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-16 03:06:27 +00:00
drag and drop image from browser
This commit is contained in:
@@ -18,15 +18,23 @@ const PATH_SEPARATORS = escapeStringRegexp(path.posix.sep) + escapeStringRegexp(
|
|||||||
* @returns {Promise<Image>} Image element created
|
* @returns {Promise<Image>} Image element created
|
||||||
*/
|
*/
|
||||||
function getImage (file) {
|
function getImage (file) {
|
||||||
return new Promise((resolve) => {
|
if (_.isString(file)) {
|
||||||
const reader = new FileReader()
|
return new Promise(resolve => {
|
||||||
const img = new Image()
|
const img = new Image()
|
||||||
img.onload = () => resolve(img)
|
img.onload = () => resolve(img)
|
||||||
reader.onload = e => {
|
img.src = file
|
||||||
img.src = e.target.result
|
})
|
||||||
}
|
} else {
|
||||||
reader.readAsDataURL(file)
|
return new Promise(resolve => {
|
||||||
})
|
const reader = new FileReader()
|
||||||
|
const img = new Image()
|
||||||
|
img.onload = () => resolve(img)
|
||||||
|
reader.onload = e => {
|
||||||
|
img.src = e.target.result
|
||||||
|
}
|
||||||
|
reader.readAsDataURL(file)
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -253,23 +261,57 @@ function generateAttachmentMarkdown (fileName, path, showPreview) {
|
|||||||
* @param {Event} dropEvent DropEvent
|
* @param {Event} dropEvent DropEvent
|
||||||
*/
|
*/
|
||||||
function handleAttachmentDrop (codeEditor, storageKey, noteKey, dropEvent) {
|
function handleAttachmentDrop (codeEditor, storageKey, noteKey, dropEvent) {
|
||||||
const file = dropEvent.dataTransfer.files[0]
|
if (dropEvent.dataTransfer.files.length > 0) {
|
||||||
const filePath = file.path
|
const file = dropEvent.dataTransfer.files[0]
|
||||||
const originalFileName = path.basename(filePath)
|
const filePath = file.path
|
||||||
const fileType = file['type']
|
const originalFileName = path.basename(filePath)
|
||||||
const isImage = fileType.startsWith('image')
|
const fileType = file['type']
|
||||||
let promise
|
const isImage = fileType.startsWith('image')
|
||||||
if (isImage) {
|
let promise
|
||||||
promise = fixRotate(file).then(base64data => {
|
if (isImage) {
|
||||||
return copyAttachment({type: 'base64', data: base64data, sourceFilePath: filePath}, storageKey, noteKey)
|
console.log(file)
|
||||||
|
promise = fixRotate(file).then(base64data => {
|
||||||
|
return copyAttachment({type: 'base64', data: base64data, sourceFilePath: filePath}, storageKey, noteKey)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
promise = copyAttachment(filePath, storageKey, noteKey)
|
||||||
|
}
|
||||||
|
promise.then((fileName) => {
|
||||||
|
const imageMd = generateAttachmentMarkdown(originalFileName, path.join(STORAGE_FOLDER_PLACEHOLDER, noteKey, fileName), isImage)
|
||||||
|
codeEditor.insertAttachmentMd(imageMd)
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
promise = copyAttachment(filePath, storageKey, noteKey)
|
for (let i = 0; i < dropEvent.dataTransfer.items.length; i++) {
|
||||||
|
const item = dropEvent.dataTransfer.items[i]
|
||||||
|
|
||||||
|
if (item.type === 'text/html') {
|
||||||
|
const html = dropEvent.dataTransfer.getData('text/html')
|
||||||
|
|
||||||
|
const match = /<img[^>]*src="([^"]+)"/.exec(html)
|
||||||
|
if (match) {
|
||||||
|
const imageURL = match[1]
|
||||||
|
|
||||||
|
getImage(imageURL)
|
||||||
|
.then(image => {
|
||||||
|
const canvas = document.createElement('canvas')
|
||||||
|
const context = canvas.getContext('2d')
|
||||||
|
canvas.width = image.width
|
||||||
|
canvas.height = image.height
|
||||||
|
context.drawImage(image, 0, 0)
|
||||||
|
|
||||||
|
return copyAttachment({type: 'base64', data: canvas.toDataURL(), sourceFilePath: imageURL}, storageKey, noteKey)
|
||||||
|
})
|
||||||
|
.then(fileName => {
|
||||||
|
const imageMd = generateAttachmentMarkdown(imageURL, path.join(STORAGE_FOLDER_PLACEHOLDER, noteKey, fileName), true)
|
||||||
|
|
||||||
|
codeEditor.insertAttachmentMd(imageMd)
|
||||||
|
})
|
||||||
|
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
promise.then((fileName) => {
|
|
||||||
const imageMd = generateAttachmentMarkdown(originalFileName, path.join(STORAGE_FOLDER_PLACEHOLDER, noteKey, fileName), isImage)
|
|
||||||
codeEditor.insertAttachmentMd(imageMd)
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
Reference in New Issue
Block a user