// JavaScript Document
var scrollTimer = null;
window.onscroll = resetScrollTimer;

function getScrollXY() {
    var scrOfX = 0, scrOfY = 0;
    if( typeof( window.pageYOffset ) == 'number' ) {
        //Netscape compliant
        scrOfY = window.pageYOffset;
        scrOfX = window.pageXOffset;
    } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
        //DOM compliant
        scrOfY = document.body.scrollTop;
        scrOfX = document.body.scrollLeft;
    } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
        //IE6 standards compliant mode
        scrOfY = document.documentElement.scrollTop;
        scrOfX = document.documentElement.scrollLeft;
    }
    return {left:Number(scrOfX), top:Number(scrOfY)};
}

function browserInnerWidth() {
	return window.innerWidth != null ? window.innerWidth: document.documentElement && document.documentElement.clientWidth ? 
		document.documentElement.clientWidth:document.body != null? document.body.clientWidth:null;
}
function browserInnerHeight() {
	return window.innerHeight != null ? window.innerHeight: document.documentElement && document.documentElement.clientHeight ? 
		document.documentElement.clientHeight:document.body != null? document.body.clientHeight:null;
}

function resetScrollTimer()
{
	clearTimeout( scrollTimer );
	scrollTimer = setTimeout( "redrawSelectedOptionsTablet()", 500 );
}

function redrawSelectedOptionsTablet()
{
	var container = selectedOptions.Options.optionsContainer;
	var optionsContainerTop = 58;
	var scollThreshold = 100;
			
	if(container !== "undefined")
	{
		//stop any current animations
		jQuery(container).stop();
		//get the scrollbars offsets
		scrollbarOffsets = getScrollXY();
		
		if (scrollbarOffsets.top > scollThreshold)
		{	//if the scrollbar top > than the threshold for movement, animate it to scroll the amount that has been scrolled(-threshold)
			jQuery(container).animate({ top: ( scrollbarOffsets.top-scollThreshold ) }, function(){
						tweakSelectedOptionsTablet(container) 
			});
		}
		else
		{
			//it is less than threshold
			if ( parseInt(jQuery(container).css("top")) > 0)
			{	//if the floating obj top is greater than 0, move it back to top:0px
				jQuery(container).animate( { top: 0 }, function(){
						//budge it up a bit more (jQuery bug not accepting minus figures for animation?)
						jQuery(container).css("top",(-optionsContainerTop)+"px")
						
						tweakSelectedOptionsTablet(container);		
				});
				
			}
			else
			{
				tweakSelectedOptionsTablet(container);		
			}
		}
		
	}
	clearTimeout( scrollTimer );
}
function tweakSelectedOptionsTablet(container)
{
	//get the floating object height
	var containerHeight = parseInt(jQuery(container).height());
	
	var bodyHeight = parseInt(jQuery('body').height());
	
	var visibleContainerOffsetTop = jQuery(container).offset().top - getScrollXY().top;
	var availableHeight = browserInnerHeight() - visibleContainerOffsetTop - 45; //-45 for the green band at bottom

	if ( containerHeight > availableHeight )
	{
		jQuery(container).animate( { top: -(containerHeight-availableHeight) })
	}
	
}
function getOptions(frmObject)
{
	_optionsAdded = "";
	for (var i = 0; i < selectedOptions.Options.optionsAdded.length; i++)
	{
		_optionsAdded += selectedOptions.Options.optionsAdded[i][0] + ",";
	}
	frmObject.modeloptions.value = _optionsAdded.substring(0, _optionsAdded.length-1);
	
	return true;
}
function showOption( linkObj )
{
	_currentOptionOpen = $( linkObj ).find("img:first").attr("id");
	$('.optionItem').find("img:first").each( function(){
		width = parseInt( $(this).css("width") );
		if ( width == 200 )
		{
			$(this).animate({ width:"100" });
		}
		else
		{
			if ( $(this).attr("id") == _currentOptionOpen )
			{
				$(this).animate({ width:"200" });
			}
		}
	})
}
function closeOption()
{
	if (typeof(_currentOptionOpen) !== "undefined")
	{
		$(_currentOptionOpen).find("img:first").animate({ width:"80" });
	}
}
function revertThumb( divObj )
{
	$(divObj).find("img:first").animate({ width:"80" });
}
function addOption(addButton, moID)
{
	$(selectedOptions.Options.optionsContainer).fadeIn(500);
	if ($(addButton).attr("rel") == "add")
	{
		price = $(addButton).parent().siblings().filter(".productOptionPrice").html()
		price = price.replace(",","");
		selectedOptions.add({ 
								id 		: moID,
								text	: $(addButton).parent().siblings().filter(".productOptionName").html(),
								code	: $(addButton).parent().siblings().filter(".productOptionCode").html(),
								price	: price.substr(8, price.length)
		});
		$(addButton).attr("rel","remove");
		tweakSelectedOptionsTablet(selectedOptions.Options.optionsContainer)
		//$('html').animate({scrollTop: 0}, 500);
	}
	else 
	{
		selectedOptions.remove({
									id	:	moID			   
		})
		$(addButton).attr("rel","add")
	}
}

