49 lines
1.5 KiB
HTML
49 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@2.30.8/dist/editorjs.umd.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/tinymce@6/tinymce.min.js"></script>
|
|
<style>
|
|
.ce-block { margin: 20px; border: 1px solid #ccc; padding: 10px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="editorjs"></div>
|
|
<script>
|
|
class TinyMCETool {
|
|
static get toolbox() { return { title: 'TinyMCE', icon: 'T' }; }
|
|
render() {
|
|
const container = document.createElement('div');
|
|
const textarea = document.createElement('textarea');
|
|
container.appendChild(textarea);
|
|
setTimeout(() => {
|
|
tinymce.init({
|
|
target: textarea,
|
|
setup: function(editor) {
|
|
editor.on('focusin mousedown click keyup', function() {
|
|
container.dispatchEvent(new MouseEvent('mousedown', { bubbles: true, cancelable: true }));
|
|
container.dispatchEvent(new MouseEvent('mousemove', { bubbles: true, cancelable: true }));
|
|
console.log('Dispatched mousedown & mousemove');
|
|
});
|
|
}
|
|
});
|
|
}, 100);
|
|
return container;
|
|
}
|
|
save() { return { html: '' }; }
|
|
}
|
|
const editor = new EditorJS({
|
|
holder: 'editorjs',
|
|
tools: { tiny: TinyMCETool },
|
|
data: {
|
|
blocks: [
|
|
{ type: 'paragraph', data: { text: 'Block 1' } },
|
|
{ type: 'tiny', data: {} },
|
|
{ type: 'paragraph', data: { text: 'Block 3' } }
|
|
]
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|