Swapped stroke-width and stroke-color params, fixes #82

README.md

@@ -11,7 +11,7 @@ Learn more by reading the <a href="https://github.com/Hundredrabbits/Ronin" targ
 ```lisp
 ; draw a red square
 (stroke 
-  (rect 30 30 100 100) 2 "red")
+  (rect 30 30 100 100) "red" 2)
 ```
 
 ## Install & Run
@@ -57,7 +57,7 @@ Ronin helpers are keywords that facilitates adding coordinates from the canvas i
 - `(text x y p t ~f)` Returns a text shape.
 - `(svg x y d)` Returns a svg shape.
 - `(offset a b)` Returns the offset between two pos.
-- `(stroke ~shape)` Strokes a shape.
+- `(stroke shape color ~thickness)` Strokes a shape.
 - `(fill ~rect)` Fills a shape.
 - `(gradient line ~colors 'black'])` Defines a gradient color.
 - `(guide shape color)` Draws a shape on the guide layer.

WORKSHOP.md

@@ -80,14 +80,14 @@ In Ronin, a shape is either a `(rect)`, a `(line)`, a `(circle)` or a `(pos)`. T
 
 ```lisp
 (stroke 
-  (rect 100 100 300 200) 10 "red")
+  (rect 100 100 300 200) "red" 10)
 ```
 
 Or, if you would like to trace the shape with your mouse:
 
 ```lisp
 (stroke 
-  $rect 10 "red")
+  $rect "red" 10)
 ```
 
 ### Fill

desktop/sources/scripts/commander.js

@@ -223,7 +223,7 @@ function Commander (ronin) {
 (fill 
   (svg align:x align:y "M15,15 L15,15 L285,15 L285,285 L15,285 Z") "#fff")
 (stroke 
-  (svg align:x align:y "M60,60 L195,60 A45,45 0 0,1 240,105 A45,45 0 0,1 195,150 L60,150 M195,150 A45,45 0 0,1 240,195 L240,240 ") 5 "#000")`
+  (svg align:x align:y "M60,60 L195,60 A45,45 0 0,1 240,105 A45,45 0 0,1 195,150 L60,150 M195,150 A45,45 0 0,1 240,195 L240,240 ") "#000" 5)`
 
   String.prototype.insert = function (s, i) { return [this.slice(0, i), `${s}`, this.slice(i)].join('') }
 }

desktop/sources/scripts/library.js

@@ -90,8 +90,8 @@ function Library (ronin) {
 
   // Actions
 
-  this.stroke = (shape = this.frame(), thickness, color) => { // Strokes a shape.
+  this.stroke = (shape, color, thickness = 2) => { // Strokes a shape.
-    ronin.surface.stroke(shape, thickness, color)
+    ronin.surface.stroke(shape, color, thickness)
     return shape
   }
 

desktop/sources/scripts/surface.js

@@ -25,7 +25,7 @@ function Surface (ronin) {
 
   // Shape
 
-  this.stroke = (shape, width, color, context = this.context) => {
+  this.stroke = (shape, color, width, context = this.context) => {
     context.beginPath()
     this.trace(shape, context)
     context.lineWidth = width

examples/basics/recursive.lisp

@@ -10,7 +10,7 @@
         (circle 
           (mul 5 v) 
           (mul 5 v) 
-          (mul 5 v)) 1 "red") 
+          (mul 5 v)) "red" 1) 
       (rec 
         (sub v 5))))) 
 (rec 100)

examples/basics/shapes.lisp

@@ -9,14 +9,14 @@
 
 ; draw circle
 (stroke 
-  (circle center-w center-h rad) 2 "white")
+  (circle center-w center-h rad) "white" 2)
 
 ; draw rect
 (stroke 
   (rect 
-    (sub center-w rad) (sub center-h rad) center-h center-h) 2 "white")
+    (sub center-w rad) (sub center-h rad) center-h center-h) "white" 2)
 
 ; draw line
 (stroke 
   (line (sub center-w rad) center-h (add center-w rad) center-h))
