## Purpose

To create nice buttons for effective user interfaces. Buttons can be of various types as follows:

rollover
  the button "illuminates" when a mouse rolls over it.
toggle
  the button stays down when it is clicked and must be clicked again to clear it. Toggles can have separate up and down state actions and tooltips.
grayable
  the button can be grayed out.

Buttons can be created with any combination of these properties. Their properties may not be changed once they are created.

The author must provide gifs for each possible button state. The possible button states depend upon the properties chosen as shown in Table 1. gifs must be labelled as shown in the table and must be stored in the `site_resources/images` directory.

xx simply refers to the Base gif. For example, the TeachingMachine run button has the base gif `"runButton"`. Since the TeachingMachine run button is a non-grayable, non-toggle, rollover button the required button gifs would be `"runButtonNormal.gif"`, `"runButtonDown.gif"` and `"runButtonOver.gif"`.

isRollover | isToggle | isGrayable | States | gifs needed
false | false | false | 2 | xxNormal xxDown
false | false | true | 3 | xxNormal xxDown xxGray
false | true | false | 2 | xxNormal xxDown
false | true | true | 4 | xxNormal xxDown xxGray xxGrayDown
true | false | false | 3 | xxNormal xxDown xxOver
true | false | true | 4 | xxNormal xxDown xxOver xxGray
true | true | false | 4 | xxNormal xxDown xxOver xxOverDown
true | true | true | 6 | xxNormal xxDown xxOver xxOverDown xxGray xxGrayDown

Table 1: Buttons states and gifs required by button type.

## Available Functions

createButton(gifBase, isRollover, isToggle, isGrayable, actionString, tooltip, downActionString, downtip)

### Arguments

gifBase
  a string giving a unique base name for the button gifs. Actual gifs must be stored in the `/site_resources/images` directory and must be named `gifBaseNormal.gif`, `gifBaseOver.gif`, etc. according Table 1.
isRollover
  a boolean: `true` makes a button that exhibits rollover behaviour.
isToggle
  a boolean: `true` makes a button that toggles—stays down when it is pressed and must be pressed again to release it.
isGrayable
  a boolean: `true` makes a button that can be grayed out.
actionString
  a string defining the action that will be taken when the mouse goes up. The `onMouseUp` handler.
tooltip
  a string giving a tooltip that will come up when the button is rolled over.
downActionString
  a string defining the action that will be taken when the mouse goes up and the button is in the down state. The `onMouseUp` handler when the button starts in the down position. Only valid for toggle buttons.
downtip
  a string giving a tooltip that will come up when a toggle button in the down position is rolled over. Only valid for toggle buttons.
Return
  a reference to the button that is created is returned

Action

The button is written dynamically into the document at the point of invocation.

grayOut(gray)

### Arguments

gray
  a boolean: `true` grays out the button, false enables it. Only works for buttons that have been created as grayable.

### Comment

This is a member function of class `Button` and so must be invoked with respect to a particular `Button` object.

## Examples

Here is a hard-coded mockup of what `insertCode` creates (only the second last button is functional)

|  | dummy_mockup.cpp

    /*******  Simple Variables Demonstration ********
    To demonstrate on the teaching machine the four
    fundamental attributes of simple C variables
    name, type, value, location

    *******************************************/

    #include
    using namespace std;

    int main(){
        int i = 110;
        char letter;
        bool flag;
        double pi;

        letter = 'n';
        flag = false;
        pi = 3.14159;

        cout << "i = " << i << '\n';
        cout << "flag = " << flag << '\n';
        cout << "letter = " << letter << '\n';
        cout << "pi = " << pi << '\n';
        return 0;
    }