/**
 *
 * @provides mjs.layout
 * @requires mjs.core
 */

/**
 * 
 *
 * @class layout
 * @static
 * @access public
 */
mjs.extend('forms', {

	init: function() 
	{
		this.setFocusListeners();
		this.setPlaceholderListeners();
	},
	
	/*
	 * Set focus/blur listeners.
	 *
	 * @author Davy De Pauw
	 * @version 1.1
	 */
	 
	setFocusListeners: function()
	{    
	    // Field focus/blur
	    $('form .field').live('focus', function()
	    {             
	        // Get dd
	        $dd = $(this).closest('dd');
	 
	        // Add focus class to dd
	        $dd.addClass('focus');
	 
	        // Add focus class to dt
	        $dd.prev('dt').addClass('focus');
	                    
	    });
	 
	    $('form .field').live('blur', function()
	    {
	        // Get dd
	        $dd = $(this).closest('dd');
	 
	        // Add focus class to dd
	        $dd.removeClass('focus');
	 
	        // Remove focus class from dt
	        $dd.prev('dt').removeClass('focus');
	        
	    });
	},
	
	/*
	*
	* get placeholder value, make a span, put value in span, position span over input field
	* on click on span: hide and focus on input 
	* on blur input: show  
	*/
	setPlaceholderListeners: function()
    {
        // Check whether placeholder is natively supported
        if (!Modernizr.input.placeholder) {
           
            // Iterate each input containing the placeholder attribute                
            $(':input[placeholder]').each(function(i) {
                
                // Input field
                $this = $(this);
             
                // input field value
                //var startVal = '';
                //$this.val(startVal);
                
                // if no value to start with
                if ( !$this.val() ) {
					                  
                	// Text contained in placeholder attribute                
                	var placeholderText = $this.attr('placeholder');
                
					// Placeholder text in span
					var $placeholderIE = '<span class="placeholder">' + placeholderText + '</span>';

                    // place on top of input
                    $this.closest('dd').append($placeholderIE);
                   
                   	var $placeholderIE = $this.closest('dd').find('.placeholder');
                   
                   	// Click placeholder,
                   	// hide it and focus on input
                   	$placeholderIE.click(function() {
	               		$(this).hide();
	               		$placeholderIE.closest('dd').find('input').focus();
	               		$placeholderIE.closest('dd').find('textarea').focus();
                   	});
                                        
                    // Focus listener
                    // hide placeholder
                    $this.focus(function(e) {
                  		$placeholderIE.hide();
                    });
                    
                    //put placeholder back on blur input, if input val is empty
                    
                    $this.blur(function(e) {
                    
                    	if ( $(this).val() == '' ) {
                    		//changeVal = false;
                    		$placeholderIE.show();
                    	}
                    });
                    
                }
                
            });
        }
    }
});