// help thickbox plugin
var help = function() {
	
	var helpUrl = applicationRoot + 'help';
	
	//public
	var init = function() {
		
		if ($.browser.msie) {
			if (parseFloat($.browser.version) < 6.9) return;
		}

		var $as = $('a.tb_help');
		
		$as.click(function (e) {
			loadHtml(e.target);
			return false;
		});
	};
	
	//private
	var loadHtml = function(t) {
		var hash = t.href.split('#')[1];
		$helpContainer = $('<div id="helpContainer" style="display:none"></div>');
		$('body').append($helpContainer);
		var loadUrl = helpUrl + ' #' + hash;
		$helpContainer.load(loadUrl, function() {
			tb_show('Ajutor' , '#TB_inline?width=500&height=400&inlineId=helpContainer', false, 'tb_help');
		});
		
	};
	
	return { init: init };
	
}();


// little utility scripts
// if you have another one, please put it in here & call from window.load or document.ready
var utils = {
	enableJavaScript: function(){
		// Add jQuery selectors and css display value for elements that need to be shown.
	  var idNoJavascriptAry = new Array();
	  idNoJavascriptAry[0] = new Array ($('#schedule #schedule-text'),"block");
	  idNoJavascriptAry[1] = new Array ($('.reviews #mainContent .car-finder'),"block");
	  idNoJavascriptAry[2] = new Array ($('a.i-add-removed'),"inline");
	  idNoJavascriptAry[3] = new Array ($('.specs .content-list table tbody a.i-add-removed'),"block");
	  for (var i=0;i<idNoJavascriptAry.length;i++) {
	    idNoJavascriptAry[i][0].css('display',idNoJavascriptAry[i][1]);
	  }

		// Add class names to items to display children
	  $('#video-list-container').addClass('show-video-list');
	},	
	
	inputHover: function() {
		 // Hover state for input go buttons
		$('input.go-button').hover(function () {
			$(this).attr('src', resolveUrl('~/assets/images/core/b-go-over.gif'));		
		  }, 		
		  function () {		
			$(this).attr('src', resolveUrl('~/assets/images/core/b-go.gif'));		
		  }
		);
		$('input.refine-button').hover(function () {
			$(this).attr('src', resolveUrl('~/assets/images/core/b-go-content-over.gif'));		
		  }, 		
		  function () {		
			$(this).attr('src', resolveUrl('~/assets/images/core/b-go-content.gif'));
		  }
		);
	}	
};


// puts text into the input field
// built as jQuery plugin
;(function($) {
  $.fn.autoInputLabel = function(options) {
    
    // setup defaults
    var defaults = {
      blurColor: '#666',
      focusColor: '#000',
      value: ''
    };
    
    // override defaults with user input
    defaults = $.extend(defaults, options);
    
    // helper functions
    // set up which value to use
    var setupValue = function(t) {
      
      // we use the value that is in the value attribute
      if (t.value !== '') {
        t.origValue = t.value;
        
      // else if the user provided a value we use that
      } else if (defaults.value !== '') {
				t.origValue = defaults.value;
      
      // else we use the label associated with it
      } else if ($('label[for=' + t.id + ']').length) {
        t.origValue = $('label[for=' + t.id + ']').text();
      } else {
        return false;
      }
			// assign the value to the value attribute
			t.value = t.origValue;
      return true;
    };
    
    // setup events
    var setupEvents = function(t) {
      var $t = $(t);
      $t.focus(function() {
        if (t.value === t.origValue) {
          $t.attr('value', '').css('color', defaults.focusColor);                
        }
      });
      $t.blur(function() {
        if ($t.attr('value') === '') {
          $t.attr('value', t.origValue).css('color', defaults.blurColor);
        }
      });
    };
    
    // constructor
    // setup the jQuery object
    this.each(function() {
      if (this.type === 'text') {            
        // if we have a value we set everything up
        if (setupValue(this)) {
          $(this).css('color', defaults.blurColor);
          setupEvents(this);
        }
      }
    });

    return this;
  };
})(jQuery);


// $('input:text#name').autoInputLabel({blurColor:'red', value:'First name'});
// $('input:text#lastname').autoInputLabel({blurColor:'red', value:'Last name'});
// this = $('input:text');

