var base = base || "/";
var aLoader = false;
var imgs = [];
var _gaq=_gaq||[];

function displayImage(image, el){
	Slimbox.open(base+'images/gallery/large/'+image+'.jpg', $(el).get('html'), {overlayOpacity: 0.5});
}

window.addEvent('domready', function(){
	var as = $('ArtistSelect');
	if (as) convertToDD(as).replaces(as);
	var cs = $('CategorySelect');
	if (cs) convertToDD(cs).replaces(cs);
	
	if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
		$$('a.thumb').each(function(a){
			var iid = a.id.substr(3);
			imgs.push(iid);
			a.addEvent('click', function(){
				aLoader = new ArtLoader({
					width: 890,
					height:450,
					artID: iid
				});			
				return false;
			});
		});
	}
	
	var url = new String(window.location);
	var index = url.indexOf('#');
	var hash = url.substr(index+1);
	if(index >=0 && hash.match(/^img[0-9]+$/)) {
		if ($(hash)) $(hash).fireEvent('click');
	}
});

function convertToDD(as){
	var dd = new Element('select', {events:{'change':function(){location.href=this.value;}}});
	as.getElements('a').each(function(a){
		var h = a.get('href');
		var n = a.get('html');
		if (a.hasClass('selected')) new Element('option',{'value':h,'html':n,'selected':'selected'}).inject(dd);
		else new Element('option',{'value':h,'html':n}).inject(dd);
	});
	return dd;
}








