$(document).ready(function() {

	$('div.Site div.Left div.Menu ul li.Main.Inactive a').bind('mouseenter', function() {
		var catID = $(this).attr('id');
		catID = catID.substr(6); // remove prefix MenuA_
		
		//setTimeout("moveMenu( '" + catID + "', 'right' )",1000);
		moveMenu( 'Menu_' + catID, 'right' );
		
		
		var updateID = 'CornerImage' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerActiveRound.png');
	}).bind('mouseleave', function() {
		var catID = $(this).attr('id');
		catID = catID.substr(6); // remove prefix MenuA_
		moveMenu(  'Menu_' + catID, 'left' );
		
		var updateID = 'CornerImage' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerInactiveRound.png');
	});
	
	$('div.Site div.Left div.Menu ul li.Active ul li.Sub.Inactive').bind('mouseenter', function() {
		$(this).addClass('Active');
		$(this).removeClass('Inactive');
		
		var catID = $(this).attr('id');
		catID = catID.substr(8); // remove prefix SubMenu_

		var updateID = 'CornerImage' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerActiveRound.png');		
	}).bind('mouseleave', function() {
		$(this).removeClass('Active');

		var catID = $(this).attr('id');
		catID = catID.substr(8); // remove prefix SubMenu_
				
		var updateID = 'CornerImage' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerInactiveRound.png');
	});
	
	$('div.Site div.Content div.Category div.CategoryOverlayCorner').bind('mouseenter', function() {
		var catID = $(this).attr('id');
		catID = catID.substr(6); // remove prefix Corner
		var updateID = 'CornerImage' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerActiveRound.png');
		
		updateID = 'ProductOverlay' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerActiveRound.png');

		// update mainmenu
		updateID = 'Menu_' + catID;
		moveMenu( updateID, 'right' );
		
	}).bind('mouseleave', function() {
		var catID = $(this).attr('id');
		catID = catID.substr(6); // remove prefix Corner
		var updateID = 'CornerImage' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerInactiveRound.png');	
		updateID = 'ProductOverlay' + catID;
		$('#' + updateID ).attr('src',AbsPath + 'images/Category/CornerInactiveRound.png');	
		
		// update mainmenu
		updateID = 'Menu_' + catID;
		moveMenu( updateID, 'left' );
	});
	
	$('div.Site div.Content div.Category div.CategoryOverlayCorner').bind('click', function() {
		var catID = $(this).attr('id');
		catID = catID.substr(6); // remove prefix Corner
		var hrefID = 'a_' + catID;
		var href = $('#' + hrefID ).attr('href');
		AnimateSketches('hide',href);
		AddFading();
	});
	
	$('div.Site div.Content div.Category h2').bind('click', function() {
		var catID = $(this).attr('id');
		catID = catID.substr(3); // remove prefix h2_
		var hrefID = 'a_' + catID;
		var href = $('#' + hrefID ).attr('href');
		AnimateSketches('hide',href);
		AddFading();
	});
});

function changeSmallImage( imageID, Template ) {
	$('div.Site div.Images div.ImagePreview div.ImagePreviewOverlayActive.Show').each(function() {
		$(this).removeClass('Show');
		$(this).addClass('Hide');
	});

	$('div.Site div.Images div.ImagePreview div.ImagePreviewOverlayInactive.Hide').each(function() {
		$(this).removeClass('Hide');
		$(this).addClass('Show');
	});
	
	var updateID = 'ImagePreviewOverlayInactive' + imageID;
	$('#' + updateID ).addClass('Hide');
	$('#' + updateID ).removeClass('Show');
	
	updateID = 'ImagePreviewOverlayActive' + imageID;
	$('#' + updateID ).addClass('Show');
	$('#' + updateID ).removeClass('Hide');
	
	//setLargeImage( imageID );
	getImage( imageID, Template );
};

