// I-Behavior.com Panel Slider
// Imulus, MMXI

function PSlider(){

	var Slider = this;
	var Data = PSData;

	// global vars
	
	var isMobile = function(){
		if( 
			navigator.userAgent.match(/Android/i) ||
			navigator.userAgent.match(/webOS/i) 	||
			navigator.userAgent.match(/iPhone/i) 	||
			navigator.userAgent.match(/iPad/i)		||
			navigator.userAgent.match(/iPod/i)
		){ return true; }
		else { return false; }
	};

	// global jQ objects
		var $panels = $("ul#panels li a");
		var	$slides = $("div.slide");
		var $dots = $("a.dot");
		var $bubbles = $("span.bubble");

//

	Slider.init = function(){
    this.billboards.init();
		this.bubbles.init();
		this.panels.init();
		this.slides.init();
		this.controls.init();
		isMobile();
	};
	
//	

  Slider.billboards = {
    
    init : function(){
      this.build();
    },
    
    build : function(){
			$('ul#billboards').cycle({
				speed: 1000, 
				timeout: 4000,
				fx: 'fade'
			});
    }
    
    
  };

//

	Slider.panels = {

		init : function(){
			this.observe();
		},

		observe : function(){

			var drop = 0.4;
			var upSpeed = 0;
			var downSpeed = 800;
			var ease = 'easeOutSine';

			$panels.hover(
				function(){
					$(this).parents('li').animate({ opacity : drop }, upSpeed, ease,
						function(){ $(this).animate({	opacity : 1	}, downSpeed, ease);
					});
				},
				function(){ return false; }
			);

			$panels.click( function(e){
				e.preventDefault();
				var index = $(this).parents('li').index();
				Slider.slides.open(index);
			});

		},
		
		show  : function(){
			$panels.fadeIn(1000);
		},
				
		hide : function(){
			$panels.fadeOut(1000);
		}
		
		

	};

//

	Slider.slides = {

		init : function(){
			this.build();
		},

		build : function(){
			$slides.css("opacity", 0);
		},

		open : function(index){
			var $slide = $slides.eq(index);
			var $bubble = $slide.find('span.bubble').eq(0);
			if ( ! isMobile() ) {
				$slide.animate({
					"right" : "0%",
					"opacity" : 1
				 }, 600, function(){
					Slider.bubbles.open($bubble);
				});
			}
			else {
				$slide.css({
					"right" : "0%",
					"opacity" : 1
				}).show();
				Slider.bubbles.open($bubble);				
			}
			Slider.panels.hide();
		},

		close: function(){
			if ( ! isMobile() ) {
				$slides.animate({
					"right" : "100%",
					"opacity" : 0
				 }, 600, function(){
					Slider.bubbles.close();
				});
			}
			else {
				$slides.hide();
				Slider.bubbles.close();				
			}
			Slider.panels.show();		
		}

	};

//

	Slider.controls = {

		init : function(){
			this.build();
			this.observe();
		},

		build : function(){
			$slides.each(function(){
				var $back = $("<button />").attr("className","ps-back").text("Back");
				$(this).append($back);
			});
		},

		observe : function(){
			$('button.ps-back').click( function(e){
				e.preventDefault();
				Slider.slides.close();
			});

		}

	};

//

	Slider.bubbles = {

		init : function(){
			this.build();
			this.observe();
		},


		build : function(){

			for ( var slide in Data ) {
				var $slide = $("#"+slide);
				for ( var bubble in Data[slide] ) {
					var bubble_id = slide + "_bubble_" + bubble;
					var bubble = Data[slide][bubble];
					var dot = bubble.dot;
					var $bubble = $("<span />").attr({"className" : "bubble","id" : bubble_id}).css(bubble.css).text(bubble.text).appendTo($slide);
					var $dot = $("<a />").attr({"className" : "dot","href" : "#"+bubble_id}).css(dot.css).appendTo($slide);
				}
			}

			$bubbles = $("span.bubble"); // re-map

		},


		observe : function(){

			if( ! isMobile() ) {

				$dots.live( "mouseenter", function(){
					Slider.bubbles.close();
					var href = $(this).attr("href");
					var $bubble = $(href);
					$.doTimeout( href );
					Slider.bubbles.open($bubble);
				});

				$dots.live( "mouseleave", function(){
					var href = $(this).attr("href");
					var $bubble = $(href);
					$.doTimeout( href, 200, function(){
						Slider.bubbles.close($bubble);
					});
				});

				$dots.live( "click", function(e){
					e.preventDefault();
				});

			}
			
			else {

				$dots.live( "click", function(e){
					e.preventDefault();
					Slider.bubbles.close();
					Slider.bubbles.open($($(this).attr("href")));
				});

			}
			
			$bubbles.click(function(){
				Slider.bubbles.close($(this));
			});
			
			$bubbles.hover(
				function(){
					var id = $(this).attr("id");
					var timeout = "#"+id;
					$.doTimeout( timeout );				
				},
				function(){
					var id = $(this).attr("id");
					var timeout = "#"+id;
					var $bubble = $(timeout);
					$.doTimeout( timeout, 200, function(){
						Slider.bubbles.close($bubble);
					});					
				}				
			);

		},

		open : function($bubble){
			var speed = 150;
			if ( isMobile() ) {
				speed = 0;
			}
			$bubble.show(speed);
		},

		close : function(){
			var speed = 150;
			if ( isMobile() ) {
				speed = 0;
			}
			$bubbles.hide(speed);	
		}

	};

//

};

















$(document).ready(function(){
	var PS = new PSlider();
		PS.init();
});