PopupGallery = Class.create();
PopupGallery.prototype = {
	controller: null,

 	initialize: function(items) {
		this.items = items;

		if (this.items.length>0) {
			this.createPopup();
			this.setDefaults();
			this.setItemAttributes();
		}
	},

 	createPopup: function() {
		this.closeBtn = Builder.node('a', {href:'#close', 'class':'close'}, 'Close');
		Event.observe(this.closeBtn, 'click', this.close.bindAsEventListener(this), false);

		this.popupimg = Builder.node('img', {'class':'popupimg', border:0});
		this.popupnav = Builder.node('div', {'class':'popupnav'});

		this.popup = Builder.node('div', {'id':'popup', 'class':'popup'}, [
			this.closeBtn,
			this.popupimg,
			this.popupnav
		]);
		
 		this.popupshadow = Builder.node('div', {id:'popupshadow', 'class':'popupshadow'}, [
 			Builder.node('img', {src:'/js/popup_shadow20070807.png', alt:'', border:0})
 		]);

 		document.body.appendChild(this.popupshadow);
 		document.body.appendChild(this.popup);
 	},

 	setDefaults: function() {
		this.defaultWidth = this.popup.offsetWidth;
		this.padleft = parseInt(Element.getStyle(this.popup, 'marginLeft').replace(/px/i,''));
		this.padright = parseInt(Element.getStyle(this.popup, 'marginRight').replace(/px/i,''));

		this.defaultHeight = this.popup.offsetHeight;
		this.padtop = parseInt(Element.getStyle(this.popup, 'marginTop').replace(/px/,''));
		this.padbottom = parseInt(Element.getStyle(this.popup, 'marginBottom').replace(/px/,''));
 	},

 	setItemAttributes: function() {
 		for (var i=0; i<this.items.length; i++) {
 			var item = this.items[i]; 

			item.img = new Image();
			item.img.src = item.href;
			item.img.alt = item.down().alt;
			item.img.alt = item.img.alt.replace(/: click to enlarge/i, '');

			item.nav = this.getNav(item);

			item.trackClick = function() {
			//	clickTracking(this.img.src, document.title +' - '+ this.img.src);
			}

 			this.setEvent(item, i);
 		}

	},

 	setEvent: function(item, i) {
		Event.observe(item, 'click', this.onClick.bindAsEventListener(this, item, i), false);
	},

 	onClick: function(evt, item, i) {
 		// store the small size and position for later
		this.left = evt.pageX || evt.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
		this.left -= this.width/2;
		this.left = this.left || document.body.getDimensions().width / 2;
		this.width = (item.offsetWidth>80) ? 80 : item.offsetWidth;
		this.height = item.offsetHeight;
		this.top = evt.pageY || evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
		this.top -= this.height/2;
		
		if (AC.Detector.isiPhone()) {
		    this.left = 3;
		    this.top = 200;
		}
		
		// stop the default event
 		Event.stop(evt);

		// track this click
	 	if (item.trackClick) item.trackClick();

		// do the image
		this.prepPop(evt, item, i);
 	},

 	getNav: function(item) {
 		var wrapper = item.up('ul');
 		var siblings = wrapper.getElementsByClassName('popupthumb');

 		var items = [];
 		for (var i=0; i<siblings.length; i++) {
 			var cloned = siblings[i].cloneNode(true);
 			if (item == siblings[i]) Element.addClassName(cloned, 'active')
	 		items.push(Builder.node('li', cloned));
 		}

		var list = Builder.node('ul', {'class':'w'+siblings.length}, items)
		return list;
 	},

	setNav: function(item, i) {
		this.popupnav.innerHTML = '';

		// set up the nav
		this.popupnav.appendChild(item.nav);
 		var items = $$('.'+this.popupnav.className+' .'+'popupthumb');
 		for (var j=0; j<items.length; j++) {
 			Event.observe(items[j], 'click', this.swapImage.bindAsEventListener(this, items[j], j, i))
		}
	},

 	swapImage: function(evt, item, j, i) {
		Event.stop(evt);

		// swap the nav
 		var items = $$('.'+this.popupnav.className+' .'+'popupthumb');
 		for (var k=0; k<items.length; k++) {
 			if (items[k].href==item.href) {
 				var clicked = items[k];
		 		Element.addClassName(clicked, 'active');
 			} else {
	 			Element.removeClassName(items[k], 'active')
	 		}
 		}
			

		// swap the image
 		this.popupimg.src = clicked.href;
 		this.popupimg.alt = clicked.down().alt.replace(/: click to enlarge/i, '');

		// track the click
	//	clickTracking(clicked.href, document.title +' - '+ clicked.href);
 	},

	windowSize: function() {
		var width = window.innerWidth || (window.document.documentElement.clientWidth || window.document.body.clientWidth);
		var height = window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight);
		var x = window.pageXOffset || (window.document.documentElement.scrollLeft || window.document.body.scrollLeft);
		var y = window.pageYOffset || (window.document.documentElement.scrollTop || window.document.body.scrollTop);
		
		if(AC.Detector.isiPhone()) {
			width = parseInt(980);
			height = parseInt(1212);
		}

		return {'width':width, 'height':height, 'x':x, 'y':y}
	},

 	setPopPosition: function() {
		// set the position/offset of the image
		var left, top = null;

		left = this.windowSize().x+(this.windowSize().width-this.defaultWidth-this.padleft-this.padright)/2;
		if (this.windowSize().width<this.defaultWidth+this.padleft+this.padright) left = this.windowSize().x-(this.padtop-this.closeBtn.offsetWidth);

		top = this.windowSize().y+(this.windowSize().height-this.defaultHeight-this.padtop-this.padbottom)/2;
		if (this.windowSize().height<this.defaultHeight+this.padtop+this.padbottom) top = this.windowSize().y-(this.padtop-this.closeBtn.offsetHeight);
		
		return { left:left, top:top };
 	},

 	prepPop: function(evt, item, i) {
		// set the source for image in the popup
 		this.popupimg.src = item.img.src;
 		this.popupimg.alt = item.img.alt;

		// set up the nav
		this.setNav(item, i);
		
		// call the effect
		this.pop(this.defaultWidth, this.setPopPosition().top, this.defaultHeight, this.setPopPosition().left, item, i);
	},

 	beforePop: function() {
		Element.addClassName(this.popup, 'isanim');
		Element.addClassName(this.popupshadow, 'isanim');
 	},

 	pop: function(width, top, height, left, item, i) {
		// prep the popup/shadow for the effect
		this.popup.style.width = this.width+'px';
		this.popupshadow.style.width = this.width+'px';

		this.popup.style.height = this.height+'px';
		this.popupshadow.style.height = this.height+'px';

		this.popup.style.left = this.left+'px';
		this.popupshadow.style.left = this.left+'px';

		this.popup.style.top = this.top+'px';
		this.popupshadow.style.top = this.top+'px';

		Element.setOpacity(this.popup, 0);
		Element.setOpacity(this.popupshadow, 0);

		if (!AC.Detector.isiPhone()) {
			// do the craziness
			new Effect.Parallel([
					new Effect.MoveBy(this.popup, top-this.top, left-this.left, { sync:true }), 
					new Effect.MoveBy(this.popupshadow, top-this.top, left-this.left, { sync:true }), 
					new Effect.Scale(this.popup, (width/this.width)*100, { sync:true, scaleY:false, scaleContent:false }),
					new Effect.Scale(this.popupshadow, ((width+this.padleft+this.padleft)/this.width)*100, { sync:true, scaleY:false, scaleContent:false }),
					new Effect.Scale(this.popup, (height/this.height)*100, { sync:true, scaleX:false, scaleContent:false }),
					new Effect.Scale(this.popupshadow, ((height+this.padtop+this.padbottom)/this.height)*100, { sync:true, scaleX:false, scaleContent:false }),
					new Effect.Appear(this.popup, { sync:true }),
					new Effect.Appear(this.popupshadow, { sync:true })
				],
				{ duration:.3, beforeStart:this.beforePop.bind(this), afterFinish:this.afterPop.bind(this, item, i) }
			);
		} else {
			this.beforePop();
			this.afterPop();
		}
	},

 	afterPop: function(item, i) {
		Element.removeClassName(this.popup, 'isanim');
		Element.removeClassName(this.popupshadow, 'isanim');
		Element.addClassName(this.popup, 'popped');
		Element.addClassName(this.popupshadow, 'popped');

		this.popup.style.width = '';
		this.popupshadow.style.width = '';

		this.popup.style.height = '';
		this.popupshadow.style.height = '';

		Element.setOpacity(this.popup, '');
		Element.setOpacity(this.popupshadow, '');
 	},

 	beforeClose: function() {
		Element.addClassName(this.popup, 'isanim');
		Element.addClassName(this.popupshadow, 'isanim');
 		Element.removeClassName(this.popup, 'popped');
 		Element.removeClassName(this.popupshadow, 'popped');
 	},

 	 	close: function(evt) {
 		if (evt) Event.stop(evt);
		this.getSurvey('http://filemaker.custhelp.com/cgi-bin/filemaker.cfg/php/enduser/doc_serve.php?&5=12#'+s.prop6)
		var width = this.defaultWidth;
		var left = this.popup.offsetLeft;
		var height = this.defaultHeight;
		var top = this.popup.offsetTop;

		if (!AC.Detector.isiPhone()) {
			// do the craziness
			new Effect.Parallel([
				new Effect.MoveBy(this.popup, this.top-top, this.left-left, { sync:true }), 
				new Effect.MoveBy(this.popupshadow, this.top-top, this.left-left, { sync:true }), 
				new Effect.Scale(this.popup, (this.width/width)*100, { sync:true, scaleY:false, scaleContent:false }),
				new Effect.Scale(this.popupshadow, (this.width/(width+this.padleft+this.padleft))*100, { sync:true, scaleY:false, scaleContent:false }),
				new Effect.Scale(this.popup, (this.height/height)*100, { sync:true,scaleX:false, scaleContent:false }),
				new Effect.Scale(this.popupshadow, (this.height/(height+this.padtop+this.padbottom))*100, { sync:true, scaleX:false, scaleContent:false }),
				new Effect.Fade(this.popup, { sync:true }),
				new Effect.Fade(this.popupshadow, { sync:true })
			],
			{ duration:.3, beforeStart:this.beforeClose.bind(this), afterFinish:this.afterClose.bind(this) });
		} else {
			this.beforeClose();
			this.afterClose();
		}
	},
	getSurvey: function(url){
		//alert('hi')
		
		//added by DLV 
		//initated by the closing of the window 'this.close'
		//url should contain #s.prop6. this is the page title plus alt tag on each video 
		//Build Survey
		survey=Builder.node('div', { id:'survey', style: 'display: none;background: url(/images/icons/spinner.gif) no-repeat center center;' }, [Builder.node( 'iframe',{id:'surveyFrame',src:'', style: 'border:0px solid white;width: 696px;height: 550px'} )]);
		
 		document.body.appendChild(survey);
		//Make sure Modalbox is loaded
		if(!window.Modalbox){return}
		if(getCookie('VideoSurvey')){return false;}
		//Randomly pop up survey
		rand=Math.random()
		if(rand>.5){return;}
		var el = $('surveyFrame');
		if (el && (el.src || el.src=='')) {
		el.src = url;
		Modalbox.show($('survey'), {title: "Survey", width: 721})
		expdate = new Date();
		expdate.setTime(expdate.getTime()+(365 * 24 * 60 * 60 * 1000));
		setCookie('VideoSurvey','true',expdate)
		return false;
		
		}
    return true;
	},
 	afterClose: function() { 
		Element.removeClassName(this.popup, 'isanim');
		Element.removeClassName(this.popupshadow, 'isanim');

		// reset everything
		this.popup.style.width = '';
		this.popupshadow.style.width = '';

		this.popup.style.height = '';
		this.popupshadow.style.height = '';

		this.popup.style.left = '';
		this.popupshadow.style.left = '';

		this.popup.style.top = '';
		this.popupshadow.style.top = '';

		this.popup.style.display = '';
		this.popupshadow.style.display = '';

		if (AC.Detector.isWebKit()) this.fixSafarisScrollBars();
 	},

 	fixSafarisScrollBars: function() {
		scrollTo = 1;
		window.scroll(this.windowSize().x+scrollTo, this.windowSize().y+scrollTo);
		scrollTo = -scrollTo;
		window.scroll(this.windowSize().x+scrollTo, this.windowSize().y+scrollTo);
 	}

}

//Cookie stuff. sould be intergrated
function getCookie (name) {
  var arg = name + "=";
  var alen = arg.length;
  var clen = document.cookie.length;
  var i = 0;
  while (i < clen) {
    var j = i + alen;
    if (document.cookie.substring(i, j) == arg)
      return getCookieVal (j);
    i = document.cookie.indexOf(" ", i) + 1;
    if (i == 0) break; 
  }
  return null;
}
function getCookieVal (offset) {
  var endstr = document.cookie.indexOf (";", offset);
  if (endstr == -1)
    endstr = document.cookie.length;
  return unescape(document.cookie.substring(offset, endstr));
}
function setCookie (name,value,expires,path,domain,secure) {
  document.cookie = name + "=" + escape (value) +
    ((expires) ? "; expires=" + expires.toGMTString() : "") +
    ((path) ? "; path=" + path : "") +
    ((domain) ? "; domain=" + domain : "") +
    ((secure) ? "; secure" : "");
}