(function($) {
    $.fn.Slider = function(options) {
        $.fn.Slider.defaults = {
            
        };
        var settings = $.extend({},$.fn.Slider.defaults,options);
        
        var element = $(this);
        var numImages = element.find('img').length;
        
        var init = {
            offsetNear: 2,
            offsetFar: 5,
            width: element.width(),
            height: element.height(),
            numImages: numImages
        }
        
        var blocks = {
            frame: '<div class="slider-frame"></div>',
            image: '<div class="slider-image"></div>',
            wrapper: '<div class="slider-wrapper-image"></div>',
            images: '<div class="slider-images"></div>'
        };
        
        var backgrounds = {
            near: '<div class="slider-background near"></div>',
            far: '<div class="slider-background far"></div>'
        }
        
        var navigations = {
            buttonPrev: $('<div class="slider-nav button-prev"></div>'),
            buttonNext: $('<div class="slider-nav button-next"></div>'),
            navbar: $('<ul class="navbar"></lu>')
        }
        
        var position = 1;
        var lastPosition = position;
        
        var create = function() {
            var imgs = element.find('img');
            
            $.each(imgs,function(index,value) {
                var img = $(value);
                img.wrap(blocks.image);
                
                var rel = img.attr('rel');
                if(rel && $('div#'+rel).length > 0) {
                    $('div#'+rel).addClass('slider-caption');
                    img.parent('div').append($('div#'+rel));
                    $('div#'+rel).width(img.width());
                }
            });
            
            $('div.slider-image',element).wrapInner(blocks.wrapper);
            $('div.slider-image',element).wrapAll(blocks.images);
            
            $('div.slider-images',element).width(init.width * init.numImages);
            $('div.slider-image',element).width(init.width);
            
            $('div.slider-images').wrap(blocks.frame);
            
            element.addClass('slider');
            
            $('div.slider-frame',element).append(navigations.buttonNext).append(navigations.buttonPrev);
            $('div.slider-frame',element).append(navigations.navbar);
            
            $.each(imgs,function(index,value) {
                var img = $(value);
                var label = img.attr('label');
                navigations.navbar.append("<li>"+ label +"</li>");
            });
            
            $('ul.navbar li:eq(0)').addClass('active');
            navigations.navbar.css('left', ($('div.slider-frame',this).width() - navigations.navbar.width()) / 2);
            
            element.prepend(backgrounds.far);
            element.prepend(backgrounds.near);
            
            $('div.near',element).width(init.width * init.numImages).height(init.height);
            $('div.far',element).width(init.width * init.numImages).height(init.height);
        };
        
        $(window).resize(function() {
                init.width = element.width();
                
                $('div.slider-images',element).width(init.width * init.numImages);
                $('div.slider-image',element).width(init.width);
                
                $('div.near',element).width(init.width * init.numImages).height(init.height);
                $('div.far',element).width(init.width * init.numImages).height(init.height);
                
                $('div.near',element).css('left', '0px');
		$('div.near',element).css('left', '-'+init.width*(position-1)*init.offsetNear/100+'px');
                
                $('div.far',element).css('left', '0px');
		$('div.far',element).css('left', '-'+init.width*(position-1)*init.offsetFar/100+'px');
                
                $('div.slider-images', element).css('left', '0px');
	        $('div.slider-images', element).css('left', '-'+init.width*(position-1)+'px');
            });
        
        navigations.buttonPrev.bind('click',function(e) {
            lastPosition = position;
            --position;
             if(position > 0) {

                element.find('div.slider-images').animate({
                    left: '+='+init.width
                },1000);
                
                 element.find('div.near').animate({
                   left: '+='+Math.floor(init.width * init.offsetNear / 100)
                },1000);
                
                element.find('div.far').animate({
                   left: '+='+Math.floor(init.width * init.offsetFar / 100)
                },1000);
                
                navigations.navbar.find('li').removeClass('active');
                navigations.navbar.find('li:eq('+(position-1)+')').addClass('active');
                
            } else {
                position = 1;
                return false;
            }    
        });
        
        navigations.buttonNext.bind('click',function(e) {
            lastPosition = position;
            if(position < init.numImages) {
                element.find('div.slider-images').animate({
                    left: '-='+init.width
                },1000);
                
                element.find('div.near').animate({
                   left: '-='+Math.floor(init.width * init.offsetNear / 100)
                },1000);
                
                element.find('div.far').animate({
                   left: '-='+Math.floor(init.width * init.offsetFar / 100)
                },1000);

                navigations.navbar.find('li').removeClass('active');
                navigations.navbar.find('li:eq('+(position++)+')').addClass('active');
            } else {
                $('ul.navbar li:eq(0)',element).trigger('click');
                
                return false;
            } 
        });
        
        var dt = setInterval(function() {
            navigations.buttonNext.trigger('click');
        },5000);
        
        element.hover(function() {
            $('div.slider-nav',element).show();
            clearInterval(dt);
            dt = null;
        }, function() {
            $('div.slider-nav',element).hide();
            if(dt == null)
                dt = setInterval(function() {
                    navigations.buttonNext.trigger('click');
                },5000);
        });
        
        $('ul.navbar li',element).live('click',function() {
            lastPosition = position;
            position = $('ul.navbar li').index($(this)) + 1;
            
            $(this).parent('ul').find('li').removeClass('active');
            $(this).addClass('active');

            var offset = position - lastPosition;
            if(offset < 0) {
                element.find('div.slider-images').animate({
                    left: '+='+init.width * Math.abs(offset)
                },1000);
                
                element.find('div.near').animate({
                   left: '+='+Math.floor(init.width * init.offsetNear / 100) * Math.abs(offset)
                },1000);
                
                element.find('div.far').animate({
                   left: '+='+Math.floor(init.width * init.offsetFar / 100) * Math.abs(offset)
                },1000);
            } else{
                element.find('div.slider-images').animate({
                    left: '-='+init.width * Math.abs(offset)
                },1000);
                
                 element.find('div.near').animate({
                   left: '-='+Math.floor(init.width * init.offsetNear / 100) * Math.abs(offset)
                },1000);
                
                element.find('div.far').animate({
                   left: '-='+Math.floor(init.width * init.offsetFar / 100) * Math.abs(offset)
                },1000);
            }
            
            lastPosition = position;
                
        });

        return element.each(create);
    };
})(jQuery);