jQuery(document).ready(function ()
	{
		
		var i_btn = $('.products .change-color a');
	
	/*	
		jQuery.post("common.htm",{action:"checkLoginStatus"},
						function(json){
							json = eval(json);
							if(json[0].isAuthenticated == "true")
							{
								jQuery("#isAuthenticated").attr("href","web/logout");	
								jQuery("#isAuthenticated").text("Logout");
							}
							else
							{
								jQuery("#isAuthenticated").attr("href","/login");	
								jQuery("#isAuthenticated").text("Login");
								
							}
							
						});	
		
	*/	
		
		/* 
			0 - default values 
			1 - pronto device 
			2 through 5 are the classic devices 
		*/
		json = eval(devicesForSale);
		jQuery(".ajax-pronto-device-price").text(json[0].prontoPrice);
		
		jQuery(".ajax-default-plan-price").text(json[0].defaultPlanPrice);
		jQuery(".ajax-default-plan-billing-cycle").text(json[0].defaultPlanBillingCycle)
		jQuery(".ajax-default-device-price").text(json[0].defaultDevicePrice);
		
		for (i=2; i < json.length ; i++)
		{
			var content = buildContentForChangeColorUl(json[i],json[0].defaultDeviceProductGID,null);
			jQuery("#tab2 .info-bar .colors ul.change-color").append(content);
		}
		
		var prontoDevice = buildProntoDevice(json[1]);	
		
		/* have to load pronto device buy default on load - this will not repeat when tabs will be clicked */
		jQuery("#tab1 .info-bar .colors ul.change-color").append(prontoDevice);
		changeModelHolder("/common/large/" + json[1].largeImage,json[1].name)
		setProductGid(json[1].productGID);

		initTabs('.tabset');
		
		$('.products .tabset a.pronto').click(function(){
				
				i_btn.filter('.pronto-device').each(function(){
					setProductGidAndChangeToActive(this, this.id);
				});
		});

		
		jQuery.getScript("https://secure.addthis.com/js/152/addthis_widget.js");
		
		jQuery("a.go-to-cart").click(function()
	  	{	
		
			jQuery.post("cart.htm",
								  {add: "", id:jQuery("#productGid").val(),addOnly:"true"},
								  function(){
									 top.location.href = 'cart.htm';
								  }
						);
	  	});
		
		$('.products .compare a').click(function(){
			displayPopup($('.compare-pop-up'));
			return false;
		});
		
		jQuery("#pronto-tab").click(function()
			{
				jQuery("div#model-color a").attr("class","free-shipping-star");
			}

		)

		jQuery("#classic-tab").click(function()
			{
				jQuery("div#model-color a").attr("class","free-shipping-star");
			}

		)
	}
);

	
function buildContentForChangeColorUl(device,defaultDeviceProductGID,style,deviceType)
{
	var li = document.createElement('li')
	$(li).attr("class",device.style + " classic");
	$(li).attr("id",device.productGID);
	
	var a = document.createElement('a')
	$(a).attr("href",'/common/large/' + device.largeImage);
	
	if(style != null){$(a).attr("style",style)}
	if(device.productGID == defaultDeviceProductGID){$(a).attr("class",'active')}
	$(a).attr("id","check-" + device.style);	
	$(a).attr("title",device.name);
	$(a).text("black");
	var largeImage = '/common/large/' + device.largeImage;
	$(a).click(function(){
		setProductGidAndChangeToActive("check-" + device.style,device.productGID )
		return false;
	}
);
	
	return $(li).append($(a));
}

function buildProntoDevice(device)
{
	var li = document.createElement('li')
	$(li).attr("class","black");
	$(li).attr("id",device.productGID);
	
	var a = document.createElement('a')
	$(a).attr("href",'/common/large/' + device.largeImage);
	$(a).attr("class",'pronto-device active');
	$(a).attr("id","check-pronto-" + device.style);	
	$(a).attr("title",device.name);
	$(a).click(function(){
		setProductGidAndChangeToActive("check-pronto-" + device.style,device.productGID);
		return false;
	});
	$(a).text("black");
	var largeImage = '/common/large/' + device.largeImage;
	return $(li).append($(a));
}



function setProductGidAndChangeToActive(elementId,productGid){
	var _el = document.getElementById(elementId)
	var i_hold = $('.products #model-color').hide();
	var i_img = i_hold.find('.model-hold').empty();
	var i_capt = i_hold.find('.title').empty();
	var i_btn = $('.products .change-color a');
	var t_el;
	
	
	setProductGid(productGid);

	if(_el != t_el)
	{
		changeModelHolder(_el.href,_el.title);
		if(! $(_el).hasClass("active"))
		{
			$("#" + _el.id).parents('.change-color').eq('0').find('a').removeClass('active');
			$("#" + _el.id).addClass("active");
		}
		t_el = _el;
	}
	return false;
	
}

function setProductGid(productGid)
{
	if (productGid)
	{
		jQuery("#productGid").each(function()
		{
			this.value =  productGid;
		});
	}
}

function changeModelHolder(src,title)
{	
	var i_hold = $('.products #model-color').hide();
	var i_capt = i_hold.find('.title').empty();
	i_img =  i_hold.find('.model-hold').empty();
	i_hold.show();
	var t_img = $('<img src="'+src+'" alt="'+title+'"/>');
	if($.browser.opera){ i_img.html(t_img);}
	t_img.load(function(){
		i_img.html(t_img);
		$(this).attr('width', $(this).width());
		$(this).attr('height', $(this).height());
		i_capt.text(title);
		initIEpng();
	});
	
}

function initIEpng(){
	
	if ($.browser.msie && $.browser.version < 7) {
		var transparentImage = "/landing/img/transparent.gif";
		$('img[src$=".png"]').each(function(){
			var src = this.src;
			this.src = transparentImage;
			this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod='scale')";
		});
	}
}

function initTabs(h_list) {
	
	$(h_list).each(function(_ind, _el) {
		var btn_h = $(_el);
		var _btn = $(_el).find('a.tab');
		var _a = 0;
		_btn.each(function(_ind, _el) {
			var _box = $('#'+_el.href.substr(_el.href.indexOf("#") + 1));
			if($(_el).hasClass('active')) {
				_box.show();
				_a = _ind;
			}
			else {
				_box.hide();
			}
			_el.onclick = function() {
				if(!$(this).hasClass('active')){
					$('#'+ _btn.get(_a).href.substr(_btn.get(_a).href.indexOf("#") + 1)).hide();
					_btn.eq(_a).removeClass('active');
					$('#'+ this.href.substr(this.href.indexOf("#") + 1)).show();
					$(this).addClass('active');
					
					_a = _ind;
					tab_index = _btn.get(_a).href.substr(_btn.get(_a).href.indexOf("#"));
					$(tab_index + " .info-bar .colors ul.change-color li").children("a.active").each(function(){
							changeModelHolder(this.href,this.title);
							setProductGid($(this).parent().get(0).id);
						}
					);
					
				}
				return false;
			}
		});
	});
}