function setLargeImage( imageID ) {
	$('div.Site div.Content div.ImageLarge .Active').each(function() {
		$(this).removeClass('Active');
		$(this).addClass('Inactive');
	});	
	$('div.Impression div.ImageLarge .Active').each(function() {
		$(this).removeClass('Active');
		$(this).addClass('Inactive');
	});	
	var updateID = 'ImageLarge_' + imageID;
	$('#' + updateID ).addClass('Active');
	$('#' + updateID ).removeClass('Inactive');
	
	//var BgColorId = 'ImageLargeBG_' + imageID;
	//var BgColor = $('#' + BgColorId ).attr('value');
	//if( BgColor != 'transparent' ) {
	//	BgColor = '#' + BgColor;
	//}
	//$('div.Impression').css("background-color",BgColor);
};

var SketchLIs = null;
var SketchCounter = 0; //remember current Link index
var SketchAnimationBusy = false;
var SketchStartIndex = 0;
var SketchScriptUrl = null;
var SketchNextIndex = null;
var SketchPreviousIndex = null;
var SketchBtnNext = null;
var SketchBtnPrevious = null;
var SketchTopNav = null;
var SketchBottomNav = null;
var SketchFilterCategory = null;
var SketchSortOrder = null;

function AnimateSketches(mode, callback) {
	if ( $.browser.msie && $.browser.version < 8 ) {
		AnimateSketches2(mode, callback,'ie7');
	} else {
		AnimateSketches2(mode, callback,'other');
	}
}

function displayH2( catID ) {
	if( catID != undefined ) {
		catID = catID.substr(10); // remove prefix MainBlock_
		$('#h2_' + catID).css('display', 'block');
	}	
}

function hideH2( catID ) {
	if( catID != undefined ) {
		catID = catID.substr(10); // remove prefix MainBlock_
		$('#h2_' + catID).css('display', 'none');
	}	
}

function AnimateSketches2(mode, callback, showAction) {
	SketchLIs = $('div.Site div.Content div.Category');
	
	if(SketchAnimationBusy){ return;
	}else{
		SketchAnimationBusy = true;
	}
	
	var Speed = 175;
	if(mode!='show') {
		Speed = 125;
	}
	ChangeSketch = setInterval(function() {
		var index = (mode=='show')?SketchCounter:SketchLIs.length -1 - SketchCounter;
		var SketchLI = $(SketchLIs[index]);
		SketchCounter++;
		
		if(mode=='show') {
			if(SketchCounter-3 == SketchLIs.length){ // all done
				SketchCounter = 0;				
			}
		} else {
			if(SketchCounter-1 == SketchLIs.length){ // all done
				SketchCounter = 0;				
			}
		}
		if(SketchLI){
			var catID = SketchLI.attr('id');
			if(mode=='show'){
				
				if( showAction == 'ie7' ) {
					SketchLI.css('display', 'block'); // .show()
				} else {
					SketchLI.fadeIn("slow");
				}
				displayH2( catID );
				if(SketchCounter==0){	
					clearInterval(ChangeSketch);
					SketchAnimationBusy = false;
					RemoveFading();
				}else{	
				}
			}else{
				if(SketchCounter==0){
					hideH2( catID );
					if( showAction == 'ie7' ) {
						SketchLI.css('display', 'none', window.location=callback);
					} else {
						SketchLI.fadeOut("slow", window.location=callback);
					}					
					
					clearInterval(ChangeSketch);
					SketchAnimationBusy = false;
				}else{		
					hideH2( catID );
					if( showAction == 'ie7' ) {
						SketchLI.css('display', 'none');
					} else {
						SketchLI.fadeOut("slow");
					}
										
				}				
			}	
		}else{				
		}
		
	}, Speed);
	
};

function RemoveFading() {
	$('div.Site div.Content div.Category').each(function() {
		$(this).removeClass('Fading'); 
	});
	$('div.Images div.ImagePreview').each(function() {
		$(this).removeClass('Fading'); 
	});	
};

function AddFading() {
	$('div.Site div.Content div.Category').each(function() {
		$(this).addClass('Fading'); 
	});	
};

function LargeImageFadeIn() {
	$('#ImageLarge img.Active').fadeIn(3000);
}

function SmallImagesFadeIn() {
	if ( $.browser.msie && $.browser.version < 8 ) {
		AnimateSmallImages('show','ie7');
	} else {
		AnimateSmallImages('show','other');
	}
}

function SmallImagesFadeIn2() {
	$('div.Images div.ImagePreview div.corner img').fadeIn(3000);
	AnimateSmallImages('show');
}

