function $(id)
{
	return document.getElementById(id);
}

function trim(str)
{
	return str.replace(/^\s+/, '').replace(/\s+$/, '');
}

function addClass(obj, class_name)
{
	if(!hasClass(obj, class_name))
	{
		obj.className = trim(obj.className + ' ' + class_name);
	}
}

function removeClass(obj, class_name)
{
	if(hasClass(obj, class_name))
	{
		var r = new RegExp('(^| )' + class_name + '($| )');
		obj.className = trim(obj.className.replace(r, ' '));
	}
}

function hasClass(obj, class_name)
{
	var hasClass;
	if(typeof obj.className != 'undefined')
	{
		var r = new RegExp('(^| )' + class_name + '($| )');
		hasClass = r.test(obj.className);
	}
	else
	{
		hasClass = false;
	}
	
	return hasClass;
}

function heroBannerMousemove(e)
{
	var btn = $('heroBannerInnerBtn');
	var btn_x = get_position_x(btn);
	var btn_y = get_position_y(btn);
	var mouse_x = get_mouse_x(e);
	var mouse_y = get_mouse_y(e);
	
	if(mouse_x >= btn_x && mouse_x < btn_x + btn.clientWidth
	&& mouse_y >= btn_y && mouse_y < btn_y + btn.clientHeight)
	{
		addClass($('heroBannerInnerBtn'), 'hover');
	}
	else
	{
		removeClass($('heroBannerInnerBtn'), 'hover');
	}
}

function heroBannerMouseout()
{
	removeClass($('heroBannerInnerBtn'), 'hover');
}

function get_mouse_x(e)
{
	return (e.pageX ? e.pageX : e.clientX);
}

function get_mouse_y(e)
{
	return (e.pageY ? e.pageY : e.clientY);
}

function get_viewport_height()
{
	return window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
}

function get_viewport_width()
{
	return window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
}

function get_scroll_offset()
{
	return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
}

function get_position_y( input_element )
{
	position = 0;
	
	while (input_element != null)
	{
		position += input_element.offsetTop;
		input_element = input_element.offsetParent;
	}
	
	return position;
}

function get_position_x( input_element )
{
	position = 0;
	
	while (input_element != null)
	{
		position += input_element.offsetLeft;
		input_element = input_element.offsetParent;
	}
	
	return position;
}

// Top navigation button background hover colors
var MAIN_BAR_HOVER_COLOR = '#0e68db';
var MYACCOUNT_BAR_HOVER_COLOR = '#d6e6fa';

// Will be set to true when mouse is within submenu, otherwise will be false;
// used to determine how to react to a certain mouseout event
var mouseWithinSubmenu = false;

// navBar is hard-coded. Current possibilities: 'main', 'myaccount'
function subOn(navBtn, subNavMenu, navBar) {
	if(navBar == 'main')
		navBtn.style.backgroundColor = MAIN_BAR_HOVER_COLOR;
	else if(navBar == 'myaccount')
		navBtn.style.backgroundColor = MYACCOUNT_BAR_HOVER_COLOR;

	subNavMenu.style.display = 'block';
}

function subOff(navBtn, subNavMenu) {
	if(!mouseWithinSubmenu)
	{
		navBtn.style.backgroundColor = 'transparent';
		subNavMenu.style.display = 'none';
	}
}

function setMouseWithinSubmenu(boolValue) {
	mouseWithinSubmenu = boolValue;
}

// Holds current timeout IDs when mousing over menus (1 for each menu)
var menu_timeouts = [null,null,null,null,null,null,null,null,null];

// IE6?
var IE6 = (navigator.userAgent.indexOf('MSIE 6') >= 0);

// Tab stuff
function tab_mouseover(tab_id)
{
	// Not selected tab
	if(tab_id != selected_tab)
	{
		var tab = $('info_tab' + tab_id);
		
		if(tab)
		{
			addClass(tab, 'info_tab_header_hover');
			removeClass(tab, 'info_tab_header_off');
		}
	}
};

function tab_mouseout(tab_id)
{
	// Not selected tab
	if(tab_id != selected_tab)
	{
		var tab = $('info_tab' + tab_id);
		
		if(tab)
		{
			addClass(tab, 'info_tab_header_off');
			removeClass(tab, 'info_tab_header_hover');
		}
	}
};

