//	Global Variables
//
var imageArray = new Array;
var activeImage;

//	Extending built-in Array object
//	- array.removeDuplicates()
//	- array.empty()

Array.prototype.removeDuplicates = function () {
    for(i = 0; i < this.length; i++){
        for(j = this.length-1; j>i; j--){        
            if(this[i][0] == this[j][0]){
                this.splice(j,1);
            }
        }
    }
}

Array.prototype.empty = function () {
	for(i = 0; i <= this.length; i++){
		this.shift();
	}
}

// -----------------------------------------------------------------------------------
var Modal = Class.create();
Modal.prototype = {
	initialize: function() {
		//Set up HTML structure for viewer
		var Body = document.getElementsByTagName("body").item(0);
		
		var viewerHolder = document.createElement('div');
		viewerHolder.setAttribute('id','viewer-holder');
		viewerHolder.className = 'hide';
		
		var shadowRight = document.createElement('div');
		shadowRight.setAttribute('id','shadow-right');
		
		var shadowLeft = document.createElement('div');
		shadowLeft.setAttribute('id','shadow-left');
		
		var shadowBottom = document.createElement('div');
		shadowBottom.setAttribute('id','shadow-bottom');
		
		var viewerContent = document.createElement('div');
		viewerContent.setAttribute('id','viewer-content');
		
		var viewerTitle = document.createElement('h4');
		var viewerTitleTxt = document.createTextNode('Gallery Title');
		viewerTitle.appendChild(viewerTitleTxt)
		
		var viewerClose = document.createElement('a');
		viewerClose.setAttribute('id','viewer-close');
		viewerClose.onclick = function(){myModal.end('viewer-holder')};
		
		var viewerImage = document.createElement('img');
		viewerImage.setAttribute('id','viewer');
		//viewerImage.src="loading.gif";
		
		var viewerDescrip = document.createElement('p');
		var viewerDescripText = document.createTextNode('Description of the image taken from the Title attribute of the link.');
		viewerDescrip.setAttribute('id','viewer-descrip');
		viewerDescrip.appendChild(viewerDescripText);
		
		var viewerNav = document.createElement('div');
		viewerNav.setAttribute('id','viewer-nav');
		
		var viewerBack = document.createElement('a');
		var viewerBackTxt = document.createTextNode('\u00ab Back ')
		viewerBack.setAttribute('id','viewer-back');
		viewerBack.setAttribute('href','javascript:return false;')
		viewerBack.appendChild(viewerBackTxt);
		
		var viewerOrder = document.createElement('span');
		var viewerOrderText = document.createTextNode('# of #');
		viewerOrder.setAttribute('id','photo-order');
		viewerOrder.appendChild(viewerOrderText);
		
		var viewerNext = document.createElement('a');
		var viewerNextTxt = document.createTextNode(' Next \u00bb')
		viewerNext.setAttribute('id','viewer-next');
		viewerNext.setAttribute('href','javascript:return false;')
		viewerNext.appendChild(viewerNextTxt);
		
		viewerNav.appendChild(viewerBack);
		viewerNav.appendChild(viewerOrder);
		viewerNav.appendChild(viewerNext);
		
		viewerContent.appendChild(viewerTitle);
		viewerContent.appendChild(viewerClose);
		viewerContent.appendChild(viewerImage);
		viewerContent.appendChild(viewerDescrip);
		viewerContent.appendChild(viewerNav);
		
		viewerHolder.appendChild(shadowRight);
		viewerHolder.appendChild(shadowLeft);
		viewerHolder.appendChild(viewerContent);
		viewerHolder.appendChild(shadowBottom);
		
		Body.appendChild(viewerHolder);
		
		if (!document.getElementsByTagName){ return; }
		var anchors = document.getElementsByTagName('a');
		for (var i=0; i<anchors.length; i++) {
			var anchor = anchors[i];
			var relAttribute = String(anchor.getAttribute('rel'));
			if (anchor.getAttribute('href') && (relAttribute.toLowerCase().match('modal'))) {
				anchor.onclick = function () {myModal.start(this); return false;}
			}
		}	
	},
	start: function(imageLink) {			
		flash('hidden');
		getPageSize();
		getPageScroll();
		if (!document.getElementsByTagName){ return; }
		
		imageArray = [];
		imageNum = 0;		

		if (!document.getElementsByTagName){ return; }
		var anchors = document.getElementsByTagName(imageLink.tagName);
		
		$('viewer-holder').removeClassName('hide');
		$('viewer-holder').style.visibility = "hidden";
		
		// if image is part of a set..
			for (var i=0; i<anchors.length; i++){
				var anchor = anchors[i];
				if (anchor.getAttribute('href') && (anchor.getAttribute('rel') == imageLink.getAttribute('rel'))){
					var descrip = anchor.getAttribute('title')
					imageArray.push(new Array(anchor.getAttribute('href'),descrip));
				}
			}			
			imageArray.removeDuplicates();
			if (imageArray.length == 1){
				$('viewer-nav').addClassName('hide')
			}
			else {
				$('viewer-nav').removeClassName('hide')
			}
			while(imageArray[imageNum][0] != imageLink.getAttribute('href')) {imageNum++;}
		var titleTag = document.getElementsByTagName('h4')
		var galTitle = imageLink.getAttribute('rel').replace(/(modal\[|\])/ig,"")
		titleTag[titleTag.length-1].childNodes[0].nodeValue = galTitle;
		
		Preloader.add(imageArray[imageNum][0]);
		var activeImage = imageNum;
		var callback = function(){
			$('viewer').src = "";
			$('viewer').src = imageArray[activeImage][0];
			$('viewer-descrip').innerHTML = imageArray[activeImage][1];
			myModal.centerImage(activeImage);
			myModal.centerImage(activeImage);
  		}
  		Preloader.onFinish(callback);
		Preloader.load();
	},
	changeImage: function(imageNum) {	
		var activeImage = imageNum;
		$('viewer').src = imageArray[activeImage][0];
		$('viewer-descrip').innerHTML = imageArray[activeImage][1];
		this.centerImage(activeImage);
		this.centerImage(activeImage);
	},
	centerImage: function(activeImage) {
		$('viewer-descrip').style.width = $('viewer').width + "px";
		var center = (arrayPageSize[2] - $('viewer-holder').offsetWidth)/2;
		var top = arrayPageScroll[1] + 20;
		if (BO["ie6"]) {
			$('viewer-content').style.width = $('viewer').offsetWidth + "px";
			$('viewer-holder').style.width = $('viewer').offsetWidth + "px";			
		}
		$('viewer-holder').style.left = center + "px";
		$('viewer-holder').style.top = top + "px";
		if (BO["ie7"]||BO["opera"]) {
			$('viewer-holder').style.width = $('viewer').width + 55 + "px";
		}
		var photoOrder=(activeImage+1)+" of "+imageArray.length;
		$('photo-order').firstChild.nodeValue = photoOrder;
		var shadowHeight = $('viewer-content').offsetHeight + 15;
		$('shadow-right').style.height = shadowHeight + "px";
		$('shadow-left').style.height = shadowHeight + "px";
		$('shadow-bottom').style.width = $('viewer-content').offsetWidth;
		
		$('viewer-holder').style.visibility = "visible";
		this.updateNav(activeImage);
	},
	updateNav: function(activeImage) {
		// if not first image in set, display prev image button
		//debug.value+="activeImage: " + activeImage + "\rimageArray.length: " + imageArray.length;
		if(activeImage != 0){
			$('viewer-back').removeClassName('gray')
			$('viewer-back').onclick = function() {
				myModal.changeImage(activeImage - 1); return false;
			}
		
		}
		else {
			$('viewer-back').addClassName('gray')
			$('viewer-back').onclick = function() { return false; }
		}
		// if not last image in set, display next image button
		if(activeImage != (imageArray.length - 1)){
			$('viewer-next').removeClassName('gray')
			$('viewer-next').onclick = function() {
				myModal.changeImage(activeImage + 1); return false;
			}
		
		}
		else {
			$('viewer-next').addClassName('gray')
			$('viewer-next').onclick = function() { return false; }
		}
		this.preloadNeighborImages(activeImage);
	},
	preloadNeighborImages: function(activeImage){
		if((imageArray.length - 1) > activeImage){
			preloadNextImage = new Image();
			preloadNextImage.src = imageArray[activeImage + 1][0];
		}
		if(activeImage > 0){
			preloadPrevImage = new Image();
			preloadPrevImage.src = imageArray[activeImage - 1][0];
		}
	},
	end: function(elem) {
		$(elem).addClassName('hide');
		$('viewer').src = "";
		$('viewer-holder').style.right = "";
		$('viewer-holder').style.left = "";
		flash('visible');
	}
}