// searchBoxText: function() {
// 	// Search box field
// 	var searchText = 'Search topgear.com';
// 	$('#header input.search-box').focus(function(){
// 	  if (this.value !== searchText) return;
// 	  this.value = '';
// 		$(this).css('color', '#333');
// 	  $(this).blur(function() {
// 	    if (this.value === '') {
// 	      this.value = searchText;
// 				$(this).css('color', '#999');
// 	    }
// 	  });
// 	});
// },

// responsible for the navigation rollovers with delay, etc
var Navigation = function() {
	// instance variables
	var delay = 300; // delay before the next item gets selected

	// DO NOT MODIFY UNLESS YOU ARE SURE WHAT YOU'RE DOING
	var navItems = [];
	var $origSub;

	if ($('#header #navigation ul#mainNav li.show-subnav div').length > 0) { // Detect if nav items are selected but sub-nav is set to visible
		$origSub = $('#header #navigation ul#mainNav li.show-subnav div');
	} else {
		$origSub = $('#header #navigation ul#mainNav li.selected div');
	}
	var $allSubs = $('#header #navigation ul#mainNav li div');
	var timer = -1;
	var defaultSubNav = $('#header #navigation ul#mainNav li.selected div');
	
	$allSubs.find('li').hover(function() {
		$(this).addClass('over');
	}, function() {
		$(this).removeClass('over');
	});
	
	// Nav item object
	var NavItem = function($el) {
			var me = this;
			var $nav = $el;
			var $subnav = $el.find('div');
			var $subnavItems = $subnav.find('li a');
			
			$nav.hover(function() {
				$nav.addClass('over');
				show();
			}, function() {
				$nav.removeClass('over');
				hide();
			});
			
			$subnav.hover(function(e) {
				show();
			}, function() {
				hide();
			});
			
			$subnavItems.click(function () {
				unbind();
			});
			
			var show = function() {
				clearTimeout(timer);
				timer = setTimeout(
					function() {
						$allSubs.hide();
						$subnav.show();
					}, 
				delay);
			};
			
			var hide = function() {
				clearTimeout(timer);
				timer = setTimeout(
					function() {
						$subnav.hide();
						$origSub.show();
					}, 
				delay);
			};
			
			var unbind = function() {
				var $mainNavItems = $('#navigation ul#mainNav > li');
				$mainNavItems.removeClass('selected').unbind();
				$subnav.unbind();
			};
		};
	
	// constructor
	this.init = function() {
		if ( $('#navigation #mainNav').length === 0 ) { return; }
		$('#navigation ul#mainNav > li').each(function(i) {
			navItems[i] = new NavItem($(this));
		});
	};
	
};

// resolveUrl function mimiks equivilent ASP.NET function,
// allowing urls beginning with a tilda (~) to resolve to 
// application root. 
function resolveUrl(url) {
	if (url.length > 1 && url.substring(0,2) == "~/") {
		return applicationRoot + url.substring(2);
	} else {
		return url;
	}
}

// Cookies
// inspired by http://www.quirksmode.com
var cookie = {
  set: function (name, value, days) {
		var exp = new Date();
		var expires = "";
		if (days){
			exp.setTime(exp.getTime() + (days*24*60*60*1000));
			expires =  "; expires="+exp.toGMTString();
		} else {
			expires = "";
		}
		var domain = window.location.hostname;
		document.cookie = name+'='+value+expires+'; path=/';
	},

	get: function (name) {
		var nameEQ = name + "=";
			var ca = document.cookie.split(';');
			for(var i=0;i < ca.length;i++) {
				var c = ca[i];
				while (c.charAt(0)==' ') c = c.substring(1,c.length);
				if (c.indexOf(nameEQ) == 0) {
					return c.substring(nameEQ.length,c.length);						
				}
			}
			return null;
	},

	erase: function (name) {
		cookie.set(name,"",-1);
	}
};

