////////////////////// MMJS.PicSlide /////////////////////
// Version : 0.1.3
// Require : jQuery 1.4.2
// Author : Albert.Lee
// Last Modify : 2010.09.20
//////////////////////////////////////////////////////////

var MMJS = MMJS || {};

MMJS.PicSlide =  function( args ){
	//init args
	args = args || {};

	var args_default = {
		container: '#PicSlide_Con',
		list: [], //pic list ,object array, items like 
		/*
		{ 
			'pic':'./images/01.jpg',
			'trans':'flash',
			'link':'link',
			'id':'id',
			'class':'class',
			'usemap':'class',
			'alt':'class'
		}
		*/
		interval: 3, //global interval in seconds
		//transaction flash var
		flash_t_p1: 20,	// flash parse1 in microseconds
		flash_t_p2: 200,	// flash parse2 in microseconds
		//transaction fade var
		fade_t_p1: 'slow',
		fade_t_p2: 'slow',
		//nav
		nav_ul_selector:'',
		nav_active_item:null,
		nav_active_class_name:'active'
	}
	
	args = jQuery.extend( args_default,args );
	jQuery.extend( this,args );

	
	this.init();

}


MMJS.PicSlide.prototype.init = function(){
	
	this.$con = jQuery(this.container);

	this.$nav_ul = jQuery(this.nav_ul_selector);

	if ( !this.created ){
		//main wrap
		this.$wrap = jQuery( '<div style="width:100%;height:100%;position:relative"></div>' );
		//flash mask
		this.$flash_mask = jQuery( '<div style="width:100%;height:100%;position:absolute;left:0;top:0;background-color:#fff"></div>' ).hide();
		//perload container
		this.$perload_con = jQuery( '<div style="width:0;height:0;overflow:hidden;position:absolute;left:0;top:0"></div>' );
		
		// append
		this.$wrap.append( this.$perload_con ).append( this.$flash_mask );
		
		this.created = true;
	}
	
	//init pic perload
	for ( i=0;i<this.list.length;i++ ){
		this.$perload_con.append( '<img src="' + this.list[i].pic + '">' );
	}
	
	//add the first pic in wrap
	this.cur_pic_index = 0;
	this.cur_pic_obj = this.list[this.cur_pic_index];
	this.$cur_pic = this.createImage( this.cur_pic_obj );
	this.$cur_pic.show();
	
	//replace the default $con content
	this.$con.empty().append(this.$wrap);
	
	if ( this.list.length > 0 ){
		this.goto(0);
		this.play();
	}
	
}

//
MMJS.PicSlide.prototype.createImage = function( pic_obj ){

	$img = jQuery( '<img src="' + pic_obj.pic + '">' );
	if ( typeof pic_obj['link'] == 'string' ){
		$img.click( function(){ window.location.href = pic_obj['url'] } );
		$img.css( {'cursor':'pointer'} );
	}
	if ( typeof pic_obj['id'] == 'string' ){
		$img.attr( {'id':pic_obj['id']} );
	}
	if ( typeof pic_obj['class'] == 'string' ){
		$img.attr( {'class':pic_obj['class']} );
	}
	if ( typeof pic_obj['usemap'] == 'string' ){
		$img.attr( {'usemap':pic_obj['usemap']} );
	}
	if ( typeof pic_obj['alt'] == 'string' ){
		$img.attr( {'alt':pic_obj['alt']} );
	}
	
	return jQuery( '<div style="position:absolute;left:0;top:0"></div>' ).append($img).hide().insertBefore(this.$flash_mask);
}