function AnimateSmallImages(mode, showAction) {
	SketchLIs = $('div.Images div.ImagePreview');
	
	if(SketchAnimationBusy){ return;
	}else{
		SketchAnimationBusy = true;
	}
	
	ChangeSketch = setInterval(function() {
		var index = (mode=='show')?SketchCounter:SketchLIs.length -1 - SketchCounter;
		var SketchLI = $(SketchLIs[index]);
		SketchCounter++;
		
		if(mode=='show') {
			if(SketchCounter-2 == SketchLIs.length){ // all done
				SketchCounter = 0;				
			}				
		} else {
			if(SketchCounter == SketchLIs.length){ // all done
				SketchCounter = 0;				
			}
		}
		if(SketchLI){
			if(mode=='show'){
				if( showAction == 'ie7' ) {
					SketchLI.css('display', 'block'); // .show()
				} else {
					SketchLI.fadeIn("slow");
				}
				if(SketchCounter==0){	
					clearInterval(ChangeSketch);
					SketchAnimationBusy = false;
					RemoveFading();
				}else{	
				}
			}else{
				if(SketchCounter==0){					
					SketchLI.fadeOut("slow", window.location=callback);//
					SketchLIs.remove();
					clearInterval(ChangeSketch);
					SketchAnimationBusy = false;
				}else{					
					SketchLI.fadeOut("slow");					
				}				
			}	
		}else{				
			//alert('unexpected');
		}
		
	}, 230);
	
};


var MenuActive = false;
var MenuActiveItem = new Array();
var MenuBackActiveItem = new Array();
function moveMenu( id, direction ) {
	if( MenuActiveItem[id] != 'Busy' && direction == 'right' ) {
		//if( MenuActive == false ) {
			MenuActive = true;
			MenuActiveItem[id] = 'Busy';
			$('#' + id).animate({
			    left: '+=20'
			  }, 600, function() {
			    // Animation complete.
			  });
		//}
	} else if( MenuActiveItem[id] == 'Busy' && MenuBackActiveItem[id] != 'Busy' && direction == 'left' ) {
		MenuBackActiveItem[id] = 'Busy';
		$('#' + id).animate({
		    left: '-=20'
		  }, 600, function() {
			  MenuActiveItem[id] = 'Ready';
			  MenuBackActiveItem[id] = 'Ready';
			  MenuActive = false;
		  });
	}
}