var ArtLoader = new Class({
	Implements: [Options, Events],
	options: {
		title: 'no title',
		width: 450,
		height: false,
		overlay: true,
		overlayEscapes: true,
		overlayOpacity: 0.6,
		closeButtonAlt: 'Close Window',
		allowEscape: true,
		allowFade: true,
		offsetTop: 0,
		data: new Element('div'),
		artID: false
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.escapeModal = function(e) { if(e.key == 'esc') { this.destruct(); } }.bind(this);
		this.closeModal = function() { this.destruct();}.bind(this);
		this.drawPopup();
		this.options.imgs = imgs;
	},
	
	drawPopup: function(){
		if(this.options.overlay) this.createOverlay();
		this.popup();
	},
	
	createOverlay: function(){
		this.overlay = new Element('div').setProperty('class', 'fboverlay').injectInside(document.body);
		this.overlay.setStyles({opacity: this.options.overlayOpacity});
	},
	
	getScrollbarWidth: function(){
		if (!Browser.Engine.webkit) return 0;
		document.body.style.overflow = 'hidden';
		var width = document.body.clientWidth;
		document.body.style.overflow = 'scroll';
		width -= document.body.clientWidth;
		if(!width) width = document.body.offsetWidth-document.body.clientWidth;
		document.body.style.overflow = '';
		return width;
	},
	
	positionEls: function(){
		var scrToTop = Window.getScrollTop();
		if(this.overlay) {
			this.overlay.setStyles({top: scrToTop+'px', height: Window.getHeight()+'px', width: (Window.getWidth() + Window.getScrollLeft()-this.getScrollbarWidth())+'px'});
		}
		var fbpopupHeight = this.infobox.getHeight() / 2;
		var totop = (window.getSize().y / 2)  + this.options.offsetTop + window.getScrollTop() - fbpopupHeight;
		if (totop < scrToTop) totop = scrToTop;
		else if (totop < 0) totop = 0;
		var toleft = (window.getSize().x / 2) - (this.options.width /2);
		if (toleft < 0) toleft = 0;
		this.infobox.setStyles({top: totop+'px', left: toleft + 'px'});
	},
	
	popup: function (){
		this.infobox = new Element('div', {'class':'modalHolder'});
		this.innerbox = new Element('div',{'class':'modalInner','style':'width:'+this.options.width+'px'}).inject(this.infobox);
		if (this.options.height) this.innerbox.setStyles({
			'height': this.options.height+'px'
		});

		if(this.options.allowFade) {	this.infobox.setStyles({'opacity': 0, 'visibility': 'hidden'});}
		this.infobox.injectInside(document.body);		
		// Center items
		this.positionEls();
		
		if(this.options.allowFade)  {
			var myFx = new Fx.Tween(this.infobox);
			myFx.start('opacity', '0', 1);
		}
		
		this.infobox.setStyle('background-image','url('+base+'images/bg/'+this.infobox.getWidth()+'-'+this.infobox.getHeight()+'-5.png)');
		
		if(this.options.allowEscape)  document.addEvent('keydown',this.escapeModal);
		
		this.centerItems = function(){	this.positionEls();}.bind(this)
		window.addEvents({ 
			'resize': this.centerItems,
			'scroll': this.centerItems
		});
		if (this.options.overlay && this.options.overlayEscapes) this.overlay.addEvent('click', this.closeModal);
		this.loadURL(this.options.artID);
	},
	
	loadURL: function(id){
		this.setHash('img'+id);
		this.innerbox.empty();
		this.imageDiv = new Element('div',{'class':'imageDiv'}).inject(this.innerbox);
		this.infoDiv = new Element('div',{'class':'infoDiv'}).inject(this.innerbox);
		this.loader = new Element('div',{'class':'loader','html':'Loading... please wait'}).inject(this.imageDiv);
		this.close = new Element('a',{'title':this.options.closeButtonAlt, 'class':'closebtn', events:{'click':function(){this.destruct();}.bind(this)}}).inject(this.infoDiv);
		this.postJSON(base+'art', 'id='+id+'&b='+base, function(result){
			var totIdx = imgs.length;
			var curIdx = imgs.indexOf(id)+1;
			artInfo = new Element('div',{'class':'artInfo'}).inject(this.infoDiv);
			
			var lr = new Element('div',{'class':'prevnext','html': curIdx+' of '+totIdx}).inject(this.infoDiv);
			var r = new Element('a',{'class':'right', 'html':'Next &gt;&gt;',events:{
					'click':function(){
						if (imgs[curIdx]) this.loadURL(imgs[curIdx]);
						else this.loadURL(imgs[0]);
					}.bind(this)
				}
			}).inject(lr,'top');
			var l = new Element('a',{'class':'left', 'html':'&lt;&lt; Prev',events:{
					'click':function(){
						if (imgs[curIdx-2]) this.loadURL(imgs[curIdx-2]);
						else this.loadURL(imgs[imgs.length-1]);
					}.bind(this)
				}}).inject(lr,'top');
			
			var e = new Hash(result.i);
			e.each(function(data,key){
				if(data){
					var p = new Element('div',{'html':data});
					var l = new Element('label',{'html':key, 'class':'label'+key.replace(/[^a-zA-Z]/,'')}).inject(p, 'top');
					p.inject(artInfo);
				}
			}.bind(this));
			artInfo.inject(this.infoDiv);
			var myImage = Asset.image(base+'images/gallery/large/'+result.image+'.jpg', {
				onLoad: function(){
					var bgImg = base+'images/bg/'+(myImage.width+25)+'-'+(myImage.height+25)+'-5.png';
					var myBG = Asset.image(bgImg, {
						onLoad: function(){
							var marginToTop = ((this.options.height - 25 - myImage.height) / 2);
							var iholder = new Element('div',{'class':'artHolder','styles':{'margin':marginToTop+'px auto 0','width':(myImage.width+25)+'px','height':(myImage.height+25)+'px',
								'background-image':'url('+bgImg+')'}});
							var i = new Element('img',{'src':base+'images/gallery/large/'+result.image+'.jpg'}).inject(iholder);
							this.imageDiv.empty();
							iholder.inject(this.imageDiv);
						}.bind(this)
					});
				}.bind(this),
				onError: function(){
					this.loader.set('html', 'Image Not Found');
					this.loader.setStyle('background', 'none');
				}.bind(this)
			});
		}.bind(this));
	},
	
	setHash: function(hash){
		if (!hash) hash = '#art';
		else if(hash.substr(1)!='#') hash = '#' + hash;
		if(Browser.Engine.trident4 || Browser.Engine.trident5) { //ie6 and ie7
			var url = new String(window.location);
			var current = url.match(/#.+?$/);
			current = current && current[0] ? current[0] : '';
			if(current.length>0) window.location = url.replace(current,hash);
			else window.location += hash;
		}
		else { //other, more advanced browsers
			window.location.hash = hash;
		}
		return false;
	},
	
	destruct: function(){
		if(this.options.allowEscape) document.removeEvent('keydown', this.escapeModal);
		window.removeEvent('resize', this.centerItems);
		window.removeEvent('scroll', this.centerItems);
		if (this.overlay) this.overlay.destroy();
		if(this.options.allowFade) {
			new Fx.Tween(this.infobox).start('opacity',0).chain(
				function(){ this.infobox.destroy(); }.bind(this)
			);
		} else this.infobox.destroy();
		this.setHash(false);
	},
	
	postJSON: function(myurl, mydata, func){
		var myRequest = new Request({method: 'post', url: myurl,
			onSuccess: function(response){
				var result = $try(function(){ 
					return myObject = JSON.decode(response);},function(){ return false;}
				);
				if (result){ func(result);}
				else{this.dispError(response);}
			}.bind(this),
			onFailure: function(){this.dispError('Error retrieving data from '+myurl);}.bind(this)
		}).send(mydata);
	},
	
	dispError: function(msg){
		alert(msg);
	}
});









/* Assets */
//MooTools More, <http://mootools.net/more>. Copyright (c) 2006-2009 Aaron Newton <http://clientcide.com/>, Valerio Proietti <http://mad4milk.net> & the MooTools team <http://mootools.net/developers>, MIT Style License.
MooTools.More={version:"1.2.5.1",build:"254884f2b83651bf95260eed5c6cceb838e22d8e"};var Asset={javascript:function(f,d){d=$extend({onload:$empty,document:document,check:$lambda(true)},d);
if(d.onLoad){d.onload=d.onLoad;delete d.onLoad;}var b=new Element("script",{src:f,type:"text/javascript"});var e=d.onload.bind(b),a=d.check,g=d.document;
delete d.onload;delete d.check;delete d.document;b.addEvents({load:e,readystatechange:function(){if(["loaded","complete"].contains(this.readyState)){e();
}}}).set(d);if(Browser.Engine.webkit419){var c=(function(){if(!$try(a)){return;}$clear(c);e();}).periodical(50);}return b.inject(g.head);},css:function(b,a){a=a||{};
var c=a.onload||a.onLoad;if(c){a.events=a.events||{};a.events.load=c;delete a.onload;delete a.onLoad;}return new Element("link",$merge({rel:"stylesheet",media:"screen",type:"text/css",href:b},a)).inject(document.head);
},image:function(c,b){b=$merge({onload:$empty,onabort:$empty,onerror:$empty},b);var d=new Image();var a=document.id(d)||new Element("img");["load","abort","error"].each(function(e){var g="on"+e;
var f=e.capitalize();if(b["on"+f]){b[g]=b["on"+f];delete b["on"+f];}var h=b[g];delete b[g];d[g]=function(){if(!d){return;}if(!a.parentNode){a.width=d.width;
a.height=d.height;}d=d.onload=d.onabort=d.onerror=null;h.delay(1,a,a);a.fireEvent(e,a,1);};});d.src=a.src=c;if(d&&d.complete){d.onload.delay(1);}return a.set(b);
},images:function(d,c){c=$merge({onComplete:$empty,onProgress:$empty,onError:$empty,properties:{}},c);d=$splat(d);var a=[];var b=0;return new Elements(d.map(function(f,e){return Asset.image(f,$extend(c.properties,{onload:function(){c.onProgress.call(this,b,e);
b++;if(b==d.length){c.onComplete();}},onerror:function(){c.onError.call(this,b,e);b++;if(b==d.length){c.onComplete();}}}));}));}};