// JavaScript Document

//Global Variables
var imageView = false; //True if an image is being viewed
var dialogueView = false; //True if a dailogue box is open
var helpView = false;
var infoView = false;
var imageData = {}; //Empty variable to load .json data for images and info
var imageNum = 0; //Denotes the current image number
var view = 0; //Denotes the current view of that image

function showOverlay(){ $('#pageOverlay a').css('width','100%');$('#pageOverlay a').css('height','100%'); }//Enables overlay to cover page
function hideOverlay(){ $('#pageOverlay a').css('width','0');$('#pageOverlay a').css('height','0'); }//Disables overlay to cover page

//Gets the window dimensions for IE and everything else


//Opens a "LightBox" style window over the screen with an iframe displaying the content of the URL
function openWindow(element, URL, width, height, dir) {
	if(window.innerWidth!=undefined) {
		var topSpace = Math.round((window.innerHeight-height-86)*.39);
		var leftSpace = Math.round((window.innerWidth)/2);
	}else{
		topSpace = Math.round((document.body.clientHeight-height-86)*.39);
		leftSpace = Math.round((document.body.clientWidth)/2);
	}
	showOverlay();//Extends the overlay to cover the screen
	$(element).css('top',topSpace);//Sets the position of the box on the screen to center it
	$(element).css('left',leftSpace);//Sets the position of the box on the screen to center it
	$(element+' iframe').attr('width','0px');
	$(element+' iframe').attr('height',height-32);
	$(element).show();//Shows element
	if (dir==true || dir==null){
		$(element).css('height',(height+8)+'px');//Sets the initial height of window
		//$(element).css({width: "18px", left: "-=9px"});//Animates the opening of the window horizontally
		//var anim = {}
		//anim["width"] = (width+46)+"px";
		//anim["left"] = "-="+((width+46)/2)+"px";
		//$(element).animate(anim, 270, "swing", function() {	$(element+' iframe').attr('src',URL); $(element+' p#dialogueClose').show(); return true;});
		$(element).css({'width':(width+46)+'px','left':(leftSpace-((width+46)/2))+'px'});
		$(element+' iframe').css({'width':width+'px'});
		$(element+' iframe').attr('src',URL);
		$(element+' p#dialogueClose').show();
		//$(element+' iframe').animate({"width":width+'px'}, 270, "swing", function() {});
		//Animates the opening of the window horizontally then open the iframe and show the close button
	}else{
		$(element).css('width',width);//Sets the initial width of window
		$(element).animate('height',height);//Animates the opening of the window vertically
	}
	dialogueView = true;
	return true;
}

//Closes window opened by openWindow() function
function closeWindow(element) {
	$(element+' iframe').attr('src','/blank.html');
	$(element).css('width','0px');
	$(element).css('height','0px');
	$(element+' p#dialogueClose').hide();//Hide the close button
	$(element).hide();
	hideOverlay();
	dialogueView = false;
	return true;
}

//Opens info panel on top of page
function openInfoPanel() { $('#topCutOut').animate({height:'187px'}, 600); }

//Closes info panel on top of page
function closeInfoPanel() { $('#topCutout').animate({height:'0px'}, 600); }

//Opens the Help Section
function openHelp() {
	showOverlay();
	helpView = true;
}

//Closes the Help Section
function closeHelp() {
	hideOverlay();
	helpView = false;
}

//Prints page with print.css stylesheet
function printThis(){
	var A = window.print;
	if(A){ window.print(); }
}

//Make the page full-screen
function maxWindow() {
	window.moveTo(0, 0);


	if (document.all) {
		top.window.resizeTo(screen.availWidth, screen.availHeight);
	}

	else if (document.layers || document.getElementById) {
		if (top.window.outerHeight < screen.availHeight || top.window.outerWidth < screen.availWidth) {
			top.window.outerHeight = screen.availHeight;
			top.window.outerWidth = screen.availWidth;
		}
	}
}

//Opens an image in gallery view
function openImage(img) {
	imageNum = img;
	view = 0;
	$('#imgFullView').css({'background-image':'url(/images/loadingGif.gif)','background-position':'center center','background-repeat':'no-repeat'});
	var height = imageData.images[imageNum].views[view].height;
	var width = imageData.images[imageNum].views[view].width;
	if(window.innerWidth!=undefined) {
		var top = Math.round((window.innerHeight-height)*0.35);
		var left = Math.round((window.innerWidth-width-96)/2);
	}else{
		top = Math.round((document.body.clientHeight-height)*.35);
		left = Math.round((document.body.clientWidth-width-96)/2);
	}
	$('#image').css({'width':width+'px', 'height':height+'px'});
	$('li#expandView a, a#cornerTab').attr('href','image.php?image=images/'+imageData.images[imageNum].views[view].file+'&title='+imageData.images[imageNum].title);
	$('#imgFullView').css({'width':width+'px', 'height':height+'px','background-image':'url(images/'+imageData.images[imageNum].views[view].file+')', 'display':'block'});
	fillInfo();
	imageView = true;
	showOverlay();
	for (i=1; i<=imageData.images[imageNum].views.length; i++) {$('li#view'+i).show();}
	$('#imageWrap').css({'width':width+96+'px','height':height+'px','top':top+'px','left':left+'px'});
	$('#imageWrap').show();
}

//Closes image
function closeImage() {
	$('#imageWrap').hide();
	$('#imgFullView').css({'background-image':'url(/images/loadingGif.gif)'});
	hideOverlay();
	imageView = false;

	$('#info').removeClass('open');//({'background-image':'url(images/tileG10.png)'});
	$('#info').css('width','22px');
	$('#imgTags, #imgWP, #imgStore, #imgTitle, #imgDesc').addClass('smallInfo');
	$('#imgWP, #imgStore').attr('href','');
	$('#imgWP, #imgStore').addClass('disabled');
	$('#imgTitle, #imgDesc').html('');
	infoView = false;

	$('.view').hide();
	return true;
}

