/* - slider.js - */
/*
	jQuery Coda-Slider v1.1 - http://www.ndoherty.com/coda-slider

	Copyright (c) 2007 Niall Doherty

	Inspired by the clever folks at http://www.panic.com/coda
	Many thanks to Gian Carlo Mingati. Coda-Slider is a heavily modified version of his slideViewer, which can be found at  http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html

	Requirements:
	-  jQuery 1.2 ... available via  http://www.jquery.com
	-  jQuery easing plugin (1.2) ... available via  http://gsgd.co.uk/sandbox/jquery/easing/
	- jQuery easing compatability plugin ... available via  http://gsgd.co.uk/sandbox/jquery/easing/
	- CSS included in index.html
*/

jQuery(function(){
	jQuery("div.csw").prepend("<p class='loading'>Cargando...<br /><img src='ajax-loader.gif' alt='cargando...'/ ></p>");
});
var j = 0;
jQuery.fn.codaSlider = function(settings) {
	 settings = jQuery.extend({
     transition: "expoinout",
     easeTime: 750,
     autoPlay: false,
     autoPlayTime: 6000,
     dynamicTabs: false,
     exoTabs: true,
     dynamicArrows: true,
     overDescription: false,
     panelTitleSelector: "h3",
     arrowsPosition: "sides",
     metaInFooter: true,
     leftArrow: "",
     rightArrow: "",
     locationHash: true
  }, settings);
	return this.each(function(){
		var container = jQuery(this);
		// Remove the preloader gif...
		container.find("p.loading").remove();
		// Self-explanatory...
		container.removeClass("csw").addClass("stripViewer");
		// Display the panelContainer...
                var panelContainer = jQuery(this).find(".panelContainer");
		panelContainer.css({ display: "block" });
		// Get the width of a panel, set from CSS...
		var panelWidth = container.find("div.panel").width();
		// panelCount gives us a count of the panels in the container...
		var panelCount = container.find("div.panel").size();
                var stripViewerWidth;
                var navinfo;

		if(settings.transition == "fade") {
                    stripViewerWidth = panelWidth;
                    var panel_height = panelContainer.find("img").css("height");
                    panelContainer.css("height", panel_height);
                    panelContainer.find(".panel").each(function() {
                            jQuery(this).css({ display: "none", zIndex: "20", position: "absolute", top: 0, left: 0 });
                        });
                }
                else {
		// Calculate the width of all the panels when lined up end-to-end...
                    stripViewerWidth = panelWidth*panelCount;
                    panelContainer.find(".panel").css({ float: "left" });
                }

                // Descriptions overlapped to their images
                if(settings.overDescription) {
                    panelContainer.find(".panel").each(function() {
                            var title = jQuery(this).find(settings.panelTitleSelector);
                            var subtitle = jQuery(this).find("p");
                            var href = jQuery(this).find("a").attr("href");
                            if(href!=null) {
                                 title.html("<a href='" + href + "'>"+title.html()+"</a>");
                                 subtitle.html("<a href='" + href + "'>"+subtitle.html()+"</a>");
                            }
                            var href = jQuery(this).find("a").attr("href");
                            var teaser = title.add(subtitle);
                            if(jQuery.browser.msie) teaser.wrapAll('<div class="ie slider-teaser" />');
                            else teaser.wrapAll('<div class="slider-teaser" />');
                            var description_wrapper = teaser.parent();
                            description_wrapper.css({position: "absolute", left: 0, bottom: 0, height: "auto"});
                            if(settings.arrowsPosition == "bottom-right") description_wrapper.css("paddingBottom","28px");
                            //                            var total_height = parseInt(description_wrapper.height(), 10) + parseInt(description_wrapper.css("padding-top"), 10) + parseInt(description_wrapper.css("padding-bottom"), 10);
                            //                            var margin_top = -(total_height);
                            //                            description_wrapper.css({marginTop: margin_top});
                        });
                }

		// Use the above width to specify the CSS width for the panelContainer element...
		panelContainer.css("width" , stripViewerWidth);
		// Set the navWidth as a multiple of panelCount to account for margin-right on each li
		//var navWidth = panelCount*2;

		// Specify the current panel.
		// If the loaded URL has a hash (cross-linking), we're going to use that hash to give the slider a specific starting position...
		if (location.hash && parseInt(location.hash.slice(1)) <= panelCount) {
			var cPanel = parseInt(location.hash.slice(1));
		// Otherwise, we'll just set the current panel to 1...
		} else {
			var cPanel = 1;
		};
                var init = true;
                goTo(cPanel);

                var auto_play;
                var go_on = true;
                if(settings.autoPlay) {
                    function Play() {
                        auto_play = setInterval(function() {
                                goTo(cPanel + 1);
                            }, settings.autoPlayTime);
                    }
                    Play();
                    jQuery(this).find(".panel").each(function() {
                            jQuery(this).mouseover(function() {
                                    clearInterval(auto_play);
                                });
                            jQuery(this).mouseout(function() {
                                    if(go_on) Play();
                                });
                        });
                }
                
                function goTo(n) {
                    if(n > panelCount) goTo(1);
                    else {
                        if((n != cPanel) || init) {
                            if(settings.transition == "fade") panelContainer.find(".panel").each(function(z) {
                                    if(z == n-1) {
                                        jQuery(this).css("zIndex", 30);
                                        jQuery(this).fadeIn(settings.easeTime, function() {
                                                if(cPanel != 1) jQuery(this).css("marginLeft", 0);
                                        });
                                    }
                                    else if(z == cPanel-1) {
                                        jQuery(this).css("zIndex", 20);
                                        jQuery(this).fadeOut(settings.easeTime);
                                    }
                                });
                            else panelContainer.animate({ left: -panelWidth*(n-1)}, settings.easeTime, settings.transition);
                            cPanel = n;
                            if(settings.locationHash) {
                                // Change the URL hash (cross-linking)...
                                location.hash = cPanel;
                            }
                            if(navinfo!=undefined) navinfo.html(cPanel + " de " + panelCount);
                        }
                    }
                }
                
		// Create appropriate nav
		container.each(function(i) {

                        if(settings.dynamicArrows) {
                            // Create the Left and Right arrows
                            if(settings.leftArrow) var leftArrow = settings.leftArrow;
                            else var leftArrow = "";
                            if(settings.rightArrow) var rightArrow = settings.rightArrow;
                            else var rightArrow = "";
                            leftArrow = "<div class='stripNav stripNavL stripNav" + j + "' id='stripNavL" + j + "'><a href='#'>" + leftArrow +" </a><\/div>";
                            rightArrow = "<div class='stripNav stripNavR stripNav" + j + "' id='stripNavR" + j + "'><a href='#'>" + rightArrow + "</a><\/div>";
                            var stripNav = "<div id='stripNav" + j + "' class='bottom-right stripNav-wrapper'></div>";
                            if(panelCount > 1) stripNav = "<div id='stripNav" + j + "' class='bottom-right stripNav-wrapper'>" + leftArrow + rightArrow + "</div><span id='nav-info-" + j + "' class='nav-info'>" + cPanel + " de " + panelCount + "</span>";

                            //Positioning of the arrows
                            switch(settings.arrowsPosition) {
                            case "bottom-right":
                                var stripNav = jQuery(this).after(stripNav);
                                jQuery("#stripNav" + j).wrap("<div class='post-footer' />");
                                jQuery("#nav-info-" + j).prependTo(jQuery("#stripNav" + j));
                                if(settings.metaInFooter) jQuery("#datos-creacion").prependTo(jQuery(".post-footer:first"));
                                else {
                                    jQuery("#datos-creacion").prependTo(jQuery(this).parent());
                                    jQuery("#datos-creacion").addClass("top");
                                }
                                navinfo = jQuery("#nav-info-" + j);
                                break;
                            case "top-sides":
                                jQuery(this).parent().before("<div id='stripNav" + j + "' class='top-sides stripNav-wrapper'>" + leftArrow + rightArrow + "</div>");
                                jQuery(".stripNav" + j).addClass("sides").css("top", "-23px");
                                break;
                            default:
                                jQuery(this).before(leftArrow);
                                jQuery(this).after(rightArrow);
                                if(settings.overDescription) {
                                    var marginTop = (jQuery("#slider" + j).height() - 72) / 2 - 28;
                                    jQuery(".stripNav" + j).addClass("sides").css("top", marginTop + "px");
                                }
                            }
                        }

                        if(settings.dynamicTabs) {
                            // Create the Tabs
                            if(settings.dynamicTabsPosition == "top" || settings.dynamicTabsPosition == "before") jQuery(this).before("<div class='tabNav' id='tabNav" + j + "'><ul><\/ul><\/div>");
                            else  jQuery(this).after("<div class='tabNav' id='tabNav" + j + "'><ul><\/ul><\/div>");
                            var odd = true;
                            var odd_or_even;
                            jQuery(this).find("div.panel").each(function(n) {
                                    if(odd) odd_or_even = "odd";
                                    else odd_or_even = "even";
                                    if(settings.exoTabs) var href = jQuery(this).find("a").attr("href");
                                    else var href = "#" + (n+1);
                                    jQuery("div#tabNav" + j + " ul").append("<li class='" + odd_or_even + " tab" + (n+1) + "'><a href='" + href + "'>" + jQuery(this).find("h3").html() + "<\/a><\/li>");
                                    odd = !odd;
                                });

                            // Tab nav

                            jQuery("div#tabNav" + j + " a").each(function(z) {
                                    // Figure out the navWidth by adding up the width of each li
                                    //navWidth += jQuery(this).parent().width();
                                    // What happens when the mouse hovers a link
                                    jQuery(this).mouseover(function() {
                                            jQuery(this).addClass("current").parent().parent().find("a").not(jQuery(this)).removeClass("current"); // wow!
                                            goTo(z+1);
                                        });
                                });
                        }

			// Left nav
			jQuery("div#stripNavL" + j + " a").click(function(){
                                clearInterval(auto_play);
                                go_on = false;
				if (cPanel == 1) {
                                        goTo(panelCount);
					jQuery(this).parent().parent().find("div.stripNav a.current").removeClass("current").parent().parent().find("li:last a").addClass("current");
				} else {
                                        goTo(cPanel - 1);
					jQuery(this).parent().parent().find("div.stripNav* a.current").removeClass("current").parent().prev().find("a").addClass("current");
				};
                                //				panelContainerpanelContainer.animate({ left: cnt}, settings.easeTime, settings.transition);
				return false;
			});

                        // Right nav
			jQuery("div#stripNavR" + j + " a").click(function(){
                                clearInterval(auto_play);
                                go_on = false;
				if (cPanel == panelCount) {
                                        goTo(1);
					jQuery(this).parent().parent().find("div.stripNav a.current").removeClass("current").parent().parent().find("li:first a").addClass("current");
				} else {
                                        goTo(cPanel+1);
					jQuery(this).parent().parent().find("div.stripNav* a.current").removeClass("current").parent().next().find("a").addClass("current");
				};
                                //				panelContainerpanelContainer.animate({ left: cnt}, settings.easeTime, settings.transition);
				return false;
			});

			// Same-page cross-linking
			jQuery("a.cross-link").click(function(){
				jQuery(this).parents().find(".tabNav ul li a:eq(" + (parseInt(jQuery(this).attr("href").slice(1)) - 1) + ")").trigger('click');
			});

			// Set the width of the nav using the navWidth figure we calculated earlier. This is so the nav can be centred above the slider
			//jQuery("div#tabNav" + j).css("width" , navWidth);

			// Specify which tab is initially set to "current". Depends on if the loaded URL had a hash or not (cross-linking).
			if (location.hash && parseInt(location.hash.slice(1)) <= panelCount) {
				jQuery("div#tabNav" + j + " a:eq(" + (location.hash.slice(1) - 1) + ")").addClass("current");
			} else {
				jQuery("div#tabNav" + j + " a:eq(0)").addClass("current");
			}

		});

		j++;
  });
};