//var myNav = new ImageNav($$('#kwick .kwick'),320,onClick function);
var ImageMenu = new Class({
	
	initialize: function(myElements,options){
		options = Object.extend({
			onClick: Class.empty,
			start: -1,
			openWidth: 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: 400, transition: Fx.Transitions.quadOut});
		
		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();
			});
			
			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();
		}
	},
	
	reset: function(){
		this.options.selected = -1;
		this.options.open = -1;
		this.myElements.each(function(el, i){
			el.hide();
		});
	}
	
});

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->