//Fills the info section of an image with the correct data depending on the imageNum and view variables
function fillInfo() {
	$('#imgTitle').html(imageData.images[imageNum].title);
	$('#imgDesc').html(imageData.images[imageNum].text);
	var tags = imageData.images[imageNum].tags.split(",");
	var tagText = "<ul>";
	for (i=0; i<tags.length; i++) {
		tagText = tagText+"<li><a href=\"#\" onclick=\"highlightThumb('"+tags[i].replace(" ","")+"');\">"+tags[i]+"</a></li>";
	}
	$('#imgTags').html(tagText+"</ul>");
	if (imageData.images[imageNum].wp != '') { $('#imgWP').removeClass('disabled'); $('#imgWP a').attr('href',imageData.images[imageNum].wp); }
	if (imageData.images[imageNum].shop != '') { $('#imgStore').removeClass('disabled'); $('#imgStore a').attr('href','http://shop.dicarloarts.com/index.php?id='+imageData.images[imageNum].shop); }
}

//Changes the image and associated text
function changeImage(a) {
	if (a==1) {
		imageNum+=1;
		if (imageNum>=imageData.images.length) imageNum = 0;
		while(imageData.images[imageNum].type!="img"){
			imageNum+=1;
			if (imageNum>=imageData.images.length) imageNum = 0;
		}
	}else if (a==-1) {
		imageNum-=1;
		if (imageNum<0) imageNum = imageData.images.length-1;
		while(imageData.images[imageNum].type!="img"){
			imageNum-=1;
			if (imageNum<0) imageNum = imageData.images.length-1;
		}
	}else {return}
	
	view = 0;
	var height = imageData.images[imageNum].views[view].height;
	var width = imageData.images[imageNum].views[view].width;
	if(window.innerWidth!=undefined) {
		var winHeight = window.innerHeight;
		var winWidth = window.innerWidth;
	}else{
		winHeight = document.body.clientHeight;
		winWidth = document.body.clientWidth;
	}
	$('#imgFullView').css({'display':'none','width':width+'px', 'height':height+'px'});
	$('.view').hide();
	$('#imgWP, #imgStore').attr('href','');
	$('#imgWP, #imgStore').addClass('disabled');
	$('#imgTitle, #imgDesc').html('');
	$('#image').css({'display':'none'});
	$('li#expandView a, a#cornerTab').attr('href','image.php?image=images/'+imageData.images[imageNum].views[view].file+'&title='+imageData.images[imageNum].title);
	$('#imageWrap').animate({'width':width+96+'px','height':height+'px','top':0.35*(winHeight-height),'left':0.5*(winWidth-width-96)},600, function() {
		$('#image').css({'width':width+'px', 'height':height+'px','display':'block'});
		$('#imgFullView').css({'background-image':'url(images/'+imageData.images[imageNum].views[view].file+')', 'display':'block'});
	});
	fillInfo();
	imageView = true;
	showOverlay();
	for (i=1; i<=imageData.images[imageNum].views.length; i++) {$('li#view'+i).show();}
	$('#imageWrap').css({'width':width+96+'px','height':height+'px'});//,'top':top+'px','left':left+'px'
	$('#imageWrap').show();
	
}

//Changes the view of the particular image
function changeView(v) {
	if (view != v) {
		view = v;
		if(window.innerWidth!=undefined) {
			var winHeight = window.innerHeight;
			var winWidth = window.innerWidth;
		}else{
			winHeight = document.body.clientHeight;
			winWidth = document.body.clientWidth;
		}
		var height = imageData.images[imageNum].views[view].height;
		var width = imageData.images[imageNum].views[view].width;
		$('#imgFullView').css({'display':'none','width':width+'px', 'height':height+'px'});
		$('#image').css({'display':'none'});
		$('li#expandView a, a#cornerTab').attr('href','image.php?image=images/'+imageData.images[imageNum].views[view].file+'&title='+imageData.images[imageNum].title);
		$('#imageWrap').animate({'width':width+96+'px','height':height+'px','top':0.35*(winHeight-height),'left':0.5*(winWidth-width-96)},600, function() {
			$('#image').css({'width':width+'px', 'height':height+'px','display':'block'});
			$('#imgFullView').css({'background-image':'url(images/'+imageData.images[imageNum].views[view].file+')', 'display':'block'});
		});
		//css({'width':width+80+'px','height':height+40+'px','top':top+'px','left':left+'px'});
	}
}

//Opens the info panel to the right of an image
function toggleInfo() {
	if (infoView == false) {
		$('#info').addClass('open');//$('#info').css({'background-image':'url(images/tileB80.png)'});
		$('#info').animate({width:'100%'}, 400);
		infoView = true;
		$('#imgTags, #imgWP, #imgStore, #imgTitle, #imgDesc').removeClass('smallInfo');
	}else {
		$('#info').removeClass('open');//({'background-image':'url(images/tileG10.png)'});
		$('#info').animate({width:'22px'}, 220);
		$('#imgTags, #imgWP, #imgStore, #imgTitle, #imgDesc').addClass('smallInfo');
		infoView = false;
	}
}

//Highlights
function highlightThumb(tag) {
	closeImage();
	$("#thumbs ul li").css({"background-image":"url(/images/tileG20.png)"});
	$("#thumbs ul li."+tag).css({"background-image":"url(/images/tileB40.png)"});
}