var view = {
	myFx: null,
	container: null,
	panelWidth: null,
	panelCount: null,
	stripViewerWidth: null,
	navWidth: null,
	cPanel: 1,
	init: function(){
		if (Browser.Engine.gecko) $$('.stripViewer').each(function(el){el.setStyle('-moz-user-select','none');});
		if (Browser.Engine.gecko) $$('.panelContainer').each(function(el){el.setStyle('-moz-user-select','none');});
		$('mid').setStyle('background','transparent url("images/indexbg.png") no-repeat 50% 0');
		$$('.stripViewer').each(function(el){el.setStyle('height','425px');});
		view.container = $$('div.panel').getLast();
		view.panelWidth = $$('.panel').getRandom().getStyle('width').toInt();
		view.panelCount = $$('.panel').length;
		view.stripViewerWidth = view.panelWidth * view.panelCount;
		$('panelContainer').setStyle('width', view.stripViewerWidth);
		var position = 0;
		$$('.panel').each(function(el){
			el.setStyle('position', 'absolute');
			el.setStyle('left', position*view.panelWidth);
			position++;
		});
		view.navWidth = view.panelCount * 2;
		var imgL = new Element('img', {'class':'stripNavL','id':'stripNavL','src':'images/left.png','alt':'Anterior'});
		var imgR = new Element('img', {'class':'stripNavR','id':'stripNavR','src':'images/right.png','alt':'Siguiente'});
		imgL.inject($('stripNavL0'));
		imgR.inject($('stripNavR0'));
		$('stripNavR').setStyle('left', view.panelWidth+((Browser.Engine.gecko)?55:59));
		$('stripNavL0').addEvent('click', view.left);
		$('stripNavR0').addEvent('click', view.right);
		view.myFx = new Fx.Tween($('panelContainer'), {duration:750,transition:Fx.Transitions.Expo.easeInOut,wheelStops:false});
		loader();
	},
	left: function(){
		if (view.cPanel == 1) {
			var cnt = -(view.panelWidth * (view.panelCount-1));
			view.cPanel = view.panelCount;
		} else {
			view.cPanel -= 1;
			var cnt = -(view.panelWidth * (view.cPanel-1));
		}
		view.myFx.start('left',cnt);
	},
	right: function(){
		if (view.cPanel == view.panelCount) {
			var cnt = 0;
			view.cPanel = 1;
		} else {
			var cnt = - (view.panelWidth * view.cPanel);
			view.cPanel += 1;
		};
		view.myFx.start('left',cnt);
	}
}
var slide = {
	container: null,
	panelWidth: null,
	panelCount: null,
	stripViewerWidth: null,
	navWidth: null,
	elements: Array,
	counter: 1,
	timer: 1500,
	timer01: null,
	timer02: null,
	init: function(){
		var el = new Element ('div',{id:'control',
		style:'clear:both;height:20px;width:485px;background-color:#000;margin-left:'+((Browser.Engine.gecko)?1:2)+'px',
		'html':	'<img src="images/control_play.png" id="play" alt="Play" class="buttons" />'+
				'<img src="images/control_stop.png" id="stop" alt="Stop" class="buttons" />'+
				'<span id="controlTxt" class="buttons" style="color:#ffffde;top:-3px;position:relative">Pulsa "Play" para empezar.</span>'});
		el.inject($('midNat'),'before');
		if (Browser.Engine.gecko) $$('.stripViewerNat').each(function(el){el.setStyle('-moz-user-select','none');});
		if (Browser.Engine.gecko) $$('.panelContainerNat').each(function(el){el.setStyle('-moz-user-select','none');});
		$$('.stripViewerNat').each(function(el){el.setStyle('height','363px');});
		slide.container = $$('div.panelNat').getLast();
		slide.panelWidth = $$('.panelNat').getRandom().getStyle('width').toInt();
		slide.panelCount = $$('.panelNat').length;
		slide.stripViewerWidth = slide.panelWidth * slide.panelCount;
		$('panelContainerNat').setStyle('width', slide.stripViewerWidth);
		var position = 0;
		$$('.panelNat').each(function(el){
			slide.elements[position] = el;
			el.setStyles({'position': 'absolute','left': '0px','opacity': '0','z-index':50+position});
			position++;
		});
		slide.navWidth = slide.panelCount * 2;
		slide.elements[0].setStyle('opacity','1');
		loader();
		$('play').addEvent('click',slide.play);
		$('stop').addEvent('click',slide.stop);
	},
	play: function(){
		if (slide.counter == 1) {
			$$('.panelNat').each(function(el){el.setStyle('opacity','0');});
			slide.elements[0].setStyle('opacity','1');
			slide.elements[slide.panelCount-1].setStyle('opacity','0');
		}
		slide.timerfn = slide.fadeinout.periodical(slide.timer);
		$('controlTxt').set('html','');
	},
	stop: function(){
		if (!$defined(slide.timerfn)) return false;
		slide.timerfn = $clear(slide.timerfn);
		$('controlTxt').set('html','Pulsa "Play" para continuar.');
	},
	fadeinout: function(){
		var myFx01 = new Fx.Tween(slide.elements[slide.counter], {duration:750,wheelStops:false}).start('opacity','1');
		slide.counter++;
		if (slide.counter>=slide.panelCount) {
			$('controlTxt').set('html','Pulsa "Play" para volver a empezar.');
			slide.counter = 1;
			slide.timerfn = $clear(slide.timerfn);
		}
	}
}
// Class:    	dwProgress bar - Author:   	David Walsh - Website:    http://davidwalsh.name - Version:  	1.0 - Date:     	07/03/2008 - Built For:  MooTools 1.2.0
var dwProgressBar = new Class({
	Implements: [Options],
	options: {
		container: $$('body')[0],
		boxID:'',
		percentageID:'',
		displayID:'',
		startPercentage: 0,
		displayText: false,
		speed:10
	},
	initialize: function(options) {
		this.setOptions(options);
		this.createElements();
	},
	createElements: function() {
		var box = new Element('div', { id:this.options.boxID });
		var perc = new Element('div', { id:this.options.percentageID, 'style':'width:0px;' });
		perc.inject(box);
		box.inject(this.options.container);
		if(this.options.displayText) { 
			var text = new Element('div', { id:this.options.displayID });
			text.inject(this.options.container);
		}
		this.set(this.options.startPercentage);
	},
	calculate: function(percentage) {
		return ($(this.options.boxID).getStyle('width').replace('px','') * (percentage / 100)).toInt();
	},
	animate: function(to) {
		$(this.options.percentageID).set('morph', { duration: this.options.speed, link:'cancel' }).morph({width:this.calculate(to.toInt())});
		if(this.options.displayText) { 
			$(this.options.displayID).set('text', to.toInt() + '%'); 
		}
	},
	set: function(to) {
		this.animate(to);
	}
});
function loader(){
	var div = new Element('div',{id:'overlay'});
	div.inject($('wrapper'));
	var div = new Element('div',{id:'progress-bar'});
	div.inject($('overlay'));
	$('overlay').setStyle('height',$('footer').getPosition().y + $('footer').getSize().y);
	$('progress-bar').setStyles({
			'top':(window.getSize().y/2) - ($('progress-bar').getStyle('height').toInt()/2),
			'left':(window.getSize().x/2) - ($('progress-bar').getStyle('width').toInt()/2)
	});
	var progressBar = new dwProgressBar({
		container: $('progress-bar'),
		startPercentage: 0,
		speed:750,
		boxID: 'box',
		percentageID: 'perc',
		displayID: 'text',
		displayText: true
	});
	var counter = 0;
	$$('img').each(function(el){
		el.addEvent('load', function(){
			counter++;
			progressBar.set((counter)*(100/$$('img').length));
		});
	});
	window.addEvent('load', function(){
		var myFx = new Fx.Tween($('overlay'), {duration:750,complete:function(){$('overlay').destroy();}}).start('opacity',0);
	});
}
window.addEvent('domready', function(){
	if ($defined($('panelContainer'))) view.init();
	if ($defined($('panelContainerNat'))) slide.init();
	$$('input','textarea').each(function(el){
		if (el.get('class')!='inputStyle short' && el.get('class')!='hidden') {
			el.addEvent('focus', function(){
				this.set('value','');
				this.removeEvents();
			});
		}
	});
});
