$(document).ready(function() {
	$("input[type=text]").placehold();
	$("#contact-form select, #new_user select").selectReplace();
	//$("#contact-form select, #main-content select, .main-content select").selectReplace();
	
	$('#walkthrough').simpleVideo(); 
	
	$('#teams-chooser > li').bind('click', function() {
		$(this).addClass('active').siblings().removeClass('active');
	});
	$('a[href=#teams-chooser]').bind('click', function(e) {
		e.preventDefault();
		$('#teams-chooser').show();
		$(this).hide();
	});
	
	if($('#teams-and-venues')) {
	  $('#teams-and-venues').find('li').hover(function() {
	    $(this).css('zIndex',100).find('.tooltip').fadeIn(250);
	  }, function() {
	    $(this).find('.tooltip').fadeOut(50).css('zIndex',10);
	  });
	}
});


/************************************************************************************
** jQuery Placehold version 0.2
** (cc) Jason Garber (http://sixtwothree.org and http://www.viget.com)
** Licensed under the CC-GNU GPL (http://creativecommons.org/licenses/GPL/2.0/)
*************************************************************************************/

;(function($) {
	$.fn.placehold = function( options ) {
		var opts = $.extend( {}, $.fn.placehold.defaults, options ),
			supported = $.fn.placehold.is_supported();
		
		function toggle( arr ) {
			for ( i = 0; i < arr.length; i++ ) {
				arr[i].toggle();
			}
		}
		
		return this.each( function() {
			if ( !supported ) {
				var elem = $( this ),
					placeholder_attr = elem.attr( "placeholder" ),
					is_password = ( elem.attr( "type" ) == "password" ) ? true : false;
				
				if ( placeholder_attr ) {
					if ( !elem.val() || elem.val() == placeholder_attr ) {
						elem.addClass( opts.placeholderClassName ).val( placeholder_attr );
					}
					
					elem.focus( function() {
						if ( elem.val() == placeholder_attr ) {
							elem.removeClass( opts.placeholderClassName ).val( "" );
						}
					});
					
					elem.blur( function() {
						if ( !elem.val() ) {
							if ( is_password ) {
								toggle( [elem, elem_stub] );
							}
							
							elem.addClass( opts.placeholderClassName ).val( placeholder_attr );
						}
					});
					
					elem.closest( "form" ).submit( function() {
						if ( elem.val() == placeholder_attr ) {
							if ( is_password ) {
								toggle( [elem, elem_stub] );
							}
							
							elem.val( "" );
						}
						
						return true;
					});
					
					if ( is_password ) {
						var elem_stub = $( '<input type="text" class="' + opts.placeholderClassName + '" value="' + placeholder_attr + '" />' );
						
						elem_stub.focus( function() {
							toggle( [elem, elem_stub] );
							elem.focus();
						});
						
						elem.hide().after( elem_stub );
					}
				}
			}
		});
	};
	
	$.fn.placehold.is_supported = function() {
		return "placeholder" in document.createElement( "input" );
	};
	
	$.fn.placehold.defaults = {
		placeholderClassName: "placeholder"
	};
})(jQuery);

/* Custom Select */
$.fn.selectReplace = function(opts) {
	if (!($.browser.msie && $.browser.version < 7)) {
		return this.each(function() {
			var $this = $(this);
			var o = $.meta ? $.extend({}, opts, $this.data()) : opts;

			$this.wrap('<span id="' + $this.attr('id') + '-wrapper" class="select-wrapper"></span>').before('<span class="value">' + $this.find('option[value=' + $this.val() + ']').html() + '</span>');
			$this.css("opacity", 0.01);

			$this.change(function() {
				$this.siblings('.value').html($this.find('option[value=' + $this.val() + ']').html());
			});
			
			$this.focus(function() {
			  $this.closest('.select-wrapper').addClass('focus');
			}).blur(function() {
			  $this.closest('.select-wrapper').removeClass('focus');
			});

		});
	}
};

/* video controls */

