/*
 * contact.js
 * version 1.1
 * - minor enhancements for browser issues
 * Tom McFarlin / October 2007
 *
 * revision history
 * - version 1.0
 *   initial release. july / 2007
 *
 * This script manages event handlers for the contact form
 * on the Storefront Systems, Inc. website.
 */
 
 
 /* A reference to the outer function */
 var This = this;
 
 Event.observe(window, 'load', function(evt) {

    /* setup the field validator for the email address */
    var validator = new Validation('email-form'); 

    /* setup button handlers for submit and cancel */
    This._setupButtonHandler('submit', validator);
    This._setupButtonHandler('cancel', validator);

    // get a reference to the input fields of the email form
    var inputs = $('email-form').getElementsBySelector('input', 'textarea');

    // setup event handlers and styling
    inputs.each(function(elem) {
    
        // go to the next element if its not an input
        if(elem.id == '')
            return;

        /* focus event listener */
        Event.observe(elem, 'focus', function(evt) {
            
            $(elem).setStyle({
                background: 'rgb(245, 245, 245)'
            });
            
        });
        
        /* blur event listener */
        Event.observe(elem, 'blur', function(evt) {
                
            $(elem).setStyle({
                background: 'rgb(255, 255, 255)'
            });
                
        });
        
    }); // end element iterator
    
    // focus on the first input field
    $('name').focus();
 
 }); // end window load observer

 /**
  * Attachs event handlers to the specified elem. Also attaches appropriate
  * listeners based on "Submit" or "Cancel."
  *
  * @param elem The element on which to attach the event handlers.
  * @param validator The validator used to validate input fields before
  *                  submission.
  *
  */
 function _setupButtonHandler(elem, validator) {

    /* mousedown listener */
    Event.observe(elem, 'mousedown', function(evt) {
            
      $(elem).setStyle({
        border: '1px inset rgb(200, 200, 200)'
      });
                
    }); // end mousedown listener 

    /* mouseup listener */
    Event.observe(elem, 'mouseup', function(evt) {
            
        $(elem).setStyle({
            border: '1px outset rgb(200, 200, 200)'
        });
                
    }); // end mouseup listener 

    /* reset the form if cancel is clicked, else validate and send email */
    if(elem == 'cancel') {
            
        Event.observe(elem, 'click', function(evt) {
            $('email-form').reset();
            $('name').focus();
        });
            
    } else {
            
        Event.observe(elem, 'click', function(evt) {

            var isConfirmed = confirm('Please confirm that you wish to send this email message.');
            if(isConfirmed) {
			
		        if(validator.validate()) {
	                $('email-form').submit();
			    } else {
			        alert('Please fill out all of the form elements before submitting the email.');
			    } // end if

            } // end if

        });
            
    } // end if/else

 } // end setupButtonEventHandler