﻿window.addEvent('domready', function(){

        var mySlide = new Fx.Slide('divSearchExpand');
 
        //First hide everything (comes down as expanded in order
        //that non Js browsers will be able to use..)
        //BUT only do this if the 'StartExpanded' hidden field is set to false or not available
        //(because it might be that the UI actually WANTS the search to start expanded e.g. on search page itself
        if ( $('startExpanded') != null ) 
        {
            if ( $('startExpanded').getProperty('value') != 'true' ) 
            {
                mySlide.hide();
                toggleAttributes($('hlSearchExpand'));
            }
        }
        else
        {   
            //If startExpanded is not even present, then hide the search control (default behaviour)
            mySlide.hide();
            toggleAttributes($('hlSearchExpand'));
        }
 
        //Now add events so that js enabled browser can show and hide to heart's content!
        $('hlSearchExpand').addEvent('click', function(e){
            toggle($('hlSearchExpand'), e, mySlide, 'slide');
        });
        
        $('hlSearchTitleExpand').addEvent('click', function(e){
            toggle($('hlSearchExpand'), e, mySlide, 'slide');
        }); 
        
});

function toggle (imgLink, e, mySlide, mode) {

    if ( imgLink.getProperty('class') == 'expand' ) 
    {
        //then is currently collapsed, so expand..
        e = new Event(e);
        if ( mode == 'hide' ) 
        {
            mySlide.hide();
        }
        else 
        {
            mySlide.slideIn();
        }
        e.stop();
        imgLink.setProperty('class', 'collapse');
    }
    else 
    {
        //otherwise collapse
        e = new Event(e);
        if ( mode == 'hide' ) 
        {
            mySlide.hide();
        }
        else 
        {
            mySlide.slideOut();
        }
        e.stop();
        imgLink.setProperty('class', 'expand');
    }            
}

function toggleAttributes (link)
{
    if ( link.getProperty('class') == 'expand' ) 
    {
        //then is currently collapsed, so expand.. (set class to collapse)
	    link.setProperty('class', 'collapse');
    }   
    else 
    {
        //otherwise collapse (set class to expand)
	    link.setProperty('class', 'expand');
    }
}