//
MMJS.PicSlide.prototype.doTransaction = function( callback ){
	var class_obj = this;

	if ( typeof callback == 'function' ){
		callback.apply( this,[ this.next_pic_index ] );
	}
	
	//if need pic switch
	if ( this.cur_pic_index != this.next_pic_index ){
		this.cur_pic_obj = this.list[this.cur_pic_index];
		this.next_pic_obj = this.list[this.next_pic_index];
		// callback function when transaction is over
		this.callback_trans = function( $cur_pic,$old_pic ){
			class_obj.$cur_pic = $cur_pic;
			$old_pic.remove();
			class_obj.cur_pic_index = class_obj.next_pic_index;
		};
		switch( this.cur_pic_obj.trans ){
			case 'flash':
				this.transFlash( this.next_pic_obj,this.callback_trans );
				break;	
			case 'fade':
				this.transFade( this.next_pic_obj,this.callback_trans );
				break;
		}
	}
}


//
MMJS.PicSlide.prototype.next = function( callback ){
	
	//first run
	if ( typeof this.cur_pic_index == 'undefined' ){
		this.cur_pic_index = 0;
	}
	//get the right next pic index
	this.next_pic_index = this.cur_pic_index + 1;
	if ( typeof this.list[this.next_pic_index] == 'undefined' ){
		this.next_pic_index = 0;
	}
	this.doTransaction( callback );
	this.setNav(this.next_pic_index);
}

//
MMJS.PicSlide.prototype.prev = function( callback ){
	//first run
	if ( typeof this.cur_pic_index == 'undefined' ){
		this.cur_pic_index = 0;
	}
	//get the right next pic index
	this.next_pic_index = this.cur_pic_index - 1;
	if ( typeof this.list[this.next_pic_index] == 'undefined' ){
		this.next_pic_index = ( this.list.length - 1 );
	}
	this.doTransaction( callback );
	this.setNav(this.next_pic_index);
}

//
MMJS.PicSlide.prototype.goto = function( index,callback ){
	//get the right next pic index
	if ( typeof this.list[index] != 'undefined' ){
		this.next_pic_index = index;
	}
	this.doTransaction( callback );
	this.setNav(this.next_pic_index);
}


//
MMJS.PicSlide.prototype.play = function(callback){
	var class_obj = this;
	this.stop();
	this.interval_handler = window.setInterval( function(){ 
		class_obj.next.apply( class_obj,[callback] );
	},this.interval*1000 );
}

//
MMJS.PicSlide.prototype.stop = function(){
	if ( this.interval_handler ){
		window.clearInterval(this.interval_handler);
		this.interval_handler = null;
	}
}


MMJS.PicSlide.prototype.transFlash = function( pic_to,callback ){
	var class_obj = this;
	
	var $pic_to = this.createImage( pic_to );
	this.$flash_mask.fadeIn( this.flash_t_p1,function(){
		class_obj.$cur_pic.hide();
		$pic_to.show();
		class_obj.$flash_mask.fadeOut( class_obj.flash_t_p2,function(){
			callback.apply( class_obj,[$pic_to,class_obj.$cur_pic] );
		} );
	} );
	
}

MMJS.PicSlide.prototype.transFade = function( pic_to,callback ){
	var class_obj = this;
	
	var $pic_to = this.createImage( pic_to );
	this.$cur_pic.fadeOut( this.fade_t_p1 );
	$pic_to.fadeIn( this.fade_t_p2,function(){
		callback.apply( class_obj,[$pic_to,class_obj.$cur_pic] );	
	} );
}

MMJS.PicSlide.prototype.setNav = function( index ){
	var class_obj = this;
	index = parseInt(index);
	
	if ( index >= 0 ){
		if ( class_obj.nav_active_item ){
			var $li = class_obj.$nav_ul.find(' > li');
			$li.find( class_obj.nav_active_item ).removeClass(class_obj.nav_active_class_name);
			$li.eq(index).find( class_obj.nav_active_item ).addClass(class_obj.nav_active_class_name);
		}else{		
			class_obj.$nav_ul.find(' > li').removeClass(class_obj.nav_active_class_name).eq(index).addClass( class_obj.nav_active_class_name );
		}
	}
}