Merge pull request #163 from milikhin/handle-osk-resize

[ubuntu-touch] prevent on-screen keyboard from being opened when scrolling editor
milikhin · Jan 28, 2023 · 54b8345 · 54b8345
2 parents ae8494b + 9330e01
commit 54b8345
Show file tree

Hide file tree

Showing 7 changed files with 52 additions and 9 deletions.
diff --git a/editor/src/editor/editor.ts b/editor/src/editor/editor.ts
@@ -48,9 +48,12 @@ export default class Editor extends EventTarget {
   _initialState: EditorState
   _isOskVisible: boolean
   _isReadOnly: boolean
+  _oskDebounceTimer: NodeJS.Timeout|null = null
 
   /** Content-change event timeout (ms) */
   ON_CHANGE_TIMEOUT = 250
+  SCROLL_INTO_VIEW_TIMEOUT = 250
+  OSK_SCROLL_DELAY = 100
 
   constructor (options: EditorOptions) {
     super()
@@ -188,6 +191,13 @@ export default class Editor extends EventTarget {
    */
   oskVisibilityChanged ({ isVisible }: { isVisible: boolean }): void {
     this._isOskVisible = isVisible
+
+    if (this._isOskVisible) {
+      // scroll into view when opening virtual keyboard
+      setTimeout(() => this._editor.dispatch({
+        effects: EditorView.scrollIntoView(this._editor.state.selection.ranges[0])
+      }), this.SCROLL_INTO_VIEW_TIMEOUT)
+    }
   }
 
   /**
@@ -221,11 +231,7 @@ export default class Editor extends EventTarget {
   }
 
   /** Handles viewport resizing */
-  resize = (): void => {
-    this._editor.dispatch({
-      effects: EditorView.scrollIntoView(this._editor.state.selection.ranges[0])
-    })
-  }
+  resize = (): void => {}
 
   async _initLanguageSupport (filePath: string): Promise<void> {
     const effects = await this._setup.setupLanguageSupport(filePath)
@@ -234,6 +240,8 @@ export default class Editor extends EventTarget {
 
   _initDomEventHandlers (): void {
     this._editorElem.addEventListener('keypress', this._onKeyPress, true)
+    ;(this._editorElem.querySelector('.cm-scroller') as HTMLElement)
+      .addEventListener('scroll', this._tmpDisableScrollIntoView)
     window.addEventListener('resize', this.resize)
   }
 
@@ -250,8 +258,33 @@ export default class Editor extends EventTarget {
     }
   }
 
+  _tmpDisableScrollIntoView = (): void => {
+    if (this._isReadOnly || this._isOskVisible) {
+      return
+    }
+
+    if (this._oskDebounceTimer === null) {
+      this._editor.dispatch({
+        effects: this._setup.readOnlyCompartment.reconfigure(
+          EditorView.editable.of(false))
+      })
+    } else {
+      clearTimeout(this._oskDebounceTimer)
+    }
+
+    this._oskDebounceTimer = setTimeout(() => {
+      this._editor.dispatch({
+        effects: this._setup.readOnlyCompartment.reconfigure(
+          EditorView.editable.of(true))
+      })
+      this._oskDebounceTimer = null
+    }, this.OSK_SCROLL_DELAY)
+  }
+
   _removeDomEventHandlers (): void {
     this._editorElem.removeEventListener('keypress', this._onKeyPress, true)
+    ;(this._editorElem.querySelector('.cm-scroller') as HTMLElement)
+      .removeEventListener('scroll', this._tmpDisableScrollIntoView)
     window.removeEventListener('resize', this.resize)
   }
 }
diff --git a/harbour-seabass/qml/pages/Editor.qml b/harbour-seabass/qml/pages/Editor.qml
@@ -50,6 +50,10 @@ WebViewPage {
                 root.isMenuEnabled = false
             }
         })
+
+        Qt.inputMethod.visibleChanged.connect(function() {
+            api.oskVisibilityChanged(Qt.inputMethod.visible)
+        })
     }
 
     PlatformComponents.Configuration {

diff --git a/ubports-seabass/html/index.html b/ubports-seabass/html/index.html
@@ -24,7 +24,7 @@
 <body>
   <div id="welcome">
     <h1>
-      Seabass2 v2.0.0
+      Seabass2 v2.0.1
     </h1>
     <h2>
       Features:

diff --git a/ubports-seabass/manifest.json.in b/ubports-seabass/manifest.json.in
@@ -10,7 +10,7 @@
             "content-hub": "content-hub.json"
         }
     },
-    "version": "2.0.0",
+    "version": "2.0.1",
     "maintainer": "Mikhael Milikhin <mikhael@milikhin.name>",
     "framework" : "ubuntu-sdk-20.04"
 }
diff --git a/ubports-seabass/po/seabass2.mikhael.pot b/ubports-seabass/po/seabass2.mikhael.pot
@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: seabass2.mikhael\n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2023-01-06 07:05+0000\n"
+"POT-Creation-Date: 2023-01-28 16:39+0000\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"

diff --git a/ubports-seabass/qml/Main.qml b/ubports-seabass/qml/Main.qml
@@ -27,7 +27,7 @@ ApplicationWindow {
   readonly property bool isWide: width >= Suru.units.gu(100)
   readonly property string defaultTitle: i18n.tr("Welcome")
   readonly property string defaultSubTitle: i18n.tr("Seabass2")
-  readonly property string version: "2.0.0"
+  readonly property string version: "2.0.1"
   readonly property bool isLibertineEnabled: false
 
   property bool hasBuildContainer: false

diff --git a/ubports-seabass/qml/components/UbuntuApi.qml b/ubports-seabass/qml/components/UbuntuApi.qml
@@ -65,4 +65,10 @@ GenericComponents.EditorApi {
     editorState.hasRedo = !data.isReadOnly && data.hasRedo
     editorState.isReadOnly = data.isReadOnly
   }
+
+  Component.onCompleted: {
+    Qt.inputMethod.visibleChanged.connect(function() {
+      api.oskVisibilityChanged(Qt.inputMethod.visible)
+    })
+  }
 }