var NBAPhotoGalleryImgs = [];

function NBAPhotoGallery(strJsonPath,strInstance) {

	//Used later to get exact instance
	this.name = "NBAPhotoGallery";
	this.instanceName = strInstance; //Had to do it this way due to IE issues, needs to be the same as the instance variable name

	//JSON path and filename
	this.jsonFile = "";
	this.jsonPath = strJsonPath;

	this.slides = new Array();
	
	//Max pixel width or height of the image
	this.imageSize = 298;

	//Set up the path to the full gallery
	this.galleryUrl = "/photos/";

	//Set up all of the CSS values
	this.domCaption = "#nbaPhotoContent .nbaPhotoCaption";
	this.domParagraph = "#nbaPhotoContent .nbaPhotoPara";
	this.domParagraphText = "#nbaPhotoContent .nbaPhotoPara span";
	this.domGalleryHeader = "#nbaPhotoHeader .nbaPhotoAll a";
	this.domGalleryReturn = "nbaPhotoCSIReturn";
	this.domImage = "nbaPhotoImage";
	this.domLeftButton = "#nbaPhotoContent .nbaPhotoLeftBtn a";
	this.domRightButton = "#nbaPhotoContent .nbaPhotoRightBtn a";

	//Load the photo gallery
	this.load = function() {

		//Set the location of the gallery
		$$(this.domGalleryHeader)[0].href = this.galleryUrl;

		//Do this ugly process to pass in the parent
		var configData = CSIManager.getInstance().getConfigForId(this.domGalleryReturn);
		configData._parent = this;
		CSIManager.getInstance().setConfigForId(this.domGalleryReturn,configData);		

		//Load the first slide
		CSIManager.getInstance().call(this.jsonPath + this.jsonFile,null,this.domGalleryReturn,this.loadAllSlides);

	} 

	//Build the result html (callback)
	this.loadAllSlides = function(objGallery,strDomId,objConfig) {

		//Set the object parent
		var objParent = objConfig._parent;

		//Go through all the slides
		for (var intCount = 0; intCount < objGallery.slides.length; intCount++) {
			NBAPhotoGalleryImgs.push( objGallery.slides[intCount].image.url );
			objParent.slides.push( objGallery.slides[intCount] );
		}

		//Load the default slide
		objParent.loadSlide(0);
	}

	this.fetchImg = function( intIndex )
	{
		if( NBAPhotoGalleryImgs[ intIndex ] )
		{
			var img = new Image();
			img.src = NBAPhotoGalleryImgs[intIndex];
			return img.src;
		}
		return false;
	};
	//Load a single slide
	this.loadSlide = function(intSlide) {

		//Set the current slide
		var objCurrSlide = this.slides[intSlide];

		var intSlides = this.slides.length - 1;

		//Set the previous link
		if (intSlide > 0) {
			var intSlidePrev = intSlide - 1;
			$$(this.domLeftButton)[0].href = "javascript:"+this.instanceName+".loadSlide("+intSlidePrev+")";
		} else {
			$$(this.domLeftButton)[0].href = "javascript:"+this.instanceName+".loadSlide("+intSlides+")";
		}

		//Set the next link
		if (intSlide < intSlides) {
			var intSlideNext = intSlide + 1;
			$$(this.domRightButton)[0].href = "javascript:"+this.instanceName+".loadSlide("+intSlideNext+")";
		} else {
			$$(this.domRightButton)[0].href = "javascript:"+this.instanceName+".loadSlide(0)";
		}

		//Set the caption and paragraph
		if (objCurrSlide.credit.toLowerCase() != "sponsor") {
			$$(this.domCaption)[0].style.visibility = "visible";
			$$(this.domCaption)[0].innerHTML = "<span>"+objCurrSlide.credit+"</span>";
		} else {
			$$(this.domCaption)[0].style.visibility = "hidden";
			$$(this.domCaption)[0].innerHTML = "";
		}
		
		//Populate and then center the text.  Using offsetHeight and offsetWidth which are supported on all major browsers so will give a great majority of users a better experience.
		//Decided to do this in JavaScript because the CSS hacks to do this are very complex.
		$$(this.domParagraph)[0].style.visibility = "hidden";
		$$(this.domParagraph)[0].innerHTML = "<span>"+objCurrSlide.blurb+"</span>";
		if ($$(this.domParagraph)[0].offsetHeight) {
			$$(this.domParagraphText)[0].style.position = "relative";
			$$(this.domParagraphText)[0].style.top = ((($$(this.domParagraph)[0].offsetHeight - $$(this.domParagraphText)[0].offsetHeight)/2)-1) + "px";
			$$(this.domParagraphText)[0].style.left = ((($$(this.domParagraph)[0].offsetWidth - $$(this.domParagraphText)[0].offsetWidth)/2)-1) + "px";
		}
		$$(this.domParagraph)[0].style.visibility = "visible";

		//Set up the image
		$(this.domImage).src = objCurrSlide.image.url;
		$(this.domImage).alt = objCurrSlide.headline;
		$(this.domImage).title = objCurrSlide.headline;

		//Calculate the width and height of the image
		this.scaleImage(objCurrSlide.image.width,objCurrSlide.image.height);

		$(this.domImage).style.visibility = "visible";
		$(this.domImage).style.top = (this.imageSize - $(this.domImage).height) + "px";
		$(this.domImage).style.left = ((this.imageSize - $(this.domImage).width)/2) + "px";
		
		//Fade in the image
		fadeIn(this.domImage,0);
		
		//Pre-load next slide img
		this.fetchImg( intSlideNext );
	}

	this.scaleImage = function(intWidth,intHeight) {

		//Get the default size
		var intSize = this.imageSize;

		//Set the ratio value
		var fltRatio = 0;

		if (intWidth == intHeight) {

			$(this.domImage).width = intSize;
			$(this.domImage).height = intSize;

		} else if (intWidth > intHeight) {

			//Calculate the scaling
			fltRatio = intSize/intWidth;
			intHeight = Math.round(fltRatio * intHeight);
		
			$(this.domImage).width = intSize;
			$(this.domImage).height = intHeight;

		} else {

			//Calculate the scaling
			fltRatio = intSize/intHeight;
			intWidth = Math.round(fltRatio * intWidth);
	
			$(this.domImage).width = intWidth;
			$(this.domImage).height = intSize;	
		}
	}
}

function setOpacity(strFade,intOpacity) {

	objFade = document.getElementById(strFade);
	
    intOpacity = (intOpacity == 100)?99.999:intOpacity;

    // Newer Mozilla, Safari and Firefox
    objFade.style.opacity = intOpacity/100;

    // Internet Explorer
    objFade.style.filter = "alpha(opacity:"+intOpacity+")";
 
    // Konqueror and Old Safari
    objFade.style.KHTMLOpacity = intOpacity/100;
 
    // Old Firefox/Mozilla
    objFade.style.MozOpacity = intOpacity/100;
}

function fadeIn(strFade,intStart) {

	if (intStart <= 100) {
        setOpacity(strFade,intStart);
        intStart += 10;
        window.setTimeout("fadeIn('"+strFade+"',"+intStart+")",50);
	}
}