var Slideshow = (function()
{
    var frameContainer = null;
    var trackString = null;
    var trackContainer = null;
    var slideDelay = null;
    var transitionEffect = null;
        
    function _init(jsonConfig)
    {
        var jsonUrl = jsonConfig.jsonUrl;
        frameContainer = $(''+ jsonConfig.frameContainer +'');
        trackString = jsonConfig.trackContainer;
        trackContainer = $(''+ jsonConfig.trackContainer +'');
        slideDelay = jsonConfig.slideDelay;
        transitionEffect = jsonConfig.transitionEffect;

        $.ajax ({
            type: "GET",
            url: jsonUrl,
            dataType: "json",
            success: function(data) 
            {
                var data = data.slides;
                TrackBuilder.init(data, trackContainer);
                SlideBuilder.init(data, frameContainer, _startSlideshow);
            },
            error: function(req, status, err)
            {
                alert("Error loading slideshow: " + err);
            }
        });
    };
    
    function _startSlideshow()
    {
        SlideshowCycle.init(frameContainer, trackContainer, trackString, transitionEffect, slideDelay)
		
		var slideshow = $('.Slideshow');
		var img = slideshow.find('img');
		
		img.hover(function(){
			slideshow.addClass('Hover');
		}, function(){
			slideshow.removeClass('Hover');
		});
    };
    
    return {
        init: _init
    };
})();

var SlideBuilder = (function()
{
    function _init(slides, frameContainer, callback)
    {
        $.each(slides, function(idx, value)
        {
            _renderSlide(value, idx, frameContainer);
        });
        callback();
    };
    
    function _renderSlide(slide, idx, frameContainer)
    {
		// Slide info from json
        var image = slide.image;
        var link = slide.link;
		
        // HTML Elements
        var listElement = $('<li />');
        var imageElement = $('<img />');
        var anchorElement = $('<a />');
	 
		listElement.append(anchorElement);
			anchorElement.attr('href', link);
			anchorElement.append(imageElement);
				imageElement.attr('src', image);
        listElement.attr('id', 'slide'+ idx +'');
            
        // Add listElement to display
        frameContainer.append(listElement);
    };
    
    return {
        init: _init
    };
})();

var TrackBuilder = (function()
{
    function _init(slides, trackContainer)
    {
        $.each(slides, function(idx, value)
        {
            _renderItem(idx, trackContainer); 
        });
    };
    
    function _renderItem(idx, trackContainer)
    {
        var listElement = $('<li />');
        var anchorTag = $('<a />');
        
        listElement.append(anchorTag);
        anchorTag.attr('href', '#slide'+ idx +'');

        trackContainer.append(listElement);
    };
    
    return {
        init: _init
    };
})();

var SlideshowCycle = (function()
{
    function _init(frameContainer, trackContainer, trackString, transitionEffect, slideDelay)
    {
        frameContainer.cycle({ 
            activePagerClass: 'On',
            fastOnEvent: 250, 
            fx: transitionEffect,
            pause: true,
            pauseOnPagerHover: true,
            rev: 0,
            speed: 1000,
            startingSlide: 0,
            sync: 1,
            timeout: slideDelay,
			next: $('.ButtonRight'),
			prev: $('.ButtonLeft'),
            pager: trackContainer,
            pagerAnchorBuilder: function(idx, slide) { return ''+ trackString +' li:eq(' + idx + ') a'; }
        });
    };
    
    return {
        init: _init
    };
}());