var dynamicText = null;
var firstPass = true;
var imgCaptions = [];
var imgChronicles = [];
var imgContainer = null;
var imgIndex = 0;
var imgMax = 0;
var imgPrev = null;
var imgSrc = [];
var imgTitles = [];
var isAd = false;
var isLoading = false;
var nextArrowBottomGrey = null;
var nextArrowGrey = null;
var paginationHasNextArrow = null;
var paginationHasPrevArrow = null;
var paginationNextArrowUnselected = null;
var paginationPrevArrowUnselected = null;
var pageKeyValues = null;
var pageLoaded = false;
var panelCount = null;
var paused = 1;
var pauseDown = null;
var pauseUp = null;
var play = false;
var playDown = null;
var playUp = null;
var preloadedImages = [];
var prevArrowBottomGrey = null;
var prevArrowGrey = null;
var viewCount = 0;
var viewLimit = 6;
var rhomIndex = 0;
var rhombusOn = null;
var rhombusOff = null;
var scrollinterval = 0;
var siteUrl = null;
var storyHeadline = null;
var t = null;

function changestate() {
	if(isAd) {return;}
	
	if(paused == 1){
		paused = 0;
		play = true;
		setDelayValue();
	}
	else {
		paused = 1;
		play = false;
		clearTimeout(t);
	}
	setstate();
	photoShow();
}

function continueShow(isClicked) {
   isAd = false;
   if(isClicked) { if(play) { changestate(); } }
   imgIndex = ++imgIndex > (imgMax-1) ? 0 : imgIndex;
   setCurrentImage();
}

function doPreload(imgLoc) {
   nextArrowBottomGrey = new Image();
   nextArrowBottomGrey.src = (imgLoc + '/img/photo/next_arrow_bottom_grey.jpg');
   
   nextArrowGrey = new Image();
   nextArrowGrey.src = (imgLoc + '/img/photo/next_arrow_grey.jpg');
   
   prevArrowBottomGrey = new Image();
   prevArrowBottomGrey.src = (imgLoc + '/img/photo/prevarrow_bottom_grey.jpg');
   
   prevArrowGrey = new Image();
   prevArrowGrey.src = (imgLoc + '/img/photo/prevarrow_grey.jpg');
   
   pauseDown = new Image();
   pauseDown.src = (imgLoc + '/img/photo/pause_down.gif');
   
   pauseUp = new Image();
   pauseUp.src = (imgLoc + '/img/photo/pause_up.gif');
   
   playDown = new Image();
   playDown.src = (imgLoc + '/img/photo/play_down.gif');
   
   playUp = new Image();
   playUp.src = (imgLoc + '/img/photo/play_up.gif');
   
   rhombusOn = new Image();
   rhombusOn.src = (imgLoc + '/img/photo_rhombus_on.gif');
   
   rhombusOff = new Image();
   rhombusOff.src = (imgLoc + '/img/photo_rhombus_off.gif');
   
   paginationNextArrowUnselected = new Image();
   paginationNextArrowUnselected.src = (imgLoc + '/img/photo/nextarrow_unselected_tp.gif');
   
   paginationPrevArrowUnselected = new Image();
   paginationPrevArrowUnselected.src = (imgLoc + '/img/photo/prevarrow_unselected_tp.gif');
   
   paginationHasNextArrow = new Image();
   paginationHasNextArrow.src = (imgLoc + '/img/photo/hasNextArrow.gif');
   
   paginationHasPrevArrow = new Image();
   paginationHasPrevArrow.src = (imgLoc + '/img/photo/hasPrevArrow.gif');
}

function endLoading() {
	isLoading = false;
	if(!firstPass) { imgPrev = imgCurrent; }
}