-(stroke (text 10 170 200 "HELL") 2 "pink")
+(stroke (text 10 170 200 "HELL") "pink" 2)

examples/demo/branch.lisp

@@ -7,7 +7,7 @@
     (
       (scale 0.95) 
       (stroke 
-        (line 0 0 100 100) 2 "white") 
+        (line 0 0 100 100) "white" 2) 
       (move 100 100) 
       (pushTransform) 
       (rotate 

examples/demo/fog.lisp

@@ -11,7 +11,7 @@
 ))
 ;
 (defn when-animate () (
-  (stroke (line prev-pos:x prev-pos:y mouse-pos:x mouse-pos:y) 4 "#72dec2")
+  (stroke (line prev-pos:x prev-pos:y mouse-pos:x mouse-pos:y) "#72dec2" 4)
   (move frame-rect:c frame-rect:m)
   (rotate 0.002)
   (scale 0.998)

examples/demo/spiral.lisp

@@ -9,7 +9,7 @@
       (def spiral-y (add frame-rect:m (mul (sin (div v 11)) (div v 2))))
       (def spiral-r (div v 2))
       ; draw
-      (stroke (circle spiral-x spiral-y spiral-r) 1 "rgba(114,222,194,0.1)") (rec (sub v 0.3))))) 
+      (stroke (circle spiral-x spiral-y spiral-r) "rgba(114,222,194,0.1)" 1) (rec (sub v 0.3))))) 
 ;
 (defn redraw () (
   (clear) 

examples/demo/stars.lisp

@@ -29,7 +29,7 @@
   (
     (stroke 
       (line cx cy (:x (circle-pos cx cy r a)) (:y (circle-pos cx cy r a))
-        ) 2 "white")))
+        ) "white" 2)))
 ;
 (defn draw-star 
   (cx cy r c) 

examples/events/on-animate.lisp

@@ -34,11 +34,11 @@
         (elevation 
           (sub i 1)) 
         (add x seg-width) 
-        (elevation i)) 4 
+        (elevation i))
       (gradient 
         (line 50 0 
           frame-rect:w 0) 
-        ("#ffb545" "#72dec2")))))
+        ("#ffb545" "#72dec2")) 4 )))
 ;
 (defn redraw 
   () 

examples/events/on-mouse.lisp

@@ -4,15 +4,15 @@
   (
     (clear) 
     ; vertical line 
-    (stroke (line e:x 0 e:x e:y) 2 "#ff0000") 
+    (stroke (line e:x 0 e:x e:y) "#ff0000") 
     ; horizontal line 
     (stroke 
-      (line 0 e:y e:x e:y) 2 "#72dec2") 
+      (line 0 e:y e:x e:y) "#72dec2") 
     ; circle 
     (stroke 
       (circle 
         e:x 
-        e:y 30) 2 "#ffffff")))
+        e:y 30) "#ffffff")))
 ;
 (on "mouse-down" redraw)
 (on "mouse-up" redraw)

examples/projects/drawing.lisp

@@ -17,7 +17,7 @@
       (
         (debug e:is-down) 
         (stroke 
-          (line prev-pos:x prev-pos:y e:x e:y) 2 "white") 
+          (line prev-pos:x prev-pos:y e:x e:y) "white") 
         (set prev-pos "x" e:x "y" e:y) 
         (debug prev-pos) 
         (debug e)))))
@@ -29,7 +29,7 @@
     (set prev-pos "x" e:x "y" e:y) 
     (debug e:x) 
     (stroke 
-      (circle e:x e:y 10) 4 
+      (circle e:x e:y 10) 
       (stroke-color e))))
 ;
 (on "mouse-down" draw-circle)

examples/projects/spire.lisp

@@ -9,7 +9,7 @@
   (e) 
   (
     (stroke 
-      (circle e:x e:y e:d) 1 
+      (circle e:x e:y e:d) 
       (gradient gradient-line 
         ("black" "#ffb545")))))
 ;