(function($) {

    $.imageList = function(options) {
        return $.imageList.impl.init(options);
    };

    $.fn.imageList = function(options) {
        return $.imageList.impl.init(this, options);
    };

    /*
    * default options
    */
    $.imageList.defaults = {
        index: 0,
        res: {}
    };

    $.imageList.impl = {

        /*
        * options
        */
        opts: null,

        /*
        * helper
        */
        helper: {},

        /*
        * Initialize the page
        */
        init: function(options) {

            var self = this;

            this.opts = $.extend({}, $.imageList.defaults, options);

            // helpers
            self.helper.container = $('div.page-imagelist');
            self.helper.list = self.helper.container.find('ul.image-collection');
            self.helper.prev = $('<a class="prev-image" href="#">' + self.opts.res.previous + '</a>').appendTo(self.helper.container);
            self.helper.next = $('<a class="next-image" href="#">' + self.opts.res.next + '</a>').appendTo(self.helper.container);

            self.helper.list.children().each(function(i, item) {

                var $a = $(item).find('a');
                var src = $(item).find('img').attr('src');

                // remove alt text
                $a.find('img')
                    .attr('alt', '')
                    ;

                if (i == self.opts.index) {
                    $(new Image())
                        .load(function() {

                            $a
                                .fadeIn(1000, function() {

                                    var $tip = $('<div>' + $a.attr('title') + '</div>');

                                    $(this)
                                        .tooltip({
                                            id: 'imagelist-tooltip',
                                            track: true,
                                            showURL: false,
                                            delay: 0,
                                            bodyHandler: function() {
                                                return $tip;
                                            }
                                        })
                                        ;

                                })
                                ;

                        })
                        .attr('src', src)
                        ;
                }
            });

            self.helper.prev.click(function(e) {
                e.preventDefault();
                self.animate('prev');
            });

            self.helper.next.click(function(e) {
                e.preventDefault();
                self.animate('next');
            });

            return self;
        },

        /*
        * Animate
        */
        animate: function(dir) {

            var self = this;
            var length = self.helper.list.children().length;

            if (dir == 'next') {
                if (self.opts.index < length - 1)
                    self.opts.index++;
                else
                    self.opts.index = 0;
            }
            else {
                if (self.opts.index == 0)
                    self.opts.index = length - 1;
                else
                    self.opts.index--;
            }

            var $a = $(self.helper.list.find('a')[self.opts.index]).clone();
            var src = $a.find('img').attr('src');

            $(new Image())
		        .load(function() {

		            $a
		                .css({
		                    display: 'none'
		                })
		                .appendTo(self.helper.container.find('.fixer'))
		                .fadeIn(1000, function() {

		                    var $tip = $('<div>' + $a.attr('title') + '</div>');

		                    $(this)
                                .tooltip({
                                    id: 'imagelist-tooltip',
                                    track: true,
                                    showURL: false,
                                    delay: 0,
                                    bodyHandler: function() {
                                        return $tip;
                                    }
                                })
                                ;

		                })
		                ;

		        })
		        .attr('src', src)
		        ;

            return;
        }

    };
})(jQuery);