feat(mobile): add collapse/uncollaspe all blocks functionality

pull/3963/head
llcc 2022-03-03 18:01:15 +08:00 committed by Tienson Qin
parent 2604a2726f
commit f9b9e674e7
2 changed files with 57 additions and 2 deletions

View File

@ -33,7 +33,8 @@
[goog.object :as gobj]
[reitit.frontend.easy :as rfe]
[medley.core :as medley]
[rum.core :as rum]))
[rum.core :as rum]
[frontend.mobile.util :as mobile-util]))
(defn- get-page-name
[state]
@ -260,8 +261,39 @@
(when (not= icon "") [:span.page-icon icon])
title]]))))
(defn- page-mouse-over
[e *control-show? *all-collapsed?]
(util/stop e)
(reset! *control-show? true)
(let [all-collapsed?
(->> (editor-handler/all-blocks-with-level {:collapse? true})
(filter (fn [b] (editor-handler/collapsable? (:block/uuid b))))
(empty?))]
(reset! *all-collapsed? all-collapsed?)))
(defn- page-mouse-leave
[e *control-show?]
(util/stop e)
(reset! *control-show? false))
(rum/defcs page-blocks-collapse-control <
[state title *control-show? *all-collapsed?]
[:a.page-blocks-collapse-control
{:id (str "control-" title)
:on-click (fn [event]
(util/stop event)
(if @*all-collapsed?
(editor-handler/expand-all!)
(editor-handler/collapse-all!))
(swap! *all-collapsed? not))}
[:span.mt-6 {:class (if @*control-show?
"control-show cursor-pointer" "control-hide")}
(ui/rotating-arrow @*all-collapsed?)]])
;; A page is just a logical block
(rum/defcs page < rum/reactive
(rum/local false ::all-collapsed?)
(rum/local false ::control-show?)
[state {:keys [repo page-name] :as option}]
(when-let [path-page-name (or page-name
(get-page-name state)
@ -294,7 +326,9 @@
icon (or icon "")
today? (and
journal?
(= page-name (util/page-name-sanity-lc (date/journal-name))))]
(= page-name (util/page-name-sanity-lc (date/journal-name))))
*control-show? (::control-show? state)
*all-collapsed? (::all-collapsed? state)]
[:div.flex-1.page.relative
(merge (if (seq (:block/tags page))
(let [page-names (model/get-page-names-by-ids (map :db/id (:block/tags page)))]
@ -308,6 +342,14 @@
(when (and (not sidebar?)
(not block?))
[:div.flex.flex-row.space-between
(when (mobile-util/is-native-platform?)
[:div.flex.flex-row.pr-2
{:style {:margin-left -15}
:on-mouse-over (fn [e]
(page-mouse-over e *control-show? *all-collapsed?))
:on-mouse-leave (fn [e]
(page-mouse-leave e *control-show?))}
(page-blocks-collapse-control title *control-show? *all-collapsed?)])
[:div.flex-1.flex-row
(page-title page-name icon title format fmt-journal?)]
(when (not config/publishing?)

View File

@ -327,3 +327,16 @@ html.is-native-ios {
}
}
}
.page-blocks-collapse-control, .page-blocks-collapse-control:hover {
text-decoration: none;
cursor: default;
min-width: 22px;
padding-top: 22px;
color: initial;
user-select: none;
.control-hide {
display: none;
}
}