function initModal() { myModal = new Modal(); }
Event.observe(window, 'load', initModal, false);

function getPageSize(){
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = window.innerWidth + window.scrollMaxX;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		if(document.documentElement.clientWidth){
			windowWidth = document.documentElement.clientWidth; 
		} else {
			windowWidth = self.innerWidth;
		}
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}
	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = xScroll;		
	} else {
		pageWidth = windowWidth;
	}
	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
	return arrayPageSize;
}
function getPageScroll(){

	var xScroll, yScroll;

	if (self.pageYOffset) {
		yScroll = self.pageYOffset;
		xScroll = self.pageXOffset;
	} else if (document.documentElement && document.documentElement.scrollTop){	 // Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
		xScroll = document.documentElement.scrollLeft;
	} else if (document.body) {// all other Explorers
		yScroll = document.body.scrollTop;
		xScroll = document.body.scrollLeft;	
	}

	arrayPageScroll = new Array(xScroll,yScroll) 
	return arrayPageScroll;
}
function flash(action){ //Variable being passed should either be 'hidden' or 'visible'
	var objects = document.getElementsByTagName("object");
	for (i = 0; i < objects.length; i++) {
		objects[i].style.visibility = action;
	}
	var embeds = document.getElementsByTagName("embed");
	for (i = 0; i < embeds.length; i++) {
		embeds[i].style.visibility = action;
	}
}
//Browser sniffer from http://parentnode.org/javascript/javascript-browser-detection-revisited/
function detectBrowser() { 
    var BO = new Object(); 
    BO["ie"]        = false /*@cc_on || true @*/; 
    BO["ie4"]       = BO["ie"] && (document.getElementById == null); 
    BO["ie5"]       = BO["ie"] && (document.namespaces == null) && (!BO["ie4"]); 
    BO["ie6"]       = BO["ie"] && (document.implementation != null) && (document.implementation.hasFeature != null); 
    BO["ie55"]      = BO["ie"] && (document.namespaces != null) && (!BO["ie6"]); 
    /*@cc_on
    BO["ie7"]       = @_jscript_version == '5.7';
    @*/ 
    BO["ns4"]       = !BO["ie"] &&  (document.layers != null) &&  (window.confirm != null) && (document.createElement == null); 
    BO["opera"]     = (self.opera != null); 
    BO["gecko"]     = (document.getBoxObjectFor != null); 
    BO["khtml"]     = (navigator.vendor == "KDE"); 
    BO["konq"]      = ((navigator.vendor == 'KDE') || (document.childNodes) && (!document.all) && (!navigator.taintEnabled)); 
    BO["safari"]    = (document.childNodes) && (!document.all) && (!navigator.taintEnabled) && (!navigator.accentColorName); 
    BO["safari1.2"] = (parseInt(0).toFixed == null) && (BO["safari"] && (window.XMLHttpRequest != null)); 
    BO["safari2.0"] = (parseInt(0).toFixed != null) && BO["safari"] && !BO["safari1.2"]; 
    BO["safari1.1"] = BO["safari"] && !BO["safari1.2"] && !BO["safari2.0"]; 
    return BO; 
} 
var BO = new detectBrowser(); 

