/**
*
*
* bxSlider: Content slider / fade / ticker using the jQuery javascript library.
*
* Author: Steven Wanderski
* Email: wandoledzep@gmail.com
* URL: http://bxslider.com
*
*
**/

jQuery.fn.bxSlider = function(options){

        /////////////////////////////////////////////////////////////////////////////////////////////////////////////
        // Declare variables and functions
        /////////////////////////////////////////////////////////////////////////////////////////////////////////////
        var defaults = {
                mode: 'slide',
                speed: 500,
                auto: false,
                auto_direction: 'left',
                pause: 2500,
                controls: true,
                prev_text: 'prev',
                next_text: 'next',
                width: $(this).children().width(),
                prev_img: '/images/slideleft.png',
                next_img: '/images/slideright.png',
                ticker_direction: 'left',
                wrapper_class: 'container'
        };

        options = $.extend(defaults, options);

        if(options.mode == 'ticker'){
                options.auto = true;
        }

        var $this = $(this);

        var $parent_width = options.width;
        var current = 0;
        var is_working = false;
        var child_count = $this.children().size();
        var i = 0;
        var j = 0;
        var k = 0;

        function animate_next(){

                is_working = true;

                $this.animate({'left':'-' + $parent_width * 2 + 'px'}, options.speed, function(){

                        $this.css({'left':'-' + $parent_width + 'px'}).children(':first').appendTo($this);

                        is_working = false;

                });

        }

        function animate_prev(){

                is_working = true;

                $this.animate({'left': 0}, options.speed, function(){

                        $this.css({'left':'-' + $parent_width + 'px'}).children(':last').insertBefore($this.children(':first'));

                        is_working = false;

                });

        }

        function fade(direction){

                if(direction == 'next'){

                        var last_before_switch = child_count - 1;
                        var start_over = 0;
                        var incr = k + 1;

                }else if(direction == 'prev'){

                        var last_before_switch = 0;
                        var start_over = child_count -1;
                        var incr = k - 1;

                }

                is_working = true;

                if(k == last_before_switch){

                        $this.children().eq(k).fadeTo(options.speed, 0, function(){$(this).hide();});
                        //$this.children().eq(k).css({'left':'-9999px'});
                        $this.children().eq(start_over).show().fadeTo(options.speed, 1, function(){

                        is_working = false;

                        k = start_over;

                        });

                }else{

                        $this.children().eq(k).fadeTo(options.speed, 0, function(){$(this).hide();});
                        //$this.children().eq(k).css({'left':'-9999px'});
                        $this.children().eq(incr).show().fadeTo(options.speed, 1, function(){

                        is_working = false;

                        k = incr;

                        });

                }

        }

        function add_controls(){

                /////////////////////////////////////////////////////////////////////////////////////////////////////////////
                // Check if user selected images to use for next / prev
                /////////////////////////////////////////////////////////////////////////////////////////////////////////////

                if(options.prev_img != '' || options.next_img != ''){

                        $this.parent().append('<a class="slider_prev" href=""><img src="' + options.prev_img + '" border=0 alt=""/></a><a class="slider_next" href=""><img src="' + options.next_img + '" border=0 alt="" /></a>');

                }else{

                        $this.parent().append('<a class="slider_prev" href="">' + options.prev_text + '</a><a class="slider_next" href="">' + options.next_text + '</a>');

                }

                $this.parent().find('.slider_prev').css({'float':'left', 'outline':'0'});
                $this.parent().find('.slider_next').css({'float':'right', 'outline':'0'});


                /////////////////////////////////////////////////////////////////////////////////////////////////////////////
                // Accomodate padding-top for controls when elements are absolutely positioned (only in fade mode)
                /////////////////////////////////////////////////////////////////////////////////////////////////////////////

                if(options.mode == 'fade'){

                        $this.parent().find('.slider_prev').css({'paddingTop' : $this.children().height()})
                        $this.parent().find('.slider_next').css({'paddingTop' : $this.children().height()})

                }

                /////////////////////////////////////////////////////////////////////////////////////////////////////////////
                // Actions when user clicks next / prev buttons
                /////////////////////////////////////////////////////////////////////////////////////////////////////////////

                $this.parent().find('.slider_next').click(function(){

                        if(!is_working){

                                if(options.mode == 'slide'){

                                        animate_next();

                                        if(options.auto){

                                                clearInterval($.t);

                                                $.t = setInterval(function(){animate_next();}, options.pause);

                                        }

                                }else if(options.mode == 'fade'){

                                        fade('next');

                                        if(options.auto){

                                                clearInterval($.t);

                                                $.t = setInterval(function(){fade('next');}, options.pause);

                                        }


                                }

                        }

                        return false;

                });

                $this.parent().find('.slider_prev').click(function(){

                        if(!is_working){

                                if(options.mode == 'slide'){

                                        animate_prev();

                                        if(options.auto){

                                                clearInterval($.t);

                                                $.t = setInterval(function(){animate_prev();}, options.pause);

                                        }

                                }else if(options.mode == 'fade'){

                                        fade('prev');

                                        if(options.auto){

                                                clearInterval($.t);

                                                $.t = setInterval(function(){fade('prev');}, options.pause);

                                        }

                                }

                        }

                        return false;

                });

        }


        function ticker() {

                if(options.ticker_direction == 'left'){

                        $this.animate({'left':'-' + $parent_width * 2 + 'px'}, options.speed, 'linear', function(){

                                $this.css({'left':'-' + $parent_width + 'px'}).children(':first').appendTo($this);

                                ticker();

                        });

                }else if(options.ticker_direction == 'right'){

                        $this.animate({'left': 0}, options.speed, 'linear', function(){

                                $this.css({'left':'-' + $parent_width + 'px'}).children(':last').insertBefore($this.children(':first'));

                                ticker();

                        });

                }

        }



        /////////////////////////////////////////////////////////////////////////////////////////////////////////////
        // Create content wrapper and set CSS
        /////////////////////////////////////////////////////////////////////////////////////////////////////////////

        $this.wrap('<div class="' + options.wrapper_class + '"></div>');

        //console.log($this.parent().css('paddingTop'));

        if(options.mode == 'slide' || options.mode == 'ticker'){

                $this.parent().css({
                        'overflow' : 'hidden',
                        'position' : 'relative',
                        'width' : options.width + 'px'
                });

                $this.css({
                        'width' : '999999px',
                        'position' : 'relative',
                        'left' : '-' + $parent_width + 'px'
                });

                $this.children().css({
                        'float' : 'left',
                        'width' : $parent_width
                });

                $this.children(':last').insertBefore($this.children(':first'));

        }else if(options.mode == 'fade'){

                $this.parent().css({
                        'overflow' : 'hidden',
                        'position' : 'relative',
                        'width' : options.width + 'px'
                        //'height' : $this.children().height()
                });

                if(!options.controls){
                        $this.parent().css({'height' : $this.children().height()});
                }

                $this.children().css({
                        'position' : 'absolute',
                        'width' : $parent_width,
                        'listStyle' : 'none',
                        'opacity' : 0,
                        'display' : 'none'
                });

                $this.children(':first').css({
                        'opacity' : 1,
                        'display' : 'block'
                });

        }

        /////////////////////////////////////////////////////////////////////////////////////////////////////////////
        // Check if user selected "auto"
        /////////////////////////////////////////////////////////////////////////////////////////////////////////////

        if(!options.auto){

                add_controls();

        }else{

                if(options.mode == 'ticker'){

                        ticker();

                }else{

                        /////////////////////////////////////////////////////////////////////////////////////////////////////////////
                        // Set a timed interval
                        /////////////////////////////////////////////////////////////////////////////////////////////////////////////

                        if(options.mode == 'slide'){

                                if(options.auto_direction == 'left'){

                                        $.t = setInterval(function(){animate_next();}, options.pause);

                                }else if(options.auto_direction == 'right'){

                                        $.t = setInterval(function(){animate_prev();}, options.pause);

                                }

                        }else if(options.mode == 'fade'){

                                if(options.auto_direction == 'left'){

                                        $.t = setInterval(function(){fade('next');}, options.pause);

                                }else if(options.auto_direction == 'right'){

                                        $.t = setInterval(function(){fade('prev');}, options.pause);

                                }

                        }

                        if(options.controls){

                                add_controls();

                        }

                }

        }

}

















