# Elm programming language

Elm is a functional programming language for declaratively creating web browser based graphical user interfaces.
Elm uses the Functional Reactive Programming style and purely functional graphical layout to build user interface without any destructive updates.

## Description

The primary implementation of Elm compiles to JavaScript and HTML, with the use of CSS styles.
In Elm, Functional Reactive Programming takes the place of event handlers and callbacks; it also manages all screen updates automatically. Purely functional graphical layout takes the place of working with the DOM. Elm also allows Markdown to be embedded directly.

## Syntax and Semantics

Elm adopts a Haskell styled syntax, with influences from OCaml and FSharp. For example, "has type" is written with a single colon (:), and forward and backward function application use the (<|) and (|>) operators where (f x) equals (f <| x) equals (x |> f).
Elm has extensible records which safely provide much of the flexibility of Javascript's object model.
The type system supports primitive types like integers and floats, structured data like tuples and records, and custom ADT's.
Elm's version of Functional Reactive Programming is event-driven, meaning that updates are only performed as necessary. It shares the closest resemblance to Event-Driven FRP and Arrowized FRP.
The following program displays the position of the mouse as it moves around the screen, automatically updating the screen in real-time. Note: Elm's import corresponds to Haskell's import qualified.
The value of main is displayed on screen. Function Graphics.Element.show turns any value into a displayable textual representation. Mouse.position is a value that changes over time, called a signal. Function Signal.map ensures that show is applied to Mouse.position every time the mouse moves.
Elm has a small but expressive set of language constructs, including if-expressions, let-expressions, case-expressions, anonymous functions, and list interpolation.
Elm also has both a module system and a foreign function interface for JavaScript.
The predefined functions are in the Prelude module.

### Values

Values are immutable:
* Bool, Int, Float.
* Char, String, (styled) Text.
* Time, Date.
* Element (html structural elements).
* graphic representations (called Forms), shapes and paths.
   >> toForm turns any Element into a Form. This lets you use text, gifs, and video in your collage. This means you can move, rotate, and scale an Element however you want.
* Records values.
* Algebraic data types (data clause) values.

### Signals

Signals are value varying items and have types as (Signal value_type).
They include time varying items (also called behaviors) and event driven sources.
Html form input elements, may vary in style and state. Their generator functions mostly return a pair (element signal, status signal) as in

#### Dependent signals

Dependent signals are like formula cells in a spreadsheet. They may react to updates of their operand signals.
The one defined as main starts the scanning of the dependency/reaction directed graph to find the independent signal variables for inclusion in the source event loop.
You define signal formulas by using signal filter functions, or by applying lifted value functions to previously defined signals. To apply a function of N parameters, you have to lift the type of a values function to a signals function, either through the lift<N> function, or by applying lift to the function, followed by signal applicative terms as ((~) signal) for functional parameters application exposed below.
You can use a value in a signal position by lifting its type through the Signal.constant function.

#### From a Haskell perspective
##### Signal as a Haskell's Functor instance

See Functor class def. From Elm's Signal library:

##### Signal as a Haskell's Applicative instance

See Applicative class def. From Elm's Signal library:

### Composable signal transformers. Automatons

This is used to generate signal transformers as a chain.
Individual chain links, with type (Automaton input output) behave like computation (side effect) functions with only one parameter.
To chain two of them the input type of the follower must match the output result type of the precedent.
This concept is borrowed from Haskell's arrows (effects sequencing through chaining of morphisms).
You may apply them to a Signal with the Automaton.run library function, specifying the Automaton and a default result for the case of lack of input value.
From Elm's Automaton library:

### Containers

See ref.
* List, Set, Dict
* Maybe (for optional parameters, and partially defined function results, as Just v or Nothing)
* Either (error aware results, as Right correct_result or Left error)
To process a list of signals as one:

## Tools

* Online editor and tester: elm-lang.org/try
* Learn by example
* Elm libraries
* Predefined functions.
* Offline UNIX installation with Haskell's cabal-dev

## Examples

Imported module members should be used qualified, except if listed at import module (members...) or when import open is used for namespace inclusion.

### Non-varying
#### Styled text

You may try it in the online editor/compiler/executor.

#### Polymorphism on Record types

See records.
* embedding it in a div element
* compile and test offline

#### Parameterizing an Elm script

The port FFI (Foreign function interface with JavaScript) feature gives the opportunity to supply parameters at the html level.

### Signals (varying) examples

* lift: is like Haskell's fmap for Signals
* lift<N> : applies a function of N values to N Signals; it acts like Haskell's Applicative liftA<N>.
* (<~) and (~) are Elm replacements for Haskell's infix Applicative operators (<$>) and (<*>).

#### Tictac varying graphics

Using Graphics.Collage library.

#### Password double field retype checker

With color changing submit button.
Note, as of Elm 0.10 Strings are no longer lists of characters, so the above becomes something more like this:

## References

* 1 2 The Syntax of Elm
* ↑ Elm - Extensible Records
* ↑ Elm - Getting started with Types
* ↑ Wan, Zhanyong; Taha, Walid; Hudak, Paul (2002). "Event-Driven FRP". Proceedings of the 4th International Symposium on Practical Aspects of Declarative Languages: 155–172.
* ↑ Elm - What is Functional Reactive Programming?
* ↑ Attention: This template ({{cite doi}}) is deprecated. To cite the publication identified by doi:10.1145/581690.581695, please use {{cite journal}} with |doi=10.1145/581690.581695 instead.
* 1 2 Elm - The Libraries You Need Automaton as an arrow implementation
* 1 2 Version 0.8 release notes Section "Importing modules"
* ↑ About Elm Elm features
* ↑ Elm - JavaScript Integration
* 1 2 3 4 Elm's Prelude
* ↑ Char library
* ↑ Text library
* ↑ Date library
* ↑ Element library
* 1 2 Collage library
* ↑ Graphics.Input library
* 1 2 3 Signal library
* ↑ Haskell class Functor def.
* ↑ Haskell class Applicative def.
* ↑ Haskell Arrows introduction
* ↑ Automaton library
* ↑ Documentation
* ↑ Syntax - records
* ↑ JavaScript FFI
* ↑ Haskellwiki - Applicative functor
* ↑ Elm v.0.7 release notes Section: "Do you even lift?"

## External links

* Elm official website