function tab_select(tab_id)
{
	// Get old and new selected tabs/content
	var old_tab = $('info_tab' + selected_tab);
	var new_tab = $('info_tab' + tab_id);
	var old_tab_content = $('tab_content' + selected_tab);
	var new_tab_content = $('tab_content' + tab_id);
	
	// Elems available
	if(old_tab && new_tab && old_tab_content && new_tab_content)
	{
		// Unselect old tab
		addClass(old_tab, 'info_tab_header_off');
		removeClass(old_tab, 'info_tab_header_on');
		removeClass(old_tab_content, 'show');

		// Select tab
		addClass(new_tab, 'info_tab_header_on');
		removeClass(new_tab, 'info_tab_header_off');
		removeClass(new_tab, 'info_tab_header_hover');
		addClass(new_tab_content, 'show');
		
		// Set new selected tab
		selected_tab = tab_id;
	}
};

function get_thumb_info()
{
	return {
		count: Number(get_thumb_elem('thumb_count').innerHTML),
		start: Number(get_thumb_elem('thumb_start').innerHTML) - 1,
		end: Number(get_thumb_elem('thumb_end').innerHTML) - 1,
		per_page: Number(get_thumb_elem('thumb_per_page').innerHTML)
	};
};

// elem_name one of 'start', 'end', 'count'
function get_thumb_elem(elem_name)
{
	return $(elem_name);
};

function update_thumb_display(new_start, new_end, thumb_count)
{
	// Set new thumb start/end
	get_thumb_elem('thumb_start').innerHTML = String(new_start + 1);
	get_thumb_elem('thumb_end').innerHTML = String(new_end + 1);
	
	// For each thumb
	for(var i=0; i<thumb_count; ++i)
	{
		// Thumb is in page
		if(i >= new_start && i <= new_end)
		{
			// Show thumb
			removeClass(get_thumb_elem('thumb' + i), 'hidden');
		}
		// Thumb is outside page
		else
		{
			// Hide thumb
			addClass(get_thumb_elem('thumb' + i), 'hidden');
		}
	}
};

function thumb_page_left()
{
	// Get thumb info
	var thumb_info = get_thumb_info();
	var new_start;
	var new_end;

	// Current page starts at beginning of thumb count
	if(thumb_info.start == 0)
	{
		// Reset new start/end to end
		new_end = thumb_info.count - 1;
		new_start = new_end - (thumb_info.per_page - 1);
	}
	// Current page does not begin at beginning of thumb count
	else
	{
		// Calculate new thumb start/end
		new_start = thumb_info.start - thumb_info.per_page;
		new_end = new_start + (thumb_info.per_page - 1);
	
		// New page beginning is beyond thumb beginning
		if(new_start < 0)
		{
			// Adjust new start/end such that the beginning will be at thumb beginning
			new_start = 0;
			new_end = thumb_info.per_page - 1;
		}
	}
	
	// Update thumb display
	update_thumb_display(new_start, new_end, thumb_info.count);
	
	// Cancel click
	return false;
};

function thumb_page_right()
{
	// Get thumb info
	var thumb_info = get_thumb_info();
	var new_start;
	var new_end;
	
	// Current page ends at thumb count
	if(thumb_info.end == thumb_info.count - 1)
	{
		// Reset new start/end to beginning
		new_start = 0;
		new_end = thumb_info.per_page - 1;
	}
	// Current page does not end at thumb count
	else
	{
		// Calculate new thumb start/end
		new_start = thumb_info.start + thumb_info.per_page;
		new_end = new_start + (thumb_info.per_page - 1);
	
		// New thumb end is beyond the count
		if(new_end >= thumb_info.count)
		{
			// Adjust new start/end such that the end will be at the count
			new_end = thumb_info.count - 1;
			new_start = new_end - (thumb_info.per_page - 1);
		}
	}
	
	// Update thumb display
	update_thumb_display(new_start, new_end, thumb_info.count);
	
	// Cancel click
	return false;
};

function shift_onmouseover(main_picture_url, selected_picture_id)
{
	// Update big image
	$('item_image_img').src = main_picture_url;
	
	// Update big image link
	var href = $('bigImageLink').getAttribute('href');
	href = href.replace(/picture_id=[^&]*/, 'picture_id=' + selected_picture_id);
	$('bigImageLink').setAttribute('href', href);
};

function get_feature(feature_id)
{
	var feature = false;

	for(i=0; i<product_feature_definitions.length; ++i)
	{
		if(product_feature_definitions[i][0] == feature_id)
		{
			feature = {
				id: product_feature_definitions[i][0],
				name: product_feature_definitions[i][1],
				desc: product_feature_definitions[i][2]
			};
			
			break;
		}
	}
	
	return feature;
};

