git.iko.soy/elk
on master help sign in
* updated the elm-yesod example
3bd18e1Vincent Ambo
Examples/elm-yesod/Main.hs+30−3
compare with master
unifiedsplit
@@ -13,15 +13,29 @@ data ElmTest = ElmTest
13-- embedding an external elm file (note: no spaces!)
13-- embedding an external elm file (note: no spaces!)
14mousePage = [elmFile|elm_source/mouse.elm|]
14mousePage = [elmFile|elm_source/mouse.elm|]
15
15
16+rootPage = [elmFile|elm_source/index.elm|]
17+
18+clockPage = [elmFile|elm_source/clock.elm|]
19+
16−-- embedding elm code in our Haskell file
20+-- embedding elm code inside Haskell using the QuasiQuoter:
17−rootPage = [elm|
21+shapesPage = [elm|
18−main = plainText "Welcome!"
22+square = rect 200 200 (150,150)
23+circle = oval 140 140 (150,150)
24+pentagon = ngon 5 60 (150,150)
25+
26+main = collage 300 300
27+ [ outlined black square
28+ , filled green pentagon
29+ , customOutline [8,4] blue circle
30+ ]
19|]
31|]
20
32
21-- our Yesod App
33-- our Yesod App
22mkYesod "ElmTest" [parseRoutes|
34mkYesod "ElmTest" [parseRoutes|
23/ RootR GET
35/ RootR GET
24/mouse MouseR GET
36/mouse MouseR GET
37+/clock ClockR GET
38+/shapes ShapesR GET
25|]
39|]
26
40
27-- generateWidget is called with the result of an Elm QuasiQuoter (which is just a
41-- generateWidget is called with the result of an Elm QuasiQuoter (which is just a
@@ -31,11 +45,24 @@ getMouseR = defaultLayout $ do
31 setTitle "Mouse position demo"
45 setTitle "Mouse position demo"
32 generateWidget mousePage
46 generateWidget mousePage
33
47
48+getClockR :: Handler RepHtml
49+getClockR = defaultLayout $ do
50+ setTitle "A clock"
51+ generateWidget clockPage
52+
53+getShapesR :: Handler RepHtml
54+getShapesR = defaultLayout $ do
55+ setTitle "Simple shapes"
56+ generateWidget shapesPage
57+
34getRootR :: Handler RepHtml
58getRootR :: Handler RepHtml
35getRootR = defaultLayout $ do
59getRootR = defaultLayout $ do
36 setTitle "Welcome!"
60 setTitle "Welcome!"
37 generateWidget rootPage
61 generateWidget rootPage
38
62
63+
64+-- Our Yesod instance contains the default layout, which inserts the elm-min.js
65+-- file in the site's <head> tag.
39instance Yesod ElmTest where
66instance Yesod ElmTest where
40 jsLoader _ = BottomOfHeadBlocking
67 jsLoader _ = BottomOfHeadBlocking
41 defaultLayout widget = do
68 defaultLayout widget = do
Examples/elm-yesod/elm_source/clock.elmnew file+12
@@ -0,0 +1,12 @@
1+clockColor = rgb (6/16) (11/16) (14/16)
2+
3+hand clr len time =
4+ let t = Math.PI * time / 30 - Math.PI / 2 in
5+ solid clr $ line [(200,200), (200 + len * cos t, 200 + len * sin t)]
6+
7+clock t = collage 400 400 [ filled clockColor $ ngon 12 110 (200, 200)
8+ , hand red 100 t
9+ , hand black 100 (t/60)
10+ , hand black 60 (t/720) ]
11+
12+main = lift clock $ Time.every 1
Examples/elm-yesod/elm_source/index.elmnew file+36
@@ -0,0 +1,36 @@
1+title w = size w 60 . box 4 . text . header . toText $ "Elm-Yesod"
2+
3+lightGrey = rgb (240/255) (241/255) (244/255)
4+mediumGrey = rgb (216/255) (221/255) (225/255)
5+heading outer inner =
6+ color mediumGrey . size outer 61 . box 1 .
7+ color lightGrey . size outer 60 . box 5 .
8+ size inner 60 . box 5 $ title inner
9+
10+skeleton body outer =
11+ let inner = if outer < 820 then outer - 20 else 800 in
12+ flow down [ heading outer inner
13+ , body outer inner
14+ ]
15+
16+----------------------
17+
18+section = text . bold . Text.height (5/4) . toText
19+
20+info w = List.map (\f -> f ()) . List.intersperse (\x -> plainText "&nbsp;") . List.map ((\e x -> e) . width w) $
21+ [ section "Written in Elm, served with Yesod"
22+ , text $ toText "This page is written in " ++ link "http://elm-lang.org/" (toText "Elm") ++
23+ toText " and served using the " ++
24+ link "http://yesodweb.com/" (toText "Yesod Web Framework") ++
25+ toText ". Since you are looking at this page it is safe to assume that you already have the example code. "
26+ , text $ toText "Rendering Yesod's type-safe URLs is not yet possible, but will be implemented as the currently " ++
27+ toText "very simple QuasiQuoter is extended."
28+ , section "More examples:"
29+ , text $ toText "- " ++ link "/mouse" (toText "A simple mouse input example")
30+ , text $ toText "- " ++ link "/clock" (toText "An animated analog clock")
31+ , text $ toText "- " ++ link "/shapes" (toText "Some simple rendered shapes")
32+ ]
33+
34+body outer inner = width outer . box 2 . flow down . (:) (plainText "&nbsp;") $ info inner
35+
36+main = lift (skeleton body) Window.width