Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-10 00:58:26 -05:00
Code Issues 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
Show stats 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))]}
(CreateIcons. id files))
;; --- Icon Updated
;; --- Icon Persisted
(defrecord IconUpdated [id data]
(defrecord IconPersisted [id data]
rs/UpdateEvent
(-apply-update [_ state]
(assoc-in state [:icons id] data)))
(defn icon-updated
(defn icon-persisted
[{:keys [id] :as data}]
{:pre [(map? data)]}
(IconUpdated. id data))
(IconPersisted. id data))
;; --- Update Icon
;; --- Persist Icon
(defrecord UpdateIcon [id]
(defrecord PersistIcon [id]
rs/WatchEvent
(-apply-watch [_ state stream]
(let [icon (get-in state [:icons id])]
(->> (rp/req :update/icon icon)
(rx/map :payload)
(rx/map icon-updated)))))
(rx/map icon-persisted)))))
(defn update-icon
(defn persist-icon
[id]
{:pre [(uuid? id)]}
(UpdateIcon. id))
(PersistIcon. id))
;; --- Icons Fetched
@ -321,6 +321,22 @@
{:pre [(uuid? 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
(defrecord SelectIcon [id]
@ -389,7 +405,7 @@
(let [selected (get-in state [:dashboard :icons :selected])]
(rx/merge
(->> (rx/from-coll selected)
(rx/map update-icon))
(rx/map persist-icon))
(->> (rx/from-coll selected)
(rx/map deselect-icon))))))
@ -413,13 +429,16 @@
;; --- Update Opts (Filtering & Ordering)
(defrecord UpdateOpts [order filter]
(defrecord UpdateOpts [order filter edition]
rs/UpdateEvent
(-apply-update [_ state]
(update-in state [:dashboard :icons] merge
{:edition edition}
(when order {:order order})
(when filter {:filter filter}))))
(defn update-opts
[& {:keys [order filter] :as opts}]
(UpdateOpts. order filter))
[& {:keys [order filter edition]
: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)
(defrecord UpdateOpts [order filter]
(defrecord UpdateOpts [order filter edition]
rs/UpdateEvent
(-apply-update [_ state]
(update-in state [:dashboard :images] merge
{:edition edition}
(when order {:order order})
(when filter {:filter filter}))))
(defn update-opts
[& {:keys [order filter] :as opts}]
(UpdateOpts. order filter))
[& {:keys [order filter edition]
: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
{:mixins [(mx/local) mx/static]}
[own {:keys [type id] :as coll}]
(let [editable? (or (= type :own)
(nil? coll))
[own {:keys [type id] :as coll} selected]
(let [editable? (or (= type :own) (nil? coll))
local (:rum/local own)]
(letfn [(delete []
(rs/emit! (di/delete-selected)))
@ -258,7 +257,10 @@
(swap! local assoc
:show-move-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
[:div.multiselect-bar
(if editable?
@ -277,9 +279,11 @@
:title "Move to library"
:on-select on-move))
i/organize]
[:span.move-item.tooltip.tooltip-top
{:alt "Rename"}
i/pencil]
(when (= 1 (count selected))
[:span.move-item.tooltip.tooltip-top
{:alt "Rename"
:on-click on-rename}
i/pencil])
[:span.delete.tooltip.tooltip-top
{:alt "Delete"
:on-click on-delete}
@ -294,12 +298,25 @@
i/organize]])])))
(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]
(rs/emit! (di/toggle-icon-selection id)))
(toggle-selection-shifted [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
{:on-click toggle-selection-shifted
:id (str "grid-item-" id)}
@ -312,15 +329,20 @@
[:span.grid-item-image
(icon/icon-svg icon)]
[:div.item-info
[:h3 (:name icon)]
(str "Uploaded at " (dt/format created-at "L"))]
#_[:div.project-th-actions
[:div.project-th-icon.edit i/pencil]
[:div.project-th-icon.delete i/trash]]]))
(if edition?
[:input {:type "text"
:auto-focus true
:on-key-down on-key-down
: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
{: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))
ordering (:order state :name)
filtering (:filter state "")
@ -334,8 +356,9 @@
(when editable? (grid-form id))
(for [icon icons
:let [id (:id icon)
edition? (= edition id)
selected? (contains? selected id)]]
(-> (grid-item icon selected?)
(-> (grid-item icon selected? edition?)
(mx/with-key (str id))))]]))
(mx/defc content
@ -345,7 +368,7 @@
(page-title coll)
(grid state)
(when (seq selected)
(grid-options coll))])
(grid-options coll selected))])
;; --- Menu

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

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