var selectedOptions = ({
	Options	:	{
					optionsContainer: "",
					optionsAdded	: new Array(),
					optionsTotal	: new Number(),
					baseName		: "",
					baseCode		: "",
					basePrice		: new Number()					
				},
	add		:	function( Options )
				{
					selectedOptions.Options.optionsAdded.push(
						new Array(
							Options.id,
							Options.text,
							Options.code,
							Options.price
						)
					);
					selectedOptions.update();
				},
	remove	:	function( Options )
				{
					selectedOptions.Options.optionsAdded.remove( Options.id );
				},
	showAll :	function()
				{
					$(selectedOptions.Options.optionsContainer).find("#optionsAdded").stop().animate({ height:"100%" }, function(){
						$(selectedOptions.Options.optionsContainer).find("#optionsAdded").css("height", $(selectedOptions.Options.optionsContainer).find("#optionsAdded").height());
					})			
				},
	hideOver:	function()
				{
					$(selectedOptions.Options.optionsContainer).find("#optionsAdded").stop().animate({ height:"85" })	
				},
	update	:	function()
				{
					selectedOptions.Options.optionsTotal = 0.00;
					htmlStr =  "<table width='100%' cellpadding='1' cellspacing='0' border='0'>";
					htmlStr += "<tr style='font-weight:bold' class='selectedOptionsRows'>" + 
									"<td width='5' valign='top'>1.</td>" +
									"<td width='auto'>" + selectedOptions.Options.baseName + "</td>" + 
									//"<td class='optionsPopupOptionCode' width='120'>" + selectedOptions.Options.baseCode + "</td>" + 
									"<td align='right'>£" + selectedOptions.Options.basePrice.toFixed(2) + "</td>" +
									"<td align='right'></td>" +
									"</tr>"
					for (var i = 0; i < selectedOptions.Options.optionsAdded.length; i++)
					{
						htmlStr += "<tr class='selectedOptionsRows'>" + 
									"<td width='5' valign='top' style='font-weight:bold'>" + (i+2) + ".</td>" +
									"<td width='auto'>" + selectedOptions.Options.optionsAdded[i][1] + "<br /><span class='selectedOptionsRowsProductCode'>(" + selectedOptions.Options.optionsAdded[i][2] + ")</span></td>" + 
									//"<td class='optionsPopupOptionCode' width='120'>" + selectedOptions.Options.optionsAdded[i][2] + "</td>" + 
									"<td align='right'>£" + Number(selectedOptions.Options.optionsAdded[i][3]).toFixed(2) + "</td>" +
									"<td align='right'><a href='javascript:void(0)' onclick='selectedOptions.remove({ id:"+selectedOptions.Options.optionsAdded[i][0]+" });'><img src='/images/delete.gif' border='0' alt='Remove Option' title='Remove Option'></a></td>" +
									//"<td align='right'><a href='javascript:void(0)' onclick='selectedOptions.remove({ id:"+selectedOptions.Options.optionsAdded[i][0]+" });' style='color:#f00; font-weight:bold; padding:0 3px'>x</a></td>" +
									"</tr>"
						selectedOptions.Options.optionsTotal = 
							(selectedOptions.Options.optionsTotal + Math.round(selectedOptions.Options.optionsAdded[i][3]*100)/100)
					}
					
					subtotal = selectedOptions.Options.optionsTotal + selectedOptions.Options.basePrice;
					totalcost = Math.round((subtotal*1.175)*100)/100
					
					$(selectedOptions.Options.optionsContainer).find("#optionsAdded").html( htmlStr );
					
					htmlStr = "<br /><table width='100%' cellpadding='1' cellspacing='0' border='0'>" +
								"<tr><td align='right' class='subtotal' style='color:#313886'><b>Sub-total:</b> £" + subtotal.toFixed(2) + "</td></tr>" + 
								"<tr><td align='right' class='vat'>VAT: 17.5%: £" + (totalcost-subtotal).toFixed(2) + "</td></tr>" +
								"<tr><td align='right' class='totalcost' style='color:#F00; font-weight:bold; font-size:110%'>Total: £" + totalcost.toFixed(2) + "</td></tr></table>";
					
					$(selectedOptions.Options.optionsContainer).find("#optionsCost").html( htmlStr );
					if (selectedOptions.Options.optionsAdded.length > 3)
					{
						$(selectedOptions.Options.optionsContainer).find("#optionsExpand").show()
					}
					else
					{
						$(selectedOptions.Options.optionsContainer).find("#optionsExpand").hide()
					}
				}
})

Array.prototype.remove = function( itemID )
{
	for (var i = 0; i < this.length; i++)
	{
		if ( this[i][0] == itemID )
			this.splice(i,1);
	}
	selectedOptions.update();
}