| <!DOCTYPE html> |
| <html> |
| <body> |
| <div id="editor" contenteditable></div> |
| <script> |
| const editor = document.getElementById('editor'); |
| editor.focus(); |
| |
| var dataTransfer = {}; |
| editor.addEventListener('paste', (event) => { |
| dataTransfer.types = Array.from(event.clipboardData.types); |
| dataTransfer.files = Array.from(event.clipboardData.files); |
| dataTransfer.items = Array.from(event.clipboardData.items).map(cloneItem); |
| }); |
| |
| function cloneItem(item) { |
| return { |
| kind: item.kind, |
| type: item.type, |
| file: item.getAsFile(), |
| } |
| } |
| |
| var imageElement; |
| function insertFileAsImage(file) { |
| imageElement = document.createElement('img'); |
| imageElement.onload = () => window.webkit.messageHandlers.testHandler.postMessage('loaded'); |
| imageElement.src = URL.createObjectURL(file); |
| document.body.appendChild(imageElement); |
| } |
| |
| </script> |
| </body> |
| </html> |