enhance(ui): WIP: fixed element of ios platform

package.json

@@ -65,11 +65,12 @@
     "dependencies": {
         "@capacitor/android": "3.2.2",
         "@capacitor/app": "1.0.6",
+        "@capacitor/camera": "1.2.1",
         "@capacitor/core": "3.2.2",
         "@capacitor/filesystem": "1.0.6",
         "@capacitor/ios": "3.2.2",
+        "@capacitor/keyboard": "^1.2.0",
         "@capacitor/splash-screen": "1.1.3",
-        "@capacitor/camera": "1.2.1", 
         "@excalidraw/excalidraw": "0.4.2",
         "@kanru/rage-wasm": "0.2.1",
         "@sentry/browser": "6.4.1",
@@ -82,6 +83,7 @@
         "d3-force": "3.0.0",
         "diff": "5.0.0",
         "diff-match-patch": "1.0.5",
+        "electron": "15.1.2",
         "fs": "0.0.1-security",
         "fs-extra": "9.1.0",
         "fuse.js": "6.4.6",
@@ -107,7 +109,6 @@
         "react-tweet-embed": "1.2.2",
         "reakit": "0.11.1",
         "threads": "1.6.5",
-        "yargs-parser": "20.2.4",
-        "electron": "15.1.2"
+        "yargs-parser": "20.2.4"
     }
 }

src/main/frontend/components/editor.cljs

@@ -8,6 +8,7 @@
             [frontend.components.search :as search]
             [frontend.components.svg :as svg]
             [frontend.mobile.camera :as mobile-camera]
+            [frontend.mobile.util :as mobile-util]
             [frontend.config :as config]
             [frontend.handler.notification :as notification]
             [frontend.db :as db]
@@ -679,7 +680,8 @@
   (let [content (state/sub-edit-content)
         heading-class (get-editor-style-class content format)]
     [:div.editor-inner {:class (if block "block-editor" "non-block-editor")}
-     (when config/mobile? (mobile-bar state id))
+     (when (or (mobile-util/is-native-platform?) config/mobile?)
+       (mobile-bar state id))
      (ui/ls-textarea
       {:id                id
        :cacheMeasurements (editor-row-height-unchanged?) ;; check when content updated (as the content variable is binded)

src/main/frontend/mobile/core.cljs

@@ -2,8 +2,10 @@
   (:require [frontend.mobile.util :as mobile-util]
             [frontend.state :as state]
             ["@capacitor/app" :refer [^js App]]
+            ["@capacitor/keyboard" :refer [^js Keyboard]]
             [reitit.frontend.easy :as rfe]
             [clojure.string :as string]
+            [frontend.handler.notification :as notification]
             [frontend.fs.capacitor-fs :as fs]))
 
 (defn init!
@@ -31,4 +33,12 @@
                          (js/window.history.back))))))
   (when (mobile-util/native-ios?)
     (let [path (fs/iOS-ensure-documents!)]
-      (println "iOS container path: " path))))
+      (println "iOS container path: " path))
+    ;; keyboard watcher
+    (let [*pre-open? (volatile! nil)]
+      (.addListener Keyboard "keyboardWillShow" #(when (state/get-left-sidebar-open?)
+                                                   (state/set-left-sidebar-open! false)
+                                                   (vreset! *pre-open? true)))
+      (.addListener Keyboard "keyboardDidHide" #(when (true? @*pre-open?)
+                                                  (state/set-left-sidebar-open! true)
+                                                  (vreset! *pre-open? nil))))))

src/main/frontend/ui.cljs

@@ -50,6 +50,12 @@
     :else
     0))
 
+(defn reset-ios-whole-page-offset!
+  []
+  (and (util/ios?)
+       (util/safari?)
+       (js/window.scrollTo 0 0)))
+
 (defonce icon-size (if (mobile-util/is-native-platform?) 23 20))
 
 (rum/defc ls-textarea