/**************************************************************

	Script	: Image Menu
	Version	: 2.2
	Authors	: Samuel Birch
	Desc	: Modified by © dev.xiligroup 081129 to be mootools 1.2.x compatible (need mootools-core and more depending other js)
	Licence	: Open Source MIT Licence

**************************************************************/

var ImageMenu = new Class({

	Implements: [Options, Events],
	options:
		{
			defaultVal: 'something',
			onOpen: -1,
			onClose: $empty,
			onStart: $empty,
			openWidth: 200,
			transition: Fx.Transitions.Quad.easeOut,
			duration: 500,
			open: null,
			border: 0

	},

	initialize: function(elements, options){
		this.setOptions(options);

		this.elements = $$(elements);

		this.widths = {};
		this.widths.closed = this.elements[0].getStyle('width').toInt();
		this.widths.openSelected = this.options.openWidth;
		this.widths.openOthers = Math.round(((this.widths.closed*this.elements.length) - (this.widths.openSelected+this.options.border)) / (this.elements.length-1))


		this.fx = new Fx.Elements(this.elements, {wait: false, duration: this.options.duration, transition: this.options.transition});

		this.elements.each(function(el,i){
			el.addEvent('mouseenter', function(e){
			new Event(e).stop();
			this.reset(i);

			}.bind(this));

			el.addEvent('mouseleave', function(e){
			new Event(e).stop();
			this.reset(this.options.open);

			}.bind(this));

			var obj = this;

			el.addEvent('click', function(e){

				var openfunc = $type(obj.options.onOpen);
				if (openfunc != 'number'){
					new Event(e).stop();
					if(obj.options.open == i){
						obj.options.open = null;

						obj.closing(this.href, i);
					} else {
						obj.options.open = i;
						obj.runme(this.href, i);
					}
				}
			})

		}.bind(this));

			if($type(this.options.open) == 'number'){
				this.reset(this.options.open);
			}
	},

	reset: function(num){
		if($type(num) == 'number'){
			var width = this.widths.openOthers;
			if(num+1 == this.elements.length){
				width += this.options.border;
			}
		}else{
			var width = this.widths.closed;
		}

		var obj = {};
		this.elements.each(function(el,i){
			var w = width;
			if(i == this.elements.length-1){
				w = width+5
			}
			obj[i] = {'width': w};
		}.bind(this));

		if($type(num) == 'number'){
			obj[num] = {'width': this.widths.openSelected};
		}

		this.fx.start(obj);

	},
//THIS PART IS THE INTERESTING BIT
		//..do some things
	runme: function(e,i){
		this.fireEvent('open', [e,i], 10);
	},

	closing: function(e,i){
		this.fireEvent('close', [e,i], 10);
	}

});

ImageMenu.implement(new Options);
ImageMenu.implement(new Events);


/*************************************************************/