3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-08-06 13:28:32 +02:00
Code Issues Projects Releases Packages Wiki Activity

Add rename support for icons and images.

Browse source
This commit is contained in:
Andrey Antukh 2016-11-12 11:38:34 +01:00
parent e80ecd7175
commit dcb35084a1
No known key found for this signature in database
GPG key ID: 4DFEBCB8316A8B95
4 changed files with 103 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

45
src/uxbox/main/data/icons.cljs
View file

@ -245,32 +245,32 @@
{:pre [(or (uuid? id) (nil? id))]} {:pre [(or (uuid? id) (nil? id))]}
(CreateIcons. id files)) (CreateIcons. id files))
;; --- Icon Updated ;; --- Icon Persisted
(defrecord IconUpdated [id data] (defrecord IconPersisted [id data]
rs/UpdateEvent rs/UpdateEvent
(-apply-update [_ state] (-apply-update [_ state]
(assoc-in state [:icons id] data))) (assoc-in state [:icons id] data)))
(defn icon-updated (defn icon-persisted
[{:keys [id] :as data}] [{:keys [id] :as data}]
{:pre [(map? data)]} {:pre [(map? data)]}
(IconUpdated. id data)) (IconPersisted. id data))
;; --- Update Icon ;; --- Persist Icon
(defrecord UpdateIcon [id] (defrecord PersistIcon [id]
rs/WatchEvent rs/WatchEvent
(-apply-watch [_ state stream] (-apply-watch [_ state stream]
(let [icon (get-in state [:icons id])] (let [icon (get-in state [:icons id])]
(->> (rp/req :update/icon icon) (->> (rp/req :update/icon icon)
(rx/map :payload) (rx/map :payload)
(rx/map icon-updated))))) (rx/map icon-persisted)))))
(defn update-icon (defn persist-icon
[id] [id]
{:pre [(uuid? id)]} {:pre [(uuid? id)]}
(UpdateIcon. id)) (PersistIcon. id))
;; --- Icons Fetched ;; --- Icons Fetched
@ -321,6 +321,22 @@
{:pre [(uuid? id)]} {:pre [(uuid? id)]}
(DeleteIcon. id)) (DeleteIcon. id))
;; --- Rename Icon
(defrecord RenameIcon [id name]
rs/UpdateEvent
(-apply-update [_ state]
(assoc-in state [:icons id :name] name))
rs/WatchEvent
(-apply-watch [_ state stream]
(rx/of (persist-icon id))))
(defn rename-icon
[id name]
{:pre [(uuid? id) (string? name)]}
(RenameIcon. id name))
;; --- Select icon ;; --- Select icon
(defrecord SelectIcon [id] (defrecord SelectIcon [id]
@ -389,7 +405,7 @@
(let [selected (get-in state [:dashboard :icons :selected])] (let [selected (get-in state [:dashboard :icons :selected])]
(rx/merge (rx/merge
(->> (rx/from-coll selected) (->> (rx/from-coll selected)
(rx/map update-icon)) (rx/map persist-icon))
(->> (rx/from-coll selected) (->> (rx/from-coll selected)
(rx/map deselect-icon)))))) (rx/map deselect-icon))))))
@ -413,13 +429,16 @@
;; --- Update Opts (Filtering & Ordering) ;; --- Update Opts (Filtering & Ordering)
(defrecord UpdateOpts [order filter] (defrecord UpdateOpts [order filter edition]
rs/UpdateEvent rs/UpdateEvent
(-apply-update [_ state] (-apply-update [_ state]
(update-in state [:dashboard :icons] merge (update-in state [:dashboard :icons] merge
{:edition edition}
(when order {:order order}) (when order {:order order})
(when filter {:filter filter})))) (when filter {:filter filter}))))
(defn update-opts (defn update-opts
[& {:keys [order filter] :as opts}] [& {:keys [order filter edition]
(UpdateOpts. order filter)) :or {edition false}
:as opts}]
(UpdateOpts. order filter edition))

9
src/uxbox/main/data/images.cljs
View file

@ -446,13 +446,16 @@
;; --- Update Opts (Filtering & Ordering) ;; --- Update Opts (Filtering & Ordering)
(defrecord UpdateOpts [order filter] (defrecord UpdateOpts [order filter edition]
rs/UpdateEvent rs/UpdateEvent
(-apply-update [_ state] (-apply-update [_ state]
(update-in state [:dashboard :images] merge (update-in state [:dashboard :images] merge
{:edition edition}
(when order {:order order}) (when order {:order order})
(when filter {:filter filter})))) (when filter {:filter filter}))))
(defn update-opts (defn update-opts
[& {:keys [order filter] :as opts}] [& {:keys [order filter edition]
(UpdateOpts. order filter)) :or {edition false}
:as opts}]
(UpdateOpts. order filter edition))

57
src/uxbox/main/ui/dashboard/icons.cljs
View file

