var CompareTips = function()
{
	// variables to make this script usable for more than one page
	var checkBoxNames = ['.cardListCompare', '.compareCheckbox'];
	var buttonNameList   = {'detailedComparisonButton' : 'Detailed Comparison', 'compareButton' : 'Compare'};
	
	// Constants
	var states = ['nothingSelected', 'oneSelected', 'multiSelected', 'maxSelected'];
	var maxChecked = DETAILED_COMPARISON_MAX_DISPLAY_ITEMS;

	var updateState = function()
	{
        var _cardCookie = new Card.Cookie();
        
        _previousProducts = _cardCookie.getSub('userSelectedProduct');
        var numChecked = 0;
        if (_previousProducts != null) {
            _tmpString        = new String(_previousProducts);
            numChecked        = (_tmpString.split(',')).length;
        }

		var atLeast = numChecked < 2 ? numChecked : 2;
        atLeast     = numChecked >= 4 ? 3 : atLeast;

		jq_infoTip.removeClass(jq_infoTip.checkState);
		jq_infoTip.checkState = states[atLeast];
		jq_infoTip.addClass(jq_infoTip.checkState);
		
		if(atLeast === 2)
		{
		    jq_infoTip.find('span.numChecked').html(numChecked);
		} 
	}

	var moveToBox = function(el)
	{
		if(jq_infoTip.parent().get(0) === el)
		{
			return;
		}
		
		jq_infoTip.remove();
		jq_infoTip.appendTo(el);
	}
    
	var boxChecked = function(ev)
	{
        // set card cookie to set userSelectedProduct variable in caponecc cookie
        boxId = $(this).attr('id');
        var previousProducts;
        var products;
        
        if (this.checked) {
            _addProductToCardCookie(boxId);
        } else {
            _removeProductFromCardCookie(boxId);
        }
        updateState(this.checked ? 1 : -1);
	}
    
	var compareOver = function(ev)
	{
		updateState();
		moveToBox(this);
		jq_infoTip.addClass('onhover');//showTip		
	}
    
	var compareAway = function(ev)
	{
		jq_infoTip.removeClass('onhover');//hideTip		
	}
	
	var getButtonName = function()
	{
		var buttonNameId = $('form#compareForm button[type=submit]').children().attr('id');
		
		for(var buttonName in buttonNameList)
		{
			if(buttonName === buttonNameId)
			{
				jq_infoTip.find('span.buttonName').html(buttonNameList[buttonName]);
			}
		}
	}
	
	var init = function()	
	{
		boxString = "";
		for(x=0; x<checkBoxNames.length; x++)
		{
			boxString = boxString + checkBoxNames[x] + ", ";			
		}
		
		var boxes = $(boxString);
		
		// make sure there are check boxes on page to work on
		if(boxes.size() === 0)
		    return;
		
		jq_infoTip = $('body').append('<div id="compareInfoTip" class="none"></div>').find("#compareInfoTip").eq(0);
		
		jq_infoTip.append('<div class="compareState nothingSelected">Check the box next to each <br />product you want to compare.</div>');
		jq_infoTip.append('<div class="compareState oneSelected">You can compare up to '+maxChecked+' products. <br />(Please select at least one more to compare.)</div>');
		jq_infoTip.append('<div class="compareState multiSelected">When you\'re ready, click the <span class="buttonName"></span>&nbsp;button.<br />(<span class="numChecked">'+(maxChecked-2)+'</span> currently checked, maximum of '+maxChecked+'.)</div>');
        jq_infoTip.append('<div class="compareState maxSelected">You\'ve selected the maxium of '+maxChecked+' cards. <br />To see more cards, choose the Compare link to edit your list.</div>');   
		
		moveToBox(boxes.get(0));
		boxes.hover(compareOver, compareAway);
		boxes.find("input[@type='checkbox']").click(boxChecked);
		getButtonName();
		
		$(boxString).Tooltip({
			bodyHandler: function() {
				return( jq_infoTip );
			},
			showURL	: false,
			track	: true,
			delay	:   0
		});
	}
	init();
}

$(document).ready(function()
{   
	CompareTips();
});