/******************************************************************************************
MooTabs is a mootools 1.2.x class for use preferent on a LIST and <A> tag HTML.
Make a Request.HTML on a file get on CLASS attribute and show it on specific DIV.
Effects, transitions, etc. are optionals.
On <A> Tag, HREF by default = #, but is possible to include variables, like as '#x=12&amp;y=34'

Running on: Internet Explorer 6, 7 y 8 , Firefox 2 y 3, Opera 9.5, Safari 3 & Chrome 1.0
Valid for: XHTML 1.1, XHTML 1.0 Strict and XHTML 1.0 Transitional and HTML 4.x with other Doctype

Author: Ricard Catalan Díaz
Version: 0.4
License: GNU
*******************************************************************************************/
window.addEvent('load', function(){
	var tabs = new MooTabs; //New instance of MooTabs class
	var minSize=10;
	var maxSize=15;
	//Aumentar letra
	$('masletra').addEvent('click', function(){
		var size = parseInt($$('body').getStyle('font-size'))+1;
		if(size <= maxSize) $$('body').setStyle('font-size',size+'px');
	});
	$('menosletra').addEvent('click', function(){
		var size = parseInt($$('body').getStyle('font-size'))-1;
		if(size >= minSize) $$('body').setStyle('font-size',size+'px');
	});
});
/* MoopOp for mootools 1.2.x unobtrusive popups - by gonchuki - http://blog.gonchuki.com */
var moopop={width:0,height:0,captureByRel:function(attrVal,parent){this.capture((parent||document).getElements('a[rel*='+(attrVal||'popup')+']'));},capture:function(el,width,height){if($defined(width)&&$defined(height)){this.width=width;this.height=height;}
switch($type(el)){case'string':el=$$(el);case'element':case'array':$splat(el).each(this.add_pop_to,this);}
this.width=null;this.height=null;},add_pop_to:function(el){el.addEvent('click',function(e){e.stop();this.popup(el);}.bind(this));var size=el.get('rel').match(/\[(\d+),\s*(\d+)/)||['',this.width,this.height];var resizable=el.get('rel').match(/,(r)/)||[];if(size[1])el.store('popupprops','width='+size[1]+', height='+size[2]+(resizable[1]?', scrollbars=yes, resizable=yes':''));},popup:function(el){window.open(el.get('href'),el.get('name')||'',el.retrieve('popupprops')||'');}};window.addEvent('domready',function(){moopop.captureByRel('popup');});
/* MOOTABS version 0.4 */
var MooTabs = new Class({
	options: {	//Options to change
		targetDiv: 'newsText',						//Container Div on charge the HTML.Request
		action: 'click',							//Action to run script: click, mouseenter, ...
		currentID: 'actual2',						//ID for <a> TAG where're specify the current TAG (list), show it with CSS
		loadingImg: 'images/ajax-loader.gif',		//Gif animado con el proceso de vcarga
		url: 'content/',							//Ruta donde estan los ficheros
		values: '',									//Valores que pasamos por HREF, vacio por defecto
		method: 'get',								//Método GET o POST
		fx: 'slide',								//Effect to aplied on 'targetDiv': false, opacity, tween, slide
		transition: 'Fx.Transitions.Circ.easeOut',	//Transition applied to effect: false or Circ, ... (ONLY FOR SLIDE EFFECT)
		duration: 1000,								//Effect duration in ms.
		//Failure, texto para mostrar el error.
		failure: '<b>Ha ocurrido un error</b> y no se ha podido cargar el contenido.<br/> Diculpe las molestias.'
	},
	initialize: function(options){
		$$('[class*=mootabs]').each(function(el){
			//Lanzamos request si tiene la currentID, de esa manera se carga el contenido al inicio
			if(el.getProperty('id')==this.options.currentID) this.request(el);
			//Creamos evento por cada elemento
			el.addEvent(this.options.action, function(){
				this.request(el); //Llamamos al método request sobre el evento
			}.bind(this));
		}.bind(this));
	},
	request: function(el){
		//OP[0] = filename , OP[1] = extension
		this.op = el.get('class').slice(8).split("."); //Extraemos Opciones de la classe
		//si HREF contiene #mivariable=algo capturamos los valores
		if(el.getProperty('href').match(/^#\w+/)){
			this.options.values= el.getProperty('href').slice(1);
		}
		this.myRequest = new Request.HTML({
			method: this.options.method,
			evalScripts: true, /* this is the default */
			url: this.options.url+this.op[0]+'.'+this.op[1],
			data: this.options.values,
			headers: { 'cache-request-directive': 'no-cache', 'cache-control': 'no-store', 'content-type': 'multipart/mixed' },
			onRequest: function(){
				//Muestra el GIF animado del proceso de carga
				$(this.options.targetDiv).setStyle('background', 'url('+this.options.loadingImg+') no-repeat center center');
			}.bind(this),
			//Actualizamos capa destino
			update: $(this.options.targetDiv),
			//Al completarse, modificamos el estado de los TABs y quitamos el proceso la imagen de carga
			onComplete: function(respt){
				//Elimina el atributo ID de todos los TABS
				$$('[class*=mootabs]').each(function(tabs){ tabs.removeProperty('id'); });
				//Finalmente se añade el atributo ID en el TAB correspondiente
				el.setProperty('id', this.options.currentID);
				//eliminamos la barra de carga
				$(this.options.targetDiv).setStyle('background', 'none');
				//Si FX esta true llamamos al método effect
				if(this.options.fx) this.effect();
			}.bind(this),
			//En el caso de errors mostramos aviso
			onFailure: function(errors){
				$(this.options.targetDiv).setProperty('html', this.options.failure);
			}.bind(this)
		}).send();
	},
	effect: function(){
		switch(this.options.fx){
			//Creamos efecto Morph con transición de opacidad de 0 a 1
			case 'opacity':	var opacityFx = new Fx.Morph($(this.options.targetDiv), {duration: this.options.duration});
							$(this.options.targetDiv).setOpacity(0);
							opacityFx.start({'opacity':1});
							break;
			//Creamos efecto Tween
			case 'tween':	var tweenFx =  new Fx.Tween(this.options.targetDiv, {duration: this.options.duration});
							tweenFx.start('background-color', '#fff', '#ddd');
							break;
			//Creamos efecto Slide
			case 'slide':	if(this.options.transition) var slideFx = new Fx.Slide(this.options.targetDiv,{duration: this.options.duration, transition: Fx.Transitions.Circ.easeOut});
							else var slideFx = new Fx.Slide(this.options.targetDiv,{duration: this.options.duration});
							slideFx.hide().slideIn(); //Desplegamos DIV con el resto de campos			
							break;
		}
	}
});