function finishSetup(onloadCaption) {
	imgPrev = $('pic0');
	$('dynamicText').innerHTML = (onloadCaption != '') ? onloadCaption : ' ';
	
	//analytics: defined in analytics/photo.js
	setPhotoInfo('Photo 1', imgChronicles[0], storyHeadline, onloadCaption);  
	
	$('imgContainer').setStyle({height: imgPrev.getHeight() + 'px'});	
	  
	Event.observe($('adIframe'), 'load', showAd);
   
	Effect.Appear($('thumb_1'));
	Effect.Appear($('prev'));
	Effect.Appear($('next'));
	Effect.Appear($('photoTitle'));
	Effect.Appear($('clickhere')); 
	Effect.Appear($('photoTitle'));
   
	var relatedGalleryImages = document.getElementsByClassName('leftimage');
	for(var i = 0; i < relatedGalleryImages.length; i++) {
		var relatedGallery = $(relatedGalleryImages[i]);
		Event.observe($(relatedGallery), 'error', noCover);   
	}
	pageLoaded = true;
}

function getc() {
	return $('thumb_' + (rhomIndex + 1));
}

function getn() {
   if((rhomIndex + 1) == panelCount) { return $('thumb_1'); }
   else { return $('thumb_' + (rhomIndex + 2)); }
}

function getp() {
	if(rhomIndex == 0) { return $('thumb_' + (panelCount)); }
	else { return $('thumb_' + rhomIndex); }
}

function handleThumbnailPanels() {
   var panelImageIndex = imgIndex % 11;
   if((panelImageIndex == 0 && imgIndex != 0) || imgIndex == (imgMax - 1)) {
      try {
         Element.hide(getc());
	      Element.show(getn());
         nextRhomb(panelCount);
      }
      catch(e) { console.warn(e); }
   }
}

function loadFadeIn() {
	imgCurrent.src = imgSrc[imgIndex];
}

function photoShow()  {
	if(play === true && scrollinterval > 0) {
      handleThumbnailPanels();
		setNextImage();
	}
	else {return;}
}

function processLoaded() {
   setTimeout(function(){$('imgContainer').style.height = Element.getHeight(imgCurrent) + 'px';}, 450);
	new Effect.Parallel([new Effect.Fade(imgPrev, {sync: true}),
	                     new Effect.Appear(imgCurrent, {afterFinish:endLoading, sync: true})]);
   if(play) { t=setTimeout(photoShow,scrollinterval * 1000); }
}

function processNotLoaded() {
   var _imgPrev = imgPrev;
   
	var fadeHeight = (Element.getHeight(_imgPrev) - 18) + 'px';
	
	$('loadIndicator').style.height = fadeHeight;
	if(!firstPass) {
		$('movingRec').style.left = '0px';
		$('movingRec').style.top = '10px';
	} 
	firstPass = false;
	
	new Effect.Parallel([new Effect.Fade(_imgPrev, {afterFinish:loadFadeIn, sync:true}), 
	                     new Effect.Appear($('loadIndicator'), {sync:true})]);
	new Effect.Move ($('movingRec'), { x: 400, y: 0, mode: 'relative'});
}

function navNextImage() {
	if(isLoading) {return;}
	if(isAd) {return;}
	if(play) { changestate(); }
	imgIndex = ++imgIndex > (imgMax-1) ? 0 : imgIndex;
	setCurrentImage();
}	

function navPrevImage() {
	if(isLoading) { return; }
	if(isAd) { return; }
   if(play) { changestate(); }
	imgIndex = imgIndex - 1;
	if(imgIndex < 0) { imgIndex = (imgMax - 1); }
	setCurrentImage();
}

function nextRhomb(panelCount) {
	var theRhombs = setRhombs();
	if((rhomIndex + 1) != panelCount) { rhomIndex += 1; }
	else { rhomIndex = 0; }
	setActiveRhomb(theRhombs);
	
	Element.hide(getp());
	Element.show(getc());
}

function noCover() {
	this.src = '/img/no_photo_gallery_cover_image.gif';
}

function noMain() {
  this.src = '/img/photo/default_main_photo.gif';
}

function noThumb() {
	this.src = '/img/no_photo_thumb.gif';
}

