// in jQuery, anything inside document.ready is ready to be executed as soon as the page is loaded
// we put functions outside document.ready
$(document).ready(function(){
						   
	// set a variable to hold the value of the cookie named 'style'
	var cookie = $.cookie('style');	
	// see if it has been created on a previous visit, if so set the active style sheet
	if (cookie) setActiveStylesheet(cookie);

	// if the image with the id 'high_contrast' is clicked, call the switch_styles function, sending across the appropriate parameter
	$('#high_contrast').click(function() {
		switch_styles("high_contrast");
	});	
	//ditto text_only
	$('#text_only').click(function() {
		switch_styles("text_only");
	});	
	// ditto reset
	$('#reset').click(function() {
		switch_styles("full");
	});	
}); //END document.ready

function setActiveStylesheet(cookie) {
	/* the alerts are useful for debugging */
	//alert(cookie);
	
	// loop through all <link href="" /> etc - there are 3 to loop for in the Brigstowe page
	$('link[rel*=style]').each(function(i) {
	if (this.getAttribute('title') == cookie) {
		// any that have a "title" attribute matching the name of the saved cookie, *don't* disable them
		this.disabled = false;
	}
	else {
		// but all others - disable them
		this.disabled = true;
	}
	});
}
	
function switch_styles(switch_to) {
	
	//alert('switching to ' + switch_to);
	
	//enable/disable stylesheets. Same as above but instead disable them all immediately the un-disable (i.e. enable!) the matching style sheet
	$('link[rel*=style]').each(function(i) {
		this.disabled=true;								 
		if (this.getAttribute('title') == switch_to) {
			this.disabled = false;
		}

	});

	//set cookie using jQuery's quick syntax
	
	//first, erase any existing cookies called 'style'
	$.cookie('style', '', { expires: -1 });
	// now create one called 'style' with a value of either 'text_only', 'high_contrast' or 'full' which will expire in 7 days
	$.cookie('style', switch_to, { expires: 7 });
	
}