var FormElements = function() {
	// Label inside
	$each($(document.body).getElements('label.inside'), function(label) {
		var input = $(document.body).getElement('input[name='+label.get('for')+']');
		label.inject(input, 'before');
		if (input.getStyle('text-align')=='center') {
			label.setStyles({'width': input.getParent().getSize().x-10, 'left': '0'});
		}
		input.addEvents({
			'focus': function() { label.setStyle('display', 'none'); },
			'blur': function() { if (input.get('value')=='') label.setStyle('display', 'block'); }
		});
		
		if (input.get('value')=='') input.fireEvent('blur');
		else input.fireEvent('focus');
		
		label.addEvent('click', function() {
			input.fireEvent('focus');
			input.focus();
		});
	});
	// Submit button
	$each($(document.body).getElements('a.submit'), function(submit) {
		// Click
		submit.addEvent('click', function(e) {
			e.stop();
			if (!this.retrieve('disabled')) submit.getParent('form').getElement('input[type=submit]').click();
		});
	});
	// Focus / Blur
	$each($(document.body).getElements('input[type=text], textarea'), function(input) {
		input.addEvents({
			'focus': function() {
				this.getParent('form').store('focus', true);
				input.store('focus', true);
			},
			'blur': function() {
				input.eliminate('focus');
			}
		});
	});
	// Antispam
	$each($(document.body).getElements('form.antispam'), function(form) {
		form.addEvent('submit', function() {
			if (form.retrieve('focus') && $time()-timeStart>2000)
				new Element('input', {'type': 'text', 'name': 'Psj93o22', 'style': 'display: none;'}).inject(form);
		});
	});
	
	// Select 2
	$each($$('div.select2'), function(select) {
		select.getElement('select').addEvent('change', function() {
			select.getElement('span').set('html', this.getSelected().get('html'));
		});
		select.getElement('select').fireEvent('change');
	});
	// Resize Inputs text
	$each($$('div.input'), function(input, key) {
		if (input.getSize().x.toInt()>0)
		input.getElement('input[type=text]').setStyle('width', input.getSize().x.toInt()-20-input.getElement('input[type=text]').getStyle('padding-right').toInt());
	});
	// Rating
	if ($chk($(document.body).getElement('ul.rating'))) {
		var rating = $(document.body).getElement('input[name=rating]');
		$each($(document.body).getElement('ul.rating').getElements('li'), function(li, index) {
			li.addEvents({
				'mouseenter': function() {
					$each($(document.body).getElement('ul.rating').getElements('li'), function(li2, index2) {
						if (index2<=index) li2.setStyle('background-position', '-100px -140px');
						else if (index2<=rating.get('value').toInt()-1) li2.setStyle('background-position', '-100px -100px');
						else li2.setStyle('background-position', '-100px -120px');
					});
				},
				'mouseleave': function() {
					$each($(document.body).getElement('ul.rating').getElements('li'), function(li3, index3) {
						if (index3<=(rating.get('value').toInt()-1)) {
							li3.setStyle('background-position', '-100px -100px');
						} else li3.setStyle('background-position', '-100px -120px');
					});
				},
				'click': function() {
					rating.set('value', index+1);
				}
			});
		});
	}
}

// Disabled temporarely a form
var disableForm = function(form, disabled) {
	if ($chk(form))
		$each(form.getElements('input, select, textarea'), function(child) {
			if ($defined(disabled) || disabled==true)
				child.erase('disabled');
			else child.set('disabled', true);
		});
}

// Form (with request in ajax)
var Forms = new Class({
	initialize: function() {
		var obj = this;
		$each($(document.body).getElements('form.inside'), function(form) {
			// Prepare send event
			form.set('send', {url: '/sync'+form.get('action')+'?lang='+language, onSuccess: function(response) {
				response = JSON.decode(response);
				if ($defined(response.errors)) obj.showErrors(response.errors, form);
				else obj.showSuccess(response.success, form);
			}});
			// Submit event
			form.addEvent('submit', function(e) {
				e.stop();
				form.send();
			});
		});
	},
	
	// Error
	showErrors: function(errors, form) {
		if ($chk(form.getElement('p.success'))) form.getElement('p.success').destroy();
		if (!$chk(form.getElement('ul.error'))) var ul = new Element('ul', {'class': 'error'}).inject(form, 'top');
		else ul = form.getElement('ul.error').empty();
		$each(errors.split(','), function(error) { if (error!='') new Element('li', {'html': error}).inject(ul); });
	}, 
	// Success
	showSuccess: function(success, form) {
		if ($chk(form.getElement('ul.error'))) form.getElement('ul.error').destroy();
		new Element('p', {'class': 'success', 'html': success}).inject(form, 'top');
	}
});

