10.1 Functions used on the top level of programs

As we have seen in the examples in Chapter 9, a fudget program consists of a number of fudgets, combined in a hierarchical structure that makes up one main fudget of type F a b, for some types a and b. The main program in Haskell should have type IO (), so we need a glue function to be able to plug in the main fudget. The function fudlogue is provided for this purpose:

fudlogue :: F a b -> IO ()

The main program of a fudget program usually consists just of a call to fudlogue with an argument fudget. like

main :: IO ()
main = fudlogue the_main_fudget

However, it is possible to combine fudlogue with other monadic I/O operations. For example, to create a program that starts by reading some configuration file, you could write

main = do config <- readFile config_filename
          fudlogue (main_fudget config)

Programs with graphical user interfaces need at least one shell (top-level) window. These are created with the function shellF:

shellF :: String -> F a b -> F a b

The typical GUI program has only one shell window, and the main program thus looks something like

main = fudlogue (shellF window_title main_gui_fudget)

A program with more than one shell window could for example look something like

main = fudlogue (shellF title1 fud1 >==< shellF title2 fud2)

The fudget shellF is not restricted to the top level. You could write the above example as

main = fudlogue (shellF title1 (fud1 >==< shellF title2 fud2))

and achieve the same result.

10.2 Displaying values

We have already seen labelF, which displays static labels, and intDispF, which displays numbers that can change dynamically. There is also displayF,

displayF :: (Graphic a) => F a b

a more general display for dynamically changing values. It can display values of any type in the Graphic class. It could in fact also display numbers, but intDispF has the advantage that the numbers are displayed right adjusted.

10.3 Buttons

We have already seen buttonF,

buttonF :: (Graphic a) => a -> F Click Click

in the examples above. It provides command buttons, i.e., buttons trigger some action when pressed. The Fudget library also provides toggle buttons and radio groups (Figure 10). Pressing these buttons causes a change that has a lasting visual effect (and probably also some other lasting effect). A toggle button changes between two states (on and off) each time you press it. A radio group allows you to activate one of several mutually exclusive alternatives. The types of these fudgets are

toggleButtonF :: (Graphic a) => a -> F Bool Bool
radioGroupF :: (Graphic b, Eq a) => [(a, b)] -> a -> F a a

The input messages can be used to change the setting under program control.

toggleButtonF "Run" radioGroupF [(1,"P1"),(2,"P2"),(3,"P3"),(0,"Off")] 0

Figure 10. Toggle buttons and radio groups.

10.4 Menus and scrollable lists

Menus serve much the same purpose as buttons, but they save screen space by appearing only when activated. The fudget menuF name alts, where

menuF :: (Graphic a, Graphic c) => a -> [(b, c)] -> F b b

provides pull-down menus. name is the constantly visible name you press to activate the menu and alts is the list of menu alternatives.

The fudget

popupMenuF :: (Graphic b, Eq b) => 
       [(a, b)] -> (F c d) -> F (Either [(a, b)] c) (Either a d)

provides pop-up menus, i.e., menus that are activated when a certain mouse button (the third by default) is pressed over some screen area. The fudget popupMenuF initial_menu fud creates a fudget which behaves like the fudget fud with the addition that the menu initial_menu pops up when the user presses the third menu button. You communicate with the fudget as with a tagged parallel composition of the menu and the fudget fud. Messages to/from the menu are tagged Left and messages to/from fud are tagged Right. You can replace the initial_menu by sending Left new_menu to the fudget.

As an example, suppose we wanted a compact version of the counter in Section 9.6. We could then replace the three buttons with a pop-up menu attached to the display. The source code for this and the resulting user interface is shown Figure 11. We have used the combinator serCompLeftToRightF, which turns a parallel composition into a serial composition (see Section 13.1).

import Fudgets main = fudlogue (shellF "Compact Up/Down/Reset Counter" counterF) counterF = serCompLeftToRightF (popupMenuF menu (intDispF >==< mapstateF count 0)) data Buttons = Up | Down | Reset deriving Eq menu = [(Up, "Up"), (Down, "Down"), (Reset, "Reset")] count n Up = (n+1, [n+1]) count n Down = (n-1, [n-1]) count n Reset = (0, [0])

Figure 11. A compact version of the up/down/reset counter presented in Section 9.6.

Figure 12. pickListF

Figure 13. stringInputF

When the number of alternatives is large, or when they change dynamically, you can use a scrollable list instead of a menu. The function

pickListF :: (a -> String) -> F (PickListRequest a) 
                                (InputMsg (Int, a))

(shown in Figure 12) takes a show function and returns a fudget that displays lists of alternatives received on the high-level input. When an alternative is selected, by clicking on it, it will appear in the output stream. Actually, the output from pickListF is of type InputMsg, which is explained in Section 10.5.1 below.

The values in the input stream are of type PickListRequest to allow the list of alternatives to be modified in various ways. To replace the entire list, you can use

replaceAll :: [a] -> PickListRequest a

but there are other functions that let you insert new alternatives at some position in the list,

insertText :: Int -> [a] -> PickListRequest a

or, more generally, replace part of the list with new alternatives,

replaceText :: Int -> Int -> [a] -> PickListRequest a

and so on. The screen will be updated in an efficient way when you do modifications of this kind.

10.5 Entering values

Choosing an alternative from a list is usually easier than typing something, e.g., the name of a colour, on the keyboard. But when there is no predefined set of alternatives, you can use fudgets that allow the user to enter values from the keyboard. The library provides

stringInputF :: F String String
intInputF :: F Int Int

for entering strings and integers (see Figure 13). For entering other types of values, you can use stringInputF and attach the appropriate printer and parser functions.

10.6 Displaying and editing text

The library provides the fudgets

moreF :: F [String] (InputMsg (Int, String))
moreFileF :: F String (InputMsg (Int, String))
moreFileShellF :: F String (InputMsg (Int, String))

which can display longer text.(Footnote: The names come from the fact that they serve the same purpose as the UNIX program more.) The input to moreF is a list of lines of text to be displayed. The other two fudgets display the contents of file names received on the input. In addition, moreFileShellF appears in its own shell window with a title reflecting the name of the file being displayed.

There also is a text editor fudget (Figure 14),

Figure 14. The text editor fudget editorF.

which supports cut/paste editing with the mouse, as well as a small subset of the keystrokes used in GNU emacs. It also has an undo/redo mechanism.

10.7 Scroll bars

GUI elements that can potentially become very large, like pickListF, moreF and editorF, have scroll bars attached by default. There are also combinators to explicitly add scroll bars:

scrollF, vScrollF, hScrollF :: F a b -> F a b

The v and h versions give only vertical and horizontal scroll bars, respectively. The argument fudget can be any combination of GUI elements.