// CLASS EXTENDS MOOTOOLS REQUEST JSON REQUEST LOCAL TWITTER JSON -------------------
Request.JSON.TwitterCache = new Class({
			Extends: Request.JSON,
			Implements: [Events, Fx, Fx.Tween],
			
			options: {
				currentTweet: 0,
				element: ''
			},
			
			initialize: function(options){
				this.parent(options);
				this.tweets = new Array();
				this.element = $(this.options.element);
				this.transition = new Fx.Tween('tweet-feed');
				this.current = 0;
				this.nextTweet = 0;
			},
			
			// Method for rewire twitter feed content into a link
			linkTweet: function(text) {
				return text.replace(/(https?:\/\/\S+)/gi,'<a href="$1">$1</a>').replace(/(^|\s)@(\w+)/g,'$1<a href="http://twitter.com/$2">@$2</a>').replace(/(^|\s)#(\w+)/g,'$1#<a href="http://search.twitter.com/search?q=%23$2">$2</a>');
			},
			
			// Method to print feed to an element
			printTweet: function(index)  {
				if (this.element) { this.element.innerHTML = this.tweets[index] }			
			},
			
			// Method to update a tweet 
			updateTweet: function(index)  {
				if(this.element) { this.element.innerHTML = this.tweets[index] }			
			},
			
			// Method for refreshing tweet (this uses mootool effects to fade the tweet in and out)
			refreshTweet: function()  {
				this.nextTweet = this.current + 1;
				if(this.nextTweet >= this.tweets.length) {this.nextTweet = 0;}
				var tween = this.element.get('tween', { property: 'opacity' } );
				tween.start(0).chain( function() {
						this.element.empty().set('html', this.tweets[this.nextTweet] );
						this.current = this.nextTweet;
						tween.start(1);
				}.bind(this));
			}
			
			
	});															 
																															 
	
	
Billboard = new Class({
	Implements: [Options, Events, Fx, Fx.Tween],
	
	options: {
			billboardWrapper: 'billboard-postion',
			navigationWrapper: '',
			buttonName: '',
			billboardName: 'billboard',
			billboardClass: '.billboard',
			billboardButtonClass: '.billboard-button',
			nextButton: 'billboard-next',
			previousButton: 'billboard-previous',
			src: false,
			type: 'img',
			width: 949,
			height: 288,
			xPostion: 0,
			yPostion: 0,
			totalItems: 2,
			isRandom: true,
			totalWidth: 1600,
			current: 0
	},

	initialize: function(options){
		this.setOptions(options);
		
		this.nextButton 					= this.options.nextButton;
		this.previousButton 			= this.options.previousButton;
		
		this.billboardButtonClass =  this.options.billboardButtonClass;
		this.billboardClass 			= this.options.billboardClass;
		
		this.billboardButtons 		= $$(this.billboardButtonClass); // Get billboard buttons
		this.billboards						= $$(this.billboardClass); // Get billboards 
			
		this.length 							= this.billboardButtons.length; // set lenght of billboards
		
		if(this.options.isRandom == true) {
			this.current 							= Math.floor(Math.random() * this.length); // If Random then randomize on load
		} else {
			this.current 							= this.options.current;  // Else reffer to current property
		}
		
		this.fxCollection 				= new Array();
		this.currentButton 				= $(this.billboardButtons[this.current]); // Set current button
		
		this.currentButton.addClass('active');   // Add class="active" to current button
		
		var hrefBookmark   = $(this.currentButton).get('href');  // Get the HREF book mark value "#billboard-0"  This should equal the id of the billboard
		
		this.currentBillboard = $$(hrefBookmark);             // set current billboard
		this.currentBillboard = this.currentBillboard[0];     // set current billboard out of array to DOM object
		
		// Loop to add events and set opactiy
		for (i=0;i < this.length; i++) {	
			this.billboardButtons[i].addEvent('click', function(event){ this.changeBillboard(event); return false;	}.bind(this) ); 
			if(i == this.current) {	this.billboards[i].setStyle('opacity',1); 	} else { this.billboards[i].setStyle('opacity',0); }			
		}
		
		// Add events to the next button and previous button
		$(this.nextButton).addEvent('click', 		function(event){ this.next(event); return false;	}.bind(this));
		$(this.previousButton).addEvent('click', function(event){ this.prev(event); return false;	}.bind(this));
						
	},
	
	// Method to change the billboard
	changeBillboard: function(event){
		var anchorButton = $(event.target);  // gets the clicked DOM anchor tag
		var hrefBookmark = anchorButton.get('href');  // gets the clicked href value
		var billboardArray = $$(hrefBookmark); // use the href value to grab the billboard  $()
		var billboard = billboardArray[0];  // Set current billboard from array to DOM value
			
		if(this.currentButton == anchorButton) { return }   // If the user clicks on already active button the cancle method

		this.currentButton.removeClass('active'); // remove class="active" on old button

		var tempFxOut = new Fx.Tween(this.currentBillboard, {property: 'opacity'});	  // intitalize effects for fade out
		var tempFxIn  = new Fx.Tween(billboard, {property: 'opacity'}); // intitalize effects for fade in
		
		tempFxOut.start(0); // fade out 
		tempFxIn.start(1); // fade in 
		
		this.currentButton =  anchorButton;  // set new current button value
		var index = hrefBookmark.parseIndex('-');  //Grab Index from href  example "#billboard-1"  grab 1 value
		
		this.current = index.toInt();    // set current index
		anchorButton.addClass('active');   // add active class to new current button
		this.currentBillboard = billboard;  // set current billboard
		
		return false;
	},
	
	// Method for next button
	next: function(event){
		var nextIndex = (this.current + 1);   // increase index
		if(nextIndex >= this.length) { nextIndex = 0; }  // check to see if index has exceeded maximum
				
		var anchorButton = this.billboardButtons[nextIndex];    // get next DOM anchor button
		var hrefBookmark = anchorButton.get('href');      // gets the next href value
		var billboardArray = $$(hrefBookmark);     // gets the next billboard value
		
		this.currentButton.removeClass('active');  // remove class="active" on old button

		var tempFxOut = new Fx.Tween(this.currentBillboard, {property: 'opacity'});	 // intitalize effects for fade out
		var tempFxIn  = new Fx.Tween(billboardArray[0],     {property: 'opacity'}); // intitalize effects for fade in
		
		tempFxOut.start(0); // fade out
		tempFxIn.start(1); // fade in 
		
		this.currentButton =  anchorButton; // set new current button value
		anchorButton.addClass('active'); // add active class to new current button
		
		this.currentBillboard = billboardArray[0];	   // set current billboard			
		this.current = nextIndex;    // set current index
		
		return false;
		
	},
	
	// Method for previous button
	prev: function(event){
		var prevIndex = (this.current - 1);  // decrease index
				
		if(prevIndex < 0) { prevIndex = (this.length - 1); } // check to see if index has gone below 0
				
		var anchorButton = this.billboardButtons[prevIndex];  // get prev DOM anchor button
		var hrefBookmark = anchorButton.get('href');    // gets the prev href value
		var billboardArray = $$(hrefBookmark);    // gets the prev billboard value
		
		this.currentButton.removeClass('active');  // remove class="active" on old button

		var tempFxOut = new Fx.Tween(this.currentBillboard, {property: 'opacity'});	 // intitalize effects for fade out
		var tempFxIn  = new Fx.Tween(billboardArray[0],     {property: 'opacity'}); // intitalize effects for fade in
		
		tempFxOut.start(0); // fade out
		tempFxIn.start(1); // fade in 
		
		this.currentButton =  anchorButton;  // set new current button value
		anchorButton.addClass('active'); // add active class to new current button
		this.currentBillboard = billboardArray[0];	  // set current billboard				
		this.current = prevIndex;   // set current index
		
		return false;	
	}
	
});		
	
	
	
	
var serenaBillboard;
var serenaTwitterFeed;

window.addEvent('domready',function() {
		
	// Intitalize billboard
	serenaBillboard = new Billboard(); 
	
	
	// Intitalize twitter feed
	serenaTwitterFeed = new Request.JSON.TwitterCache({ url: "twitter-feed.php", element: 'tweet-feed', noCache: true, onSuccess: 
		function(twitterResponse) { 
			
			// AFTER REQUEST DATA HAS BEEN RETURNED
			
			twitterResponse.each( function(tweet) { this.tweets.push( this.linkTweet(tweet.text)); },this); // Loop through each JSON value and build array
			
			var tween = this.element.get('tween', { property: 'opacity' }); // Get opacity
			
			//Chain events for tweeet fad in and out 
			tween.start(0).chain( function() {
					this.element.empty().set('html', this.tweets[0] ); // Change up Tweet data
					tween.start(1);
			}.bind(this));
			
			this.refreshTweet.periodical(6500, this);  // Reset timer - periodical is the timer 
				
		}
	}).get(); 	
		
});