/*
	public class Trips
	@by Javier Onglao
	@January 4, 2010
	
*/

var Trips = new Class({

	Implements: [Options, Events],
	
	options: {
		id: 0
	},
	
	colorIn: '#66CC00',
	colorOut: '#fff',
	effect: 'Quart',
	duration: .15,
	isForm: false,
	formType: null,
	busy: false,
	percent: 0,
	atGallery: false,
	errors: [],
	
	initialize: function(options){
		this.setOptions(options);
	
		/* 
			Requests
		*/
		var loadImg = new Element('img', {id: 'loader', src: root+'images/content-loader.gif'});
		var contentDiv = new Element('div', {id: 'content'})
		var barDiv = new Element('div', {id: 'bar'});
					
		if(this.percent == 100) { this.busy = false; }
		
		// .. content
		var content = new Request({
			autoCancel: true,
			method: 'get',
			url: root+'micro/get.trip.php',		
			onRequest: function() { 
				$('loader').fade(0,1);
				$('content').fade(1,0);
				
				if(this.busy) { $('bar').fade(1,0); this.busy = false; }
			}.bind(this),
			onSuccess: function(txt) {	
				if(!txt)
				{
					$('content').set('html', 'There is nothing.');
				}
				else
				{
					this.atGallery = false;
					$('content').set('html', txt);
					$('content').setStyle('visibility', 'hidden');
					
					if(this.isForm)
					{
						// Insert Loader and Response Elements
						new Element('div', {id: 'response'}).inject('loader','after');
						
						// Adopt elements from micro into the page
						$('content').adopt(txt);
						
						// Event Instantiation
						$('form').addEvent('submit', function(e) {
							e.stop();
							this.errors.empty();
							
							var checkEmpty = function(input, index) {
								if(input.get('required') == "yes" || input.get('required'))
								{
									this.errors.extend([true]);
									
									if(!input.get('value'))
									{
										$(input.get('name') + 'e3').set('html', input.get('name').capitalize() + ' is blank.');
										$(input.get('name') + 'e1').fade(0,1);
										$(input.get('name') + 'e2').fade(0,1);
										$(input.get('name') + 'e3').fade(0,1);
										
										$(input.get('name') + 'e2').addEvent('click', function()
										{
											$(input.get('name') + 'e1').fade(1,0);
											$(input.get('name') + 'e2').fade(1,0);
											$(input.get('name') + 'e3').fade(1,0);
											input.focus();
										});
										
										$(input).addEvent('focus', function()
										{
											if($(input.get('name') + 'e1').getStyle('opacity') != 0)
											{
												$(input.get('name') + 'e1').fade(1,0);
												$(input.get('name') + 'e2').fade(1,0);
												$(input.get('name') + 'e3').fade(1,0);
											}
										});
									}
									else
									{
										this.errors[input.get('index')] = false;
									}
								}
								
								//Attach all form elements for constructing the mail headers, ensuring that there are no duplicates.
								//if(!this.elements.contains(input)) { this.elements.extend([input]); }
							}.bind(this);
							
							// Event Distribution
							$$('form input').each(checkEmpty);
							$$('form textarea').each(checkEmpty);
							
							// If all things are set, move on. Mail Away!
							if(!this.errors.contains(true))
							{
								var submitDiv = null;
								
								var sendEmail = new Request({method: 'post', url: root+'micro/send.email.php',
									onRequest: function() {
										$('bar').set('html', '');
										$('loader').fade(0,1);
										$('bar').fade(0,1);
										submitDiv = $('submit').get('html');
										$('submit').set('html', 'Sending');
									},
									onSuccess: function(txt) {
										$('bar').fade(1,0);
										$('response').fade(0,1);
										$('response').set('html', txt);
										
										if(txt == "Not Sent!<br>Please try again")
										{	$('submit').set('html', submitDiv);	}
										else
										{	$('submit').set('html', 'Sent');	}
										
										var nextStep = function() { 
											$('response').fade(1,0); 
											$('loader').fade(1,0); }.delay(1500);
									},
									onFailure: function() {
										$('response').fade(0,1);
										$('bar').fade(1,0);
										$('response').fade(0,1);
										$('response').set('html', "Cannot send now, try again later");
									}
								});
								
								// Mail Header
								if(this.formType == "interested")
								{				
									contact = $('contact').get('value') ? $('contact').get('value') : "(none provided)";
									
									sendEmail.send("type=i&id=" + this.options.id + "&to=" + $('toEmail').get('value') + "&from=" + $('fromEmail').get('value') + "&name=" + $('nameInp').get('value').capitalize() + "&contact=" + contact);
								}
								else if(this.formType == "share")
								{
									var addresses = $('toEmail').get('value').split(",");
									
									addresses.map( function(i,ii) { sendEmail.send("type=s&id=" + this.options.id + "&to=" + i + "&from=" + $('yourEmail').get('value') + "&pmsg=" + $('pmsg').get('value'))}.bind(this));
								}
								
							}
	
						}.bind(this));	
						
						this.isForm = false;
					}
				}
			}.bind(this),
			onComplete: function() {
				$('loader').fade(1,0);
				$('content').fade(0,1);
			},
			onFailure: function() {
				$('content').set('html', 'Server is currently not responding. Please try again.');
			}
		});

		// .. photo gallery
		var photogallery = new Request({
			autoCancel: true,
			method: 'get',
			url: root+'micro/get.trip.php',
			onRequest: function() { 
				$('loader').fade(0,1);
				$('content').fade(1,0);
			},
			onSuccess: function(txt) {
				if(!txt)
				{
					$('content').set('html', 'There are no photos.');
				}
				else
				{
					this.atGallery = true;
					this.busy = true;
					$('content').set('html', txt);
					$('content').setStyle('visibility', 'hidden');
					$('photogallery').setStyle('display', 'none');
					
					imgSrc = [];
					imgLoaded = [];
					
					$$('#photogallery img').each(function(img,index) {
						imgSrc.extend([img.get('src'), img.get('href')]);
						
						img.addEvents({
							'mouseover': function()
							{
								imgfx = new Fx.Tween(img, {property: 'border-color', duration: 250, transition: Fx.Transitions.Quad.easeInOut});
								imgfx.start(this.colorIn);
							}.bind(this),
							'mouseleave': function()
							{
								imgfx = new Fx.Tween(img, {property: 'border-color', duration: 250, transition: Fx.Transitions.Quad.easeInOut});
								imgfx.start(this.colorOut);
							}.bind(this),
							'click': function(el)
							{	
								$('mid-features').set('html', '<img src="' + img.get('href') + '" alt="' + img.get('alt') + '">');
								$('caption').set('html', img.get('alt'));
							}
						});
					}.bind(this));
					
					var imgLoad = new Asset.images(imgSrc, {
						onProgress: function(i) {
							imgLoaded[i] = this;
							this.percent = Math.round(((i+1) / imgSrc.length) * 100);
							$('bar').set('html', this.percent+"%");
						}.bind(this),
						onComplete: function() {
							if(this.atGallery) { $('bar').fade(1,0); }
							$('photogallery').setStyle('display', 'block');
							$('loader').fade(1,0);
							$('content').fade(0,1);
							if(this.percent == 100) { this.busy = false; }
						}.bind(this)
					});
				}
			}.bind(this),
			onFailure: function() {
				$('content').set('html', 'Server is currently not responding. Please try again.');
			}
		});
		
		// Menu Effects
		var transitions = eval('Fx.Transitions.' + this.effect + '.easeInOut');
		
		$$('#title-bar-menu li').addEvents({
			'mouseover': function(el)
			{
				menufx = new Fx.Tween(el.target, {property: 'color', duration: this.duration * 1000, transition: transitions});
				menufx.start(this.colorIn);
			}.bind(this),
			
			'mouseleave': function(el)
			{
				menufx = new Fx.Tween(el.target, {property: 'color', duration: this.duration * 1000, transition: transitions});
				menufx.start(this.colorOut);
			}.bind(this),
			
			'click': function(e) 
			{ 
				new Event(e).stop();
				el = e.target;
				
				$('body').set('html', ''); // clear contents 
				$('body').adopt(loadImg, contentDiv, barDiv); // insert main elements
				
				content.cancel();
				photogallery.cancel();
				
				if(el.get('href') == 'information')
					content.send("tripId=" + this.options.id + "&type=information");
				else if(el.get('href') == 'history')
					content.send("tripId=" + this.options.id + "&type=history");
				else if(el.get('href') == 'photo')
					photogallery.send("tripId=" + this.options.id + "&type=photo");
				else if(el.get('href') == 'share')
				{
					this.isForm = true;
					this.formType = "share";
					content.send("tripId=" + this.options.id + "&type=share");
				}
				else if(el.get('href') == 'interested')
				{
					this.isForm = true;
					this.formType = "interested";
					content.send("tripId=" + this.options.id + "&type=interested");
				}
			}.bind(this)
		});
	}
});