var content  = ''
var showFunction = function() {
	$$('.cottagedetails').setStyle('display', 'none'); 
	this.setStyle('display', 'block');
}
var stateFunction = function() {
	$$('.cottageswitch a').setStyle('color', '#ffffff'); 
	$$('.cottageswitch a').setStyle('backgroundImage', 'url(img/menu_normal.png)');
	this.setStyle('color', '#DFD7C3');
	this.setStyle('backgroundImage', 'url(img/menu_bg.png)');
}

var tableshowFunction = function() {
if ($('tableA').getStyle('display')  == 'none' ) {

	$('tableA').setStyle('display', 'block');
	$('tableB').setStyle('display', 'none');
	} else {
	$('tableB').setStyle('display', 'block');
	$('tableA').setStyle('display', 'none');	
	}
	
}
var tablestateFunction = function() {

	if (this.getStyle('backgroundImage') == 'url(img/buttons/cottageavailability_btn.png)'  || this.getStyle('backgroundImage') == 'url(../img/buttons/cottageavailability_btn.png)'   || this.getStyle('backgroundImage') == '' ) {

	this.setStyle('backgroundImage', 'url(img/buttons/cottageavailability_btn_alt.png)');
	} else {
	this.setStyle('backgroundImage', 'url(img/buttons/cottageavailability_btn.png)');
	}
}

window.GET = function(){
    var array = window.location.search.substring(1).split(/&;/);
        /* URLs can be like either
        "sample.html?test1=hi&test2=bye" or
        "sample.html?test1=hi;test2=bye" */
    window._GET = {};
    for(var i = 0; i < array.length; i++){
        var assign = array[i].indexOf('=');
        if(assign == -1){
            _GET[array[i]] = true;//if no value, treat as boolean
        }else{
            _GET[array[i].substring(0, assign)] = array[i].substring(assign + 1);
        }
    }
}


window.addEvent('domready', function() {
window.GET();
	$$('div.cottageswitch a').set('href', '#contentstart');
window.GET ();
	var ButtonOne = $('switchA');
	var ButtonTwo = $('switchB');
	var ButtonThree = $('switchC');
	var ButtonFour = $('switchD');
	var ContentOne = $('contentA');
	var ContentTwo = $('contentB');
	var ContentThree = $('contentC');
	var ContentFour = $('contentD');
	
	var Table1 = $('tableA');
	var Table2 = $('tableB');
	var TableBtn1 = $('avaiabilitybtn');
		
	$('avaiabilitybtn').addEvent('click', tableshowFunction.bind());
	$('avaiabilitybtn').addEvent('click', tablestateFunction.bind(TableBtn1));
	
	
 	$('switchA').addEvent('click', showFunction.bind(ContentOne));
 	$('switchA').addEvent('click', stateFunction.bind(ButtonOne));
	$('switchB').addEvent('click', showFunction.bind(ContentTwo));
	$('switchB').addEvent('click', stateFunction.bind(ButtonTwo));
	 $('switchC').addEvent('click', showFunction.bind(ContentThree));
 	$('switchC').addEvent('click', stateFunction.bind(ButtonThree));
	$('switchD').addEvent('click', showFunction.bind(ContentFour));
	$('switchD').addEvent('click', stateFunction.bind(ButtonFour));
	$('avaiabilitybtn').setStyle('backgroundImage', 'url(img/buttons/cottageavailability_btn.png)');
	


	
	
	ContentTwo.setStyle('display', 'none');
	ContentThree.setStyle('display', 'none');
	ContentFour.setStyle('display', 'none');
	ButtonOne.setStyle('color', '#DFD7C3');
	ButtonOne.setStyle('backgroundImage', 'url(img/menu_bg.png)');
	Table2.setStyle('display', 'none');

	
	//if the content needs to be switch do this
if (_GET['content'] == 'D') {
		ContentOne.setStyle('display', 'none');
	ContentTwo.setStyle('display', 'none');
	ContentThree.setStyle('display', 'none');
	ContentFour.setStyle('display', 'block');
	ButtonFour.setStyle('color', '#DFD7C3');
	ButtonFour.setStyle('backgroundImage', 'url(img/menu_bg.png)');
	ButtonOne.setStyle('color', '#ffffff');
	ButtonOne.setStyle('backgroundImage', 'url(img/menu_normal.png)');
	
}

	
	$$('.cottagedetails').setStyle('border', 'none'); 
	$$('.cottagedetails').setStyle('marginBottom', '0px'); 
	$('avaiabilitybtn').setStyle('display', 'block');
});
