/**
 * jQuery Skitter Slideshow
 * @name jquery.skitter.js
 * @description Slideshow
 * @author Thiago Silva Ferreira - http://thiagosf.net
 * @version 3.1
 * @date August 04, 2010
 * @copyright (c) 2010 Thiago Silva Ferreira - http://thiagosf.net
 * @license Dual licensed under the MIT or GPL Version 2 licenses
 * @example http://thiagosf.net/projects/jquery/skitter/
 */

(function($) {

    var number_skitter = 0;
    //var url_base = "http://betatso.es/";
    
    $.fn.skitter = function(options) {
        return this.each(function() {
            new $sk(this, options, number_skitter);
            ++number_skitter;
        });
    };
    
    var defaults = {
        url                 : "",
        velocity            : 1,
        interval            : 2500, 
        animation           : '',
        numbers             : true,
        navigation          : true,
        easing_default      : '',
        box_skitter         : null,
        time_interval       : null,
        images_links        : null,
        image_actual        : null,
        link_actual         : null,
        type_actual         : null,
        delay_actual        : false,
        width_skitter       : null,
        height_skitter      : null,
        image_i             : 1,
        is_animating        : false,
        animateNumberOut    : {backgroundColor:'#333', color:'#fff'},
        animateNumberOver   : {backgroundColor:'#fff', color:'#000'},
        animateNumberActive : {backgroundColor:'#cc3333', color:'#fff'},
        hideTools           : false,
        fullscreen          : false,
        xml                 : false,
        dots                : false,
        structure:              '<a href="#" class="prev_button">prev</a>'
                                + '<a href="#" class="next_button">next</a>'
                                + '<span class="info_slide"></span>'
                                + '<div class="container_skitter">'
                                    + '<div class="image">'
                                        + '<a href=""><div class="general_container"><img class="image_main" /></div></a>'
                                    + '</div>'
                                + '</div>'
    };
    
    $.skitter = function(obj, options, number) {
        this.box_skitter = $(obj);
        this.timer = null;
        this.settings = $.extend({}, defaults, options || {});
        this.number_skitter = number;
        this.setup();
    };
    
    // Shortcut
    var $sk = $.skitter;
    
    $sk.fn = $sk.prototype = {};
    
    $sk.fn.extend = $.extend;
    
    $sk.fn.extend({
        
        /**
         * Init
         */
        setup: function() 
        {
            var self = this;
            
            // Size settings
            if (!this.settings.width_skitter || !this.settings.height_skitter) {
                this.settings.width_skitter     = parseFloat(this.box_skitter.css('width'));
                this.settings.height_skitter     = parseFloat(this.box_skitter.css('height'));               
            } else {
                this.box_skitter.width(this.settings.width_skitter).height(this.settings.height_skitter);
            }
            
            // Structure html
            this.box_skitter.append(this.settings.structure);
            
            // Settings
            this.settings.easing_default     = this.getEasing(this.settings.easing);
            
            if (this.settings.velocity >= 2) this.settings.velocity = 1.3;
            if (this.settings.velocity <= 0) this.settings.velocity = 1;
            
            if (!this.settings.numbers) this.box_skitter.find('.info_slide').hide();
            if (!this.settings.navigation) {
                this.box_skitter.find('.prev_button').hide();
                this.box_skitter.find('.next_button').hide();
            }
            
            this.box_skitter.find('.container_skitter').width(this.settings.width_skitter);
            this.box_skitter.find('.container_skitter').height(this.settings.height_skitter);
            
            var initial_select_class = ' image_number_select', u = 0;
            this.settings.images_links = new Array();
            
            // Add image, link, type and delay
            var addImageLink = function (src, link, type, delay) {
                //alert("tipo: " + type + " delay: " + delay);
                self.settings.images_links.push([src, link, type, delay]);
                self.box_skitter.find('.info_slide').append(
                        '<span class="image_number'+initial_select_class+'" rel="'+(u - 1)+'" id="image_n_'+u+'_'+self.number_skitter+'">'+u+'</span>');
                initial_select_class = '';
            };

            // Load from XML
            if (this.settings.xml) {
                $.ajax({
                    type: 'GET',
                    url: this.settings.xml,
                    async: false,
                    dataType: 'xml',
                    success: function(xml) {
                        $(xml).find('promo').each(function(){
                            ++u;
                            var src             = self.settings.url + $(this).attr('alternative');
                            var link            = $(this).attr('link');
                            var type            = $(this).attr('promoType');
                            var delay           = $(this).attr('delay');
                            addImageLink(src, link, type, delay);
                        });
                    }
                });
            }
            else {
                console.warn('Need a source...');
            }
            
            if (self.settings.dots)
            {
                self.box_skitter.find('.info_slide').addClass('info_slide_dots').removeClass('info_slide');
                var left_info_slide_dots = (self.settings.width_skitter - self.box_skitter.find('.info_slide_dots').width()) / 2;
                self.box_skitter.find('.info_slide_dots').css({'left':left_info_slide_dots});
            }
            else 
            {
                if (self.box_skitter.find('.info_slide').height() > 20) {
                    self.box_skitter.find('.info_slide').hide();
                }
            }
            
            this.box_skitter.find('ul').hide();
            
            this.settings.image_actual   = this.settings.images_links[0][0];
            this.settings.link_actual    = this.settings.images_links[0][1];
            this.settings.type_actual    = this.settings.images_links[0][2];
            this.settings.delay_actual   = this.settings.images_links[0][3];
            
            if (this.settings.images_links.length > 1) 
            {
                this.box_skitter.find('.prev_button').click(function() {
                    if (self.settings.is_animating == false) {
                        //clearInterval(this.timer);
                        
                        //this.timer = self.settings.delay_actual;
                        //alert(this.timer);
                        
                        self.settings.image_i -= 2;
                        
                        if (self.settings.image_i == -2) {
                            self.settings.image_i = self.settings.images_links.length - 2;
                        } 
                        else if (self.settings.image_i == -1) {
                            self.settings.image_i = self.settings.images_links.length - 1;
                        }
                                                
                        self.box_skitter.find('.image a').attr({'href': self.settings.link_actual});
                        self.box_skitter.find('.image_main').attr({'src': self.settings.image_actual});
                        self.box_skitter.find('.box_clone').remove();
                        self.nextImage();
                    }
                    return false;
                });
                
                this.box_skitter.find('.next_button').click(function() {
                    if (self.settings.is_animating == false) {
                        clearInterval(this.timer);
                        console.warn('siguiente');
                        
                        self.box_skitter.find('.image a').attr({'href': self.settings.link_actual});
                        self.box_skitter.find('.image_main').attr({'src': self.settings.image_actual});
                        self.box_skitter.find('.box_clone').remove();
                        self.nextImage();
                        
                    }
                    return false;
                });
                
                this.box_skitter.find('.next_button, .prev_button').hover(function() {
                    $(this).stop().animate({opacity:0.5}, 200);
                }, function(){
                    $(this).stop().animate({opacity:1.0}, 200);
                });
                
                this.box_skitter.find('.image_number').hover(function() {
                    if ($(this).attr('class') != 'image_number image_number_select') {
                        $(this).stop().animate(self.settings.animateNumberOver, 300);
                    }
                }, function(){
                    if ($(this).attr('class') != 'image_number image_number_select') {
                        $(this).stop().animate(self.settings.animateNumberOut, 500);
                    }
                });
                
                /*this.box_skitter.find('.image_number').click(function(){
                    if ($(this).attr('class') != 'image_number image_number_select') {
                        if (self.settings.is_animating == false) {
                            self.box_skitter.find('.box_clone').stop();
                            //clearInterval(self.timer);
                            
                            var new_i = $(this).attr('rel');
                            self.settings.image_i = Math.floor(new_i);
                            
                            self.box_skitter.find('.image a').attr({'href': self.settings.link_actual});
                            self.box_skitter.find('.image_main').attr({'src': self.settings.image_actual});
                            self.box_skitter.find('.box_clone').remove();
                            self.nextImage();
                        }
                    }
                    return false;
                });*/
                
                this.box_skitter.find('.image_number').css(self.settings.animateNumberOut);
                this.box_skitter.find('.image_number:eq(0)').css(self.settings.animateNumberActive);
            }
            
            if (this.settings.hideTools) {
                this.hideTools();
            }
            
            this.loadImages();
        },
        
        /**
         * Load images
         */
        loadImages: function () 
        {
            var self = this;
            
            var loading = $('<div class="loading">Loading</div>');
            this.box_skitter.append(loading);
            total = this.settings.images_links.length;
            
            
            var u = 0;
            $.each(this.settings.images_links, function(i)
            {
                var self_il = this;
                var image = $('<img src="" class="image_loading" />');
                image.css({position:'absolute', top:'-9999em'});
                self.box_skitter.append(image);
                var img = new Image();
                
                $(img).load(function () {
                    ++u;
                    if (u == total) {
                        self.box_skitter.find('.loading').remove();
                        self.box_skitter.find('.image_loading').remove();
                        self.start();
                    }
                }).error(function () {
                    self.box_skitter.find('.loading, .image_loading, .image_number, .next_button, .prev_button').remove();
                    self.box_skitter.html('<p style="color:white;">Error loading images. One or more images were not found.</p>');
                }).attr('src', self_il[0]);
            });
        }, 
        
        /**
         * Start skitter
         */
        start: function()
        {
            var self = this;
                        
            //if (this.settings.type_actual == 'I'){
               this.box_skitter.find('.image a').attr({'href': this.settings.link_actual});
               this.box_skitter.find('.image a img').attr({'src': this.settings.image_actual});
               img_link = this.box_skitter.find('.image a'); 
            //}
            
            
            img_link = this.resizeImage(img_link);
            img_link.find('img').fadeIn(1500);
            
            // Start slideshow
            if (this.settings.images_links.length > 1) {
                //this.timer = setTimeout(function() { self.nextImage(); }, this.settings.interval);
                self.timer = setTimeout(function() { self.nextImage(); }, self.settings.delay_actual * 1000);
                console.warn(this.settings.delay_actual * 1000);
            } 
            else {
                this.box_skitter.find('.loading, .image_loading, .image_number, .next_button, .prev_button').remove();
            }
        },
        
        /**
         * Next image
         */
        nextImage: function() 
        {
            this.animationFade();
        },
        
        animationFade: function(options)
        {
            var self = this;
            
            this.settings.is_animating = true;
            easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
            var time_animate = this.settings.velocity;
            
            this.setActualLevel();
            
            var width_box     = this.settings.width_skitter;
            var height_box    = this.settings.height_skitter;
            var total         = 2;
            
            for (i = 0;i<total;i++) {
                var _vtop = 0;
                var _vleft = 0;
            
                var box_clone = this.getBoxClone();
                box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box});
                this.addBoxClone(box_clone);

                var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
                box_clone.animate({opacity:'show', left:0, top:0}, time_animate, easing, callback);
            }
        },
        
        // Finish animation
        finishAnimation: function (options) 
        {
            var self = this;
            this.box_skitter.find('.image_main').show();
            this.settings.is_animating = false;
            
            this.settings.interval = this.settings.delay_actual * 1000;
            this.timer = setTimeout(function() { self.completeMove(); }, this.settings.interval);
            console.warn(this.timer);
            
            this.box_skitter.find('.image_main').attr({'src': this.settings.image_actual});
            this.box_skitter.find('.image a').attr({'href': this.settings.link_actual});
        },

        // Complete move
        completeMove: function () 
        {
            //clearInterval(this.timer);
            this.box_skitter.find('.box_clone').remove();
            this.nextImage();
        },

        // Actual config for animation
        setActualLevel: function() {
            this.setImageLink();
            this.addClassNumber();
            //this.hideBoxText();
            this.increasingImage();
        },

        // Set image and link
        setImageLink: function()
        {
            var name_image = this.settings.images_links[this.settings.image_i][0];
            var link_image = this.settings.images_links[this.settings.image_i][1];
            var delay_image = this.settings.images_links[this.settings.image_i][3];
            
            this.settings.image_actual = name_image;
            this.settings.link_actual = link_image;
            this.settings.delay_actual = delay_image;
            
            //alert(delay_image);
        },

        // Add class for number
        addClassNumber: function () 
        {
            var self = this;
            this.box_skitter.find('.image_number_select').animate(self.settings.animateNumberOut, 500).removeClass('image_number_select');
            $('#image_n_'+(this.settings.image_i+1)+'_'+self.number_skitter).animate(self.settings.animateNumberActive, 700).addClass('image_number_select');
        },

        // Increment image_i
        increasingImage: function()
        {
            this.settings.image_i++;
            if (this.settings.image_i == this.settings.images_links.length) {
                this.settings.image_i = 0;
            }
        },
        
        // Get box clone
        getBoxClone: function()
        {
            if (this.settings.link_actual != '#') {
                var img_clone = $('<a href="'+this.settings.link_actual+'"><img src="'+this.settings.image_actual+'" /></a>');
            } 
            else {
                var img_clone = $('<img src="'+this.settings.image_actual+'" />');
            }
            
            img_clone = this.resizeImage(img_clone);
            var box_clone = $('<div class="box_clone"></div>');
            box_clone.append(img_clone);
            return box_clone;
        },
        
        // Get box clone
        getBoxCloneImgOld: function(image_old)
        {
            if (this.settings.link_actual != '#') {
                var img_clone = $('<a href="'+this.settings.link_actual+'"><img src="'+image_old+'" /></a>');
            } 
            else {
                var img_clone = $('<img src="'+image_old+'" />');
            }
            
            img_clone = this.resizeImage(img_clone);
            var box_clone = $('<div class="box_clone"></div>');
            box_clone.append(img_clone);
            return box_clone;
        },
        
        // Redimensiona imagem
        resizeImage: function(img_clone) 
        {
            if (this.settings.fullscreen) {
                img_clone.find('img').height(this.settings.height_skitter);
            }
            return img_clone;
        }, 

        // Add box clone in box_skitter
        addBoxClone: function(box_clone)
        {
            this.box_skitter.find('.container_skitter').append(box_clone);
        },
        
        // Get accepts easing 
        getEasing: function(easing)
        {
            var easing_accepts = [
                'easeInQuad',         'easeOutQuad',         'easeInOutQuad', 
                'easeInCubic',         'easeOutCubic',     'easeInOutCubic', 
                'easeInQuart',         'easeOutQuart',     'easeInOutQuart', 
                'easeInQuint',         'easeOutQuint',     'easeInOutQuint', 
                'easeInSine',         'easeOutSine',         'easeInOutSine', 
                'easeInExpo',        'easeOutExpo',         'easeInOutExpo', 
                'easeInCirc',         'easeOutCirc',         'easeInOutCirc', 
                'easeInElastic',     'easeOutElastic',     'easeInOutElastic', 
                'easeInBack',         'easeOutBack',         'easeInOutBack', 
                'easeInBounce',     'easeOutBounce',     'easeInOutBounce', 
            ];
            
            if (jQuery.inArray(easing, easing_accepts) > 0) {
                return easing;
            }
            else {
                return '';
            }
        },
        
        // Get random number
        getRandom: function (i) 
        {
            return Math.floor(Math.random() * i);
        },

        // Set link actual
        setLinkActual: function() {
            if (this.settings.link_actual != '#') {
                this.box_skitter.find('.image a').attr({'href': this.settings.link_actual});
            }
            else {
                this.box_skitter.find('.image a').removeAttr('href');
            }
        },
        
        // Hide tools
        hideTools: function() {
            this.box_skitter.find('.info_slide').hide();
            this.box_skitter.find('.prev_button').hide();
            this.box_skitter.find('.next_button').hide();
        }, 
        
    });

})(jQuery);