// Select
var selectClass = new Class({
	interval: 100,
	timer: null,
	pos: 0,
	initialize: function (select) {
		this.select = select;
		this.prepare();
	},
	prepare: function() {
		var obj = this;
		// Hide select
		this.select.setStyles({'position': 'absolute', 'left': '-2000em'});
		// Get all options 
		this.options = this.select.getElements('option');
		// Get total
		this.total = this.options.length;
		// Create a wrapper
		this.div = new Element('div', {'class': 'select'}).inject(this.select, 'after');
		if (this.select.getStyle('float')!=null) this.div.setStyle('float', this.select.getStyle('float'));
		// Show selected
		this.div.set('html', '<span>'+this.select.getSelected().get('html')+'</span>');
		// Arrow
		this.arrow = new Element('img', {'class': 'arrow', 'src': '/images/blank.gif', 'width': 10, 'height': 10, 'styles': {
			'background-image': 'url(\'/images/elements/colours/'+colourIndex+'.png\')'
		}}).inject(this.div);
		
		// Rollover
		var originalcolor = this.div.getElement('span').getStyle('color');
		if (Browser.Engine.trident) {
			var originalarrow = {x: this.arrow.getStyle('background-position-x'), y: this.arrow.getStyle('background-position-y')};
			this.div.addEvents({
				'mouseenter': function() {
					this.getElement('span').setStyle('color', '#'+colour);
					obj.arrow.setStyle('background-position', '-150px -170px');
				},
				'mouseleave': function() {
					this.getElement('span').setStyle('color', originalcolor);
					obj.arrow.setStyle('background-position', originalarrow.x+' '+originalarrow.y);
				}
			});
		} else {
			var originalarrow = this.arrow.getStyle('background-position');
			this.div.addEvents({
				'mouseenter': function() {
					this.getElement('span').setStyle('color', '#'+colour);
					obj.arrow.setStyle('background-position', '-150px -170px');
				},
				'mouseleave': function() {
					this.getElement('span').setStyle('color', originalcolor);
					obj.arrow.setStyle('background-position', originalarrow);
				}
			});
		}
		
		// Show icon
		if (this.select.getSelected().get('title') && !$chk(this.div.getParent('div.breadcumb')))
			this.div.getElement('span').setStyle('background-image', 'url(\''+this.select.getSelected().get('title')+'\')');
		// Get dimensions
		this.dimensions = this.div.getSize();
		// Add event to wrapper
		var obj = this;
		// Prepare move
		this.move = 0;
		// Create container
		this.container = new Element('div').inject(this.div);
		// Intro
		var p = new Element('p', {'html': $(document.body).getElement('p.select').get('html')}).inject(this.container, 'top');
		this.padding = p.getSize().y.toInt()+12;
		this.container.setStyles({'height': this.container.getStyle('height').toInt()-this.padding, 'padding-top': this.padding});
		
		// Create list
		this.list = new Element('ul').inject(
			new Element('div', {'styles': {'height': this.container.getStyle('height')}}).inject(this.container)
		);
		// Create all options
		var optgrp;
		$each(this.options, function(item, index) {
			// Groups
			if (!$defined(optgrp) || item.getParent('optgroup').get('label')!=optgrp.get('html'))
				optgrp = new Element('li', {'html': item.getParent('optgroup').get('label'), 'class': 'group'}).inject(obj.list);
			// Create option and add event
			var li = new Element('li', {'html': item.get('html')}).inject(obj.list).addEvent('click', function(index) {
				// Select the right option
				if (obj.select.get('value')!=item.get('value')) {
				item.set('selected', true);
					item.set('selected', true);
					obj.select.set('value', item.get('value'));
					obj.select.fireEvent('change');
				}
				// Close
				obj.close(obj);
			});
			// Rollover
			var originalcolor = li.getStyle('color');
			var myFx = new Fx.Morph(li, {duration: 100, link: 'cancel'});
			// Add Class focus item(s)
			if (obj.options[index].get('selected')) {
				li.addClass('focus').setStyle('color', '#'+colour);
			} else {
				li.addEvents({
					'mouseenter': function() { myFx.start({'color': '#'+colour, 'padding-left': 32, 'background-position': ['0 4px', '2px 4px']}); },
					'mouseleave': function() { myFx.start({'color': originalcolor, 'padding-left': 30, 'background-position': ['2px 4px', '0 4px'] }); }
				});
			}	
			// Icons
			if (item.get('title')) li.setStyle('background-image', 'url(\''+item.get('title')+'\')');
		});
		
		// List height
		this.height = obj.list.getSize().y;
		
		// Set height
		if (obj.height.toInt()>obj.container.getElement('div').getSize().y.toInt()) {
			// Arrows
			new Element('a', {'target': 'up', 'styles': {'top': this.padding, 'background-position': 'left top'}}).inject(obj.container, 'top');
			new Element('a', {'target': 'down', 'styles': {'bottom': 11, 'background-position': 'left bottom'}}).inject(obj.container, 'bottom');
			// Add events to arrows to change direction
			$each(obj.container.getElements('a'), function(item){
				item.addEvent('mouseenter', function(e){
					switch(this.get('target')) {
						case 'up': obj.move = +20; break;
						case 'down': obj.move = -20; break;
					}
				});
			});
			var windowsize = obj.container.getElement('div').getSize().y.toInt()-(obj.container.getElement('a').getSize().y.toInt()*2);
			// Get Position
			this.pos;
			$each(obj.options, function(item, index) {
				if ($(item)==obj.select.getSelected()[0]) {
					obj.pos = 0-obj.list.getElements('li[class!=group]')[index].getPosition(obj.list).y.toInt()+26;
					if (obj.pos<-obj.height.toInt()+windowsize+52) obj.pos = -obj.height.toInt()+windowsize;
				}
			});
		}
		// Hide container
		this.container.setStyle('display', 'none');
		
		// Add Click event
		this.div.addEvent('click', function() {
			// Remove wrapper events
			obj.div.removeEvents();
			var coordinates = this.getCoordinates();
			this.inject($(document.body)).setStyles({'position': 'absolute', 'top': coordinates.top.toInt(), 'left': coordinates.left, 'z-index': 200});
			// Create lightboxes
			obj.lightbox = new Element('div', {'styles': {
				'position': 'absolute', 
				'z-index': 10, 
				'width': ($(document.body).getScrollSize().x-30), 
				'height': $(document.body).getScrollSize().y, 
				'top': 0, 
				'left': 0, 
				'background-image': 'url(\'/images/blank.gif\')'
			}}).inject($(document.body));
			obj.lightbox2 = new Element('div', {'class': 'selectlightbox','styles': {
				'height': $(document.body).getElement('div.content').getSize().y, 
				'opacity': 0.7
			}}).inject($(document.body).getElement('div.content').getElement('div')); 
			// Show container
			obj.container.setStyle('display', 'block');
			// Follow mouse
			obj.mouse(obj);
			obj.list.addEvent('mouseenter', function() { obj.move = 0; });
			// If arrow needed
			if (obj.height.toInt()>obj.container.getElement('div').getSize().y.toInt()) {
				// Show list
				obj.show(obj);
				// Scroll
				obj.timer = obj.show.periodical(100, obj, obj);
			}
		});
	},
	show: function(obj) {
		// Set position if it needs to change
		obj.pos = obj.pos + obj.move;
		// Count max
		var maxdown = -obj.height.toInt()+obj.container.getElement('div').getSize().y.toInt()-(obj.container.getElement('a').getSize().y.toInt()*2)+46;
		var maxup = 0;
		// Count real Maxdown
		if(obj.pos>maxdown){
			this.container.getElement('a[target=down]').setStyle('background-position', 'left bottom');
		} else {
			this.container.getElement('a[target=down]').setStyle('background-position', 'right bottom');
			// If was moving up and arrow down disappear, stop
			if (obj.move<0) {
				obj.move = 0;
				obj.pos = maxdown;
			}
		}
		// Count real Maxup
		if(obj.pos<0){
			// Inject Arrow Up
			this.container.getElement('a[target=up]').setStyle('background-position', 'left top');
		} else {
			// If was moving down and arrow up disappear, stop
			this.container.getElement('a[target=up]').setStyle('background-position', 'right top');
			if (obj.move>0) {
				obj.move = 0;
				obj.pos = 0;
			}
		}
		obj.list.setStyle('top', obj.pos+'px');
	},
	// Events on invisible lightbox
	mouse: function(obj) {
		// Set the direction of the mouvement depending on where is the mouse compared to the window select
		obj.lightbox.addEvents({
			'mousemove': function(e) {
				if (e.page.y.toInt() < obj.container.getPosition($(document.body)).y.toInt()+56) {
					if (e.page.y.toInt() < obj.container.getPosition($(document.body)).y.toInt()+56-125) obj.move = 80;
					else if (e.page.y.toInt() < obj.container.getPosition($(document.body)).y.toInt()+56-50) obj.move = 40;
					else obj.move = 20;
				}
				else if (e.page.y.toInt() > obj.container.getPosition($(document.body)).y.toInt()+obj.container.getSize().y.toInt()) {
					if (e.page.y.toInt() > obj.container.getPosition($(document.body)).y.toInt()+obj.container.getSize().y.toInt()+125) obj.move = -80;
					else if (e.page.y.toInt() > obj.container.getPosition($(document.body)).y.toInt()+obj.container.getSize().y.toInt()+50) obj.move = -40;
					else obj.move = -20;
				} else obj.move = 0;
			},
			// If user clicks anywhere in the browser, closes the select
			'mousedown': function() { obj.close(obj); }
		});
	},
	// Close the select window
	close: function(obj) {
		// Clear scroll
		$clear(obj.timer);
		$(document.body).removeEvents();
		obj.div.destroy();
		obj.lightbox.destroy();
		obj.lightbox2.destroy();
		// Run Select
		obj.prepare();
	}
});

window.addEvent('domready', function() {
	// Form Elements
	FormElements.run();
	// Form
	//new Forms();
	// Select
	$each($(document.body).getElements('select.select'), function(select) {
		new selectClass(select);
	});
});