GHCJS Examples
Hello World example, uses the bare minimum of functions from
ghcjs-dom
to get text into the browser window.
Only slightly more elaborate than =hello=, sets a large chunk of static HTML, and then selects several elements by id.
Use hamlet
and blaze-html
to create the inner HTML content.
Use ghcjs-dom
to read from an input field and echo the value to a paragraph..
Like echo, but register a callback on a button, and only update the paragraph when the button is pressed. This is the simplest example with a callback.
A countdown timer using an MVar
event queue to tie the knot. Callbacks on DOM elements add events to the queue. A single Haskell thread pops events from the queue and updates the (global) state. A render
function is called in a loop by requestAnimationFrame
and updates the DOM based on the global state. This is the simplest example with an event queue.
Uses diagrams-ghcjs and ghcjs-canvas to render to a Canvas element. Also uses ghcjs-jqueryto setup the initial DOM. There's probably a better way without jquery, however.
Uses ghcjs-canvas to render a bouncing ball.
Uses diagrams-ghcjs to render a bouncing ball.
Uses diagrams-reflex to render a circle, and respond to clicks on the circle. The counter should update only when the circle is clicked, not when other parts of the SVG are clicked.
Uses diagrams-reflex to render a circle at the current mouse position. Uses the mouse position event streams associated with each Diagram by diagrams-reflex
.