3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-05 12:51:37 +02:00
Code Issues Projects Releases Packages Wiki Activity

Add dragging support for color picker handlers.

Browse source
This commit is contained in:
Andrey Antukh 2016-04-02 22:55:23 +03:00
parent 50eb744c3b
commit 7e8730c26e
1 changed files with 14 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -86,7 +86,6 @@
(let [event (.-nativeEvent event) (let [event (.-nativeEvent event)
my (.-offsetY event) my (.-offsetY event)
h (* (/ my (:s-height @local)) 360)] h (* (/ my (:s-height @local)) 360)]
(println "on-slide-click")
(swap! local assoc :color [h 1 255]))) (swap! local assoc :color [h 1 255])))
(defn- colorpicker-render (defn- colorpicker-render
@ -102,13 +101,23 @@
pit (- (* s (:p-width @local)) pit (- (* s (:p-width @local))
(/ (:pi-height @local) 2)) (/ (:pi-height @local) 2))
pil (- (- (:p-height @local) (* (/ v 255) (:p-height @local))) pil (- (- (:p-height @local) (* (/ v 255) (:p-height @local)))
(/ (:pi-width @local) 2))] (/ (:pi-width @local) 2))
on-mouse-down #(swap! local assoc :mousedown true)
on-mouse-up #(swap! local assoc :mousedown false)
on-mouse-move-slide #(when (:mousedown @local)
(on-slide-click local %))
on-mouse-move-picker #(when (:mousedown @local)
(on-picker-click local on-change color %))]
(html (html
[:div.color-picker [:div.color-picker
[:div.picker-wrapper [:div.picker-wrapper
[:div.picker [:div.picker
{:ref "picker" {:ref "picker"
:on-click (partial on-picker-click local on-change color) :on-click (partial on-picker-click local on-change color)
:on-mouse-down on-mouse-down
:on-mouse-up on-mouse-up
:on-mouse-move on-mouse-move-picker
:style {:backgroundColor bg}} :style {:backgroundColor bg}}
(picker-box)] (picker-box)]
[:div.picker-indicator [:div.picker-indicator
@ -119,6 +128,9 @@
[:div.slide-wrapper [:div.slide-wrapper
[:div.slide [:div.slide
{:ref "slide" {:ref "slide"
:on-mouse-down on-mouse-down
:on-mouse-up on-mouse-up
:on-mouse-move on-mouse-move-slide
:on-click (partial on-slide-click local)} :on-click (partial on-slide-click local)}
(slider-box)] (slider-box)]
[:div.slide-indicator [:div.slide-indicator