function prevRhomb() {
	var theRhombs = setRhombs();
	if((rhomIndex) != 0) { rhomIndex -= 1; }
	else { rhomIndex = (panelCount - 1); }
	setActiveRhomb(theRhombs);
	Element.hide(getn());
	Element.show(getc());
}

function processAd() {
	$('dynamicText').hide();
	$('photoTitle').hide();
	$('clickhere').hide();
	$('continueclick').show();
	
	$('imgContainer').setStyle({height: '600px'});
	$('imgContainer').setStyle({textAlign: 'center'});
	$('topcaptiontable').style.backgroundColor = '#CCCCCC';
	$('centralimagediv').style.backgroundColor = '#CCCCCC';
	$('bottomcaptiontable').style.backgroundColor = '#CCCCCC';
		
	$('toprightbtn').src = nextArrowGrey.src;
	$('topleftbtn').src = prevArrowGrey.src;
	$('bottomrightbutton').src = nextArrowBottomGrey.src;
	$('bottomleftbutton').src = prevArrowBottomGrey.src;
		
	Element.setStyle('toprightbtn', {position: 'relative'} );
	Element.setStyle('topleftbtn', {position: 'relative'} );
	Element.setStyle('bottomrightbutton', {position: 'relative'} );
	Element.setStyle('bottomleftbutton', {position: 'relative'} );
		
	Element.setStyle('toprightbtn', {left: '140px'} );
	Element.setStyle('topleftbtn', {right: '140px'} );
	Element.setStyle('bottomrightbutton', {left: '140px'} );
	Element.setStyle('bottomleftbutton', {right: '140px'} );
	isAd = true;
	if(paused == 1) { setTimeout(function(){isAd = false;}, 3000); }
	else {
		if(scrollinterval == 7) { 
		   setTimeout(function(){continueShow(false);}, 7000); 
		}
		else if(scrollinterval == 5){
		   setTimeout(function(){continueShow(false);}, 5000);
		} 
		else if(scrollinterval == 3) { 
		   setTimeout(function(){continueShow(false);}, 3000);
		}
	}	
}

function setActiveRhomb(theRhombs) {
	if((rhomIndex + 1) == panelCount) {
      // does not have next
      theRhombs[panelCount-1].src = rhombusOn.src;
      theRhombs[panelCount-1].id = 'activeRhombus'; 
		$('nextThumbNavArrow').src = paginationNextArrowUnselected.src;
		$('nextThumbText').style.color = '#c3c3c3';	
	}
	else {
      // has next
		$('nextThumbNavArrow').src = paginationHasNextArrow.src;
	   $('nextThumbText').style.color = '#565656';
	}
	if(rhomIndex == 0) {
	   // does not have previous
      theRhombs[rhomIndex].src = rhombusOn.src;
      theRhombs[rhomIndex].id = 'activeRhombus';
      $('prevThumbNavArrow').src = paginationPrevArrowUnselected.src;
		$('prevThumbText').style.color = '#c3c3c3';	 
	}
	else {
	  // has previous
		theRhombs[rhomIndex].src = rhombusOn.src;
		theRhombs[rhomIndex].id = 'activeRhombus';
		$('prevThumbNavArrow').src = paginationHasPrevArrow.src;
		$('prevThumbText').style.color = '#565656';
	}
}

