F hi ho is the type of a fudget that consumes an high-level input stream of values of type hi and produces an high-level output stream of values of type ho. It can also generate a number of user interface elements, and can read input from and send output to those user interface elements.

runF is typically used only once in the main function of a program. It runs the fudget and adds any user interface elements it generates to the documentBody of the web page.

Creates a button, like <input type="button" value="label">. It outputs BtnClick when pressed. (BtnClick received on the input is propagated directly to the output, allowing button clicks to be simulated programmatically.)

Creates a button with another fudget inside (which should be something simple, e.g. an imgF or a stringDisplayF...), <button>...</button>.

A checkboxF with a label

A checkbox, <input type=checkbox>. (Slightly buggy at the moment: sending in False does not unckeck the checkbox.)

A menu of options, <select><option>...</option>...</select>

An output-only element displaying text, <span>...</span>

stringDisplayF combined with show

stringF combined with show and read

readShowF restricted to numbers, <input type="number">

A string input/output field, <input type="text">

A string input/output field that shows **** instead of the actual input, <input type="password">

Creates a canvas of given width and height. Use the Picture type from Haste.Graphics.Canvas to draw things. The canvas outputs MouseUp events (becase MouseUp seems to work for both the left and the right mouse button, while Click only works for the left mouse button).

An image, <img src="url" alt=""> You can change the image dynamically by sending in the URL of another image.

An image with extra attributes, <img src="url" ...>. You can change the image dynamically by sending in the URL of another image.

Plain text

Text with HTML markup

A hyperlink <a href="url">...</a>

Level 1 header <h1>...</h1>

Level 2 header <h2>...</h2>

Level 3 header <h3>...</h3>

Paragraph <p>...</p>

A table with n columns

A div element <div>...</div>

A div element with a black border and some padding

Unordered list <ul>...</ul>

List item <li>...</li>

A pre element <pre>...</pre>

Apply attributes to the elements generated by a fudget

Tagged parallel composition. Messages to/from the left fudget are tagged Left. Messages to/from the right fudget are tagged Right.

Parallel composition where only the left fudget is connected. The right fudget is typically static content.

Parallel composition where only the right fudget is connected. The left fudget is typically static content.

Tagged parallel composition of a list of fudgets

Right-to-left serial composition. The output stream of the right fudget is connected to the input stream of the left fudget. This was originally called >==< in Fudgets.

Left-to-right serial composition. The output stream of the left fudget is connected to the input stream of the right fudget. (This was not included in the original implementation of Fudgets. Using both =>= and =<= in the same expression might lead to confusion...)

Creates a feedback loop. loopLeftF fud behaves as follows: output from fud tagged Left will be sent back to the input of fud. Output from fud tagged Right will be sent to the output of loopLeftF fud. Input to loopLeftF fud will be tagged Right and delivered to fud.

loopThroughRightF master slave is similar to loopLeftF master, but the loop goes through the slave fudget. (A better name might be encapsulateF since all communication with the slave has to go via the master, so the slave is encapsulated in this sense.)

Like map for lists. mapF f outputs f x for every x in the input stream

Like filter for lists. Propagates values from the input stream to the output stream if they pass a test.

Like mapMaybe for lists. A combination of mapF and filterF.

Like concatMap for lists. A combination of concatF and mapF.

stateF is used to maintain an internal state. Given a state transition function f and an initial state s, stateF f s responds to input by applying f to it to update the internal state and generate an output.

mapF id, propagates all input directly to the output

putF x fud outputs x, then behaves like fud

Ignores all input. Doesn't produce any output.

Like concat for lists, flattens a stream of lists.

timerF outputs Tick after a specified delay or at regular intervals. The timer starts when it receives Just interval on its input. The timer stops when it receives Nothing in its input.

Add a link to a style sheet to the document head, <link rel="stylesheet" type="text/css" href="url">