on master help sign in
Update examples for version 0.4
commit4ca6dccaada0f8635ba6bcf10765f9531531561f authorevancz <info@elm-lang.org> dateSun 16 Sep 2012, 00:52 (14 years ago) parentb3ab4f8
4 files changed+32−25
Examples/elm-js/FrameRate/FrameRate.elm+18−13 Examples/elm-js/Maps/Map.elm+2−2 Examples/elm-js/Maps/MapHelp.js+5−3 Examples/elm-js/Pong/Pong.elm+7−7
Examples/elm-js/FrameRate/FrameRate.elm+18−13
@@ -6,17 +6,20 @@ import Foreign.JavaScript
66import Signal.Keyboard.Raw
77import Signal.Input
88
9−
10−foreign import jsevent "trigger" (castIntToJSNumber 0)
11− jsTime :: Signal JSNumber
12−
13−foreign export jsevent "finished"
14− done :: Signal JSBool
15−
9+(drop,dFPS) = dropDown
10+ [ ( "30", 30)
11+ , ( "4", 4)
12+ , ( "10", 10)
13+ , ( "60", 60)
14+ , ("100", 100) ]
15+
16+desiredFPS = lift castIntToJSNumber dFPS
1617foreign export jsevent "desiredFPS"
1718 desiredFPS :: Signal JSNumber
1819
19−desiredFPS = constant (castIntToJSNumber 30)
20+
21+foreign import jsevent "trigger" (castIntToJSNumber 0)
22+ jsTime :: Signal JSNumber
2023
2124time = lift castJSNumberToFloat jsTime
2225
@@ -26,7 +29,6 @@ time = lift castJSNumberToFloat jsTime
2629getFPS ts =
2730 let len = length ts in
2831 if len > 1 then (len-1) / (head ts - last ts) else 0
29−truncate n = castJSNumberToInt (castFloatToJSNumber $ 100 * n) / 100
3032fps = lift (truncate . getFPS) (foldp (\t ts -> take 10 (t:ts)) [0] time)
3133
3234
@@ -45,7 +47,7 @@ velocity = lift (foldl addKey (0,0)) keysDown
4547
4648timestep = lift snd $ foldp (\t1 (t0,d) -> (t1, t1-t0)) (0,0) time
4749
48−delta = dropIf (\(x,y) -> x == 0 && y == 0) (0,0) $
50+delta = dropIf (\(x,y) -> x == 0 && y == 0) (0,0) . sampleOn timestep $
4951 lift (scaleBy 100) (lift2 scaleBy timestep velocity)
5052
5153position = foldp addVecs (0,0) delta
@@ -53,15 +55,18 @@ position = foldp addVecs (0,0) delta
5355
5456-- Display moving square and FPS on screen.
5557
56−screen pos actual desired =
58+screen pos actual =
5759 flow down [ collage 400 400 [ outlined black (rect 40 40 pos) ]
5860 , plainText "Move the square around with the arrow keys."
5961 , 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
6163 ]
6264
6365
64−game = lift3 screen position fps desiredFPS
66+game = lift2 screen position fps
67+
6568done = lift (\_ -> castBoolToJSBool True) game
69+foreign export jsevent "finished"
70+ done :: Signal JSBool
6671
6772main = game
Examples/elm-js/Maps/Map.elm+2−2
@@ -5,11 +5,11 @@ import Signal.Window as Win
55import Foreign.JavaScript.Experimental
66
77foreign import jsevent "provideMap"
8− (castElementToJSElement $ rectangle 640 360)
8+ (castElementToJSElement $ spacer 640 360)
99 jsMaps :: Signal JSElement
1010
1111
12−center (w,h) elem = size w h (box 5 elem)
12+center (w,h) elem = container w h middle elem
1313maps = lift (castJSElementToElement 640 360) jsMaps
1414
1515main = lift2 center Win.dimensions maps
Examples/elm-js/Maps/MapHelp.js+5−3
@@ -1,6 +1,7 @@
11
2−var lib = document.createElement('script');
2+document.body.onload = function() {
33
4+var lib = document.createElement('script');
45lib.addEventListener('load', function() {
56 var div = document.createElement('div');
67 div.id = "demoMap";
@@ -18,6 +19,7 @@ lib.addEventListener('load', function() {
1819 map.zoomToMaxExtent();
1920 }, 0);
2021 });
21−
2222lib.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 =
299299 let { code = text . monospace . toText
300300 ; stack top bottom = flow down [ code " ", code top, code bottom ]
301301 ; 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
304− , text . Text.height 4 $ show p1 ++ toText " " ++ show p2
305− , rectangle 20 1, stack "&uarr;" "&darr;" ]
302+ ; board = flow right [ stack "W" "S", spacer 20 1
303+ , text . Text.height 4 $ show p1 ++ toText " " ++ show p2
304+ , spacer 20 1, stack "&uarr;" "&darr;" ]
305+ ; score = container w (heightOf board) midTop board
306306 }
307307 in if inPlay then score else score `above` msg
308308
@@ -311,14 +311,14 @@ scoreBoard w inPlay p1 p2 =
311311
312312display (w,h) (GameState state (Score p1 p2) (Ball pos _) (Paddle y1) (Paddle y2)) =
313313 layers
314− [ scoreBoard w (state == Play) p1 p2
315− , let pongGreen = rgb 60 100 60 in
316− size w h . box 5 $ collage gameWidth gameHeight
314+ [ let pongGreen = rgb 60 100 60 in
315+ container w h middle $ collage gameWidth gameHeight
317316 [ filled pongGreen (rect gameWidth gameHeight (halfWidth,halfHeight))
318317 , filled white (oval 15 15 pos) -- ball
319318 , filled white (rect 10 40 ( 20, y1)) -- first paddle
320319 , filled white (rect 10 40 (gameWidth - 20, y2)) -- second paddle
321320 ]
321+ , scoreBoard w (state == Play) p1 p2
322322 ]
323323
324324-- We can now define a view of the game (a signal of Elements) that changes