diff --git a/examples/geometry/example.html b/examples/geometry/example.html
index 54b9eba..6cc6c22 100644
--- a/examples/geometry/example.html
+++ b/examples/geometry/example.html
@@ -2,7 +2,7 @@
- reagent simple example
+ reagent svg example
diff --git a/examples/geometry/src/components.cljs b/examples/geometry/src/components.cljs
index f962811..85dd0e1 100644
--- a/examples/geometry/src/components.cljs
+++ b/examples/geometry/src/components.cljs
@@ -8,10 +8,15 @@
:fill "blue"
:r 5})
-(def line-defaults
+(def segment-defaults
{:stroke "black"
:stroke-width 2})
+(def circle-defaults
+ {:fill "rgba(255,0,0,0.1)"
+ :stroke "black"
+ :stroke-width 2})
+
(defn point [p]
[:circle
(merge point-defaults
@@ -21,8 +26,7 @@
(when (:mouse-down? @mouse-info)
(reset! p (g/point (:x @mouse-info)
(:y @mouse-info)))
- (.requestAnimationFrame
- js/window
+ (r/next-tick
(fn []
(drag mouse-info p)))))
@@ -37,7 +41,7 @@
(defn segment [from to]
[:line
- (merge line-defaults
+ (merge segment-defaults
{:x1 (x from) :y1 (y from)
:x2 (x to) :y2 (y to)})])
@@ -47,12 +51,9 @@
[segment b c]
[segment c a]])
-
(defn circle [c r]
[:circle
- {:cx (x c)
- :cy (y c)
- :r (dist c r)
- :stroke-width 2
- :stroke "black"
- :fill "rgba(0,0,0,0)"}])
+ (merge circle-defaults
+ {:cx (x c)
+ :cy (y c)
+ :r (dist c r)})])
diff --git a/examples/geometry/src/core.cljs b/examples/geometry/src/core.cljs
index 9d173e4..cba5828 100644
--- a/examples/geometry/src/core.cljs
+++ b/examples/geometry/src/core.cljs
@@ -24,13 +24,16 @@
(def p1 (r/atom (g/point 100 100)))
(def p2 (r/atom (g/point 200 200)))
(def p3 (r/atom (g/point 100 200)))
+(def c (r/atom (g/point 250 250)))
+(def p (r/atom (g/point 250 300)))
(defn root []
[:g
[c/triangle @p1 @p2 @p3]
- [c/circle @p1 @p2]
- [c/circle @p2 @p3]
- [c/circle @p3 @p1]
+ [c/circle @p @c]
+ [c/segment @p @c]
+ [c/draggable-point c mouse-info]
+ [c/draggable-point p mouse-info]
[c/draggable-point p1 mouse-info]
[c/draggable-point p2 mouse-info]
[c/draggable-point p3 mouse-info]])
@@ -43,11 +46,12 @@
[:svg {:on-mouse-down on-mouse-down
:on-mouse-up on-mouse-up
:on-mouse-move on-mouse-move
- :width 400
- :height 400
+ :width 800
+ :height 600
:style {:border "1px solid black"}}
- [:text {:style {:-webkit-user-select "none"}
+ [:text {:style {:-webkit-user-select "none"
+ :-moz-user-select "none"}
:x 20 :y 20 :font-size 20}
- "The corners are draggable"]
- [root]]
+ "The points are draggable"]
+ [root]]
(by-id "app")))
diff --git a/examples/geometry/src/geometry.cljs b/examples/geometry/src/geometry.cljs
index b0e7f9d..ffdfac3 100644
--- a/examples/geometry/src/geometry.cljs
+++ b/examples/geometry/src/geometry.cljs
@@ -12,18 +12,6 @@
(defn point [x y]
(Point. x y))
-(defn addp [p1 p2]
- (point (+ (x p1) (x p2))
- (+ (y p1) (y p2))))
-
-(defn rand-point [xmin xmax ymin ymax]
- (point (rand-nth (vec (range xmin xmax)))
- (rand-nth (vec (range ymin ymax)))))
-
-(defn rand-dir []
- (rand-point -1 2 -1 2))
-
-
(defn dist [p1 p2]
(js/Math.sqrt (+ (js/Math.pow (- (x p2) (x p1)) 2)
(js/Math.pow (- (y p2) (y p1)) 2))))