/*
 * Pure jQuery Style Switcher (http://www.userfirstinteractive.com/)
 * @author Scott D. Brooks 
 * @created by UserFirst Interactive (creations@userfirstinteractive.com)
 * 
 */

	function setStyle(myStyle) { 	
		if (myStyle == "blue"){
			$('#created-by').attr("src","images/a-userfirst-website-red.jpg"); 
			$("body a").css("color", "#983220");			
			$("pre").css("border", "2px dashed #983220");
			$("pre").css("border-left", "20px solid #983220");
		}
		else{  // blue
			$('#created-by').attr("src","images/a-userfirst-website-blue.jpg"); 
			$("body a").css("color", "#607e99");
			$("pre").css("border", "2px dashed #607e99");
			$("pre").css("border-left", "20px solid #607e99");
		}
	}

	function setCookie(choosenStyle) {  
		// javascript set
		$.cookie('style', null); 			// clear cookie
		$.cookie('style', choosenStyle); 	// set cookie		
	}		

	
	$(document).ready(function() {
	// stylesheet setup
	var headID = document.getElementsByTagName("head")[0];		   
	var cssNode = document.createElement('link');
	cssNode.type = 'text/css';
	cssNode.rel = 'stylesheet';
	
	var style_color = $.cookie('style');
	if (style_color != undefined) {
		cssNode.href = style_color + '.css';
	} else {
		cssNode.href = 'yello.css';
		style_color = "yello";
	}			
	cssNode.media = 'screen';
	headID.appendChild(cssNode);
	// set style for the image src.  Not required unless you are setting an image dynamically, like we do here.
	//setStyle(style_color);
	
	// click actions
	$("#switchToBlueAnchor").click(function()
	{
    	setStyle("blue");
    	setCookie("blue");
	});

	$("#switchToOrangeAnchor").click(function()
	{
    	setStyle("orange");
		setCookie("orange");
	});
	$("#switchToGreenAnchor").click(function()
	{
    	setStyle("green");
		setCookie("green");
	});
	$("#switchToYelloAnchor").click(function()
	{
    	setStyle("yello");
		setCookie("yello");
	});

});