function scrollSmallImage( direction, Template ) {
	var PreviousActive = 0;
	var PreviousID = 0;
	var NextActive = 0;
	var Counter = 0;
	var GoToLast = false;
	var FirstID = 0;
	$('div.Site div.Images div.ImagePreview div.ImagePreviewOverlayActive').each(function() {
		Counter++;
	});
	var Total = Counter;
	Counter = 0;
	$('div.Site div.Images div.ImagePreview div.ImagePreviewOverlayActive').each(function() {
		Counter++;
		var id = $(this).attr('id').substr(25); // remove prefix ImagePreviewOverlayActive
		
		if( direction == 'right' ) {
			if( Counter == 1 ) {
				FirstID = id;
			}
			if( $(this).hasClass('Show') && Counter <= Total ) {
				// deactivate current active image
				$(this).removeClass('Show');
				$(this).addClass('Hide');
	
				var updateID = 'ImagePreviewOverlayInactive' + id;
				$('#' + updateID ).addClass('Show');
				$('#' + updateID ).removeClass('Hide');
				
				if( Counter == Total ) {
					// last was active, activate first image
					updateID = 'ImagePreviewOverlayActive' + FirstID;
					$('#' + updateID ).addClass('Show');
					$('#' + updateID ).removeClass('Hide');	
					
					updateID = 'ImagePreviewOverlayInactive' + FirstID;
					$('#' + updateID ).addClass('Hide');
					$('#' + updateID ).removeClass('Show');	
					
					getImage( FirstID, Template );
				}
				PreviousActive = $(this).attr('id');
			} else if( PreviousActive != 0 ) {
				// activate next image
				$(this).removeClass('Hide');
				$(this).addClass('Show');
	
				updateID = 'ImagePreviewOverlayInactive' + id;
				$('#' + updateID ).addClass('Hide');
				$('#' + updateID ).removeClass('Show');
				
				//setLargeImage( id );
				getImage( id, Template );
				
				PreviousActive = 0;
			}
				
		} else if( direction == 'left' ) {			
			if( PreviousID > 0 && PreviousActive == 0 && $(this).hasClass('Show') ) {
				PreviousActive = id;
				
				// deactivate current active image
				$(this).removeClass('Show');
				$(this).addClass('Hide');
	
				var updateID = 'ImagePreviewOverlayInactive' + id;
				$('#' + updateID ).addClass('Show');
				$('#' + updateID ).removeClass('Hide');
				
				// activate previous image
				updateID = 'ImagePreviewOverlayActive' + PreviousID;
				$('#' + updateID ).addClass('Show');
				$('#' + updateID ).removeClass('Hide');	
				
				updateID = 'ImagePreviewOverlayInactive' + PreviousID;
				$('#' + updateID ).addClass('Hide');
				$('#' + updateID ).removeClass('Show');				
				
				//setLargeImage( PreviousID );
				getImage( PreviousID, Template );
			} else if( PreviousID == 0 && PreviousActive == 0 && $(this).hasClass('Show') ) {
				// first item was active, scroll to first item
				GoToLast = true;
				FirstID = id;
			} else if( GoToLast == true && Counter == Total ) {
				// deactivate first image
				var updateID = 'ImagePreviewOverlayActive' + FirstID;
				$('#' + updateID ).addClass('Hide');
				$('#' + updateID ).removeClass('Show');					
				
				updateID = 'ImagePreviewOverlayInactive' + FirstID;
				$('#' + updateID ).addClass('Show');
				$('#' + updateID ).removeClass('Hide');
				
				// activate this image
				updateID = 'ImagePreviewOverlayActive' + id;
				$('#' + updateID ).addClass('Show');
				$('#' + updateID ).removeClass('Hide');	
				
				updateID = 'ImagePreviewOverlayInactive' + id;
				$('#' + updateID ).addClass('Hide');
				$('#' + updateID ).removeClass('Show');				
				
				//setLargeImage( PreviousID );
				getImage( id, Template );				
			}
			PreviousID = id;
		}
	});
}

function displayBackground( imageID, Template ) {
	changeSmallImage( imageID, Template );
	$('div.Site div.Address').hide();
	$('div.Site div.MenuTop').hide();
	$('div.Site div.MenuBg').hide();
	$('div.Site div.MenuBottom').hide();
	$('div.Site div.InfoTop').hide();
	$('div.Site div.Info').hide();
	$('div.Site div.InfoBottom').hide();
	$('.DisplaySite').show();
}

function displaySite() {
	$('div.Site div.Address').show();
	$('div.Site div.MenuTop').show();
	$('div.Site div.MenuBg').show();
	$('div.Site div.MenuBottom').show();
	$('div.Site div.InfoTop').show();
	$('div.Site div.Info').show();
	$('div.Site div.InfoBottom').show();
	$('.DisplaySite').hide();
}

function setHeaders() {
	$('h1').each(function() {
		$(this).addClass('AGBook');
	});	
	$('h2').each(function() {
		$(this).addClass('AGBook');
	});	
}

function getImage( imageID, Template ) {
	var httpObject = getHTTPObject();
	var ScriptURL = AbsPath + 'includes/Components/Product/ImageAjax.php';
	
	if ( httpObject != null) {
		//Opening the connection
		httpObject.open( "POST", ScriptURL, false );
		httpObject.setRequestHeader( "Content-Type", "application/x-www-form-urlencoded" );
		
		//Setting up params and sending them
		var Params = "ID=" + imageID + "&Template=" + Template;
		httpObject.send( Params );
		
		//Based on the ajax response we will determin if it went ok or not.
		var response = httpObject.responseText;

		if ( response !== 'false' ) {			
			var ImageDiv = document.getElementById( 'ImageLarge' );
			ImageDiv.innerHTML = response;
		} else {
			throw 'Not a valid image';
		}		
	} else {
		throw 'HttpObject was not set!';
	}
	return false;
}