////////////////////////////////////
//
// current functionality:
// all external links open in new window without editors having to do something
// popups open when anchors have rel="popup"
// popups can be sized by using small, medium, large keywords, i.e.: rel="popup small"
//
// sizes for the 3 popup sizes can be set in the object (see below)
// i.e.: small : [width, height]
//
////////////////////////////////////
var link = {
	//define popup sizes here!
	small : [400, 600],
	medium : [600, 800],
	large : [800, 1000],

	//properties
	domain : window.location.hostname,
	
	init : function() {
		var as = document.getElementsByTagName('a');
		for(var i=0; i<as.length; i++){
			link.externalLinks(as[i]);
			link.popupLinks(as[i]);
		}
	},
	//attach event handler to external links
	externalLinks : function(a){
    var linkDom = a.hostname;
		if(linkDom != link.domain && a.href.indexOf(link.domain) === -1 &&  a.href.indexOf('javascript:') === -1 && linkDom.indexOf("topgear.com") === -1 && a.href !== '' && a.href.indexOf('clients.adestra.com/topgear') === -1 && a.href.indexOf('msgfocus') === -1){
			a.onclick = function() {
				link.openPopup(this.href, "External_Window");
				return false;
			};
		}
	},
	// attach event handler to popup windows
	popupLinks : function(a){
		if (!a.rel || a.rel.indexOf('popup') == -1) return;
		else {
			a.onclick = function() {
				if (this.rel.indexOf('small') != -1) {
					link.openPopup(this.href, "Popup_Window", link.small[0], link.small[1]);
				} else if (this.rel.indexOf('medium') != -1) {
					link.openPopup(this.href, "Popup_Window", link.medium[0], link.medium[1]);
				} else if (this.rel.indexOf('large') != -1) {
					link.openPopup(this.href, "Popup_Window", link.large[0], link.large[1]);
				} else {
					link.openPopup(this.href, "Popup_Window");
				}				
				return false;
			};
		}
	},
	//TODO: at the moment, we always get an empty string passed...
	openPopup : function (location, name, width, height) {
		var topPos = 20;
		var leftPos = 20;
		var winName = name || 'External_Window';
		var popupWindow;
		//make sure the name has no spaces
		name = name.replace(' ', '_');
		
		if (!width) {
			popupWindow = window.open(location, name);
		} else {
			popupWindow = window.open(location, name, 'left=' + leftPos + ',top=' + topPos + ',width=' + width + ',height=' + height + ',menubar=0,resizable=1,toolbar=0,scrollbars=1');
		}
		
	}
};                                                                                                                                      

/**
 * Carbar script
 */
