diff --git a/frontend/uxbox/library/icons.cljs b/frontend/uxbox/library/icons.cljs index 3a8cc17f1..3ae5c566a 100644 --- a/frontend/uxbox/library/icons.cljs +++ b/frontend/uxbox/library/icons.cljs @@ -13,7 +13,19 @@ :data [:path {:d "M38.71 20.07c-1.36-6.88-7.43-12.07-14.71-12.07-5.78 0-10.79 3.28-13.3 8.07-6.01.65-10.7 5.74-10.7 11.93 0 6.63 5.37 12 12 12h26c5.52 0 10-4.48 10-10 0-5.28-4.11-9.56-9.29-9.93z"}]} ]) +(def ^:private +external+ + [{:name "Custon icon" + :view-box [0 0 50 50] + :id :material/foobar + :type :builtin/icon-svg + :image {:xlink-href "http://s.cdpn.io/3/kiwi.svg" + :width 50 + :height 50}}]) + (def +collections+ [{:name "Material design" :id 1 - :icons +material+}]) + :icons +material+} + {:name "External icons" + :id 2 + :icons +external+}]) diff --git a/frontend/uxbox/shapes.cljs b/frontend/uxbox/shapes.cljs index 77046bf83..34f09e12f 100644 --- a/frontend/uxbox/shapes.cljs +++ b/frontend/uxbox/shapes.cljs @@ -24,12 +24,29 @@ (assoc data :view-box (apply str (interpose " " view-box))) data)) +(defn extract-attrs + "Extract predefinet attrs from shapes." + [shape] + (select-keys shape [:width :height :view-box :x :y :cx :cy])) + (defmethod -render :builtin/icon - [{:keys [data width height view-box] :as shape} attrs] + [{:keys [data] :as shape} attrs] (let [attrs (as-> shape $ - (select-keys $ [:width :height :view-box]) + (extract-attrs $) (remove-nil-vals $) (merge $ attrs) (transform-attrs $))] (html [:svg attrs data]))) + +(defmethod -render :builtin/icon-svg + [{:keys [image] :as shape} attrs] + (let [attrs (as-> shape $ + (extract-attrs $) + (remove-nil-vals $) + (merge $ attrs) + (transform-attrs $))] + (html + [:svg attrs + [:image image]]))) + diff --git a/frontend/uxbox/ui/dashboard/icons.cljs b/frontend/uxbox/ui/dashboard/icons.cljs index 18a37eedf..d64ef1a86 100644 --- a/frontend/uxbox/ui/dashboard/icons.cljs +++ b/frontend/uxbox/ui/dashboard/icons.cljs @@ -151,7 +151,7 @@ (for [icon (:icons coll)] [:div.grid-item.small-item.project-th {:key (str (:id icon))} [:span.grid-item-image #_i/toggle (shapes/render icon)] - [:h3 "Custom icon"] + [:h3 (:name icon)] #_[:div.project-th-actions [:div.project-th-icon.edit i/pencil] [:div.project-th-icon.delete i/trash]]])]]))))