$(document).ready(function(){
    $(".website-designer-header2").animate({ backgroundColor: "#d4e19f" }, 3000);

  });

// JavaScript Document
//preload images

window.onload = loadimages;

function loadimages(){
	pic1= new Image(302,40); 
  pic1.src="http://www.designandillustration.co.uk/images/gbutton.gif"; 
  	pic2= new Image(82,28); 
  pic1.src="http://www.designandillustration.co.uk/images/menu_b.gif"; 
	}

//form validation
window.onload = initForms;

function initForms() {
	for (var i=0; i< document.forms.length; i++) {
		document.forms[i].onsubmit = function() {return validForm();}
	}
}

function validForm() {
	var allGood = true;
	var allTags = document.getElementsByTagName("INPUT");

	for (var i=0; i<allTags.length; i++) {
		if (!validTag(allTags[i])) {
			allGood = false;
		}
	}
	return allGood;

	function validTag(thisTag) {
		var outClass = "";
		var allClasses = thisTag.className.split(" ");
	
		for (var j=0; j<allClasses.length; j++) {
			outClass += validBasedOnClass(allClasses[j]) + " ";
		}
	
		thisTag.className = outClass;
	
		if (outClass.indexOf("invalid") > -1) {
			invalidLabel(thisTag.parentNode);
			thisTag.focus();
			if (thisTag.nodeName == "INPUT") {
				thisTag.select();
			}
			return false;
		}
		return true;
		
		function validBasedOnClass(thisClass) {
			var classBack = "";
		
			switch(thisClass) {
				case "":
				case "invalid":
					break;
				case "reqd":
					if (allGood && thisTag.value == "") classBack = "invalid ";
					classBack += thisClass;
					break;

				default:
					if (allGood && !crossCheck(thisTag,thisClass)) classBack = "invalid ";
					classBack += thisClass;
			}
			return classBack;
		}
				
		function crossCheck(inTag,otherFieldID) {
			if (!document.getElementById(otherFieldID)) return false;
			return (inTag.value != "" || document.getElementById(otherFieldID).value != "");
		}
		
		function invalidLabel(parentTag) {
			if (parentTag.nodeName == "DIV") {
				parentTag.className += " invalid";
			}
		}
	}
}

function changeHeaderImage(d){
	var menu =d;
	var image ="url(images/headerimage/SiteHeader-"+menu+")";
	document.getElementById('chrismiller').style.backgroundImage = "url('images/headerimage/SiteHeader-design.gif')";
	}
	
//PRINTING FORM

//add paper type
function addDropDown(d,e){
	var	num = Math.floor(Math.random()*50);
	var Category="Please fill out the folllowing details for a quote on: "+e;
	var HiddenInfo =document.createElement('input');
		HiddenInfo.setAttribute('value',e);
		HiddenInfo.setAttribute('name',"Category"+num);
		HiddenInfo.setAttribute('type',"hidden");
	var Catdiv =document.createElement('div');
		Catdiv.className='Quotetext';
	var QuoteTitle=document.createTextNode(Category);
	Catdiv.appendChild(QuoteTitle);	
	var Title =document.getElementById("formframe");
	Title.appendChild(Catdiv);
	Title.appendChild(HiddenInfo);
	var MenuType=d.split('.');
		for(i=0; i<MenuType.length; i++){
var titlebox = Array("Paper size:","Paper type:","Paper thickness:");
var	num = Math.floor(Math.random()*50);
var SelectBox = document.createElement('select');
SelectBox.setAttribute('id',"SelectMenu"+num);
SelectBox.setAttribute('name',"SelectDate"+num);
var Masterdiv =document.createElement('div');
var div =document.createElement('div');
div.setAttribute('id',titlebox[i]);
var OptionTitle=document.createTextNode(titlebox[i]);
div.appendChild(OptionTitle);
Masterdiv.appendChild(div);
Masterdiv.appendChild(SelectBox);
var dropMen =document.getElementById("formframe");
dropMen.appendChild(Masterdiv);
	var MenuItem=MenuType[i];
	var MenuArray=MenuItem.split(',');
	for(a=0; a<MenuArray.length; a++){
	var newOption= document.createTextNode(MenuArray[a]);
	var OpenOption= document.createElement("option");
	OpenOption.setAttribute('value',MenuArray[a]);
	OpenOption.appendChild(newOption);
	var SelectMenu = document.getElementById("SelectMenu"+num);	

	SelectMenu.appendChild(OpenOption);
	}
}
var ExtraOptions = Array ("Colour or B/W:","Quanity:","Delivery Date:","Number of Sides/Pages:");
for(i=0; i<ExtraOptions.length; i++){
	var Masterdiv =document.createElement('div');
	var div =document.createElement('div');
		div.setAttribute('id',ExtraOptions[i]);
	var input =document.createElement('input');
		input.setAttribute('value',"");
		input.setAttribute('name',ExtraOptions[i]+num);
		input.setAttribute('type',"text");
	var OptionTitle=document.createTextNode(ExtraOptions[i]);
	div.appendChild(OptionTitle);
	Masterdiv.appendChild(div);
	Masterdiv.appendChild(input);
	var extras =document.getElementById("formframe");
extras.appendChild(Masterdiv);

}
	var LinkText="Send quote";
	var DeleteLinkText="Delete above quote";
	var AddLinkText="Add another quote before sending the above";
	var Textspacer=document.createTextNode(" | ");
	var Textspacer1=document.createTextNode(" | ");
	

	var QuoteTitle=document.createTextNode(LinkText);
	var SendQuote =document.createElement('a');
		SendQuote.onclick=ContactDetails;
		SendQuote.appendChild(QuoteTitle);		
		
	var QuoteDelete=document.createTextNode(DeleteLinkText);
	var DeleteQuote =document.createElement('a');
		DeleteQuote.setAttribute('onclick',"DeleteQuote()");
		DeleteQuote.appendChild(QuoteDelete);	
		
	var QuoteAdd=document.createTextNode(AddLinkText);
	var AddQuote =document.createElement('a');
		AddQuote.setAttribute('onclick',"AddQuote()");
		AddQuote.appendChild(QuoteAdd);	

	var Catdiv =document.createElement('div');
		Catdiv.className='QuoteOptions';
		Catdiv.appendChild(SendQuote);	
		Catdiv.appendChild(Textspacer);
		Catdiv.appendChild(AddQuote);		
	var LInfo =document.getElementById("formframe");
	LInfo.appendChild(Catdiv);
}