@ -236,9 +236,8 @@
(mx/defcs grid-options (mx/defcs grid-options
{:mixins [(mx/local) mx/static]} {:mixins [(mx/local) mx/static]}
[own {:keys [type id] :as coll}] [own {:keys [type id] :as coll} selected]
(let [editable? (or (= type :own) (let [editable? (or (= type :own) (nil? coll))
(nil? coll))
local (:rum/local own)] local (:rum/local own)]
(letfn [(delete [] (letfn [(delete []
(rs/emit! (di/delete-selected))) (rs/emit! (di/delete-selected)))
@ -258,7 +257,10 @@
(swap! local assoc (swap! local assoc
:show-move-tooltip false :show-move-tooltip false
:show-copy-tooltip false) :show-copy-tooltip false)
(rs/emit! (di/move-selected selected)))] (rs/emit! (di/move-selected selected)))
(on-rename [event]
(let [selected (first selected)]
(rs/emit! (di/update-opts :edition selected))))]
;; MULTISELECT OPTIONS BAR ;; MULTISELECT OPTIONS BAR
[:div.multiselect-bar [:div.multiselect-bar
(if editable? (if editable?
@ -277,9 +279,11 @@
:title "Move to library" :title "Move to library"
:on-select on-move)) :on-select on-move))
i/organize] i/organize]
[:span.move-item.tooltip.tooltip-top (when (= 1 (count selected))
{:alt "Rename"} [:span.move-item.tooltip.tooltip-top
i/pencil] {:alt "Rename"
:on-click on-rename}
i/pencil])
[:span.delete.tooltip.tooltip-top [:span.delete.tooltip.tooltip-top
{:alt "Delete" {:alt "Delete"
:on-click on-delete} :on-click on-delete}
@ -294,12 +298,25 @@
i/organize]])]))) i/organize]])])))
(mx/defc grid-item (mx/defc grid-item
[{:keys [id created-at] :as icon} selected?] {:mixins [mx/static]}
[{:keys [id created-at] :as icon} selected? edition?]
(letfn [(toggle-selection [event] (letfn [(toggle-selection [event]
(rs/emit! (di/toggle-icon-selection id))) (rs/emit! (di/toggle-icon-selection id)))
(toggle-selection-shifted [event] (toggle-selection-shifted [event]
(when (kbd/shift? event) (when (kbd/shift? event)
(toggle-selection event)))] (toggle-selection event)))
(on-key-down [event]
(when (kbd/enter? event)
(on-blur event)))
(on-blur [event]
(let [target (dom/event->target event)
name (dom/get-value target)]
(rs/emit! (di/update-opts :edition false)
(di/rename-icon id name))))
(on-edit [event]
(dom/stop-propagation event)
(dom/prevent-default event)
(rs/emit! (di/update-opts :edition id)))]
[:div.grid-item.small-item.project-th [:div.grid-item.small-item.project-th
{:on-click toggle-selection-shifted {:on-click toggle-selection-shifted
:id (str "grid-item-" id)} :id (str "grid-item-" id)}
@ -312,15 +329,20 @@
[:span.grid-item-image [:span.grid-item-image
(icon/icon-svg icon)] (icon/icon-svg icon)]
[:div.item-info [:div.item-info
[:h3 (:name icon)] (if edition?
(str "Uploaded at " (dt/format created-at "L"))] [:input {:type "text"
#_[:div.project-th-actions :auto-focus true
[:div.project-th-icon.edit i/pencil] :on-key-down on-key-down
[:div.project-th-icon.delete i/trash]]])) :on-blur on-blur
:on-click on-edit
:default-value (:name icon)}]
[:h3 {:on-double-click on-edit}
(:name icon)])
(str "Uploaded at " (dt/format created-at "L"))]]))
(mx/defc grid (mx/defc grid
{:mixins [mx/static mx/reactive]} {:mixins [mx/static mx/reactive]}
[{:keys [selected id type] :as state}] [{:keys [selected edition id type] :as state}]
(let [editable? (or (= type :own) (nil? id)) (let [editable? (or (= type :own) (nil? id))
ordering (:order state :name) ordering (:order state :name)
filtering (:filter state "") filtering (:filter state "")
@ -334,8 +356,9 @@
(when editable? (grid-form id)) (when editable? (grid-form id))
(for [icon icons (for [icon icons
:let [id (:id icon) :let [id (:id icon)
edition? (= edition id)
selected? (contains? selected id)]] selected? (contains? selected id)]]
(-> (grid-item icon selected?) (-> (grid-item icon selected? edition?)
(mx/with-key (str id))))]])) (mx/with-key (str id))))]]))
(mx/defc content (mx/defc content
@ -345,7 +368,7 @@
(page-title coll) (page-title coll)
(grid state) (grid state)
(when (seq selected) (when (seq selected)
(grid-options coll))]) (grid-options coll selected))])
;; --- Menu ;; --- Menu

47
src/uxbox/main/ui/dashboard/images.cljs
View file

