Last active
August 29, 2015 14:06
-
-
Save rm-hull/efee7bef4dcc615728a7 to your computer and use it in GitHub Desktop.
An optical illusion in ClojureScript & big-bang, ported from http://djfav.com/2014/01/24/illusory-cones/ - originally written in javascript by Jon Faviell.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(ns big-bang.examples.illusory-cones | |
(:require | |
[big-bang.core :refer [big-bang]] | |
[jayq.core :refer [show]] | |
[enchilada :refer [ctx canvas canvas-size]] | |
[monet.canvas :refer [clear-rect circle fill-style fill | |
save restore translate rotate]])) | |
(def initial-state | |
(let [[width height] (canvas-size)] | |
{ :t 0 | |
:radius 200 | |
:canvas {:x 0 :y 0 :w width :h height} | |
:mid-point [(/ width 2) (/ height 2)]})) | |
(defn update-state [event world-state] | |
(update-in world-state [:t] (partial + 0.5))) | |
(defn draw-circles [ctx num-circles radius] | |
(doseq [i (range 1 num-circles) | |
:let [color (if (odd? i) :black :white)]] | |
(-> | |
ctx | |
(fill-style color) | |
(circle {:x (* (Math/sin (/ i 2)) num-circles) | |
:y 0 | |
:r (- radius (* i (/ num-circles 2)))}))) | |
ctx) | |
(defn render [{:keys [t radius canvas mid-point] :as world-state}] | |
(-> | |
ctx | |
(clear-rect canvas) | |
(save) | |
(translate (first mid-point) (second mid-point)) | |
(rotate (/ t Math/PI)) | |
(draw-circles 20 radius) | |
(restore))) | |
(show canvas) | |
(big-bang | |
:initial-state initial-state | |
:on-tick update-state | |
:tick-rate 50 | |
:to-draw render) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment