Last active
May 17, 2016 11:23
-
-
Save ggb/07daa01fe1e1c64ab7b8 to your computer and use it in GitHub Desktop.
A minimal example of the usage of ports (aka JS-interop) in Elm, featuring incoming and outgoing ports.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<script type="text/javascript" src="elm.js"></script> | |
</head> | |
<body> | |
</body> | |
<script> | |
var component = Elm.fullscreen(Elm.PortsExample, { newData: 0 }); | |
component.ports.outgoing.subscribe(function(val) { | |
console.log("Elm sagt: ", val); | |
}); | |
var newValue = function(val) { | |
component.ports.newData.send(val); | |
} | |
</script> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
module PortsExample where | |
import Graphics.Element exposing (show) | |
type alias MyModel = ( Int, List Int ) | |
initialModel : MyModel | |
initialModel = ( 0, [] ) | |
port newData : Signal Int | |
port outgoing : Signal Int | |
port outgoing = Signal.map fst update | |
updateHelper data (current, store) = | |
(data * data, current :: store) | |
update = Signal.foldp updateHelper initialModel newData | |
main = Signal.map show update |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This is an example that uses Elm v0.16 syntax and works with old-style ports.