android - fix emitting html change event (#67)

Author: exploIF

android/src/main/java/com/swmansion/reactnativerichtexteditor/ReactNativeRichTextEditorView.kt

@@ -52,6 +52,7 @@ class ReactNativeRichTextEditorView : AppCompatEditText {
 
   val mentionHandler: MentionHandler? = MentionHandler(this)
   var richTextStyle: RichTextStyle = RichTextStyle(this, null)
+  var spanWatcher: EditorSpanWatcher? = null
 
   var fontSize: Float? = null
   private var autoFocus = false
@@ -345,6 +346,7 @@ class ReactNativeRichTextEditorView : AppCompatEditText {
   private fun addSpanWatcher(watcher: EditorSpanWatcher) {
     val spannable = text as Spannable
     spannable.setSpan(watcher, 0, spannable.length, Spannable.SPAN_INCLUSIVE_INCLUSIVE)
+    spanWatcher = watcher
   }
 
   fun verifyAndToggleStyle(name: String) {

android/src/main/java/com/swmansion/reactnativerichtexteditor/spans/interfaces/EditorHeadingSpan.kt

@@ -1,4 +1,4 @@
 package com.swmansion.reactnativerichtexteditor.spans.interfaces
 
-interface EditorHeadingSpan {
+interface EditorHeadingSpan : EditorSpan {
 }

android/src/main/java/com/swmansion/reactnativerichtexteditor/spans/interfaces/EditorInlineSpan.kt

@@ -1,4 +1,4 @@
 package com.swmansion.reactnativerichtexteditor.spans.interfaces
 
-interface EditorInlineSpan {
+interface EditorInlineSpan : EditorSpan {
 }

android/src/main/java/com/swmansion/reactnativerichtexteditor/spans/interfaces/EditorParagraphSpan.kt

@@ -1,4 +1,4 @@
 package com.swmansion.reactnativerichtexteditor.spans.interfaces
 
-interface EditorParagraphSpan {
+interface EditorParagraphSpan : EditorSpan {
 }

android/src/main/java/com/swmansion/reactnativerichtexteditor/spans/interfaces/EditorSpan.kt

@@ -0,0 +1,4 @@
+package com.swmansion.reactnativerichtexteditor.spans.interfaces
+
+interface EditorSpan {
+}

android/src/main/java/com/swmansion/reactnativerichtexteditor/watchers/EditorSpanWatcher.kt

@@ -9,6 +9,7 @@ import com.swmansion.reactnativerichtexteditor.ReactNativeRichTextEditorView
 import com.swmansion.reactnativerichtexteditor.events.OnChangeHtmlEvent
 import com.swmansion.reactnativerichtexteditor.spans.EditorOrderedListSpan
 import com.swmansion.reactnativerichtexteditor.spans.interfaces.EditorHeadingSpan
+import com.swmansion.reactnativerichtexteditor.spans.interfaces.EditorSpan
 import com.swmansion.reactnativerichtexteditor.utils.EditorParser
 import com.swmansion.reactnativerichtexteditor.utils.getSafeSpanBoundaries
 
@@ -18,13 +19,13 @@ class EditorSpanWatcher(private val editorView: ReactNativeRichTextEditorView) :
   override fun onSpanAdded(text: Spannable, what: Any, start: Int, end: Int) {
     updateNextLineLayout(what, text, end)
     updateUnorderedListSpans(what, text, end)
-    emitEvent(text)
+    emitEvent(text, what)
   }
 
   override fun onSpanRemoved(text: Spannable, what: Any, start: Int, end: Int) {
     updateNextLineLayout(what, text, end)
     updateUnorderedListSpans(what, text, end)
-    emitEvent(text)
+    emitEvent(text, what)
   }
 
   override fun onSpanChanged(text: Spannable, what: Any, ostart: Int, oend: Int, nstart: Int, nend: Int) {
@@ -50,7 +51,10 @@ class EditorSpanWatcher(private val editorView: ReactNativeRichTextEditorView) :
     }
   }
 
-  private fun emitEvent(s: Spannable) {
+  fun emitEvent(s: Spannable, what: Any?) {
+    // Emit event only if we change one of ours spans
+    if (what != null && what !is EditorSpan) return;
+
     val html = EditorParser.toHtml(s, EditorParser.TO_HTML_PARAGRAPH_LINES_INDIVIDUAL)
     if (html == previousHtml) return;
 

android/src/main/java/com/swmansion/reactnativerichtexteditor/watchers/EditorTextWatcher.kt

@@ -5,7 +5,6 @@ import android.text.TextWatcher
 import com.facebook.react.bridge.ReactContext
 import com.facebook.react.uimanager.UIManagerHelper
 import com.swmansion.reactnativerichtexteditor.ReactNativeRichTextEditorView
-import com.swmansion.reactnativerichtexteditor.events.OnChangeHtmlEvent
 import com.swmansion.reactnativerichtexteditor.events.OnChangeTextEvent
 
 class EditorTextWatcher(private val editorView: ReactNativeRichTextEditorView) : TextWatcher {
@@ -24,7 +23,7 @@ class EditorTextWatcher(private val editorView: ReactNativeRichTextEditorView) :
   override fun afterTextChanged(s: Editable?) {
     if (s == null || editorView.isSettingValue) return
 
-    emitEvent(s)
+    emitEvents(s)
     applyStyles(s)
   }
 
@@ -35,15 +34,11 @@ class EditorTextWatcher(private val editorView: ReactNativeRichTextEditorView) :
     editorView.parametrizedStyles?.afterTextChanged(s, endCursorPosition)
   }
 
-  private fun emitEvent(s: Editable) {
+  private fun emitEvents(s: Editable) {
     val context = editorView.context as ReactContext
     val surfaceId = UIManagerHelper.getSurfaceId(context)
     val dispatcher = UIManagerHelper.getEventDispatcherForReactTag(context, editorView.id)
     dispatcher?.dispatchEvent(OnChangeTextEvent(surfaceId, editorView.id, s))
-
-    // For empty text we have to manually emit HTML event from TextWatcher instead of SpanWatcher
-    if (s.isEmpty()) {
-      dispatcher?.dispatchEvent(OnChangeHtmlEvent(surfaceId, editorView.id, ""))
-    }
+    editorView.spanWatcher?.emitEvent(s, null)
   }
 }