yogsototh/elm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'master' of https://github.com/evancz/Elm

Browse source
This commit is contained in:
evancz 2012-06-02 15:45:45 -05:00
commit fa502cd620
5 changed files with 56 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
Examples/elm-yesod/Main.hs
View file

@ -17,7 +17,7 @@ clockPage = $(elmFile "elm_source/clock.elm")
shapesPage = [elm|
square = rect 200 200 (150,150)
circle = oval 140 140 (150,150)
pentagon = ngon 5 60 (150,150)
pentagon = ngon 5 60 (150,150) --@
main = collage 300 300
[ outlined black square
@ -34,48 +34,48 @@ mkYesod "ElmTest" [parseRoutes|
/shapes ShapesR GET
|]
-- elmWidget takes some elm source code and returns the finished elm widget
-- inside the GHandler monad. URL interpolation is done automatically, all
-- interpolated variables have to be in scope when the elmWidget call happens.
-- Your App data type needs to have an instance of YesodElm (see line 75&76)
-- so that toWidget can work with QuasiQuoted elm code. All URL interpolation
-- is done automatically. (e.g. lines 28-30 in elm_source/index.elm)
getMouseR :: Handler RepHtml
getMouseR = do
widget <- elmWidget mousePage
defaultLayout $ do
getMouseR =
defaultLayout $ do
setTitle "Mouse position demo"
widget
toWidget mousePage
getClockR :: Handler RepHtml
getClockR = do
widget <- elmWidget clockPage
getClockR =
defaultLayout $ do
setTitle "A clock"
widget
toWidget clockPage
getShapesR :: Handler RepHtml
getShapesR = do
widget <- elmWidget shapesPage
getShapesR =
defaultLayout $ do
setTitle "Simple shapes"
widget
toWidget shapesPage
getRootR :: Handler RepHtml
getRootR = do
widget <- elmWidget $(elmFile "elm_source/index.elm")
getRootR =
defaultLayout $ do
setTitle "Welcome!"
widget
toWidget $(elmFile "elm_source/index.elm")
-- Our Yesod instance contains the default layout, which inserts the elm-min.js
-- file in the site's <head> tag.
-- file in the site's <head> tag. The YesodElm instance defines the location of
-- elm-min.js
instance Yesod ElmTest where
jsLoader _ = BottomOfHeadBlocking
defaultLayout widget = do
mmsg <- getMessage
pc <- widgetToPageContent $ do
addScriptRemote $ "http://f.cl.ly/items/2e3Z3r3v29263U393c3x/elm-min.js"
$(whamletFile "templates/default-layout.hamlet")
hamletToRepHtml $(hamletFile "templates/default-layout-wrapper.hamlet")
instance YesodElm ElmTest where
urlElmJs _ = Right $ "http://f.cl.ly/items/2e3Z3r3v29263U393c3x/elm-min.js"
main :: IO ()
main = warpDebug 3000 ElmTest

33
README.md
View file

@ -3,8 +3,11 @@ Elm
This is the Elm compiler and server, allowing you to develop Elm applications that run in any modern browser.
Installation Process
--------------------
If you intend to serve Elm code with a Haskell backend, be sure to read all the way to the "Installation for Haskell-Users" section.
Installation for General Use
----------------------------
Download the [Haskell Platform](http://hackage.haskell.org/platform/). This will give you access to the Haskell compiler (needed to build Elm) and Haskell's package distribution system (to make installation of Elm easier). Once installed (even if it already was), you must update your listing of Haskell packages with:
@ -12,7 +15,7 @@ Download the [Haskell Platform](http://hackage.haskell.org/platform/). This will
This will ensure that the elm package is available. Then install Elm with:
cabal install elm
cabal install elm-server
Assuming everything goes correctly (potential problems are discussed later), this will build two executables on your machine:
@ -30,11 +33,29 @@ That is almost everything. Now, we will create a simple Elm project. The followi
echo main = lift asText Mouse.position > main.elm
elm-server
The first two commands create a new directory and navigate into it. Then next command (`wget`) downloads the [elm-mini.js](https://raw.github.com/evancz/Elm/master/elm-mini.js) file which is the Elm runtime system and must be in the root directory of your Elm project. If you do not have wget, just follow [this link](https://raw.github.com/evancz/Elm/master/elm-mini.js) and download it directly. The `echo` command places a simple program into `main.elm`. The final command starts the Elm server at [localhost](http://localhost:8000/), allowing you to navigate to `main.elm` and see your first program in action.
The first two commands create a new directory and navigate into it. Then next command (`wget`) downloads the [elm-mini.js](https://raw.github.com/evancz/Elm/master/elm-mini.js) file which is the Elm runtime system and must be in the root directory of your Elm project. If you do not have wget, just follow [this link](https://raw.github.com/evancz/Elm/master/elm-mini.js) and download it directly. The `echo` command places a simple program into `main.elm` (do this manually if you do not have `echo`). The final command starts the Elm server at [localhost](http://localhost:8000/), allowing you to navigate to `main.elm` and see your first program in action.
Potential problems and their solutions:
---------------------------------------
Installation for Haskell-users
------------------------------
Elm as described in the previous section is actually split into two packages: `elm` which contains the guts of the compiler and `elm-server` which provides a simple HAppStack-based server to simplify development. Those of you planning to write your own server in Haskell only need the `elm` package:
cabal install elm
The `elm` package provides support for [compilation of Elm code directly in Haskell](http://hackage.haskell.org/packages/archive/Elm/0.1.2/doc/html/Language-Elm.html) and [QuasiQuoting](http://hackage.haskell.org/packages/archive/Elm/0.1.2/doc/html/Language-Elm-Quasi.html). See the [Examples/](https://github.com/evancz/Elm/tree/master/Examples) directory for information and examples on how to get started with Elm+Haskell.
Yesod users should also install the `elm-yesod` package which provides functions for idiomatically embedding Elm in Yesod:
cabal install elm-yesod
Potential problems and their solutions
--------------------------------------
* Try `cabal install elm`. This will give you access to the `elm` executable (but not `elm-server`).
These problems all appeared before Elm version 0.1.1.4:
* Install errors having to do with `happstack-server-7.0.2`. This version of `happstack-server` has stricter dependency restrictions that conflict with other libraries required by Elm. Try installing with an earlier version of `happstack-server` with the following command: `cabal install elm --constrain="happstack-server<7.0.2"`
* When installing on Debian, `blaze-html-0.4.3.2` fails to compile. You must install `blaze-html-0.4.3.1` instead.

4
elm/Elm.cabal
View file

@ -1,6 +1,6 @@
Name: Elm
Version: 0.1.2
Version: 0.1.2.1
Synopsis: The Elm language module.
Description: Elm aims to make client-side web-development more pleasant.
It is a statically/strongly typed, functional reactive
@ -31,7 +31,7 @@ source-repository head
Library
exposed-modules: Language.Elm,
Language.Elm.Quasi
ghc-options: -O2 -Wall
ghc-options: -O2
Hs-Source-Dirs: src, src/Parse, src/Types
other-modules: Ast,
CompileToJS,

9
elm/src/GenerateHtml.hs
View file

@ -1,5 +1,5 @@
{-# LANGUAGE OverloadedStrings #-}
module GenerateHtml (generateHtml, body, css) where
module GenerateHtml (generateHtml, body, css, widgetBody) where
import Text.Blaze (preEscapedToMarkup)
import Text.Blaze.Html (Html)
@ -51,4 +51,9 @@ body noscript = do
H.div ! A.id "widthChecker" ! A.style "width:100%; height:1px; position:absolute; top:-1px;" $ ""
H.span ! A.id "content" $ ""
H.script ! A.type_ "text/javascript" $ "Dispatcher.initialize()"
H.noscript $ preEscapedToMarkup noscript
H.noscript $ preEscapedToMarkup noscript
widgetBody noscript = do
H.div ! A.id "widthChecker" ! A.style "width:100%; height:1px; position:absolute; top:-1px;" $ ""
H.span ! A.id "content" $ ""
H.noscript $ preEscapedToMarkup noscript

2
elm/src/Language/Elm.hs
View file

@ -71,4 +71,4 @@ toPartsHelper :: String -> (Html, Html, String)
toPartsHelper source = (html, css, js)
where expr = initialize source
js = compileToJS expr
html = body $ either id extract expr
html = widgetBody $ either id extract expr