//-----------------------------------------------------------------------------------
// These functions assume that the form on the HTML page is called "theForm".
//
// For each checkbox and radio button field on the page, there should be an
//    <input type="hidden" name="FieldName" value="InitialValue"> tag in the form,
//    where FieldName is replaced by the actual name of the field and InitialValue
//    is replaced by the initial value for the field (for checkboxes, either "on"
//    or "").
//
// On the HTML page, there should be a function that is called when the page loads.
//    This function should call SetInitialCheckbox("FieldName") for each checkbox
//    field on the page and SetInitialRadioBtn("FieldName") for each radio button
//    field on the page, where FieldName is replaced by the actual name of the field.
//
// The image representing a checkbox should be named "imgFieldName", where FieldName
//    is replaced by the actual name of the field.
//
// The image representing a radio button should be named "imgFieldName_OptionValue",
//    where FieldName is replaced by the actual name of the field and OptionValue is
//    replaced by the value for that particular option.
//
// The onClick event for each checkbox image should call CheckBoxChange("FieldName"),
//    where FieldName is replaced by the actual name of the field.
//
// The onClick event for each radio button image should call
//    RadioBtnChange("FieldName", "OptionValue"), where FieldName is replaced by the
//    actual name of the field and OptionValue is replaced by the value for that
//    particular option.
//-----------------------------------------------------------------------------------

// preload images
var imgOn = new Image();
var imgOff = new Image();
imgOn.src = "images/selectboxR.gif"		// set to the actual path of the "checked" image
imgOff.src = "images/selectbox.gif"	// set to the actual path of the "unchecked" image

// called from SetInitialImages to initialize a checkbox
function SetInitialCheckBox(fld) {
	if (document.theForm.elements[fld].value == "on")
		document.images["img" + fld].src = imgOn.src;
	else
		document.images["img" + fld].src = imgOff.src;
}

// called from SetInitialImages to initialize a radio button
function SetInitialRadioBtn(fld) {
	RadioBtnChange(fld, document.theForm.elements[fld].value);
}

// called when a checkbox image is clicked
function CheckBoxChange(fld) {
	if (document.theForm.elements[fld].value == "on") {	// if it's checked, uncheck it
		document.images["img" + fld].src = imgOff.src;
		document.theForm.elements[fld].value = "";
	} else {											// otherwise, check it
		document.images["img" + fld].src = imgOn.src;
		document.theForm.elements[fld].value = "on";
	}
}

// called when a radio button image is clicked or the radio button is initialized
function RadioBtnChange(fld, val) {
	for (var i=0; i < document.images.length; i++) {	// loop through the images
		if (document.images[i].name.substr(3, fld.length) == fld &&
			document.images[i].name.charAt(3 + fld.length) == '_') {
			if (document.images[i].name == "img" + fld + "_" + val)
				document.images[i].src = imgOn.src;		// turn on the one they clicked
			else
				document.images[i].src = imgOff.src;	// turn off the others in the same group
		}
	}
	document.theForm.elements[fld].value = val;			// set the form value
}