function ContactDetails(){
var ExtraOptions = Array ("Name:","Email:","Phone Number:");
for(i=0; i<ExtraOptions.length; i++){
	var Masterdiv =document.createElement('div');
	var div =document.createElement('div');
		div.setAttribute('id',ExtraOptions[i]);
	var input =document.createElement('input');
		input.setAttribute('value',"");
		input.setAttribute('name',ExtraOptions[i]+num);
		input.setAttribute('type',"text");
	var OptionTitle=document.createTextNode(ExtraOptions[i]);
	div.appendChild(OptionTitle);
	Masterdiv.appendChild(div);
	Masterdiv.appendChild(input);
	var extras =document.getElementById("formframe");
extras.appendChild(Masterdiv);
}
	var Masterdiv =document.createElement('div');
	var div =document.createElement('div');
	var Send =document.createElement('input');
		Send.setAttribute('name',"submit");
		Send.setAttribute('type',"submit");
		Send.setAttribute('value',"Submit Quote");
	Masterdiv.appendChild(div);
	Masterdiv.appendChild(Send);
	var extras =document.getElementById("formframe");
extras.appendChild(Masterdiv);
}

$(document).ready(function(){
	
$('.gallery_demo_unstyled').addClass('gallery_demo'); // adds new class name to maintain degradability
		
		$('ul.gallery_demo').galleria({
			history   : true, // activates the history object for bookmarking, back-button etc.
			clickNext : true, // helper for making the image clickable
			insert    : '#main_image', // the containing selector for our main image
			onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes
				
				// fade in the image & caption
				if(! ($.browser.mozilla && navigator.appVersion.indexOf("Win")!=-1) ) { // FF/Win fades large images terribly slow
					image.css('display','none').fadeIn(1000);
				}
				caption.css('display','none').fadeIn(1000);
				
				// fetch the thumbnail container
				var _li = thumb.parents('li');
				
				// fade out inactive thumbnail
				_li.siblings().children('img.selected').fadeTo(500,0.3);
				
				// fade in active thumbnail
				thumb.fadeTo('fast',1).addClass('selected');
				
				// add a title for the clickable image
				image.attr('title','Next image >>');
			},
			onThumb : function(thumb) { // thumbnail effects goes here
				
				// fetch the thumbnail container
				var _li = thumb.parents('li');
				
				// if thumbnail is active, fade all the way.
				var _fadeTo = _li.is('.active') ? '1' : '0.3';
				
				// fade in the thumbnail when finnished loading
				thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);
				
				// hover effects
				thumb.hover(
					function() { thumb.fadeTo('fast',1); },
					function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active
				)
			}
		});
	
	$('.leftmenudrop').collapser({
		target: 'siblings',
		effect: 'slide',
		changeText: 0,
		expandClass: 'expArrow',
		collapseClass: 'collArrow'
	});
	
	
	
	$("#tabs").tabs();
	
	
});