/*
*Iconos de Windows/Linux*
 */


jQuery.preloadImages = function()
{
	for(var i = 0; i<arguments.length; i++)
	jQuery("<img>").attr("src", arguments[i]);
}
jQuery.preloadImages("windows.png", "linux.png");

jQuery(document).ready(function(){
	
	// This adds "zebra stripes" to your tables
	$('tbody tr:even').addClass('tablasy');
	$('tbody tr:odd').addClass('odd');
	
	$("#iconbar li a").hover(
		function(){
			var iconName = $(this).children("img").attr("src");
			var origen = iconName.split(".png")[0];
			$(this).css("cursor", "pointer");
			$(this).animate({ width: "110px" }, {queue:false, duration:"normal"} );
			$(this).children("span").animate({opacity: "show"}, "fast");
		}, 
		function(){
			var iconName = $(this).children("img").attr("src");
			var origen = iconName.split("o.")[0];		
			$(this).animate({ width: "24px" }, {queue:false, duration:"normal"} );
			$(this).children("span").animate({opacity: "hide"}, "fast");
		});
});


/*
*Sub-menu de Servicio*
 */


		$(function(){
		
			$("#opcionales-button").css({
				opacity: 0.6
			});
			$("#descripcion-button").css({
				opacity: 0.6
			});
			$("#specs-button").css({
				opacity: 0.6
			});
			$("#plandorado-button").css({
				opacity: 0.6
			});
		
			$("#planes_sec ul.planes li").click(function(){
				
				$clicked = $(this);
				
				// if the button is not already "transformed" AND is not animated
				if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
					
					$clicked.animate({
						opacity: 1,
						borderWidth: 5
					}, 600 );
					
					// each button div MUST have a "xx-button" and the target div must have an id "xx" 
					var idToLoad = $clicked.attr("id").split('-');
					
					//we search trough the content for the visible div and we fade it out
					$("#planes_sec").find("div:visible:first").fadeOut("fast", function(){
						//once the fade out is completed, we start to fade in the right div
						$(this).parent().find("#"+idToLoad[0]).fadeIn();
					})
				}
				
				//we reset the other buttons to default style
				$clicked.siblings("ul.planes li").animate({
					opacity: 0.5,
					borderWidth: 1
				}, 600 );
				
			});
		});
		

/*
*Menu de Descripción de Planes*
 */



$(document).ready(function()
{
	slide("#sliding-navigation", 25, 15, 150, .8);
});

function slide(navigation_id, pad_out, pad_in, time, multiplier)
{
	// creates the target paths
	var list_elements = navigation_id + " li.sliding-element";
	var link_elements = list_elements + " a";
	
	// initiates the timer used for the sliding animation
	var timer = 0;
	
	// creates the slide animation for all list elements 
	$(list_elements).each(function(i)
	{
		// margin left = - ([width of element] + [total vertical padding of element])
		$(this).css("margin-left","-180px");
		// updates timer
		timer = (timer*multiplier + time);
		$(this).animate({ marginLeft: "0" }, timer);
		$(this).animate({ marginLeft: "15px" }, timer);
		$(this).animate({ marginLeft: "0" }, timer);
	});

	// creates the hover-slide effect for all link elements 		
	$(link_elements).each(function(i)
	{
		$(this).hover(
		function()
		{
			$(this).animate({ paddingLeft: pad_out }, 150);
		},		
		function()
		{
			$(this).animate({ paddingLeft: pad_in }, 150);
		});
	});
}