feat: implement Google Form plugin and enhance TinyMCE editor with advanced configuration attributes

2026-08-08 09:32:07 +07:00
parent 373ee63716
commit 57a5c0cce3
39 changed files with 6600 additions and 577 deletions
@@ -0,0 +1,48 @@
+<!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>