/*
Author:
	luistar15, <leo020588 [at] gmail.com>
	Rainer Ilgen <rainerilgen@yahoo.ca> Extention for Fading
	
License:
	MIT License
 
Class
	noobSlide (rev.19-06-08)
	noobSlide Extention for Fading (rev. 23-10-08)

Arguments:
	Parameters - see Parameters below

Parameters:
	box: dom element | required
	items: dom collection | required
	size: int | item size (px) | default: 240
	mode: string | 'horizontal', 'vertical' | default: 'horizontal'
	fade: boolean | default: false
	addButtons:{
		previous: single dom element OR dom collection| default: null
		next:  single dom element OR dom collection | default: null
		play:  single dom element OR dom collection | default: null
		playback:  single dom element OR dom collection | default: null
		stop:  single dom element OR dom collection | default: null
	}
	button_event: string | event type | default: 'click'
	handles: dom collection | default: null
	handle_event: string | event type| default: 'click'
	fxOptions: object | Fx.Tween options | default: {duration:500,wait:false}
	interval: int | for periodical | default: 5000
	autoPlay: boolean | default: false
	onWalk: event | pass arguments: currentItem, currentHandle | default: null
	startItem: int | default: 0

Properties:
	box: dom element
	items: dom collection
	size: int
	mode: string
	fade: boolean
	buttons: object
	button_event: string
	handles: dom collection
	handle_event: string
	previousIndex: int
	nextIndex: int
	fx: Fx.Tween instance
	interval: int
	autoPlay: boolean
	onWalk: function
	
Methods:
	previous(manual): walk to previous item
		manual: bolean | default:false
	next(manual): walk to next item
		manual: bolean | default:false
	play (interval,direction,wait): auto walk items
		interval: int | required
		direction: string | "previous" or "next" | required
		wait: boolean | required
	stop(): stop auto walk
	walk(item,manual,noFx): walk to item
		item: int | required
		manual: bolean | default:false
		noFx: boolean | default:false
	addHandleButtons(handles):
		handles: dom collection | required
	addActionButtons(action,buttons):
		action: string | "previous", "next", "play", "playback", "stop" | required
		buttons: dom collection | required

Requires:
	mootools 1.2 core
*/
function getUrlFromDesc(desc) {
	
	var hrefLength = 6;
	var charactersInPartOne = desc.indexOf('href="');
	var totalLength = desc.length;
	var descTemp = desc.substr((charactersInPartOne+hrefLength),totalLength);
	var charactersInPartTwo = descTemp.indexOf('"') + (charactersInPartOne+hrefLength);
	var url = desc.substring((charactersInPartOne+hrefLength),charactersInPartTwo);
	if (url == "l") {url="index.aspx";}
	return url;
}
var noobSlide = new Class({

	initialize: function(params){
		this.items = params.items;
		this.mode = params.mode || 'horizontal';
		this.fade = params.fade || false;
		this.modes = {horizontal:['left','width'], vertical:['top','height']};
		this.size = params.size || 249;
		this.box = params.box.setStyle(this.modes[this.mode][1],(this.size*this.items.length)+'px');
		
				
		this.slides = params.slides;
		this.setupSlides(this.slides,this.items);
		
		this.button_event = params.button_event || 'click';
		this.handle_event = params.handle_event || 'click';
		this.onWalk = params.onWalk || null;
		this.currentIndex = null;
		this.previousIndex = null;
		this.nextIndex = null;
		this.interval = params.interval || 5000;
		this.autoPlay = params.autoPlay || false;

		
		this._play = null;
		this.handles = params.handles || null;
		if(this.handles){
			this.addHandleButtons(this.handles,this.items.length);
		}
		this.buttons = {
			previous: [],
			next: [],
			play: [],
			playback: [],
			stop: []
		};
		if(params.addButtons){
			for(var action in params.addButtons){
				this.addActionButtons(action, $type(params.addButtons[action])=='array' ? params.addButtons[action] : [params.addButtons[action]]);
			}
		}
		
		if(this.fade)
		{
		  //Prepare Fading
      	this.orderItems()      
		  this.fading((params.startItem||0),true,true);
    }
    else
    {
      //original Sliding
      this.fx = new Fx.Tween(this.box,$extend((params.fxOptions||{duration:500,wait:false}),{property:this.modes[this.mode][0]}));
		  this.walk((params.startItem||0),true,true);
		}
	},
	
	//setupslides
	setupSlides: function(slides,item) {
			for(var i=0;i<slides.length;i++){
			//main ID DIV 
			new Element('div', {
					'class': 'myClass',
					'id': 'myid'+i,
					//html: '<a href="'+item[i].Url+'" id="carouselLink'+i+'" title="'+item[i].Title+'"><span><img src="'+item[i].Url+'" alt="" /></span></a>',
					html: '<a href="'+getUrlFromDesc(item[i].Description)+'" id="carouselLink'+i+'" title="'+item[i].Title+'"><span><img src="'+item[i].Url+'" alt="" /></span></a>',
					styles: {
						display: 'block'
					}
				}).inject(this.box);
				//}).inject('image_box');
		
			// Footer DIV
			new Element('div', {
					'class': 'imgFooter',
					'id': 'footer'+i
				}).inject('myid'+i);
			// info box
			new Element('div', {
					'class': 'info',
					'id': 'info_box'+i
				}).inject('footer'+i);
			
			new Element('h4').set('html',item[i].Title).inject('info_box'+i);
			new Element('p').set('html',item[i].Description).inject('info_box'+i);
			//new Element('p').set('html',currentItem.Description).inject(infoBox);
			
			
			//button handles
			new Element('span',{
						'id': 'span'+i,
						'class': 'dot_buttons',
						events: {
							click: function(){
								//alert(this.id+' clicked span'+i+' ci= '+parent._currentIndex);
								//this.fade.bind(this,true,false);
							}
						}
					}).inject('handles_box');
			var ourSpan = $('span'+i);
			ourSpan.addEvent('click',this.fading.bind(this,[i,true]));
			
			new Element('img',{
						width: '8',
						height: '8',
						src: 'css/carousel/dot-off.png'
					}).inject('span'+i);
			

			}
		
	},
  //new function for Ordering the Items for Fading
  orderItems: function() {
	  testbox = $$('#image_box .myClass');//.getElements('div');
    for(i=0;i<this.items.length;i++)
    {
		testbox[i].setStyle('position', 'absolute')
      testbox[i].setStyle('left', '0px');
      testbox[i].setStyle('z-index', i+1);
	  /*
	  this.items[i].setStyle('position', 'absolute')
      this.items[i].setStyle('left', '0px');
      this.items[i].setStyle('z-index', i+1);
	  */
      if(i>0)
      {
       // this.items[i].fade('out');
	   testbox[i].fade('out');
      }
    }
  },

	addHandleButtons: function(handles,noHandles){
		
		for(var i=0;i<handles.length;i++){
		  if(this.fade)
		  {
			  
        handles[i].addEvent(this.handle_event,this.fading.bind(this,[i,true]));
      }
      else
      {
        handles[i].addEvent(this.handle_event,this.walk.bind(this,[i,true]));
      }
		}
	},

	addActionButtons: function(action,buttons){
		for(var i=0; i<buttons.length; i++){
			switch(action){
				case 'previous': buttons[i].addEvent(this.button_event,this.previous.bind(this,[true])); break;
				case 'next': buttons[i].addEvent(this.button_event,this.next.bind(this,[true])); break;
				case 'play': buttons[i].addEvent(this.button_event,this.play.bind(this,[this.interval,'next',false])); break;
				case 'playback': buttons[i].addEvent(this.button_event,this.play.bind(this,[this.interval,'previous',false])); break;
				case 'stop': buttons[i].addEvent(this.button_event,this.stop.bind(this)); break;
			}
			this.buttons[action].push(buttons[i]);
		}
	},

	previous: function(manual){
    if(this.fade)
    {
      this.fading((this.currentIndex>0 ? this.currentIndex-1 : this.items.length-1),manual);
    }
    else
    {
		  this.walk((this.currentIndex>0 ? this.currentIndex-1 : this.items.length-1),manual);
		}
	},

	next: function(manual){
    if(this.fade)
    {
      this.fading((this.currentIndex<this.items.length-1 ? this.currentIndex+1 : 0),manual);
    }
    else
    {
		  this.walk((this.currentIndex<this.items.length-1 ? this.currentIndex+1 : 0),manual);
		}
	},

	play: function(interval,direction,wait){
		this.stop();
		if(!wait){
			this[direction](false);
		}
		this._play = this[direction].periodical(interval,this,[false]);
	},

	stop: function(){
		$clear(this._play);
	},

	walk: function(item,manual,noFx){
		if(item!=this.currentIndex){
			this.currentIndex=item;
			this.previousIndex = this.currentIndex + (this.currentIndex>0 ? -1 : this.items.length-1);
			this.nextIndex = this.currentIndex + (this.currentIndex<this.items.length-1 ? 1 : 1-this.items.length);
			if(manual){
				this.stop();
			}
			if(noFx){
				this.fx.cancel().set((this.size*-this.currentIndex)+'px');
			}else{
				this.fx.start(this.size*-this.currentIndex);
			}
			if(manual && this.autoPlay){
				this.play(this.interval,'next',true);
			}
			if(this.onWalk){
				this.onWalk((this.items[this.currentIndex] || null), (this.handles && this.handles[this.currentIndex] ? this.handles[this.currentIndex] : null));
			}
		}
	},
	
	//Fading
	fading: function(item,manual,noFx){
		//console.log(item,manual,noFx); 
		testbox = $$('#image_box .myClass');
		if(item!=this.currentIndex){
		  this.lastIndex=this.currentIndex;
			this.currentIndex=item;
			this.previousIndex = this.currentIndex + (this.currentIndex>0 ? -1 : this.items.length-1);
			this.nextIndex = this.currentIndex + (this.currentIndex<this.items.length-1 ? 1 : 1-this.items.length);
			if(manual){
				this.stop();
			}
			if(!noFx){
				
				testbox[this.lastIndex].fade('out');
				testbox[this.currentIndex].fade('in');
			}
			if(manual && this.autoPlay){
				this.play(this.interval,'next',true);
			}
			if(this.onWalk){
				//console.log(item);
				//console.log(this.lastIndex);
				this.onWalk((this.items[this.currentIndex] || null), (this.handles && this.handles[this.currentIndex] ? this.handles[this.previousIndex] : null));
				
				if (this.lastIndex!=null) {
					$('span'+this.lastIndex).getElements('img').set({
						src:'css/carousel/dot-off.png'
					});
				}
			}
		}
	}
	
});