var tooltip_added_class;

function hide_tooltip()
{
	var tooltip = $('tooltip');
	tooltip.style.visibility = 'hidden';
	
	if(tooltip_added_class)
	{
		removeClass(tooltip, tooltip_added_class);
	}
};


// options is an object {
//	 feature_id: associated feature ID
//	 stock_id: associated stock ID
//	 anchor: "left top" anchor like 'right top' (default if no anchor/position are given),
//			   'center bottom', etc.
//			   anchor tooltip to specified corner/edge of caller
//	 class: classname to add to tooltip
//	 position: {x:?, y:?} position relative to given anchor, or if no anchor,
//			   position relative to top left corner of caller; if no anchor/position are given,
//			   anchor 'right top' and position {x:10, y:0} are used
//	 content: inner HTML of tooltip
//	 width: width of tooltip box (default inherit)
// }
function show_tooltip(caller, options)
{
	var anchor_given = (typeof options.anchor != 'undefined');
	var position_given = (typeof options.position != 'undefined');
	var position_without_anchor = false;

	// No anchor/position given
	if(!anchor_given && !position_given)
	{
		options.anchor = 'right top';
		options.position = {x:10, y:0};
	}
	// No anchor given
	else if(!anchor_given)
	{
		options.anchor = null;
		position_without_anchor = true;
	}
	// No position given
	else if(!position_given)
	{
		options.position = {x:0, y:0};
	}
	
	// No width given
	if(typeof options.width == 'undefined')
	{
		options.width = null;
	}
	
	// Feature tooltip
	if(typeof options.feature_id != 'undefined')
	{
		var feature = get_feature(options.feature_id);
		options.content = '<div class="name">' + feature.name + '</div>' + feature.desc;
	}
	
	// Set properties
	var tooltip = $('tooltip');
	tooltip.innerHTML = options.content;
	tooltip.style.width = options.width;
	
	// Extra class provided?
	if(typeof options['class'] != 'undefined')
	{
		tooltip_added_class = options['class'];
		addClass(tooltip, options['class']);
	}
	// No extra class
	else
	{
		tooltip_added_class = null;
	}
	
	// Get base positions
	var base_x = get_position_x(caller);
	var base_y = get_position_y(caller);
	var page_bottom = get_scroll_offset() + get_viewport_height();
	
	// Position without anchor
	if(position_without_anchor)
	{
		// Set position (x, y) from top left of caller
		tooltip.style.left = (base_x + options.position.x) + 'px';
		tooltip.style.top = (base_y + options.position.y) + 'px';
	}
	// Anchor given
	else
	{
		// Parse anchor
		var anchor = options.anchor.split(' ');

		// Set tooltip position
		if(anchor[0] == 'left')		{ tooltip.style.left = (base_x - tooltip.offsetWidth + options.position.x) + 'px'; }
		if(anchor[0] == 'center')	{ tooltip.style.left = (base_x + (caller.offsetWidth / 2) + options.position.x) + 'px'; }
		if(anchor[0] == 'right')	{ tooltip.style.left = (base_x + caller.offsetWidth + options.position.x) + 'px'; }
		if(anchor[1] == 'top')		{ tooltip.style.top = (base_y + options.position.y) + 'px'; }
		if(anchor[1] == 'center')	{ tooltip.style.top = (base_y + (caller.offsetHeight / 2) + options.position.y) + 'px'; }
		if(anchor[1] == 'bottom')	{ tooltip.style.top = (base_y + caller.offsetHeight + options.position.y) + 'px'; }
	}

	// Tip extends off page
	if(get_position_y(tooltip) + tooltip.offsetHeight > page_bottom)
	{
		tooltip.style.top = (page_bottom - tooltip.offsetHeight - 5) + 'px';
	}
	
	// Show
	tooltip.style.visibility = 'visible';
};

function toggle_tooltip(caller, options)
{
	if($('tooltip').style.visibility != 'visible')
	{
		show_tooltip(caller, options);
	}
	else
	{
		hide_tooltip();
	}
};

function newsletterQuickSignupFocus(emailInput)
{
	if(emailInput.value == 'E-mail address')
	{
		emailInput.value = '';
	}
	addClass(emailInput, 'hasInput');
}

function newsletterQuickSignupBlur(emailInput)
{
	if(trim(emailInput.value) == '')
	{
		emailInput.value = 'E-mail address';
		removeClass(emailInput, 'hasInput');
	}
}
