diff --git a/frontend/src/uxbox/main/ui/shapes.cljs b/frontend/src/uxbox/main/ui/shapes.cljs index e7ab7e87a..579569f47 100644 --- a/frontend/src/uxbox/main/ui/shapes.cljs +++ b/frontend/src/uxbox/main/ui/shapes.cljs @@ -37,33 +37,21 @@ (render-shape shape)) (mf/defc shape-component - {:wrap [mf/wrap-memo]} - [{:keys [id] :as props}] - (uxbox.util.perf/with-measure ::foobar - (let [shape-iref (mf/use-memo {:deps #js [id] - :fn #(-> (l/in [:shapes id]) - (l/derive st/state))})] - (when-let [shape (mf/deref shape-iref)] - (when-not (:hidden shape) - (mf/html - [:& render-shape' {:shape shape}])))))) - -(mf/defc shape-component' {:wrap [mf/wrap-memo]} [{:keys [shape] :as props}] (when (and shape (not (:hidden shape))) [:& render-shape' {:shape shape}])) -(def ^:private shapes-iref - (-> (l/key :shapes) - (l/derive st/state))) - -(mf/defc all-shapes +(mf/defc canvas-and-shapes {:wrap [mf/wrap-memo]} [{:keys [page] :as props}] - (let [shapes-by-id (mf/deref shapes-iref) - shapes (map #(get shapes-by-id %) (:shapes page))] + (let [shapes-by-id (mf/deref refs/shapes-by-id) + shapes (map #(get shapes-by-id %) (:shapes page [])) + canvas (map #(get shapes-by-id %) (:canvas page []))] [:* + (for [item canvas] + [:& shape-component {:shape item :key (:id item)}]) (for [item shapes] - [:& shape-component' {:shape item :key (:id item)}])])) + [:& shape-component {:shape item :key (:id item)}])])) + diff --git a/frontend/src/uxbox/main/ui/workspace.cljs b/frontend/src/uxbox/main/ui/workspace.cljs index 99a22402c..b8a13211a 100644 --- a/frontend/src/uxbox/main/ui/workspace.cljs +++ b/frontend/src/uxbox/main/ui/workspace.cljs @@ -29,7 +29,7 @@ [uxbox.main.ui.workspace.scroll :as scroll] [uxbox.main.ui.workspace.shortcuts :as shortcuts] [uxbox.main.ui.workspace.sidebar :refer [left-sidebar right-sidebar]] - [uxbox.main.ui.workspace.sidebar.history :refer [history-dialog]] + ;; [uxbox.main.ui.workspace.sidebar.history :refer [history-dialog]] [uxbox.main.ui.workspace.streams :as uws] [uxbox.util.data :refer [classnames]] [uxbox.util.dom :as dom] @@ -99,7 +99,7 @@ :on-scroll on-scroll :on-wheel #(on-wheel % canvas)} - (history-dialog) + ;; (history-dialog) ;; Rules (when (contains? flags :rules) @@ -128,8 +128,6 @@ {:deps #js [project-id page-id] :fn #(st/emit! (dw/initialize project-id page-id))}) - ;; (prn "workspace-page.render" (:id page) props) - [:> rdnd/provider {:backend rdnd/html5} (when page [:& workspace {:page page}])])) diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar.cljs index 684e1be9b..eb0e75f5d 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar.cljs @@ -9,7 +9,7 @@ (:require [rumext.alpha :as mf] [uxbox.main.ui.workspace.sidebar.drawtools :refer [draw-toolbox]] - [uxbox.main.ui.workspace.sidebar.history :refer [history-toolbox]] + ;; [uxbox.main.ui.workspace.sidebar.history :refer [history-toolbox]] [uxbox.main.ui.workspace.sidebar.icons :refer [icons-toolbox]] [uxbox.main.ui.workspace.sidebar.layers :refer [layers-toolbox]] [uxbox.main.ui.workspace.sidebar.options :refer [options-toolbox]] diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs index b87c37e40..9e9b92e3b 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs @@ -21,115 +21,115 @@ ;; --- History Item (Component) -(mf/def history-item - :mixins [mf/memo] - :key-fn :id - :render - (fn [own {:keys [::selected] :as item}] - (letfn [(on-select [event] - (dom/prevent-default event) - (st/emit! (udh/select-page-history (:version item)))) - (on-pinned [event] - (dom/prevent-default event) - (dom/stop-propagation event) - (let [item (assoc item - :label "no label" - :pinned (not (:pinned item)))] - (st/emit! (udh/update-history-item item))))] - [:li {:class (when (= selected (:version item)) "current") - :on-click on-select} - [:div.pin-icon {:on-click on-pinned - :class (when (:pinned item) "selected")} - i/pin] - [:span (str "Version " (:version item) - " (" (dt/timeago (:created-at item)) ")")]]))) +;; (mf/def history-item +;; :mixins [mf/memo] +;; :key-fn :id +;; :render +;; (fn [own {:keys [::selected] :as item}] +;; (letfn [(on-select [event] +;; (dom/prevent-default event) +;; (st/emit! (udh/select-page-history (:version item)))) +;; (on-pinned [event] +;; (dom/prevent-default event) +;; (dom/stop-propagation event) +;; (let [item (assoc item +;; :label "no label" +;; :pinned (not (:pinned item)))] +;; (st/emit! (udh/update-history-item item))))] +;; [:li {:class (when (= selected (:version item)) "current") +;; :on-click on-select} +;; [:div.pin-icon {:on-click on-pinned +;; :class (when (:pinned item) "selected")} +;; i/pin] +;; [:span (str "Version " (:version item) +;; " (" (dt/timeago (:created-at item)) ")")]]))) -;; --- History List (Component) +;; ;; --- History List (Component) -(mf/def history-list - :mixins [mf/memo mf/reactive] - :render - (fn [own {:keys [selected items min-version] :as history}] - (let [items (reverse (sort-by :version items)) - page (mf/react refs/selected-page) - show-more? (pos? min-version) - load-more #(st/emit! (udh/load-more))] - [:ul.history-content - (for [item items] - (history-item (assoc item ::selectd selected))) - (when show-more? - [:li {:on-click load-more} - [:a.btn-primary.btn-small - "view more"]])]))) +;; (mf/def history-list +;; :mixins [mf/memo mf/reactive] +;; :render +;; (fn [own {:keys [selected items min-version] :as history}] +;; (let [items (reverse (sort-by :version items)) +;; page (mf/react refs/selected-page) +;; show-more? (pos? min-version) +;; load-more #(st/emit! (udh/load-more))] +;; [:ul.history-content +;; (for [item items] +;; (history-item (assoc item ::selectd selected))) +;; (when show-more? +;; [:li {:on-click load-more} +;; [:a.btn-primary.btn-small +;; "view more"]])]))) -;; --- History Pinned List (Component) +;; ;; --- History Pinned List (Component) -(mf/def history-pinned-list - :mixins [mf/memo] - :render - (fn [own {:keys [pinned selected] :as history}] - [:ul.history-content - (for [item (reverse (sort-by :version pinned))] - (let [selected (= (:version item) selected)] - (history-item (assoc item ::selected selected))))])) +;; (mf/def history-pinned-list +;; :mixins [mf/memo] +;; :render +;; (fn [own {:keys [pinned selected] :as history}] +;; [:ul.history-content +;; (for [item (reverse (sort-by :version pinned))] +;; (let [selected (= (:version item) selected)] +;; (history-item (assoc item ::selected selected))))])) -;; --- History Toolbox (Component) +;; ;; --- History Toolbox (Component) -(mf/def history-toolbox - :mixins [mf/memo mf/reactive] +;; (mf/def history-toolbox +;; :mixins [mf/memo mf/reactive] - :init - (fn [own page-id] - (st/emit! (udh/initialize page-id)) - own) +;; :init +;; (fn [own page-id] +;; (st/emit! (udh/initialize page-id)) +;; own) - :will-unmount - (fn [own] - (st/emit! ::udh/stop-changes-watcher) - own) +;; :will-unmount +;; (fn [own] +;; (st/emit! ::udh/stop-changes-watcher) +;; own) - :render - (fn [own page-id] - (let [history (mf/react refs/history) - section (:section history :main) +;; :render +;; (fn [own page-id] +;; (let [history (mf/react refs/history) +;; section (:section history :main) - close #(st/emit! (dw/toggle-flag :document-history)) - main? (= section :main) - pinned? (= section :pinned) +;; close #(st/emit! (dw/toggle-flag :document-history)) +;; main? (= section :main) +;; pinned? (= section :pinned) - show-main #(st/emit! (udh/select-section :main)) - show-pinned #(st/emit! (udh/select-section :pinned))] - [:div.document-history.tool-window {} - [:div.tool-window-bar {} - [:div.tool-window-icon {} i/undo-history] - [:span {} (tr "ds.settings.document-history")] - [:div.tool-window-close {:on-click close} i/close]] - [:div.tool-window-content {} - [:ul.history-tabs {} - [:li {:on-click show-main - :class (when main? "selected")} - (tr "ds.history.versions")] - [:li {:on-click show-pinned - :class (when pinned? "selected")} - (tr "ds.history.pinned")]] - (if (= section :pinned) - (history-pinned-list history) - (history-list history))]]))) +;; show-main #(st/emit! (udh/select-section :main)) +;; show-pinned #(st/emit! (udh/select-section :pinned))] +;; [:div.document-history.tool-window {} +;; [:div.tool-window-bar {} +;; [:div.tool-window-icon {} i/undo-history] +;; [:span {} (tr "ds.settings.document-history")] +;; [:div.tool-window-close {:on-click close} i/close]] +;; [:div.tool-window-content {} +;; [:ul.history-tabs {} +;; [:li {:on-click show-main +;; :class (when main? "selected")} +;; (tr "ds.history.versions")] +;; [:li {:on-click show-pinned +;; :class (when pinned? "selected")} +;; (tr "ds.history.pinned")]] +;; (if (= section :pinned) +;; (history-pinned-list history) +;; (history-list history))]]))) -;; --- History Dialog +;; ;; --- History Dialog -(mf/def history-dialog - :mixins [mf/memo mf/reactive] - :render - (fn [own] - (let [history (mf/react refs/history) - version (:selected history) - on-accept #(st/emit! (udh/apply-selected-history)) - on-cancel #(st/emit! (udh/deselect-page-history))] - (when (or version (:deselecting history)) - [:div.message-version - {:class (when (:deselecting history) "hide-message")} - [:span {} (tr "history.alert-message" (or version "00")) - [:div.message-action {} - [:a.btn-transparent {:on-click on-accept} (tr "ds.accept")] - [:a.btn-transparent {:on-click on-cancel} (tr "ds.cancel")]]]])))) +;; (mf/def history-dialog +;; :mixins [mf/memo mf/reactive] +;; :render +;; (fn [own] +;; (let [history (mf/react refs/history) +;; version (:selected history) +;; on-accept #(st/emit! (udh/apply-selected-history)) +;; on-cancel #(st/emit! (udh/deselect-page-history))] +;; (when (or version (:deselecting history)) +;; [:div.message-version +;; {:class (when (:deselecting history) "hide-message")} +;; [:span {} (tr "history.alert-message" (or version "00")) +;; [:div.message-action {} +;; [:a.btn-transparent {:on-click on-accept} (tr "ds.accept")] +;; [:a.btn-transparent {:on-click on-cancel} (tr "ds.cancel")]]]])))) diff --git a/frontend/src/uxbox/main/ui/workspace/viewport.cljs b/frontend/src/uxbox/main/ui/workspace/viewport.cljs index fd58f6c2d..c9110b535 100644 --- a/frontend/src/uxbox/main/ui/workspace/viewport.cljs +++ b/frontend/src/uxbox/main/ui/workspace/viewport.cljs @@ -246,12 +246,7 @@ [:g.zoom {:transform (str "scale(" zoom ", " zoom ")")} (when page [:* - (for [id (reverse (:canvas page))] - [:& uus/shape-component {:id id :key id}]) - - #_(for [id (reverse (:shapes page))] - [:& uus/shape-component {:id id :key id}]) - [:& uus/all-shapes {:page page}] + [:& uus/canvas-and-shapes {:page page}] (when (seq (:selected wst)) [:& selection-handlers {:wst wst}])