function setCurrentImage() {
   ++viewCount;
   if(play) { clearTimeout(t); }
  
   if(viewCount > viewLimit) {
      viewCount = -1;
      imgIndex = imgIndex - 1;
      if(imgIndex < 0) { imgIndex = (imgMax - 1); }
      try {
         imgCurrent.hide();
         imgCurrent = $('pic' + imgIndex);
         imgCurrent.hide();
         $('adIframe').src = siteUrl + '/ajax/gallery?pageKeyValues=' + pageKeyValues;      
      }
      catch(e) { console.warn(e); } 
      return;
   }
   var _dynamicText = $('dynamicText');
   if (viewCount === 0){
      $('adIframe').hide();
      _dynamicText.show();
      $('photoTitle').show();
      $('clickhere').show();
      $('continueclick').hide();
      
      $('imgContainer').setStyle({textAlign: 'left'});
      $('topcaptiontable').setStyle({backgroundColor: ''});
      $('centralimagediv').setStyle({backgroundColor: ''});
      $('bottomcaptiontable').setStyle({backgroundColor: ''});
  	
      $('toprightbtn').src = '/img/photo/next_arrow_normal.jpg';
      $('topleftbtn').src = '/img/photo/prevarrow_normal.jpg';
      $('bottomrightbutton').src = '/img/photo/next_arrow_bottom_normal.jpg';
      $('bottomleftbutton').src = '/img/photo/prevarrow_bottom_normal.jpg';
     
      Element.setStyle('toprightbtn', {left: '0px'} );
      Element.setStyle('topleftbtn', {right: '0px'} );
      Element.setStyle('bottomrightbutton', {left: '0px'} );
      Element.setStyle('bottomleftbutton', {right: '0px'} );
  	}
	isLoading = true;
	isLoaded = false;
	
	imgCurrent = $('pic' + imgIndex);
		
	if((imgCurrent.src.indexOf('.jpeg') != -1 || 
	   imgCurrent.src.indexOf('.gif') != -1 || imgCurrent.src.indexOf('.png') != -1 || 
		imgCurrent.src.indexOf('.jpg') != -1) && imgCurrent.src.indexOf('image_placeholder') == -1) {isLoaded = true;}
		
	if(!isLoaded) { processNotLoaded(); }
	else { processLoaded(); }
	
	//_dynamicText.childNodes[0].nodeValue = imgCaptions[imgIndex];
	_dynamicText.update(imgCaptions[imgIndex]);
	$('imgNumber').update((imgIndex + 1) + ' of ' + imgMax);
	
   //analytics: called in /analytics/photo.js
	setPhotoInfo(('Photo ' + (imgIndex + 1)) , (imgChronicles[imgIndex] + ''), storyHeadline, imgCaptions[imgIndex]);
}

function setDelayValue() {
	scrollinterval = $('scrollspeed').value;
}

function setNextImage() {
	if(isLoading) {return;}
	if(isAd) {return;}
	imgIndex = ++imgIndex > (imgMax-1) ? 0 : imgIndex;
	setCurrentImage();
}	

function setPrevImage() {
	if(isLoading) {return;}
	if(isAd) {return;}
	imgIndex = imgIndex - 1;
	if(imgIndex < 0) { imgIndex = (imgMax - 1); }
	setCurrentImage();
}

function setRhombs() {
	$('activeRhombus').src = rhombusOff.src;
	$('activeRhombus').id = null;
	return document.getElementsByClassName('rhombus');
}

function setScoreValue(){
	scrollinterval = 2;
}

function setstate() {
	if(isAd) {return;}
      
	if (paused == 1) {
	   $('pausebutton').src = pauseDown.src;
		$('startbutton').src = playUp.src;
	}
	else {
	   $('pausebutton').src = pauseUp.src;
		$('startbutton').src = playDown.src;
	}
}

function showAd() {
   processAd();
   Effect.Appear('adIframe');
   setAdImpressionEvent('event4');
}

function showImage() {
   if(!pageLoaded) {return;}   
   if(play) { t=setTimeout(photoShow,scrollinterval * 1000); }
	$('imgContainer').setStyle({height: this.getHeight() + 'px'});
	$('loadIndicator').setStyle({height: (this.getHeight() - 18) + 'px' });
	
	new Effect.Move ('movingRec', { x: 0, y: 300, mode: 'relative'});
	try {
      new Effect.Parallel([new Effect.Fade($('loadIndicator'), {sync: true}),
                           new Effect.Appear(this, {afterFinish:endLoading, sync: true})]);
	}
	catch(e) { console.warn(e); }
}

function showThisImage(newIndex) {
	if(isLoading) {return;}
	if(imgIndex == newIndex) {return;}
	if(isAd) {return;}
   if(play) { changestate(); }
	imgIndex = newIndex;
	setCurrentImage();
}