4ca6dcc · elk · git.iko.soy

git.iko.soy/elk

on master help sign in

Update examples for version 0.4

4ca6dccevancz14 years ago

Examples/elm-js/FrameRate/FrameRate.elm+18−13

compare with master

unifiedsplit

@@ -6,17 +6,20 @@ import Foreign.JavaScript

6import Signal.Keyboard.Raw

7import Signal.Input

9−

9+(drop,dFPS) = dropDown

10+ [ ( "30", 30)

11+ , ( "4", 4)

12+ , ( "10", 10)

13+ , ( "60", 60)

14+ , ("100", 100) ]

15+

10−foreign import jsevent "trigger" (castIntToJSNumber 0)

16+desiredFPS = lift castIntToJSNumber dFPS

11− jsTime :: Signal JSNumber

12−

13−foreign export jsevent "finished"

14− done :: Signal JSBool

15−

16foreign export jsevent "desiredFPS"

17foreign export jsevent "desiredFPS"

17 desiredFPS :: Signal JSNumber

18 desiredFPS :: Signal JSNumber

20+

19−desiredFPS = constant (castIntToJSNumber 30)

21+foreign import jsevent "trigger" (castIntToJSNumber 0)

22+ jsTime :: Signal JSNumber

21time = lift castJSNumberToFloat jsTime

24time = lift castJSNumberToFloat jsTime

@@ -26,7 +29,6 @@ time = lift castJSNumberToFloat jsTime

26getFPS ts =

29getFPS ts =

27 let len = length ts in

30 let len = length ts in

28 if len > 1 then (len-1) / (head ts - last ts) else 0

31 if len > 1 then (len-1) / (head ts - last ts) else 0

29−truncate n = castJSNumberToInt (castFloatToJSNumber $ 100 * n) / 100

30fps = lift (truncate . getFPS) (foldp (\t ts -> take 10 (t:ts)) [0] time)

32fps = lift (truncate . getFPS) (foldp (\t ts -> take 10 (t:ts)) [0] time)

@@ -45,7 +47,7 @@ velocity = lift (foldl addKey (0,0)) keysDown

46timestep = lift snd $ foldp (\t1 (t0,d) -> (t1, t1-t0)) (0,0) time

48timestep = lift snd $ foldp (\t1 (t0,d) -> (t1, t1-t0)) (0,0) time

48−delta = dropIf (\(x,y) -> x == 0 && y == 0) (0,0) $

50+delta = dropIf (\(x,y) -> x == 0 && y == 0) (0,0) . sampleOn timestep $

49 lift (scaleBy 100) (lift2 scaleBy timestep velocity)

51 lift (scaleBy 100) (lift2 scaleBy timestep velocity)

51position = foldp addVecs (0,0) delta

53position = foldp addVecs (0,0) delta

@@ -53,15 +55,18 @@ position = foldp addVecs (0,0) delta

54-- Display moving square and FPS on screen.

56-- Display moving square and FPS on screen.

56−screen pos actual desired =

58+screen pos actual =

57 flow down [ collage 400 400 [ outlined black (rect 40 40 pos) ]

59 flow down [ collage 400 400 [ outlined black (rect 40 40 pos) ]

58 , plainText "Move the square around with the arrow keys."

60 , plainText "Move the square around with the arrow keys."

59 , text $ toText "Actual frames per second: " ++ show actual

61 , text $ toText "Actual frames per second: " ++ show actual

60− , text $ toText "Desired frames per second: " ++ show desired

62+ , plainText "Desired frames per second: " `beside` drop

61 ]

63 ]

64−game = lift3 screen position fps desiredFPS

66+game = lift2 screen position fps

67+

65done = lift (\_ -> castBoolToJSBool True) game

68done = lift (\_ -> castBoolToJSBool True) game

69+foreign export jsevent "finished"

70+ done :: Signal JSBool

67main = game

72main = game

Examples/elm-js/Maps/Map.elm+2−2

@@ -5,11 +5,11 @@ import Signal.Window as Win

5import Foreign.JavaScript.Experimental

7foreign import jsevent "provideMap"

8− (castElementToJSElement $ rectangle 640 360)

8+ (castElementToJSElement $ spacer 640 360)

9 jsMaps :: Signal JSElement

12−center (w,h) elem = size w h (box 5 elem)

12+center (w,h) elem = container w h middle elem

13maps = lift (castJSElementToElement 640 360) jsMaps

15main = lift2 center Win.dimensions maps

Examples/elm-js/Maps/MapHelp.js+5−3

@@ -1,6 +1,7 @@

2−var lib = document.createElement('script');

2+document.body.onload = function() {

4+var lib = document.createElement('script');

4lib.addEventListener('load', function() {

5lib.addEventListener('load', function() {

5 var div = document.createElement('div');

6 var div = document.createElement('div');

6 div.id = "demoMap";

7 div.id = "demoMap";

@@ -18,6 +19,7 @@ lib.addEventListener('load', function() {

18 map.zoomToMaxExtent();

19 map.zoomToMaxExtent();

19 }, 0);

20 }, 0);

20 });

21 });

21−

22lib.src = "http://www.openlayers.org/api/OpenLayers.js";

23−document.head.appendChild(lib);

23+document.head.appendChild(lib);

24+

25+}

Examples/elm-js/Pong/Pong.elm+7−7

@@ -299,10 +299,10 @@ scoreBoard w inPlay p1 p2 =

299 let { code = text . monospace . toText

300 ; stack top bottom = flow down [ code " ", code top, code bottom ]

301 ; msg = width w . centeredText . monospace $ toText "Press SPACE to begin"

302− ; score = width w . box 2 $ flow right

303− [ stack "W" "S", rectangle 20 1

302+ ; board = flow right [ stack "W" "S", spacer 20 1

304− , text . Text.height 4 $ show p1 ++ toText " " ++ show p2

303+ , text . Text.height 4 $ show p1 ++ toText " " ++ show p2

305− , rectangle 20 1, stack "↑" "↓" ]

304+ , spacer 20 1, stack "↑" "↓" ]

305+ ; score = container w (heightOf board) midTop board

306 }

307 in if inPlay then score else score `above` msg

308

@@ -311,14 +311,14 @@ scoreBoard w inPlay p1 p2 =

311

312display (w,h) (GameState state (Score p1 p2) (Ball pos _) (Paddle y1) (Paddle y2)) =

313 layers

314− [ scoreBoard w (state == Play) p1 p2

315− , let pongGreen = rgb 60 100 60 in

314+ [ let pongGreen = rgb 60 100 60 in

316− size w h . box 5 $ collage gameWidth gameHeight

315+ container w h middle $ collage gameWidth gameHeight

317 [ filled pongGreen (rect gameWidth gameHeight (halfWidth,halfHeight))

316 [ filled pongGreen (rect gameWidth gameHeight (halfWidth,halfHeight))

318 , filled white (oval 15 15 pos) -- ball

317 , filled white (oval 15 15 pos) -- ball

319 , filled white (rect 10 40 ( 20, y1)) -- first paddle

318 , filled white (rect 10 40 ( 20, y1)) -- first paddle

320 , filled white (rect 10 40 (gameWidth - 20, y2)) -- second paddle

319 , filled white (rect 10 40 (gameWidth - 20, y2)) -- second paddle

321 ]

320 ]

321+ , scoreBoard w (state == Play) p1 p2

322 ]

323

324-- We can now define a view of the game (a signal of Elements) that changes