/* Author: 

*/

$(document).ready(function(){
	/* SCAFFOLDING ----------
	var pages = {
			'/index.shtml': {
				addClass: ''
			},
			
			'/home-charley.shtml': {
				addClass: 'home charley'
			},
			
			'/home-neighbors.shtml': {
				addClass: 'home neighbors'
			},
			
			'/home-derby.shtml': {
				addClass: 'home derby'
			},
			
			'/promotions.shtml': {
				addClass: 'promotions',
				navIndex: 4
			}, 
			
			'/coupons-in.shtml': {
				addClass: 'coupons',
				navIndex: 4
			},
			
			'/coupons-out.shtml': {
				addClass: 'coupons',
				navIndex: 4
			},
			
			'/meal-solutions-landing.shtml': {
				addClass: 'meal-solutions-landing',
				navIndex: 2
			},
			
			'/product-landing.shtml': {
				addClass: 'product-landing',
				navIndex: 1
			},
			
			'/product-detail.shtml': {
				addClass: 'product-detail',
				navIndex: 1
			},
			
			'/recipe-landing.shtml': {
				addClass: 'recipe-landing',
				navIndex: 0
			},
			
			'/recipe-results.shtml': {
				addClass: 'recipe-results',
				navIndex: 0
			},
			
			'/recipe-detail.shtml': {
				addClass: 'recipe-detail',
				navIndex: 0
			},
			
			'/tips-for-life.shtml': {
				addClass: 'tips-for-life',
				navIndex: 3
			}
		};
	
	if (pages[location.pathname]) {
		$('body')
			.addClass( pages[location.pathname].addClass ? pages[location.pathname].addClass : '');
		
		if (pages[location.pathname].navIndex) {
			if ($('nav#primary table').length) {
				$('nav#primary table td:eq(' + pages[location.pathname].navIndex + ')').addClass('current');
				
			} else {
				$('nav#primary ul li:eq(' + pages[location.pathname].navIndex + ')').addClass('current');
			}
		}
	}
	
	$('body').addClass(
		(location.search.replace('?','') == '') ? 'blue' : location.search.replace('?','')
	);
	
	/* SCAFFOLDING ---------- */
	
	// Decorating
	//*
	$('#carousel li')
		.each(function(idx){
			$(this).addClass('nth-of-type' + ++idx);
		});
	
	$('ul')
		.find('li:first-of-type')
			.addClass('first-of-type')
		.end()
		.find('li:last-of-type')
			.addClass('last-of-type');
	
	$('.ie7 nav#primary')
		.find('td:last-of-type')
			.addClass('last-of-type');
	
	$('#coupon-list')
		.find('li')
			.each(function(idx){
				$(this).addClass('nth-last-of-type' + ($('#coupon-list li').length - idx));
			});
			
	$('.recipe-results ul')
		.find('li:even')
			.addClass('even')
		.end()
		.find('li:odd')
			.addClass('odd');
	// */
	
	// Add a general "ie" class for any version of IE.
	// Necessary for font control.
	$.browser.msie && $('html').addClass('ie');
	
	if (!Modernizr.textshadow) {
		$('nav#side h1').textshadow({useStyle: false});
		$('.home.charley #lunchtime h2').textshadow({useStyle: false});
		$('.recipe-detail #details h1').textshadow({useStyle: false});
	}
	
	$('#tabs').tabs();
	
	$('a').focus(function(){ $(this).blur(); });
	
	// Focus / Blur Handler for input.instructions.
	$('input[data-instructions]').bind({
		focus: function(){
			var $this = $(this);
			if ($this.val() == $this.attr('data-instructions')) {
				$this.val('');
				$this.removeClass('filled');
			}
		},
		
		blur: function(){
			var $this = $(this);
			if($this.val() == '') {
				$this.val($this.attr('data-instructions'));
				$this.removeClass('filled');
			} else {
				$this.addClass('filled');
			}
		}
	}).blur();
	




	// Carousel
	window.carousel = function($){
		var _c, _e, _a, _pub, _ie7,
			_$carousel, _$tabs, _$links, _$panels, _$stage;
		
		_c = { // Configuration and Class names
			active: 'active',
			baseWidth: 134,
			hoverWidth: 149,
			activeWidth: 164
		};
		
		_e = { // Elements
			active: '.active',
			
			carousel: '#carousel',
			tab: 'li span',
			link: 'li a.link',
			panel: 'li img.panel',
			stage: '.stage'
		};
		
		_a = { // Animation Specific Settings
			itemIn: 100,
			itemOut: 150,
			panelShow: 500
		};
		
		function init() {
			// Because of the CSS, the carousel starts with
			// the last image showing, and no 'active' item.
			// So we need to activate the last item, then trigger
			// the transition to the first item.
			_$carousel = $(_e['carousel']);
			_$tabs = _$carousel.find(_e['tab']);
			_$panels = _$carousel.find(_e['panel']);
			_$links = _$carousel.find(_e['link']);
			
			_ie7 = $.browser.msie && $.browser.version == 7;
			
			if($('body').hasClass('ie7')) {
				for (var timing in _a) { _a[timing] = 0; }
			}
			
			_$panels
				.not(_e['active'])
					.fadeOut(0);
			
			bindHandlers();
			
			showPanel(_$carousel.find(_e['active']).parent().index());
		}
		
		function bindHandlers() {
			!_ie7 && _$tabs.bind({
				mouseenter: function(ev){
					var $this = $(this);
						
					!$this.is(_e['active']) &&
						$this.stop()
							.animate({
								width: _c['hoverWidth']
							},{
								duration: _a['itemIn']
							});
				},
				
				mouseleave: function(ev){
					var $this = $(this);
						
					!$this.is(_e['active']) &&
						$this.stop()
							.animate({
								width: _c['baseWidth']
							},{
								duration: _a['itemOut']
							});
				}
			});
			
			_$carousel.bind({
				click: function(){
					window.location = $(this).find(_e['active']).find('a').attr('href');
				}
			});
			
			_$links.bind({
				click: function(ev){
					var $this = $(this),
						$target = $this.parent();
					
					if (!$target.is(_e['active']) && !_$panels.filter(':animated').length) {
						showPanel($this.parents('li').index());
					}
					
					return false;
				}
			});
		}
		
		function animate($item, destination, duration) {
			$item
				.stop()
				.animate({
					width: destination,
					paddingRight: destination
				},{
					duration: duration
				});
		}
		
		function showPanel(index) {
			var $inTab = _$tabs.eq(index),
				$inPanel = _$panels.eq(index),
				$outTab = _$tabs.filter(_e['active']),
				activeIndex = $outTab.parents('li').index(),
				$outPanel = _$panels.eq(activeIndex);
				
			if (index > activeIndex) {
				$inPanel.show().fadeTo(_a['panelShow'], 1, function(){
					_$panels.not($inPanel).fadeTo(0,0).hide();
				});
				
			} else {
				$inPanel.show().fadeTo(0,1);
				
				if ($outTab.parent().index() != index) {
					$outPanel.fadeTo(_a['panelShow'], 0, function(){
						_$panels.not($inPanel).fadeTo(0,0).hide();
					});
				}
			}
			
			if ($outTab.parent().index() != index) {
				$outTab
					.animate({
						width: _c['baseWidth']
					},{
						duration: _a['itemOut'],
						complete: function() {
							_$tabs.not($inTab).removeClass(_c['active']);
						}
					});
			}
			
			$inTab
				.animate({
					width: _c['activeWidth']
				},{
					duration: _a['itemIn'],
					complete: function() {
						$inTab.addClass(_c['active'])
					}
				});
			
		}
		
		
		
		_pub = {
			init: init,
			showPanel: showPanel
		}
		return _pub;
	}(jQuery);
	$('#carousel').length && carousel.init();
	
	
	
	
	// Overlay
	window.layover = function($) {
		var _c, _e, _a, _pub,
			_$overlay, _$bg, _$open, _$close,
			_$window, _$document, _$body;
		
		_c = {
			bg: 'overlaybg',
			bgOpacity: 0.5,
			maxz: 16777271,
			mintop: 45,
			travel: 50
		};
		
		_e = {
			overlay: '#overlay',
			bg: '#overlaybg',
			open: '#varieties li a,a.popup',
			close: '.close'
		};
		
		_a = {
			show: 750,
			hide: 500
		};
		
		function init() {
			$(_e['bg']).length && $(_e['bg']).remove();
			
			_$window = $(window);
			_$document = $(document);
			_$body = $('body');
			_$bg = $('<div>').attr({ id: _c['bg'] });
			_$overlay = $(_e['overlay']);
			_$open = $(_e['open']);
			_$close = _$overlay.find(_e['close']);
			
			_$bg
				.css({
					position: 'absolute',
					display: 'none',
					top: 0,
					left: 0,
					width: Math.max(_$window.width(), _$document.width()),
					height: Math.max(_$window.height(), _$document.height()),
					backgroundColor: '#000',
					opacity: 0,
					cursor: 'pointer',
					zIndex: _c['maxz'] - 10
				})
				.appendTo('body');

			_$overlay
				.remove()
				.css({
					top: -9999,
					left: -9999,
					opacity: 0,
					zIndex: _c['maxz'] - 5
				})
				.appendTo('body');
		
			bindHandlers();
		}
		
		function bindHandlers() {
			_$open.bind({
				click: function() {
					$("#" + $(this).attr("rel")).removeClass("hidden"); //Show only the element tied to the clicked link
					showOverlay();
					return false;
				}
			});
			
			_$close.add(_$bg).bind({
				click: function() {
					$(".popup-content").addClass("hidden"); // To Hide All elements in the Overlay Div
					hideOverlay();
					return false;
				}
			});
		}
		
		function showOverlay() {
			var top;
			
			if (_$window.scrollTop() + _$overlay.outerHeight() + _c['travel'] > _$body.height()) {
				_$body.height( _$window.scrollTop() + _$overlay.outerHeight() + _c['travel']*2 );
			}
		
			
			_$bg
				.css({
					height: _$document.height()
				})
				.show()
				.fadeTo(_a['show'] / 2, _c['bgOpacity']);
			
			top = (_$window.height() < _$overlay.outerHeight()) ? 10 : (_$window.height() - _$overlay.outerHeight()) / 3 ;
			top += _$window.scrollTop();
			if (top < _c['mintop']) { top = _c['mintop'] }
			
			_$overlay
				.show()
				.css({
					top: top - _c['travel'],
					left: ((_$window.width() - _$overlay.outerWidth()) / 2)
				})
				.animate({
					top: top,
					opacity: 1
				},{
					duration: _a['show']
				});
			
			(_$window.scrollTop() > top) && window.scrollTo(0, top);
		}
		
		function hideOverlay() {
			_$overlay
				.animate({
					top: -_c['travel'],
					opacity: 0
				},{
					duration: _a['hide'],
					complete: function() {
						_$overlay.hide();
					}
				});
				
			_$bg
				.delay(_a['hide'] / 3)
				.fadeTo(_a['hide'], 0, function(){ _$bg.hide() });
		}
		
		_pub = {
			init: init
		};
		return _pub;
	}(jQuery);
	$('#overlay').length && layover.init();

});