Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-23 07:16:07 -05:00
Code Issues Activity

Move all react/rum related stuff under one unique ns.

Browse source
This commit is contained in:
Andrey Antukh 2016-01-12 19:30:04 +02:00
parent 8151faf15e
commit 809ac8cbc7
27 changed files with 137 additions and 156 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/uxbox/ui.cljs
View file

@ -10,7 +10,6 @@
[uxbox.ui.users :as users]
[uxbox.ui.dashboard :as dashboard]
[uxbox.ui.workspace :refer (workspace)]
[uxbox.ui.util :as util]
[uxbox.ui.mixins :as mx]
[uxbox.ui.shapes]))
@ -34,9 +33,9 @@
)))
(def app
(util/component {:render app-render
:mixins [rum/reactive]
:name "app"}))
(mx/component {:render app-render
:mixins [rum/reactive]
:name "app"}))
(defn init
[]
(let [app-dom (gdom/getElement "app")

11
src/uxbox/ui/colorpicker.cljs
View file

@ -3,8 +3,7 @@
[rum.core :as rum]
[cats.labs.lens :as l]
[goog.events :as events]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util])
[uxbox.ui.mixins :as mx])
(:import goog.events.EventType))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
@ -13,7 +12,7 @@
(defn on-click-handler
[e own callback]
(let [canvas (util/get-ref-dom own "colorpicker")
(let [canvas (mx/get-ref-dom own "colorpicker")
context (.getContext canvas "2d")
brect (.getBoundingClientRect canvas)
x (- (.-pageX e) (.-left brect))
@ -22,7 +21,7 @@
r (aget (.-data image) 0)
g (aget (.-data image) 1)
b (aget (.-data image) 2)]
(callback {:hex (util/rgb->hex [r g b])
(callback {:hex (mx/rgb->hex [r g b])
:rgb [r g b]})))
(defn colorpicker-render
@ -38,7 +37,7 @@
(defn colorpicker-did-mount
[own]
(let [canvas (util/get-ref-dom own "colorpicker")
(let [canvas (mx/get-ref-dom own "colorpicker")
context (.getContext canvas "2d")
img (js/Image.)]
(set! (.-src img) "/images/colorspecrum-400x300.png")
@ -51,7 +50,7 @@
(events/unlistenByKey key)))
(def ^:static colorpicker
(util/component
(mx/component
{:render colorpicker-render
:did-mount colorpicker-did-mount
:will-unmout colorpicker-will-unmout

12
src/uxbox/ui/dashboard.cljs
View file

@ -6,15 +6,13 @@
[uxbox.ui.icons :as i]
[uxbox.ui.mixins :as mx]
[uxbox.ui.dom :as dom]
[uxbox.ui.util :as util]
[uxbox.data.dashboard :as dd]
[uxbox.ui.library-bar :as ui.library-bar]
[uxbox.ui.dashboard.header :refer (header)]
[uxbox.ui.dashboard.projects :as projects]
[uxbox.ui.dashboard.elements :as elements]
[uxbox.ui.dashboard.icons :as icons]
[uxbox.ui.dashboard.colors :as colors]
))
[uxbox.ui.dashboard.colors :as colors]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Page: projects
@ -40,7 +38,7 @@
state)
(def ^:static projects-page
(util/component
(mx/component
{:render projects-page-render
:will-mount projects-page-will-mount
:transfer-state projects-page-transfer-state
@ -73,7 +71,7 @@
state)
(def ^:static elements-page
(util/component
(mx/component
{:render elements-page-render
:will-mount elements-page-will-mount
:transfer-state elements-page-transfer-state
@ -104,7 +102,7 @@
state)
(def ^:static icons-page
(util/component
(mx/component
{:render icons-page-render
:will-mount icons-page-will-mount
:transfer-state icons-page-transfer-state
@ -135,7 +133,7 @@
state)
(def ^:static colors-page
(util/component
(mx/component
{:render colors-page-render
:will-mount colors-page-will-mount
:transfer-state colors-page-transfer-state

14
src/uxbox/ui/dashboard/colors.cljs
View file

@ -10,13 +10,13 @@
[uxbox.library :as library]
[uxbox.data.dashboard :as dd]
[uxbox.util.lens :as ul]
[uxbox.util.color :refer (hex->rgb)]
[uxbox.ui.icons :as i]
[uxbox.ui.form :as form]
[uxbox.ui.lightbox :as lightbox]
[uxbox.ui.colorpicker :refer (colorpicker)]
[uxbox.ui.dom :as dom]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Lenses
@ -63,7 +63,7 @@
[:span {:on-click on-delete} i/trash]])]))))
(def ^:static page-title
(util/component
(mx/component
{:render page-title-render
:name "page-title"
:mixins [mx/static rum/reactive]}))
@ -109,7 +109,7 @@
(tr "ds.num-elements" (t/c num))]])]]])))
(def ^:static nav
(util/component
(mx/component
{:render nav-render
:name "nav"
:mixins [rum/reactive]}))
@ -137,7 +137,7 @@
{:on-click #(lightbox/open! :color-form {:coll coll})}
[:span "+ New color"]])
(for [color (remove nil? (:colors coll))
:let [color-rgb (util/hex->rgb color)]]
:let [color-rgb (hex->rgb color)]]
[:div.grid-item.small-item.project-th {:key color}
[:span.color-swatch {:style {:background-color color}}]
[:span.color-data color]
@ -151,7 +151,7 @@
i/trash]])])]]))))
(def grid
(util/component
(mx/component
{:render grid-render
:name "grid"
:mixins [mx/static rum/reactive]}))
@ -197,7 +197,7 @@
i/close]]))))
(def color-lightbox
(util/component
(mx/component
{:render color-lightbox-render
:name "color-lightbox"
:mixins [(rum/local {})

9
src/uxbox/ui/dashboard/elements.cljs
View file

@ -5,8 +5,7 @@
[uxbox.ui.icons :as i]
[uxbox.ui.lightbox :as lightbox]
[uxbox.ui.dom :as dom]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Page Title
@ -22,7 +21,7 @@
[:span i/trash]]]))
(def ^:static page-title
(util/component
(mx/component
{:render page-title-render
:name "page-title"
:mixins [mx/static]}))
@ -118,7 +117,7 @@
[:div.project-th-icon.delete i/trash]]]]))
(def ^:static grid
(util/component
(mx/component
{:render grid-render
:name "grid"
:mixins [mx/static]}))
@ -145,7 +144,7 @@
i/close]]))
(def new-element-lightbox
(util/component
(mx/component
{:render new-element-lightbox-render
:name "new-element-lightbox"}))

4
src/uxbox/ui/dashboard/header.cljs
View file

@ -10,7 +10,7 @@
[uxbox.ui.navigation :as nav]
[uxbox.ui.icons :as i]
[uxbox.ui.users :as ui.u]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
(def ^:static header-l
(as-> (l/in [:dashboard]) $
@ -45,7 +45,7 @@
(ui.u/user)])))
(def ^:static header
(util/component
(mx/component
{:render header-render
:name "header"
:mixins [rum/static

11
src/uxbox/ui/dashboard/icons.cljs
View file

@ -14,8 +14,7 @@
[uxbox.ui.form :as form]
[uxbox.ui.lightbox :as lightbox]
[uxbox.ui.dom :as dom]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Lenses
@ -46,7 +45,7 @@
i/trash]])])))
(def ^:static page-title
(util/component
(mx/component
{:render page-title-render
:name "page-title"
:mixins [mx/static rum/reactive]}))
@ -89,7 +88,7 @@
(str (count (:icons props)) " elements")]])]]])))
(def ^:static nav
(util/component
(mx/component
{:render nav-render
:name "nav"
:mixins [rum/reactive]}))
@ -125,7 +124,7 @@
[:div.project-th-icon.delete i/trash]]])]]))))
(def grid
(util/component
(mx/component
{:render grid-render
:name "grid"
:mixins [mx/static rum/reactive]}))
@ -155,6 +154,6 @@
i/close]]))
(def new-icon-lightbox
(util/component
(mx/component
{:render new-icon-lightbox-render
:name "new-icon-lightbox"}))

10
src/uxbox/ui/dashboard/projects.cljs
View file

@ -13,7 +13,7 @@
[uxbox.ui.dom :as dom]
[uxbox.ui.dashboard.header :as dsh.header]
[uxbox.ui.lightbox :as lightbox]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Helpers & Constants
@ -136,7 +136,7 @@
i/close]])))
(def new-project-lightbox
(util/component
(mx/component
{:render new-project-lightbox-render
:name "new-project-lightbox"
:mixins [(rum/local +project-defaults+)]}))
@ -177,7 +177,7 @@
i/search]])))
(def menu
(util/component
(mx/component
{:render menu-render
:name "projects-menu"
:mixins [rum/reactive]}))
@ -210,7 +210,7 @@
i/trash]]])))
(def project-item
(util/component
(mx/component
{:render project-item-render
:name "project"
:mixins [rum/static]}))
@ -246,7 +246,7 @@
(rum/with-key (project-item item) (:id item)))]]))))
(def grid
(util/component
(mx/component
{:render grid-render
:name "grid"
:mixins [rum/reactive]}))

3
src/uxbox/ui/library_bar.cljs
View file

@ -1,7 +1,6 @@
(ns uxbox.ui.library-bar
(:require [sablono.core :as html :refer-macros [html]]
[rum.core :as rum]
[uxbox.ui.util :as ui]
[uxbox.ui.mixins :as mx]
[uxbox.ui.icons :as i]))
@ -79,7 +78,7 @@
]))
(def ^:static library-bar
(ui/component
(mx/component
{:render library-bar-render
:name "library-bar"
:mixins [mx/static]}))

4
src/uxbox/ui/lightbox.cljs
View file

@ -1,7 +1,7 @@
(ns uxbox.ui.lightbox
(:require [sablono.core :as html :refer-macros [html]]
[rum.core :as rum]
[uxbox.ui.util :as util]
[uxbox.ui.mixins :as mx]
[uxbox.ui.keyboard :as k]
[goog.events :as events])
(:import goog.events.EventType))
@ -59,7 +59,7 @@
(render-lightbox params)])))
(def ^:static lightbox
(util/component
(mx/component
{:name "lightbox"
:render lightbox-render
:transfer-state lightbox-transfer-state

45
src/uxbox/ui/mixins.cljs
View file

@ -4,8 +4,43 @@
[cats.labs.lens :as l]
[goog.dom.forms :as gforms]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Rum Sugar
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn component
[spec]
(let [name (or (:name spec)
(str (gensym "rum-")))
mixins (or (:mixins spec)
[])
spec (merge (dissoc spec :name :mixins)
(when-let [rfn (:render spec)]
{:render (fn [state]
[(apply rfn state (:rum/props state)) state])}))
cls (rum/build-class (conj mixins spec) name)
ctr (fn self
([] (self {}))
([& props]
(let [state {:rum/props props}]
(rum/element cls state nil))))]
(with-meta ctr {:rum/class cls})))
(defn ref-value
[own ref]
(let [component (-> own :rum/react-component)
ref-node (aget (.-refs component) ref)
dom-node (.findDOMNode js/ReactDOM ref-node)]
(.-value dom-node)))
(defn get-ref-dom
[own ref]
(let [component (-> own :rum/react-component)
ref-node (aget (.-refs component) ref)]
(.findDOMNode js/ReactDOM ref-node)))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Cursored & Lenses
;; Cursored Mixin
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn- cursored-key
@ -63,6 +98,10 @@
{:did-mount cursored-did-mount
:will-unmount cursored-will-unmount})
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Local Mixin
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn local
"Adds an atom to component’s state that can be used as local state.
Atom is stored under key `:rum/local`.
@ -85,6 +124,10 @@
(assoc state key local-state)))
}))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Static Mixin
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(def static
{:should-update
(fn [old-state new-state]

6
src/uxbox/ui/users.cljs
View file

@ -6,7 +6,7 @@
[uxbox.state :as s]
[uxbox.ui.icons :as icons]
[uxbox.ui.navigation :as nav]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Menu
@ -34,7 +34,7 @@
[:span "Save & Exit"]]]))
(def user-menu
(util/component
(mx/component
{:render menu-render
:name "user-menu"
:mixins []}))
@ -65,7 +65,7 @@
(user-menu (:open @local))])))
(def user
(util/component
(mx/component
{:render user-render
:name "user"
:mixins [rum/reactive (rum/local {:open false})]}))

62
src/uxbox/ui/util.cljs
View file

@ -1,62 +0,0 @@
(ns uxbox.ui.util
"A collection of sugar syntax for define react
components using rum libary."
(:refer-clojure :exclude [derive])
(:require [rum.core :as rum]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Rum Sugar
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn component
[spec]
(let [name (or (:name spec)
(str (gensym "rum-")))
mixins (or (:mixins spec)
[])
spec (merge (dissoc spec :name :mixins)
(when-let [rfn (:render spec)]
{:render (fn [state]
[(apply rfn state (:rum/props state)) state])}))
cls (rum/build-class (conj mixins spec) name)
ctr (fn self
([] (self {}))
([& props]
(let [state {:rum/props props}]
(rum/element cls state nil))))]
(with-meta ctr {:rum/class cls})))
(defn ref-value
[own ref]
(let [component (-> own :rum/react-component)
ref-node (aget (.-refs component) ref)
dom-node (.findDOMNode js/ReactDOM ref-node)]
(.-value dom-node)))
(defn get-ref-dom
[own ref]
(let [component (-> own :rum/react-component)
ref-node (aget (.-refs component) ref)]
(.findDOMNode js/ReactDOM ref-node)))
(def mount rum/mount)
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Color Conversion
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn hex->rgb
[^string data]
(some->> (re-find #"^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$" data)
(rest)
(mapv #(js/parseInt % 16))))
(defn rgb->hex
[[r g b]]
(letfn [(to-hex [c]
(let [hexdata (.toString c 16)]
(if (= (count hexdata) 1)
(str "0" hexdata)
hexdata)))]
(str "#" (to-hex r) (to-hex g) (to-hex b))))

5
src/uxbox/ui/workspace.cljs
View file

@ -7,7 +7,6 @@
[uxbox.state :as st]
[uxbox.data.workspace :as dw]
[uxbox.ui.icons :as i]
[uxbox.ui.util :as util]
[uxbox.ui.mixins :as mx]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.workspace.options :refer (element-opts)]
@ -35,7 +34,7 @@
[:tr [:td "y="] [:td y]]]]])))
(def coordinates
(util/component
(mx/component
{:render coordenates-render
:name "coordenates"
:mixins [rum/reactive]}))
@ -100,7 +99,7 @@
state))
(def ^:static workspace
(util/component
(mx/component
{:render workspace-render
:will-mount workspace-will-mount
:transfer-state workspace-transfer-state

1
src/uxbox/ui/workspace/base.cljs
View file

@ -7,7 +7,6 @@
[uxbox.data.projects :as dp]
[uxbox.data.workspace :as dw]
[uxbox.util.lens :as ul]
[uxbox.ui.util :as util]
[goog.events :as events])
(:import goog.events.EventType))

13
src/uxbox/ui/workspace/canvas.cljs
View file

@ -14,7 +14,6 @@
[uxbox.data.workspace :as dw]
[uxbox.ui.mixins :as mx]
[uxbox.ui.dom :as dom]
[uxbox.ui.util :as util]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.workspace.grid :refer (grid)]
[uxbox.ui.workspace.options :refer (element-opts)])
@ -39,7 +38,7 @@
{:x 0 :y 0 :width "100%" :height "100%" :fill "white"}]))
(def background
(util/component
(mx/component
{:render background-render
:name "background"
:mixins [mx/static]}))
@ -60,7 +59,7 @@
:height height}]))))
(def ^:static selrect
(util/component
(mx/component
{:render selrect-render
:name "selrect"
:mixins [mx/static rum/reactive]}))
@ -117,7 +116,7 @@
{:cx (+ x width) :cy (+ y height)})]]]))))
(def selected-shapes
(util/component
(mx/component
{:render selected-shapes-render
:name "selected-shapes"
:mixins [mx/static rum/reactive (mx/local {})]}))
@ -169,7 +168,7 @@
{:cx (+ x width) :cy (+ y height)})]])]))))
(def shape
(util/component
(mx/component
{:render shape-render
:name "shape"
:mixins [mx/static (mx/local {})]}))
@ -188,7 +187,7 @@
(- y offset-y)]}]
(rx/push! wb/mouse-b event)))]
(let [[page] (:rum/props own)
canvas (util/get-ref-dom own (str "canvas" (:id page)))
canvas (mx/get-ref-dom own (str "canvas" (:id page)))
brect (.getBoundingClientRect canvas)
brect [(.-left brect) (.-top brect)]
key (events/listen js/document EventType.MOUSEMOVE
@ -251,7 +250,7 @@
(selrect)]]))))
(def canvas
(util/component
(mx/component
{:render canvas-render
:did-mount canvas-did-mount
:will-unmount canvas-will-unmount

6
src/uxbox/ui/workspace/colorpalette.cljs
View file

@ -9,10 +9,10 @@
[uxbox.data.workspace :as dw]
[uxbox.util.lens :as ul]
[uxbox.util.data :refer (read-string)]
[uxbox.util.color :refer (hex->rgb)]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.icons :as i]
[uxbox.ui.dom :as dom]
[uxbox.ui.util :as util]
[uxbox.ui.mixins :as mx]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
@ -65,7 +65,7 @@
[:span.left-arrow i/arrow-slide]
[:div.color-palette-content
(for [hex-color (:colors collection)
:let [rgb-vec (util/hex->rgb hex-color)
:let [rgb-vec (hex->rgb hex-color)
rgb-color (apply str "" (interpose ", " rgb-vec))]]
[:div.color-cell {:key (str hex-color)
:on-click #(select-color hex-color %)}
@ -139,7 +139,7 @@
;; [:span.color-text "+ Add color"]]]
(def ^:static colorpalette
(util/component
(mx/component
{:render colorpalette-render
:name "colorpalette"
:mixins [mx/static rum/reactive

3
src/uxbox/ui/workspace/grid.cljs
View file

@ -2,7 +2,6 @@
(:require [sablono.core :as html :refer-macros [html]]
[rum.core :as rum]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]
[uxbox.ui.workspace.base :as wb]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
@ -78,7 +77,7 @@
(rum/with-key line (str "tick-" tick))))]))))
(def grid
(util/component
(mx/component
{:render grid-render
:name "grid"
:mixins [mx/static rum/reactive]}))

4
src/uxbox/ui/workspace/header.cljs
View file

@ -9,7 +9,7 @@
[uxbox.ui.icons :as i]
[uxbox.ui.users :as ui.u]
[uxbox.ui.navigation :as nav]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
(defn on-download-clicked
[event page]
@ -73,7 +73,7 @@
(ui.u/user)])))
(def header
(util/component
(mx/component
{:render header-render
:name "workspace-header"
:mixins [rum/reactive]}))

4
src/uxbox/ui/workspace/lateralmenu.cljs
View file

@ -7,7 +7,7 @@
[uxbox.data.workspace :as dw]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.icons :as i]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Lateral Menu
@ -45,7 +45,7 @@
i/chat]]]])))
(def ^:static lateralmenu
(util/component
(mx/component
{:render lateralmenu-render
:name "lateralmenu"
:mixins [rum/reactive]}))

3
src/uxbox/ui/workspace/options.cljs
View file

@ -5,7 +5,6 @@
[uxbox.shapes :as shapes]
[uxbox.data.workspace :as dw]
[uxbox.ui.icons :as i]
[uxbox.ui.util :as util]
[uxbox.ui.mixins :as mx]
[uxbox.ui.dom :as dom]
[uxbox.ui.workspace.base :as wb]
@ -186,7 +185,7 @@
(-render-menu menu own shape))])))
(def ^:static element-opts
(util/component
(mx/component
{:render element-opts-render
:name "element-opts"
:mixins [rum/reactive (mx/local {})]}))

13
src/uxbox/ui/workspace/pagesmngr.cljs
View file

@ -5,12 +5,11 @@
[uxbox.rstore :as rs]
[uxbox.data.projects :as dp]
[uxbox.data.workspace :as dw]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.keyboard :as k]
[uxbox.ui.icons :as i]
[uxbox.ui.mixins :as mx]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.dom :as dom]
[uxbox.ui.util :as util]))
[uxbox.ui.dom :as dom]))
(defn- page-item-render
[own parent page numpages]
@ -37,7 +36,7 @@
i/trash]]]))))
(def page-item
(util/component
(mx/component
{:render page-item-render
:name "page-item"
:mixins [rum/reactive]}))
@ -59,7 +58,7 @@
"+ Add new page"]])))
(def page-list
(util/component
(mx/component
{:render page-list-render
:name "page-list"
:mixins [rum/reactive]}))
@ -108,7 +107,7 @@
"Cancel"]]))))
(def page-form
(util/component
(mx/component
{:render page-form-render
:name "page-form"
:mixins [rum/reactive]}))
@ -127,7 +126,7 @@
(page-list local))])))
(def pagesmngr
(util/component
(mx/component
{:render pagesmngr-render
:name "pagesmngr"
:mixins [rum/reactive (mx/local {:edit false :form {}})]}))

7
src/uxbox/ui/workspace/rules.cljs
View file

@ -6,8 +6,7 @@
[uxbox.state :as s]
[uxbox.ui.dom :as dom]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]))
[uxbox.ui.mixins :as mx]))
(def ^:static zoom 1)
(def ^:static padding 20)
@ -91,7 +90,7 @@
(h-line pos tick))]])))
(def h-rule
(util/component
(mx/component
{:render h-rule-render
:name "h-rule"
:mixins [mx/static rum/reactive]}))
@ -113,7 +112,7 @@
(v-line pos tick))]])))
(def v-rule
(util/component
(mx/component
{:render v-rule-render
:name "v-rule"
:mixins [mx/static rum/reactive]}))

3
src/uxbox/ui/workspace/sidebar.cljs
View file

@ -6,7 +6,6 @@
[uxbox.router :as r]
[uxbox.rstore :as rs]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.workspace.toolboxes :as toolboxes]))
@ -29,7 +28,7 @@
(toolboxes/layers))]])))
(def aside
(util/component
(mx/component
{:render aside-render
:name "aside"
:mixins [rum/reactive mx/static]}))

13
src/uxbox/ui/workspace/toolboxes.cljs
View file

@ -12,8 +12,7 @@
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.icons :as i]
[uxbox.ui.mixins :as mx]
[uxbox.ui.dom :as dom]
[uxbox.ui.util :as util]))
[uxbox.ui.dom :as dom]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Lenses
@ -79,7 +78,7 @@
(:icon props)])]])))
(def ^:static draw-tools
(util/component
(mx/component
{:render draw-tools-render
:name "draw-tools"
:mixins [mx/static rum/reactive]}))
@ -102,7 +101,7 @@
(:id item))]])))
(def ^:static ^:private layer-element
(util/component
(mx/component
{:render layer-element-render
:name "layer-element"
:mixins [mx/static]}))
@ -171,7 +170,7 @@
(def ^:static layers
(util/component
(mx/component
{:render layers-render
:name "layers"
:mixins [rum/reactive]}))
@ -198,7 +197,7 @@
(shapes/render icon))
(def ^:static ^:private icon-wrapper
(util/component
(mx/component
{:render icon-wrapper-render
:name "icon-wrapper"
:mixins [mx/static]}))
@ -236,7 +235,7 @@
(icon-wrapper icon)])]])))
(def ^:static icons
(util/component
(mx/component
{:render icons-render
:name "icons-toolbox"
:mixins [rum/reactive

3
src/uxbox/ui/workspace/workarea.cljs
View file

@ -5,7 +5,6 @@
[uxbox.rstore :as rs]
[uxbox.state :as s]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]
[uxbox.data.workspace :as dw]
[uxbox.ui.workspace.canvas :refer (canvas)]
[uxbox.ui.workspace.grid :refer (grid)]
@ -45,7 +44,7 @@
(canvas page))]])))
(def viewport
(util/component
(mx/component
{:render viewport-render
:name "viewport"
:mixins [rum/reactive]}))

17
src/uxbox/util/color.cljs Normal file
View file

@ -0,0 +1,17 @@
(ns uxbox.util.color
"Color conversion utils.")
(defn hex->rgb
[^string data]
(some->> (re-find #"^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$" data)
(rest)
(mapv #(js/parseInt % 16))))
(defn rgb->hex
[[r g b]]
(letfn [(to-hex [c]
(let [hexdata (.toString c 16)]
(if (= (count hexdata) 1)
(str "0" hexdata)
hexdata)))]
(str "#" (to-hex r) (to-hex g) (to-hex b))))