var Carbar = function () {
	var self = this;
	// cache buttons
	var $open_btn    = $('a.open');
	var $find_btn    = $('a.find');
	var $compare_btn = $('a.compare');
	var $close_btn   = $('a.close'); 
	var $help_btn    = $('a.help');
			
	// cache containers
	var $carbar           = $('#carbar');
	var $carbar_container = $('#carbar-container');
	var $model_container  = $('#car-model');
	var $cb_full 					= $('#cb-full');
	var $helpText					= $('#cb-helptext');
	
	// DOM parents that are removed when a derivative or a model is removed
	var derivativeParent = 'li';
	var modelParent      = 'div.model';
	
	// helper classes
	var carbarOpen        = 'open-bar';
	var cOpen             = 'open';
	var cClose            = 'close';
	var cMenu             = 'model-menu';
	var cMinimise         = 'minimise';
	var cRemoveDerivative = 'remove-derivative';
	var cRemoveModel      = 'remove-model';
	var cCloseFull				= 'close-cbfull';
	var cAdd               = 'i-add';
	var cAdded							= 'i-added';
	var full							= 'full';
	
	// messages
	var errorMessage = 'Sorry, there was a problem removing the model';
	
	var timer;

	// init method
	var init = function () {
		// checks whether the carbar should be displayed
		if (cookie.get('carbarState') === 'active' || !(location.pathname.indexOf('car-chooser-launch') === -1) || !(location.pathname.indexOf('parkinglot') === -1) || !(location.pathname.indexOf('car-chooser-compare') === -1) || !(location.pathname.indexOf('compare-cars') === -1)) {
			if ($carbar.hasClass('hidden')) {
				$carbar.removeClass('hidden');
		
				// Add padding to container bottom to give room for carbar
				$('#container').addClass('carbar-added');
			}
		}
		if (cookie.get('pl')) {
			$('#chooser-link').attr('href', cookie.get('pl')).text('Parking Lot');
		}
		
		// checks the cookie to see whether the carbar was open or close
		if (cookie.get('carbar') === 'open' || !(location.pathname.indexOf('car-chooser-launch') === -1) || !(location.pathname.indexOf('parkinglot') === -1) || !(location.pathname.indexOf('car-chooser-compare') === -1) || !(location.pathname.indexOf('compare-cars') === -1)) {
			openCloseCarbar($open_btn);
		} else if (cookie.get('carbar') === 'closed') {
			openCloseCarbar($close_btn);
		}
		
		// event listeners - event delegation
		$carbar.click(function (e) {
			var $target = $(e.target);
			
			// set up different events listeners
			if ($target.hasClass(cOpen)) return openCloseCarbar($target);
			if ($target.hasClass(cClose)) return openCloseCarbar($target);
			if ($target.hasClass(cMenu)) return modelMenu($target);
			if ($target.hasClass(cMinimise)) return modelMenu($target);
			if ($target.hasClass(cRemoveDerivative)) return removeDerivative($target);
			if ($target.hasClass(cRemoveModel)) return removeCar($target);
			if ($target.hasClass(cRemoveModel)) return removeCar($target);
			if ($target.hasClass(cCloseFull)) return removeWarning();
		});
		
		// request new model from backend
		$('#content').click(function (e) {
			var $t = $(e.target);
			
			if ($t.hasClass(cAdd)) {
				// if car has already been added don't add it again.
				if ($t.hasClass(cAdded)) return false;

				// and if there are less than 7 already there
				if ($('#carbar div.model').length < 7) {
					return addCar(e.target);					
				} else {
					return showWarning();
				}
			}
		});

		// save whether carbar was open or closed when window changed
		$(window).unload(function() {
			var loc = window.location + '';
			if (loc.indexOf('parkinglot') !== -1) {
				cookie.set('pl', loc);
			}
			
			if ($carbar.hasClass(carbarOpen)) {
				cookie.set('carbar', 'open');
			} else {
				cookie.set('carbar', 'closed');
			}
		});
		
	};
	
	var toggleHelpText = function() {
		if ($helpText.is(':visible')) {
			$helpText.fadeOut('fast');
		} else if ($helpText.is(':hidden') && $('#carbar div.model').length === 0) {
			$helpText.fadeIn('fast');
		}
	};
	
	var showWarning = function() {
		$carbar.addClass(full);
		$cb_full.fadeIn('fast');
		$('#carbar div.model').hide();
		timer = setTimeout(removeWarning, 10000);
		return false;
	};
	
	var removeWarning = function() {
		$cb_full.fadeOut('fast', function() {
			$carbar.removeClass(full);
		});
		$('#carbar div.model').fadeIn('fast');
		clearTimeout(timer);
		return false;
	};
	
	var openCloseCarbar = function($t) {
		if ($t.hasClass(cOpen)) {
			$open_btn.hide();
			$carbar.addClass(carbarOpen);			
		} else {
			$open_btn.show();
			$carbar.removeClass(carbarOpen);
		}
		return false;
	};
		
	var modelMenu = function($t) {
		var $menu = $t.parents('div.model').find('ul');
		var $menuButton = $t.parents('div.model').find('h2 a');		
		
		if ($menu.is(':visible')) {
			$menu.slideUp('fast');	// closes the menu
			$menuButton.removeClass('menu-open');
		} else {
			if ($('#carbar .model ul').is(':visible')) {
				$('#carbar .model ul').slideUp('fast'); // if any other menus are open, we close those first!
				$('#carbar .model').find('h2 a').removeClass('menu-open'); // remove the class menu-open from the button
			}
			$menu.slideDown('fast'); // opens the menu
			$menuButton.addClass('menu-open');			
			
		}
		return false;
	};
	
	var removeDerivative = function($t) {
		var url = $t.attr('href') + '?render=ajax';
		var parent = derivativeParent;
		var $parent = $t.parents(parent);
		$.getJSON(url, function(json) {
			$parent.fadeOut('fast', function() {
				$(this).remove();
			});
		});
		return false;
	};
	
	var addCar = function(t) {
		if (cookie.get('carbarState') !== 'active') {
			cookie.set('carbarState', 'active');
			$carbar.removeClass('hidden');
		}
		openCloseCarbar($open_btn);
		
		var url = t.href + '?render=ajax';
		var added = false;
		$.get(url, function(html) {
			// check which model we are adding & have a look whether we already have that model. 
			// if yes, remove previous model & add new one instead
			var newModel = $(html).find('h2 a.model-menu').text().toLowerCase();
			
			// search for current models
			$('#carbar #carbar-container #car-model .model').each(function(i){
				if ($(this).find('h2 a.model-menu').text().toLowerCase() === newModel) {
					$(html).insertBefore(this);
					$(this).remove();
					added = true;
				}
			});
			if (!added) {
				$model_container.append(html);					
			}
		});
		toggleHelpText();
		$(t).addClass(cAdded).text('added');
		
		return false;
	};
	
	var removeCar = function($t) {
		var url = $t.attr('href') + '?render=ajax';
		var parent = modelParent;
		$.getJSON(url, function(json) {
			var $parent = $t.parents(parent);
			$parent.fadeOut('fast', function() {
				$(this).remove();
				toggleHelpText();
			});
		});
		return false;
	};
	
	init();

};