(function() {

	$.fn.simpleVideo = function(options) {
		var opts = $.extend({}, $.fn.simpleVideo.defaults, options);
		return this.each(function() {

			var video = this,
				o = $.meta ? $.extend({}, opts, $video.data()) : opts,
				$video = $(this),
				$overlay = $(o.overlay),
				$wrapper = $(o.wrapper),
				elements = {
					overlay: $overlay,
					video: $video,
					wrapper: $wrapper
				},
				playing = false,
				playCheck = null;
				
			function init() {
				$video.wrap($wrapper).before($overlay);
				$video.bind({
					click: function() {
						pause();
					},
					pause: function() {
						pause();
					},
					play: function() {
						play();
					},
					toggle: function() {
						if(isPlaying()) {
							pause();
						} else {
							play();
						}
					}
				});
				$overlay.bind({
					click: function() {
						$video.trigger("play");
					}
				});
			};
			
			function play() {
				video.play();
				playing = true;
				pingVideo();
				o.onPlay(elements);
			};
			
			function pause() {
				video.pause();
				playing = false;
				endPing();
				o.onPause(elements);
			};
			
			function isPlaying() {
				if(video.paused || video.ended) {
					return false;
				}
				return true;
			};
			
			function pingVideo() {
				playCheck = setInterval(function() {
					if(isPlaying()) {
						return;
					}
					playing = false;
					endPing();
				}, 1000);
			};
			
			function endPing() {
				clearInterval(playCheck);
				o.onStop(elements);
			};
			
			init();
		});
	};

	$.fn.simpleVideo.defaults = {
		onPause: function(elements) {
			elements.overlay.fadeIn();
		},
		onPlay: function(elements) {
			elements.overlay.fadeOut();
		},
		onStop: function(elements) {
			elements.overlay.fadeIn();
		},
		overlay: '<span class="video-player-overlay"></span>',
		wrapper: '<div class="video-player"></div>'
	};
	
})(jQuery);



var carousel = function(scope, options) {
  this.options = $.extend({}, carousel.defaults, options);
  var _this = this,
      $this = _this.scope = $(scope),
      $next = _this.next = $this.find(_this.options.nextSelector),
      $previous = _this.previous = $this.find(_this.options.previousSelector),
      $viewPane = _this.viewPane = $this.find(_this.options.viewPaneSelector),
      $slider = _this.slider = $this.find(_this.options.sliderSelector),
      $items = _this.items = $this.find(_this.options.itemsSelector);
      _this.itemCount = $items.size();

  _this.advance = function(dir, callback) {
    var distance = dir * _this.options.pageWidth;
    $slider.animate({
      left: '-='+distance+'px'
    },_this.options.animationDuration, callback);
  };

  _this.bindActions = function() {

     $items.bind('click', function() {
       window.location.href = $(this).find('a').attr('href');
     });

     $next.bind('click', function() {
       if(!$(this).hasClass(_this.options.disabledClass)) {
         _this.advance(1, setDisabledStates);
       }
       return false;
     });

     $previous.bind('click', function() {
       if(!$(this).hasClass(_this.options.disabledClass)) {
         _this.advance(-1, setDisabledStates);
        }
       return false;
     });
  };

  _this.setSliderWidth = function() {
    var sliderWidth = _this.itemCount*$items.eq(0).outerWidth(true);
    $slider.css('width', sliderWidth);
    return sliderWidth;
  };

  function setDisabledStates() {
    if(_this.itemCount <= _this.options.visiblePerPage) {
      $next.addClass(_this.options.disabledClass);
      $previous.addClass(_this.options.disabledClass);
      return;
    }
    var sliderPos = $slider.offset().left,
        viewPanePos = $viewPane.offset().left;
    if(sliderPos >= viewPanePos) {
      $previous.addClass(_this.options.disabledClass);
      $next.removeClass(_this.options.disabledClass);
    } else if(Math.abs(sliderPos - viewPanePos) + _this.options.pageWidth >= $slider.outerWidth()) {
      $previous.removeClass(_this.options.disabledClass);
      $next.addClass(_this.options.disabledClass);
    } else {
      $previous.removeClass(_this.options.disabledClass);
      $next.removeClass(_this.options.disabledClass);
    }
  }

  _this.setSliderWidth();
  setDisabledStates();
  _this.bindActions();

  return this;

};

carousel.defaults = {
  visiblePerPage: 4,
  pageWidth: 620,
  animationDuration: 750,
  easingMethod: 'easeOutExpo',
  nextSelector: 'a.next',
  previousSelector: 'a.prev',
  viewPaneSelector: 'div',
  sliderSelector: 'ul',
  itemsSelector: 'li:not(ol ul li)',
  disabledClass: 'disabled'
};

var caro = carousel('#teams-and-venues .carousel');

