/**
 * @author  : Santiago Camelo
 * @company : Hydramedialabs
 * @site    : www.hydra.com.uy
 * @contact : info[at]hydra.com.uy
 */
 
var components = {
    slides: {
        createSquareSlideshow: function($container, $name, $arrObjects, $interval){
            var index = 0;
            var html = "";
            var component;
            var i;
            
            html += "<div id='" + $name;
            html += "' class='squareSlideshow'><img src=" + $arrObjects[index].path;
            html += "><div class='caption'><div class='button'></div><a href=''>" + $arrObjects[index].title + "</a></div></div>"
            
            jQuery($container).append(html);
            
            component = jQuery("#" + $name);
            
            component.find(".button").fadeTo(0, .7).hover(function(){
                jQuery(this).fadeTo(0, 1);
            }, function(){
                jQuery(this).fadeTo(0, .7)
            }).click(function(){
				alert($arrObjects[index].link);
                //window.location.href = $arrObjects[index].link;
            });
            
            /*
             * shows first image
             */
            showImage();
            
            /*
             * starts timer for slideshow
             */
            setInterval(showNextSlide, $interval);
            
            /*
             * methods
             */
            function showNextSlide(){
                hideImage();
            }
            
            /*
             * shows image with fade fx.
             */
            function showImage(){
                component.find("img").fadeTo(500, 1);
                component.find(".caption").fadeTo(300, 1);
                
                clearInterval(i);
            }
            
            /*
             * hides image and change content.
             */
            function hideImage(){
                component.find(".caption").fadeTo(300, 0);
                
				component.find("img").fadeTo(500, 0, function(){
                    index == $arrObjects.length - 1 ? index = 0 : index++;
                    
                    component.find("img").attr("src", $arrObjects[index].path);
                    component.find(".caption a").text($arrObjects[index].title);
                });
                
                i = setInterval(showImage, 200);
            }
        }
    }
};