// from Lonelyplanet.com
// image preloader
jQuery.fn.extend({
	backgroundLoadImage: function(src, callback) {
		var self = this;
		var image = $(new Image()).load(function () {
			self.filter('img').each(function() {
				$(this).attr('src', src);
				if (callback) callback.call(this);
			});
		}).attr('src', src);
		return this;
	},

	centerImageToBox: function(maxWidth, maxHeight) {
		return this.filter('img').each(function() {
			var image = $(this);
			// copy src to temporary image so that CSS styles don't influence sizing (eg. in webkit)
			var img = new Image();
			$(img).attr('src', image.attr('src'));
			
			var scaledHeight = img.height * (maxWidth/img.width);
			if (scaledHeight < maxHeight) {
				image.css({width: maxWidth, height: scaledHeight});
				image.css('padding-top', Math.floor(((maxHeight - scaledHeight) / 2)));
			} else {
				var scaledWidth = img.width * (maxHeight/img.height);
				image.css({width: scaledWidth, height: maxHeight});
				image.css({display: 'block', margin: 'auto'});
			}
		});
	}
});

// from Lonelyplanet.com
// background overlay
// background overlay plugin by http://www.lonelyplanet.com
// extended by Digital Delivery, BBC Worldwide
(function($) {
	
	$.fn.addOverlay = function(o, callback) {
		return this.each(function() {
			var container = $(this);
			var data = container.data('overlay');
			if (data) {
				data.overlay.remove();
			}
			
			data = $.extend({
				speed: 'fast',
		        opacity: 0.8
		    }, o || {});

			var overlay;
			var fadeOn;
			var bgDiv;
			if (jQuery.browser.msie) {
				// IE does strange things when fading on the div with the background - so put an inner div in to carry the background
				overlay = $('<iframe /><div><div /></div>');
				fadeOn = overlay.eq(1);
				bgDiv = fadeOn.children();
				bgDiv.css({width:'100%', height:'100%'});
			} else {
				overlay = $('<div />');
				fadeOn = overlay;
				bgDiv = overlay;
			}
			overlay.css({
				position: 'absolute',
				'z-index': '1000010',
				top: '0px',
				left: '0px',
				height: this.parentNode.scrollHeight,
				width: '100%',
				opacity: '0',
				filter: "alpha(opacity='0')"
			});
			bgDiv.css({background:'black', opacity:data.opacity});

			data.overlay = overlay;
			data.fadeOn = fadeOn;
			container.data('overlay', data);
			
			fadeOn.hide();
			container.append(overlay);
			fadeOn.fadeIn(data.speed, callback);
		});
	};

	$.fn.removeOverlay = function(callback) {
		return this.each(function() {
			var container = $(this);
			var data = container.data('overlay');
			if (data) {
				data.fadeOn.fadeOut('fast', function() {
					data.overlay.remove();
					container.removeData('overlay');
					if (callback)
						callback();
				});
			}
		});
	};
	
})(jQuery);



// execute as soon as the script is parsed
utils.enableJavaScript();
utils.inputHover();
var nav = new Navigation();

$(document).ready(function () {
 nav.init();
 link.init();
 help.init();
});

// carbar needs to wait until the rest of the document is finished as it is behind the ads
$(document).ready(function() {
	var carbar = new Carbar();
});
