diff --git a/core/lib/utils/html/html_utils.dart b/core/lib/utils/html/html_utils.dart
index c2fda6341..c9ab00f37 100644
--- a/core/lib/utils/html/html_utils.dart
+++ b/core/lib/utils/html/html_utils.dart
@@ -16,6 +16,22 @@ class HtmlUtils {
});''',
name: 'lineHeight100Percent');
+ static const registerDropListener = (
+ script: '''
+ document.querySelector(".note-editable").addEventListener(
+ "drop",
+ (event) => window.parent.postMessage(
+ JSON.stringify({"name": "registerDropListener"})))''',
+ name: 'registerDropListener');
+
+ static const unregisterDropListener = (
+ script: '''
+ console.log("unregisterDropListener");
+ const editor = document.querySelector(".note-editable");
+ const newEditor = editor.cloneNode(true);
+ editor.parentNode.replaceChild(newEditor, editor);''',
+ name: 'unregisterDropListener');
+
static String customCssStyleHtmlEditor({TextDirection direction = TextDirection.ltr}) {
if (PlatformInfo.isWeb) {
return '''
diff --git a/lib/features/composer/presentation/widgets/web/web_editor_widget.dart b/lib/features/composer/presentation/widgets/web/web_editor_widget.dart
index a1a3543cf..44ade9bab 100644
--- a/lib/features/composer/presentation/widgets/web/web_editor_widget.dart
+++ b/lib/features/composer/presentation/widgets/web/web_editor_widget.dart
@@ -1,9 +1,11 @@
+import 'dart:convert';
import 'package:collection/collection.dart';
import 'package:core/utils/app_logger.dart';
import 'package:core/utils/html/html_utils.dart';
import 'package:flutter/material.dart';
import 'package:html_editor_enhanced/html_editor.dart';
+import 'package:universal_html/html.dart' hide VoidCallback;
typedef OnChangeContentEditorAction = Function(String? text);
typedef OnInitialContentEditorAction = Function(String text);
@@ -62,6 +64,16 @@ class _WebEditorState extends State {
double? dropZoneWidth;
double? dropZoneHeight;
final ValueNotifier _htmlEditorHeight = ValueNotifier(_defaultHtmlEditorHeight);
+ bool _dropListenerRegistered = false;
+
+ void _dropListener(Event event) {
+ if (event is MessageEvent) {
+ if (jsonDecode(event.data)['name'] == HtmlUtils.registerDropListener.name) {
+ _editorController.evaluateJavascriptWeb(
+ HtmlUtils.lineHeight100Percent.name);
+ }
+ }
+ }
@override
void initState() {
@@ -76,6 +88,8 @@ class _WebEditorState extends State {
dropZoneWidth = widget.width! - _offsetWidth;
}
log('_WebEditorState::initState:dropZoneWidth: $dropZoneWidth | dropZoneHeight: $dropZoneHeight');
+
+ window.addEventListener("message", _dropListener);
}
@override
@@ -96,6 +110,9 @@ class _WebEditorState extends State {
@override
void dispose() {
_htmlEditorHeight.dispose();
+ _editorController.evaluateJavascriptWeb(
+ HtmlUtils.unregisterDropListener.name);
+ window.removeEventListener("message", _dropListener);
super.dispose();
}
@@ -118,7 +135,15 @@ class _WebEditorState extends State {
WebScript(
name: HtmlUtils.lineHeight100Percent.name,
script: HtmlUtils.lineHeight100Percent.script,
- )
+ ),
+ WebScript(
+ name: HtmlUtils.registerDropListener.name,
+ script: HtmlUtils.registerDropListener.script,
+ ),
+ WebScript(
+ name: HtmlUtils.unregisterDropListener.name,
+ script: HtmlUtils.unregisterDropListener.script,
+ ),
])
),
htmlToolbarOptions: const HtmlToolbarOptions(
@@ -133,7 +158,14 @@ class _WebEditorState extends State {
callbacks: Callbacks(
onBeforeCommand: widget.onChangeContent,
onChangeContent: widget.onChangeContent,
- onInit: () => widget.onInitial?.call(widget.content),
+ onInit: () {
+ widget.onInitial?.call(widget.content);
+ if (!_dropListenerRegistered) {
+ _editorController.evaluateJavascriptWeb(
+ HtmlUtils.registerDropListener.name);
+ _dropListenerRegistered = true;
+ }
+ },
onFocus: widget.onFocus,
onBlur: widget.onUnFocus,
onMouseDown: () => widget.onMouseDown?.call(context),