Created
January 7, 2016 20:18
-
-
Save netzwerg/ce68469060c267cad3c1 to your computer and use it in GitHub Desktop.
Circle animation to paste into http://www.elm-lang.org/try
This file contains 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
import Color exposing (..) | |
import Graphics.Collage exposing (..) | |
import Graphics.Element exposing (..) | |
import Time exposing (..) | |
import Window | |
import List exposing (..) | |
import Debug | |
-- CONFIG | |
size = 600 | |
circleSize = 240 | |
dotCount = 10 | |
dotSize = 10 | |
velocity = 0.01 | |
-- MODEL | |
type alias Dot = | |
{ x : Float | |
, angle : Float | |
} | |
type alias State = List Dot | |
createDots : State | |
createDots = map createDot [ 0 .. dotCount - 1 ] | |
createDot : Int -> Dot | |
createDot index = | |
let angle = toFloat index * pi / dotCount | |
in { x = 0 | |
, angle = angle | |
} | |
-- UPDATE | |
update : Time -> State -> State | |
update time dots = map (moveDot time) dots |> Debug.watch "Dots" | |
moveDot : Time -> Dot -> Dot | |
moveDot time dot = | |
let t = velocity * time / pi | |
newX = (-circleSize + dotSize) * cos(t + dot.angle) | |
in { dot | x = newX } | |
-- VIEW | |
view : State -> Element | |
view dots = | |
let background = filled black (circle circleSize) | |
dotLinePairs = map viewDotWithLine dots | |
in collage size size (background :: dotLinePairs) | |
viewDotWithLine : Dot -> Form | |
viewDotWithLine dot = | |
let dotView = viewDot dot | |
lineView = createLineView | |
in group [dotView , lineView] |> rotate dot.angle | |
viewDot : Dot -> Form | |
viewDot d = alpha 0.8 (filled lightOrange (circle dotSize)) |> move (d.x, 0) | |
createLineView : Form | |
createLineView = traced (solid white) (path [ (-size / 2.0, 0) , (size / 2.0, 0) ]) | |
-- SIGNALS | |
main = Time.every 20 |> Signal.foldp update createDots |> Signal.map view |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment