//Slideshow
var $slideshow = {
	context: true,
	tabs: false,
	timeout: 6000,      // Time Between Slides
	slideSpeed: 1000,   // Animation Speed General
	tabSpeed: 300,      // Animation Speed When Clicked
	fx: 'scrollLeft',   // Effect

	init: function() {
		//Commonly Used Reference
		this.context = $('.Slideshow');
		// Set Tabs to Nav Li's
		this.tabs = $('.SlidesNav li', this.context);
		// prepare slideshow and jQuery cycle tabs
		this.prepareSlideshow();
	},
	
	prepareSlideshow: function() {
		// Start JQuery
		// JQuery options: http://malsup.com/jquery/cycle/options.html
		$('.SlidesList', $slideshow.context).cycle({
			fx: $slideshow.fx,
			timeout: $slideshow.timeout,
			speed: $slideshow.slideSpeed,
			fastOnEvent: $slideshow.tabSpeed,
			pager: $('.SlidesNav', $slideshow.context),
			pagerAnchorBuilder: $slideshow.prepareTabs,
			before: $slideshow.activateTab,
			pauseOnPagerHover: true,
			pause: true,
			prev: $('.ScrollLeft'),
			next: $('.ScrollRight')
		});            
	},
	
	prepareTabs: function(i, slide) {
		//Return Markup from Tabs (attaches jQuery Cycle Events to Tabs)
		return $slideshow.tabs.eq(i);
	},
	
	activateTab: function(currentSlide, nextSlide) {		
		//Get the Active Tab
		var activeTab = $('a[href="#' + nextSlide.id + '"]', $slideshow.context);
		
		if(activeTab.length) {
			//Remove 'on' from Tabs
			$slideshow.tabs.removeClass('on');
			//Add 'on' to Correct Tab
			activeTab.parent().addClass('on');
		}            
	}
};

var Slideshow = (function()
{
	function _renderNav(slideData)
    {   
		var idx = 0;
        // Set Context and Clear Slides
		var context = $('.SlidesNav');
        context.empty();
    
        for (idx = 0; idx < slideData.slides.length; idx++)
        {
            // Empty Slide
            var slide = [];

			var listItem = $('<li />');
			var anchor = $('<a />');
			var nbsp = $('nbsp;');
		            
            // Build Frame
            listItem.append(anchor);
				anchor.attr('href', '#slide'+idx);
				anchor.append(nbsp);
            slide = listItem;
                    
            // Add Slide to Display
            context.append(slide);
        }
        
        // Start cycle
        $slideshow.init();
    }
	
	function _renderSlides(themeUrl, slideData)
    {   
        // Set Context and Clear Slides
        var idx = 0;
		var context = $('.SlidesList');
        context.empty();
    
        for (idx = 0; idx < slideData.slides.length; idx++)
        {
            // Empty Slide
            var slide = [];

			var listItem = $('<li />');
			var div = $('<div />');
			var imageLink = $('<a class="ImageLink" />');
			var imageTag = $('<img />');
			var h1 = $('<h1 />');
			var para = $('<p />');
			var para2 = $('<p />');
			var textLink = $('<a class="TextLink" />');
		
            // Json
            var img = slideData.slides[idx].image;
            var headingLarge = slideData.slides[idx].headingLarge;
            var description = slideData.slides[idx].description;
            var button = slideData.slides[idx].button;
            var url = slideData.slides[idx].url;
            
            // Build Frame
            listItem.attr('id', 'slide'+[idx]);
            listItem.append(div);
				div.append(imageLink);
					imageLink.attr('href', url);
					imageLink.append(imageTag);
						imageTag.attr('src', themeUrl+'/'+img);
						imageTag.attr('width', 550);
						imageTag.attr('height', 325);
				div.append(h1);
					h1.append(headingLarge);
				div.append(para);
					para.append(description);
				if (button.length != 0 && url.length != 0)
				{
					div.append(textLink);
						textLink.attr('href', url);
							textLink.append(button);
				}
				else if (button.length > 0 && url.length == 0)
				{
					div.append(para2);
						para2.append(button);
							para2.css('text-align', 'right');
							para2.css('padding-top', 10);
				}
				else if (button.length > 0 && url.length == 0)
				{
					div.append(textLink);
						textLink.attr('href', url);
							textLink.append(url);
				}
				else
				{
					// Do nothing
				}
				
            slide = listItem;
                    
            // Add Slide to Display
            context.append(slide);
        }
        
        // Render Nav
        _renderNav(slideData);
    }
	
	function _loadSlides(themeUrl, slidesUrl)
	{	
		var fullUrl = themeUrl.toString()+'/'+slidesUrl;
		
		$.ajax({
			type: "GET",
			url: fullUrl,
			dataType: "json",
			success: function(data) {
				var slideData = data;
				
				// Render Slides
				_renderSlides(themeUrl, slideData);
			},
			error: function(req, status, err)
			{
				alert("Error loading json: " + err);
			}
		});
	}	
		
	return {
		loadSlides: _loadSlides
	};
}());
