var ImageMenu = new Class({
	
	initialize: function(myElements,options){
		options = Object.extend({
			onClick: openThumbs,//Class.empty,
			start: -1,
			openWidth: 320,//0,
			smallWidth: 0,
			itemWidth: 0,
			selected: -1,
			open: -1
		}, options || {});
		
		this.myElements = myElements;
		this.options = options;
		
		options.itemWidth = myElements[0].getStyle('width').toInt();
		options.smallWidth = Math.round(((options.itemWidth*myElements.length)-options.openWidth)/(myElements.length-1));
		
		var fx = new Fx.Elements(myElements, {wait: false, duration: 300, transition: Fx.Transitions.Quad.easeOut});
		
		document.addEvent('keypress',keypress);
		
		function keypress(e){
			i=e.key.toInt()-1;
			switch (e.key){
				
				case '1':
				case '2':
				case '3':
				case '4':
				case '5':
				case '6':
				case '7':	
					if (i!=options.selected) 
					{ myElements[i].show();}
					myElements[i].select();
					if (options.selected==-1){ myElements[i].hide();}
					break;
				/* case 'x':
					if (options.selected!=-1){
						myElements[options.selected].select();
						myElements[0].hide();
					}
					break; */
				default:
					break;
			} 				
		};
		
		myElements.each(function(el, i){
			el.addEvent('mouseover', function(e){
				e = new Event(e).stop();
				el.show();
			});
			
			el.addEvent('click', function(e){
				el.select();
			});
			
			el.addEvent('mouseout', function(e){
				e = new Event(e).stop();
				el.hide();
			});
			
			/* window.addEvent('keypress',function(e){
				if((e.key.toInt()==i+1) && (i!=options.selected)) {
					el.select();
					el.show();
				}
				else if (e.key=="x" && i==options.selected) {
					el.select();
					el.hide();
				}
			}); */
			
			el.show = function(){
				var obj = {};
				obj[i] = {'width': [el.getStyle('width').toInt(), options.openWidth]};
				myElements.each(function(other, j){
					if (other != el){
						var w = other.getStyle('width').toInt();
						if (w != options.smallWidth) obj[j] = {'width': [w, options.smallWidth]};
					}
				});
				fx.start(obj);
			};
			
			el.hide = function(){
				var obj = {};
				if(options.selected == -1){
					myElements.each(function(el,i){
						obj[i] = {'width': [el.getStyle('width').toInt(), options.itemWidth]};	
					});
				}else{
					myElements.each(function(el,i){
						if(i != options.selected){
							var w = el.getStyle('width').toInt();
							if(w != options.smallWidth){obj[i] = {'width': [w, options.smallWidth]}};
						}else{
							obj[i] = {'width': [el.getStyle('width').toInt(), options.openWidth]};
						}
					});
				}
				fx.start(obj);
			};
			
			el.select = function(){
				if(options.selected == i){options.selected = -1}else{options.selected = i}
				options.onClick(options.selected ,options.open);
				options.open = options.selected;
			};
		});
		
		if(options.start != -1){
			myElements[options.start].show();
			myElements[options.start].select();
		}
	},
	
	open: function(i){
		this.options.selected = i;
		this.myElements.each(function(el,j){
			if (i==j) {
				el.show();
				openThumbs(i,-1);
			}
			else el.hide();
		});
	},
	
	reset: function(){
		this.options.selected = -1;
		this.options.open = -1;
		this.myElements.each(function(el, i){
			el.hide();
		});
	}
	
});

function openThumbs(selected, open){
	var thumbs = $$('.thumbnailContainer');
	var item=$$('#navcontainer a')[selected];
	//var loader=$('ajaxLoading');
	var thumbFx = new Fx.Elements(thumbs, {wait: false, duration: 400, transition: Fx.Transitions.Quad.easeOut});
	var thumbFx2 = new Fx.Elements(thumbs, {wait: false, duration: 400, transition: Fx.Transitions.Quad.easeIn});
	var loaded=false;
	
	var obj={};
	obj[0]={'height': [thumbs[0].getStyle('height').toInt(), 0]};//[thumbToClose]
	thumbFx2.start(obj).chain(function(){
		if (selected != -1){
			thumbs[0].setStyle('display','block');
			if (myJax.isCached(item)){
				myJax.pageLoaded(item);
				loaded=true;
			}else{
				myJax.container.set('html','');
			}
			obj[0]={'height': [thumbs[0].getStyle('height').toInt(),thumbsHeight(item)]};
			
			thumbFx.start(obj).chain(function(){
				if (!loaded){
					myJax.cacheThis(item);
				}});
		}else{
			thumbs[0].setStyle('display', 'none');
		}
	});
};

function thumbsHeight(item){
	numThumbs = item.rel.match(/[0-9]+/g);
	numRows = Math.ceil(numThumbs/6);
	nextLinks = numThumbs>(18+6)?24:0;//numRows > 3 ? 24 : 0;
	numRows = numRows > 3 ? 3 : numRows;
	margins = 2;
	return (numRows*128+nextLinks+margins).toInt();
};

