0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-20 19:51:23 -05:00

More work on color collections page.

This commit is contained in:
Andrey Antukh 2016-11-06 18:04:56 +01:00
parent d6fd75f7b9
commit dbaeb9d5f4
No known key found for this signature in database
GPG key ID: 4DFEBCB8316A8B95
3 changed files with 47 additions and 42 deletions

View file

@ -8,6 +8,7 @@
(ns uxbox.main.data.colors
(:require [clojure.set :as set]
[beicon.core :as rx]
[uxbox.util.datetime :as dt]
[uxbox.util.uuid :as uuid]
[uxbox.util.rstore :as rs]
[uxbox.util.router :as r]
@ -60,10 +61,9 @@
(defrecord CollectionsFetched [data]
rs/UpdateEvent
(-apply-update [_ state]
(let [value (:value data)]
(-> state
(assoc-in [:kvstore :color-collections] data)
(update :color-colls-by-id merge value)))))
(-> state
(assoc-in [:kvstore :color-collections] data)
(update :color-colls-by-id merge (:value data)))))
(defn collections-fetched
[data]
@ -94,25 +94,25 @@
;; --- Create Collection
(defrecord CreateCollection []
(defrecord CreateCollection [id]
rs/UpdateEvent
(-apply-update [_ state]
(let [id (uuid/random)
item {:name "Unnamed collection"
(let [item {:name "Unnamed collection"
:id id
:created-at (dt/now)
:type :own
:id id}]
(-> state
(assoc-in [:color-colls-by-id id] item)
(assoc-in [:dashboard :colors :id] id)
(assoc-in [:dashboard :colors :type] :own))))
:colors #{}}]
(assoc-in state [:color-colls-by-id id] item)))
rs/WatchEvent
(-apply-watch [_ state stream]
(rx/of (persist-collections))))
(rx/of (persist-collections)
(select-collection :own id))))
(defn create-collection
[]
(CreateCollection.))
(let [id (uuid/random)]
(CreateCollection. id)))
;; --- Persist Collections
@ -120,12 +120,12 @@
rs/WatchEvent
(-apply-watch [_ state stream]
(let [builtin? #(= :builtin (:type %))
xf (remove (comp builtin? second))
colls (get state :color-colls-by-id)
data (-> (get-in state [:kvstore :color-collections])
(assoc :value (into {} xf colls)))]
(->> (rp/req :update/kvstore data)
xform (remove (comp builtin? second))
value (->> (get state :color-colls-by-id)
(into {} xform))
store (get-in state [:kvstore :color-collections])
store (assoc store :value value)]
(->> (rp/req :update/kvstore store)
(rx/map :payload)
(rx/map collections-fetched)))))
@ -157,7 +157,9 @@
rs/WatchEvent
(-apply-watch [_ state s]
(rx/of (persist-collections))))
(let [type (get-in state [:dashboard :colors :type])]
(rx/of (persist-collections)
(select-collection type)))))
(defn delete-collection
[id]
@ -169,7 +171,7 @@
rs/UpdateEvent
(-apply-update [_ state]
(let [replacer #(-> (disj % from) (conj to))]
(update-in state [:color-colls-by-id id :data] (fnil replacer #{}))))
(update-in state [:color-colls-by-id id :colors] (fnil replacer #{}))))
rs/WatchEvent
(-apply-watch [_ state s]
@ -178,7 +180,6 @@
(defn replace-color
"Add or replace color in a collection."
[{:keys [id from to] :as params}]
(println "replace-color" params)
(ReplaceColor. id from to))
;; --- Remove Color
@ -186,7 +187,7 @@
(defrecord RemoveColors [id colors]
rs/UpdateEvent
(-apply-update [_ state]
(update-in state [:color-colls-by-id id :data]
(update-in state [:color-colls-by-id id :colors]
#(set/difference % colors)))
rs/WatchEvent
@ -230,7 +231,7 @@
rs/UpdateEvent
(-apply-update [_ state]
(let [selected (get-in state [:dashboard :colors :selected])]
(update-in state [:color-colls-by-id id :data] set/union selected)))
(update-in state [:color-colls-by-id id :colors] set/union selected)))
rs/WatchEvent
(-apply-watch [_ state stream]
@ -248,8 +249,8 @@
(-apply-update [_ state]
(let [selected (get-in state [:dashboard :colors :selected])]
(-> state
(update-in [:color-colls-by-id from :data] set/difference selected)
(update-in [:color-colls-by-id to :data] set/union selected))))
(update-in [:color-colls-by-id from :colors] set/difference selected)
(update-in [:color-colls-by-id to :colors] set/union selected))))
rs/WatchEvent
(-apply-watch [_ state stream]

View file

@ -3,11 +3,11 @@
;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
;;
;; Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
;; Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
(ns uxbox.main.state
(:require [beicon.core :as rx]
[lentes.core :as l]
[uxbox.main.state.colors :as colors]
[uxbox.util.rstore :as rs]
[uxbox.util.i18n :refer (tr)]
[uxbox.util.storage :refer (storage)]))
@ -38,8 +38,7 @@
:icon-colls-by-id nil
:icons-by-id nil
:shapes-by-id nil
:elements-by-id nil
:colors-by-id nil
:color-colls-by-id colors/collections
:projects-by-id nil
:pages-by-id nil})

View file

@ -43,7 +43,8 @@
[own {:keys [id] :as coll}]
(let [local (:rum/local own)
dashboard (mx/react dashboard-ref)
own? (= :builtin (:type coll))
own? (= :own (:type coll))
editable? (or own? (nil? id))
edit? (:edit @local)]
(letfn [(save []
(let [dom (mx/ref-node own "input")
@ -74,10 +75,13 @@
:on-key-down on-input-keydown}
(:name coll)]
[:span.close {:on-click cancel} i/close]]
[:span.dashboard-title-field
{:on-double-click edit}
(:name coll "Storage")])]
(if (and (not own?) coll)
(if own?
[:span.dashboard-title-field
{:on-double-click edit}
(:name coll)]
[:span.dashboard-title-field
(:name coll "Storage")]))]
(if (and own? coll)
[:div.edition
(if edit?
[:span {:on-click save} i/save]
@ -92,7 +96,7 @@
(letfn [(on-click [event]
(let [type (or type :own)]
(rs/emit! (dc/select-collection type id))))]
(let [colors (count (:data coll))]
(let [colors (count (:colors coll))]
[:li {:on-click on-click
:class-name (when selected? "current")}
[:span.element-title
@ -101,7 +105,7 @@
(tr "ds.num-elements" (t/c colors))]])))
(def ^:private storage-num-colors-ref
(-> (comp (l/in [:color-colls-by-id nil :data])
(-> (comp (l/in [:color-colls-by-id nil :colors])
(l/lens count))
(l/derive st/state)))
@ -123,7 +127,8 @@
colls (cond->> (vals colls)
own? (filter #(= :own (:type %)))
builtin? (filter #(= :builtin (:type %)))
own? (sort-by :id))]
own? (sort-by :created-at)
builtin? (sort-by :created-at))]
[:ul.library-elements
(when own?
[:li
@ -144,11 +149,11 @@
(let [own? (= type :own)
builtin? (= type :builtin)]
(letfn [(select-tab [type]
(if own?
(if (= type :own)
(rs/emit! (dc/select-collection type))
(let [coll (->> (map second colls)
(filter #(= type (:type %)))
(sort-by :name)
(sort-by :created-at)
(first))]
(if coll
(rs/emit! (dc/select-collection type (:id coll)))
@ -278,9 +283,9 @@
(mx/defc grid
{:mixins [mx/static]}
[{:keys [id type data] :as coll} selected]
[{:keys [id type colors] :as coll} selected]
(let [editable? (or (= :own type) (nil? id))
colors (->> (remove nil? data)
colors (->> (remove nil? colors)
(sort-by identity))]
[:div.dashboard-grid-content
[:div.dashboard-grid-row