//Image Preloader from http://warpspire.com/tipsresources/interface-scripting/image-preloading-revisited/
var Preloader = {
  callbacks: [],
  images: [],
  loadedImages: [],
  imagesLoaded: 0,
  
  add: function(image){
    if (typeof image == 'string') this.images.push(image);
    if (typeof image == 'array' || typeof image == 'object'){
      for (var i=0; i< image.length; i++){
        this.images.push(image[i]);
      }
    }
  },
  onFinish: function(func){
    if (typeof func == 'function') this.callbacks.push(func);
    if (typeof func == 'array' || typeof func == 'object'){
      for (var i=0; i< func.length; i++){
        this.callbacks.push(func[i]);
      }
    }
  },
  load: function(){
    for(var i=0; i<this.images.length; i++){
      this.loadedImages[i] = new Image();
      this.loadedImages[i].onload = function(){ Preloader.checkFinished.apply(Preloader) }
      this.loadedImages[i].src = this.images[i];
    }
  },
  
  checkFinished: function(){
    this.imagesLoaded++;
    if (this.imagesLoaded == this.images.length) this.fireFinish();
  },
  fireFinish: function(){
    for (var i=0; i<this.callbacks.length; i++){
      this.callbacks[i]();
    }
    this.images = [];
    this.loadedImages = [];
    this.imagesLoaded = 0;
    this.callbacks = [];
  }
}