@ -240,7 +240,7 @@
(mx/defcs grid-options (mx/defcs grid-options
{:mixins [(mx/local) mx/static]} {:mixins [(mx/local) mx/static]}
[own {:keys [type id] :as coll}] [own {:keys [type id] :as coll} selected]
(let [editable? (or (= type :own) (nil? coll)) (let [editable? (or (= type :own) (nil? coll))
local (:rum/local own)] local (:rum/local own)]
(letfn [(delete [] (letfn [(delete []
@ -260,7 +260,10 @@
(swap! local assoc (swap! local assoc
:show-move-tooltip false :show-move-tooltip false
:show-copy-tooltip false) :show-copy-tooltip false)
(rs/emit! (di/move-selected selected)))] (rs/emit! (di/move-selected selected)))
(on-rename [event]
(let [selected (first selected)]
(rs/emit! (di/update-opts :edition selected))))]
;; MULTISELECT OPTIONS BAR ;; MULTISELECT OPTIONS BAR
[:div.multiselect-bar [:div.multiselect-bar
(if editable? (if editable?
@ -279,9 +282,11 @@
:title "Move to library" :title "Move to library"
:on-select on-move)) :on-select on-move))
i/organize] i/organize]
[:span.move-item.tooltip.tooltip-top (when (= 1 (count selected))
{:alt "Rename"} [:span.move-item.tooltip.tooltip-top
i/pencil] {:alt "Rename"
:on-click on-rename}
i/pencil])
[:span.delete.tooltip.tooltip-top [:span.delete.tooltip.tooltip-top
{:alt "Delete" {:alt "Delete"
:on-click on-delete} :on-click on-delete}
@ -295,10 +300,9 @@
:on-select on-copy)) :on-select on-copy))
i/organize]])]))) i/organize]])])))
(mx/defcs grid-item (mx/defc grid-item
{:mixins [mx/static (mx/local)]} {:mixins [mx/static]}
[{:keys [rum/local] :as own} [{:keys [id created-at] :as image} selected? edition?]
{:keys [id created-at] :as image} selected?]
(letfn [(toggle-selection [event] (letfn [(toggle-selection [event]
(rs/emit! (di/toggle-image-selection id))) (rs/emit! (di/toggle-image-selection id)))
(toggle-selection-shifted [event] (toggle-selection-shifted [event]
@ -309,18 +313,15 @@
(on-blur event))) (on-blur event)))
(on-blur [event] (on-blur [event]
(let [target (dom/event->target event) (let [target (dom/event->target event)
name (dom/get-value target) name (dom/get-value target)]
id (:id image)] (rs/emit! (di/update-opts :edition false)
(swap! local assoc :edition false) (di/rename-image id name))))
(rs/emit! (di/rename-image id name))))
(on-edit [event] (on-edit [event]
(dom/stop-propagation event) (dom/stop-propagation event)
(dom/prevent-default event) (dom/prevent-default event)
(swap! local assoc :edition true))] (rs/emit! (di/update-opts :edition id)))]
[:div.grid-item.images-th [:div.grid-item.images-th
{:on-click toggle-selection-shifted {:on-click toggle-selection-shifted}
:on-double-click on-edit}
[:div.grid-item-th [:div.grid-item-th
{:style {:background-image (str "url('" (:thumbnail image) "')")}} {:style {:background-image (str "url('" (:thumbnail image) "')")}}
[:div.input-checkbox.check-primary [:div.input-checkbox.check-primary
@ -330,20 +331,21 @@
:checked selected?}] :checked selected?}]
[:label {:for (:id image)}]]] [:label {:for (:id image)}]]]
[:div.item-info [:div.item-info
(if (:edition @local) (if edition?
[:input {:type "text" [:input {:type "text"
:auto-focus true :auto-focus true
:on-key-down on-key-down :on-key-down on-key-down
:on-blur on-blur :on-blur on-blur
:on-click on-edit :on-click on-edit
:default-value (:name image)}] :default-value (:name image)}]
[:h3 (:name image)]) [:h3 {:on-double-click on-edit}
(:name image)])
[:span.date [:span.date
(str "Uploaded at " (dt/format created-at "L"))]]])) (str "Uploaded at " (dt/format created-at "L"))]]]))
(mx/defc grid (mx/defc grid
{:mixins [mx/static mx/reactive]} {:mixins [mx/static mx/reactive]}
[{:keys [id type selected] :as state}] [{:keys [id type selected edition] :as state}]
(let [editable? (or (= type :own) (nil? id)) (let [editable? (or (= type :own) (nil? id))
ordering (:order state :name) ordering (:order state :name)
filtering (:filter state "") filtering (:filter state "")
@ -357,8 +359,9 @@
(when editable? (grid-form id)) (when editable? (grid-form id))
(for [image images (for [image images
:let [id (:id image) :let [id (:id image)
edition? (= edition id)
selected? (contains? selected id)]] selected? (contains? selected id)]]
(-> (grid-item image selected?) (-> (grid-item image selected? edition?)
(mx/with-key (str id))))]])) (mx/with-key (str id))))]]))
(mx/defc content (mx/defc content
@ -368,7 +371,7 @@
(page-title coll) (page-title coll)
(grid state) (grid state)
(when (seq selected) (when (seq selected)
(grid-options coll))]) (grid-options coll selected))])
;; --- Menu ;; --- Menu