(function($) {

    $.slider = function(element, options) {

        var defaults = {
            nav : null,
            loop : null,
            speed : 1000
        };

        // Reference to this
        var t = this;

        // Current Index
        var cIndex = 0;

        // Number of images
        var num = 0;

        // Create settings object
        t.set = {};

        // jQuery reference to element
        var $ul = $(element);

        // Arrays
        t.images = []; // Image
        t.quotes = []; // Quote
        t.labels = []; // Button label
        t.urls = []; // Url

        // Constructor
        t.init = function ()
        {
            // Extend the defaults with options, save in settings
            t.set = $.extend({}, defaults, options);

            // Set number of images
            num = $ul.children().length;

            // Fill arrays
            fillArrays();

            // Show first item
            t.goto(cIndex,true);

            // Loop ?
            if(t.set.loop != null)
            {
                var intv = t.set.loop;
                t.loop = setTimeout(function(){
                    t.next();
                    t.loop = setInterval(function(){ t.next(); },intv + t.set.speed);
                },intv);
            }

            // Nav ?
            if(t.set.nav != null)
            {
                var $nav = $(t.set.nav);
                $('li',$nav).click(function()
                {
                    var $li = $(this);
                    if( ! $nav.hasClass('disabled'))
                    {
                        if($li.index() != cIndex)
                        {
                            // Stop the loop
                            clearInterval(t.loop);

                            t.goto($(this).index());

                            $nav.addClass('disabled');
                            setTimeout(function()
                            {
                                $nav.removeClass('disabled');
                            }, t.set.speed);
                        }
                    }
                });
            }
        };

        // Public method Next
        // Slide to the next image
        t.next = function()
        {
            // Get target
            var tIndex;
            if(cIndex != num-1)
            {
                tIndex = cIndex+1;
            }
            else
            {
                tIndex = 0;
            }

            t.goto(tIndex);
        };

        // Public method Goto
        // Slide to the passed index
        t.goto = function(tIndex,first)
        {
            if(cIndex != tIndex || first)
            {
                // Append list item
                addListItem(tIndex,first);

                // Adjust images
                t.adjust();

                // Add classes
                if( ! first)
                {
                    $ul.children('.show').addClass('hide').removeClass('show');
                    $ul.children('.new').addClass('show').removeClass('new');

                    // Enlarge "show" image
                   var $img = $('.show').children('figure').children('img');
                   reduceImage($img);

                    setTimeout(function(){ $ul.children('.hide').remove(); }, t.set.speed);
                }
                // Switch index
                cIndex = tIndex;

                if(t.set.nav != null)
                {
                    $('.active',t.set.nav).removeClass('active');
                    $(t.set.nav).children('li').eq(cIndex).addClass('active');
                }
            }
        };

        // Public method Adjust
        // Adjust slider size to parent (ul)
        t.adjust = function()
        {
            // Get ul width and height
            var w = $ul.width();
            var h = $ul.height();

            // List item gets height of ul and width of ul
            var $li = $ul.children('li');
            $li.width(w);
            $li.height(h);

            var $img = $('img',$li);
            $($img).one('load', function() {

                // Images adjust in full-width or full-height,
                // depending on ratio and parent dimensions
                var ratioI = $img.width() / $img.height();
                var ratioP = $li.width() / $li.height();
                if(ratioP >= ratioI)
                {
                    // Make image as wide as parent
                    $img.width($li.width());
                    $img.height($li.width() / ratioI);
                }
                else
                {
                    // Make image as high as parent
                    $img.height($li.height());
                    $img.width($li.height() * ratioI);
                }

                var ml = $img.width() / -2;
                //var mt = $img.height() / -2;
                $img.css({  display: 'block', marginLeft : ml+'px'  });


                // Show slider
                if(parseInt($(element).css('opacity')) == 0 )
                {
                    $(element).stop().animate({ opacity: 1 },300);
                }

            }).each(function() {
                if(this.complete) $(this).load();
            });
        };

        // Private method fillArrays
        // Convert Li content to array then clear li's
        var fillArrays = function()
        {

            for(var i=0;i<num;i++)
            {
                var $li = $ul.children('li').eq(i);
                t.images[i] = $li.children('.image').html();
                t.quotes[i] = $li.children('.quote').html();
                t.labels[i] = $li.children('.label').html();
                t.urls[i] = $li.children('.url').html();

                // Navigation
                var $liNav =  $('<li/>');
                $liNav.html('<span>' + (i+1) + '</span>');
                $(t.set.nav).append($liNav);
            }

            // Remove all li
            $ul.children('li').remove();
        };

        // Private method Append
        // Add image to ul
        var addListItem = function(i,first)
        {
            // Create a string of the item
            var $li = $('<li/>');

            // Show the first image without animation
            if(first){
                $li.addClass('show');
            }
            else
            {
                $li.addClass('new');
            }
            var text = '<section class="text">';
                text += '<blockquote>' + t.quotes[i] + '</blockquote>';
                text += '<a class="btn" href="' + t.urls[i] + '"><span class="label">' + t.labels[i] + '<span class="arrow"></span></span><span class="hover"></span><span class="up"></span></a>';
                text += '</section>';
            var image = '<figure>' + t.images[i] + '</figure>';

            // Add text to list item
            $li.append(text);
            $li.append(image);

            // Add item to list
            $ul.append($li);
        };

        // Private method reduceImage
        // Create a zoom effect while switching between images
        var reduceImage = function($img)
        {
            // How much px larger
            var larger = 1000;

            var r = $img.width() / $img.height();
            var oldW = $img.width();
            var oldH = $img.height();
            var newW = $img.width() + larger;
            var newH = newW / r;

            var oldMl = oldW / -2;
            var newMl = newW / -2;

            $img.css({ marginLeft : newMl+'px', width: newW+'px',height: newH+'px' });
            $img.animate({ marginLeft : oldMl+'px', width: oldW+'px',height: oldH+'px'  }, t.set.speed);
        };

        // Run plugin
        t.init();
    };

    $.fn.slider = function(options)
    {
        return this.each(function()
        {
            // if plugin has not already been attached to the element
            if ($(this).data('slider') == undefined)
            {
                // create a new instance of the plugin
                var slider = new $.slider(this, options);
                $(this).data('slider', slider);
            }
        });
    }

})(jQuery);