
document.observe("dom:loaded",function(){
	initMenu();
	var config = {
		images:images,
		frameEl:'framePic',
		thumbEl:'thumbsCon',
		scrollUpEl: 'scrollUpButton',
		scrollDownEl: 'scrollDownButton'
	};
	var pv = new PhotoViewer(config);
	pv.init();
	pv.startSlideShow();
});

/**
 * frameEl
 * thumbEl
 * images
 * scrollUpEl
 * scrollDownEl
 **/
function PhotoViewer(config) {

  this.config = config;
  this.visible = new Array();
  this.images = new Array();
  this.topMax = 525;
  this.topMin = 30;
  this.scrollNum = 8;
  this.scrollIdx = 0;
  this.slideDelay = 8300;
  this.eventQ = [];

  this.showImage = function(img,caption) {
    this.transition(function(caption) {
	this.clearImage();
	$(this.config.frameEl).style.background = "url(" + img + ") left no-repeat";
	this.showCaption(caption);
    }.bind(this,caption));
  };

  this.clearImage = function() {
    var f = $(this.config.frameEl);
    f.style.background = "";
    f.innerHTML = "<div id=\"captions\"></div>";
  };

  this.showAvail = function() {
	this.stopSlideShow();
	var html = "<iframe src=\"http://www.google.com/calendar/embed?height=450&amp;wkst=1&amp;bgcolor=%23ffffff&amp;src=jck86iafq9t0vnlbo6gj8rvfc4%40group.calendar.google.com&amp;color=%23AB8B00&amp\" style=\" border-width:0 \" width=\"840\" height=\"560\" frameborder=\"0\" scrolling=\"no\"></iframe>";
	this.showHtml(html);
  };

  this.showContactForm = function(){
	this.stopSlideShow();
	var html = "<div class='contact' style='height:560px;width:840px;background:url(img/Contact.jpg);'>";
	html += "<div class='contactForm'>";
	html += "<iframe src='notify.php' class='contactFrame' frameborder=0 ALLOWTRANSPARENCY=\"true\" scrolling='no'></iframe>";
	html += "</div>";
	html += "</div>";
	this.showHtml(html);
  };

  this.showHtml = function(html) {
    this.transition(function() {
	this.clearImage();
	$(this.config.frameEl).innerHTML = html;
    }.bind(this));
  };

  this.transition = function(f) {
	new Effect.Fade($(this.config.frameEl),{
		afterFinish:function(fn) {
		    fn();
		    setTimeout(function(){new Effect.Appear($(this.config.frameEl))}.bind(this),1700);
		}.bind(this,f),
		duration: 1.5
	});
  };

  this.showCaption = function(txt) {
    var capDiv = $('captions');
    if (!capDiv) {
	capDiv = document.createElement("div");
	capDiv.id = "captions";
	$(this.config.frameEl).appendChild(capDiv);
    }
    if (txt) {
	capDiv.innerHTML = "<p>" + txt + "</p>";
    }
    var img = $('toggle_cap_image');
    if (img.src.search("img/captions_off.png") != -1) { //captions are off
	capDiv.style.display = "none";
    }
  };

  this.handleEvent = function() {
    if (this.eventQ.length > 0) {
      var e = this.eventQ[0];
      this.eventQ = this.eventQ.splice(0,1);
      e();
    }
    setTimeout(this.handleEvent.bind(this),500);
  };

  this.init = function() {
	Event.observe($(this.config.scrollUpEl),'click',this.scrollUp.bind(this));
	Event.observe($(this.config.scrollDownEl),'click',this.scrollDown.bind(this));
	for (var i = 0; i < this.config.images.length; i++) {
		var img = document.createElement("div");
		img.className = 'thumb';
		img.innerHTML = "<img src='" + this.config.images[i].thumbLink + "'/>";
		this.images[i] = img;
		$(this.config.thumbEl).appendChild(img);
		Event.observe(img,'click',function(n){
			this.stopSlideShow();
			var timg = this.config.images[n];
			this.showImage(timg.link, timg.cap);
			this.currentPic = parseInt(n);
		}.bind(this,[i]));
	}
	Event.observe($('start'),'click',function() {
		this.stopSlideShow();
		this.startSlideShow();
	}.bind(this));
	if ($('contactAnchor'))
	    Event.observe($('contactAnchor'),'click',this.showContactForm.bind(this));
	if ($('faqAnchor'))
	    Event.observe($('faqAnchor'),'click',this.showMenuItem.bind(this,'img/FAQs.jpg'));
	if ($('investmentAnchor'))
	    Event.observe($('investmentAnchor'),'click',this.showMenuItem.bind(this,'img/Investment.jpg'));
	if ($('aboutAnchor'))
	    Event.observe($('aboutAnchor'),'click',this.showMenuItem.bind(this,'img/About.jpg'));
	if ($('availAnchor'))
	    Event.observe($('availAnchor'),'click',this.showAvail.bind(this));
	if ($('productsAnchor'))
	    Event.observe($('productsAnchor'),'click',this.showMenuItem.bind(this,'img/Products.jpg'));
	Event.observe($('stop'),'click',this.stopSlideShow.bind(this));
	Event.observe($('forward'),'click',this.forward.bind(this));
	Event.observe($('back'),'click',this.back.bind(this));
	Event.observe($('thumbToggle'),'click',this.toggleThumbs.bind(this));
	Event.observe($('toggle_cap_image'), 'click', this.toggleCaptions.bind(this));
  };

  this.showMenuItem = function(image) {
    this.stopSlideShow();
    this.showImage(image);
  };

  this.toggleThumbs = function() {
	if (!this.thumbsShowing) {
// 		this.eventQ[this.eventQ.length] = this.toggleThumbsFn.bind(this,true,Effect.SlideLeftOut,"thumbOpen");
		this.toggleThumbsFn(true,Effect.SlideLeftOut,"thumbOpen");
	} else {
// 		this.eventQ[this.eventQ.length] = this.toggleThumbsFn.bind(this,false,Effect.SlideRightIn,"thumbClose");
		this.toggleThumbsFn(false,Effect.SlideRightIn,"thumbClose");
	}
  };

  this.toggleThumbsFn = function(showing,effect,classNameStr) {
	var ctlEl = document.getElementById("thumbToggle");
	this.thumbsShowing = showing;
	new effect('thumbs',{duration:1.5});
	ctlEl.className = ctlEl.className.replace("thumbOpen","");
	ctlEl.className = ctlEl.className.replace("thumbClose","");
	ctlEl.className += " " + classNameStr;
  };

  this.toggleCaptions = function() {
    var img = $('toggle_cap_image');
    var caps = $('captions');
    if (img.src.search("img/captions_on.png") != -1) { //turn off
	img.src = "img/captions_off.png";
	if (caps) {
	    new Effect.SlideDownOut(caps);
	}
    } else {
	img.src = "img/captions_on.png";
	if (caps) {
	    new Effect.SlideUpIn(caps);
	}
    }
  };

  this.scrollUp = function() {
	if (this.scrollIdx - this.scrollNum < 0) {
		return;
	}
	this.scrollIdx -= this.scrollNum;
	this._scroll(70);
  };

  this.scrollDown = function() {
	if (this.scrollIdx + this.scrollNum >= this.images.length) {
		return;
	}
	this.scrollIdx += this.scrollNum;
	this._scroll(-70);
  };

  this._scroll = function(y) {
	var len = this.images.length;
	if (len <= this.scrollNum) {
		return;
	}
	y = this.scrollNum * y;
	for (var i = 0; i < len; i++) {
		new Effect.Move(this.images[i],{x:0,y:y,mode:'relative'});
	}
  };

  this.startSlideShow = function() {
	//this.timeoutId = setTimeout(this.slide.bind(this),this.slideDelay);
	this.slide();
  };

  this.stopSlideShow = function() {
	clearTimeout(this.timeoutId);
  };

  this.slide = function() {
	this.move(1);
	this.timeoutId = setTimeout(this.slide.bind(this),this.slideDelay);
  };

  this.forward = function() {
	this.stopSlideShow();
	this.move(1);
  };

  this.back = function() {
	this.stopSlideShow();
	this.move(-1);
  };

  this.move = function(i) {
	if (this.currentPic == undefined || this.currentPic == "undefined" ||
		this.currentPic >= this.config.images.length ||
		this.currentPic < 0) {
		this.currentPic = 0;
	} else {
		this.currentPic += i;
	}
	var timg = this.config.images[this.currentPic];
	this.showImage(timg.link, timg.cap);
  };

  this._setButton = function(enabled,el,imgSrc) {
	if (!enabled) {
		Event.stopObserving(el);
	} else {
		Event.observe(el,'click',enabled);
	}
	if (imgSrc) {
		el.innerHtml = "<img src='" + imgSrc + "'/>";
	}
  };
};
