Browse Source

enhance: scroll earlier

Tienson Qin 3 years ago
parent
commit
b59284c406

+ 2 - 2
src/main/frontend/components/block.cljs

@@ -2933,10 +2933,10 @@
                          (reset! ignore-scroll? false))]
     [:div#lazy-blocks
      (ui/infinite-list
-      "main-container"
+      "main-content-container"
       (block-list config segment)
       {:on-load bottom-reached
-       :threhold 400})]))
+       :threhold 1000})]))
 
 (rum/defcs blocks-container <
   {:init (fn [state]

+ 1 - 1
src/main/frontend/components/editor.cljs

@@ -472,7 +472,7 @@
         _ (rum/use-effect! (fn []
                              (when-let [^js/HTMLElement cnt
                                         (and right-sidebar? editing-key
-                                             (js/document.querySelector "#main-container"))]
+                                             (js/document.querySelector "#main-content-container"))]
                                (when (.contains cnt (js/document.querySelector (str "#" editing-key)))
                                  (let [el  (rum/deref *el)
                                        ofx (- (.-scrollWidth cnt) (.-clientWidth cnt))]

+ 1 - 1
src/main/frontend/components/journal.cljs

@@ -92,7 +92,7 @@
 (rum/defc journals < rum/reactive
   [latest-journals]
   [:div#journals
-   (ui/infinite-list "main-container"
+   (ui/infinite-list "main-content-container"
                      (for [[journal-name format] latest-journals]
                        [:div.journal-item.content {:key journal-name}
                         (journal-cp [journal-name format])])

+ 11 - 12
src/main/frontend/components/sidebar.cljs

@@ -305,14 +305,14 @@
 
   (let [left-sidebar-open? (state/sub :ui/left-sidebar-open?)]
     (rum/with-context [[t] i18n/*tongue-context*]
-      [:div#main-content.cp__sidebar-main-layout.flex-1.flex
+      [:div#main-container.cp__sidebar-main-layout.flex-1.flex
        {:class (util/classnames [{:is-left-sidebar-open left-sidebar-open?}])}
 
        ;; desktop left sidebar layout
        (left-sidebar {:left-sidebar-open? left-sidebar-open?
                       :route-match route-match})
 
-       [:div#main-content-container.w-full.flex.justify-center
+       [:div#main-content-container.scrollbar-spacing.w-full.flex.justify-center
         [:div.cp__sidebar-main-content
          {:data-is-global-graph-pages global-graph-pages?
           :data-is-full-width         (or global-graph-pages?
@@ -535,16 +535,15 @@
                           :default-home   default-home
                           :new-block-mode new-block-mode})
 
-          [:div#main-container.scrollbar-spacing
-           (main {:route-match         route-match
-                  :global-graph-pages? global-graph-pages?
-                  :logged?             logged?
-                  :home?               home?
-                  :route-name          route-name
-                  :indexeddb-support?  indexeddb-support?
-                  :white?              white?
-                  :db-restoring?       db-restoring?
-                  :main-content        main-content})]
+          (main {:route-match         route-match
+                 :global-graph-pages? global-graph-pages?
+                 :logged?             logged?
+                 :home?               home?
+                 :route-name          route-name
+                 :indexeddb-support?  indexeddb-support?
+                 :white?              white?
+                 :db-restoring?       db-restoring?
+                 :main-content        main-content})
 
           (footer)]
          (right-sidebar/sidebar)

+ 5 - 4
src/main/frontend/components/sidebar.css

@@ -31,10 +31,7 @@
 
 #main-container {
   position: relative;
-  height: 100%;
-}
-
-#main-content {
+  height: calc(100vh - var(--ls-headbar-height));
   transition: padding-left .3s;
 
   &.is-left-sidebar-open {
@@ -465,3 +462,7 @@ html[data-theme='dark'] {
 .favorites li.dragging-target {
   border-left: 5px solid green;
 }
+
+#main-content-container {
+    height: calc(100vh - var(--ls-headbar-height));
+}

+ 2 - 2
src/main/frontend/ui.cljs

@@ -261,7 +261,7 @@
 
 (defn main-node
   []
-  (gdom/getElement "main-container"))
+  (gdom/getElement "main-content-container"))
 
 (defn get-scroll-top []
   (.-scrollTop (main-node)))
@@ -375,7 +375,7 @@
 
 (defn on-scroll
   [node {:keys [on-load on-top-reached threhold]
-         :or {threhold 100}}]
+         :or {threhold 500}}]
   (let [full-height (gobj/get node "scrollHeight")
         scroll-top (gobj/get node "scrollTop")
         client-height (gobj/get node "clientHeight")

+ 1 - 1
src/main/frontend/util.cljc

@@ -35,7 +35,7 @@
 
 #?(:cljs (defonce ^js node-path utils/nodePath))
 #?(:cljs (defn app-scroll-container-node []
-           (gdom/getElement "main-container")))
+           (gdom/getElement "main-content-container")))
 
 #?(:cljs
    (defn ios?