// JavaScript Document

var productsListWidth = 0;
var categoryMargin = 5;

function getTotalWidth(className, margin) {
    totalWidth = 0;
    $("." + className).each(function() {
        totalWidth += $(this).outerWidth(margin);
    });
    return totalWidth;
}

function setScrollbar() {
	holderWidth=$("#products").width();
	windowWidth=$("#products_navigation").width()
    overSize =holderWidth  - windowWidth;
	
	
	currentItemPos=$(".selected").position().left;
	

	offset=currentItemPos-windowWidth;
	if(offset > 0){
		value=offset+70;
	 $("#products").css('left', '-'+value+'px');
	}	

    if (overSize > 10) {
        $("#scrollbar").slider({
            value: (currentItemPos-windowWidth > 0)? currentItemPos-windowWidth : 0,
            min: 0,
            max: overSize,
            slide: function(event, ui) {
                $("#products").css('left', '-'+ui.value+'px');
            }
        });



    } else {
        $("#scrollbar_wrapper").hide();
    }
}

function enableToolTips() {
    $('.product_item').hover(
		function() {
		    if ($(this).hasClass('selected') == false) {
		        // Set content first to get proper width
		        var tooltipText = $(this).find('.tooltip_text').html();

		        $('#tooltip > .content').html(tooltipText);

		        // Do the rest
		        var elemPos = $(this).offset();
		        var tooltipWidth = $('#tooltip').width();
		        var elemWidth = $(this).width();
		        var movePos = {};

		        movePos.left = elemPos.left - (tooltipWidth / 2) + (elemWidth / 2);
		        movePos.top = elemPos.top - 35;

		        $('#tooltip > .content').html(tooltipText);
		        $('#tooltip').css({ left: movePos.left, top: movePos.top, visibility: 'visible' });
		    }
		},
	    function() {
	        if ($(this).hasClass('selected') == false) {
	            $('#tooltip').css({ visibility: 'hidden' });
	        }
	    }
    );

}

function setProductsHolderWidth(){
	$("#products").width(getTotalWidth("product_item", categoryMargin)+10); //set product holder's with. make all categories in one line.
}



$(document).ready(function() {
	setProductsHolderWidth()
    setScrollbar(); // set the scroll bar
    enableToolTips();

});