/*

Title :: adidoMosaic
Author :: Thomas Stradling
Version :: 0.1

Changelog ::

0.1 ::

*/

$.fn.adidoMosaic = function(options) {
    var opts = $.extend({}, $.fn.adidoMosaic.defaults, options);
    return this.each(function() {
        $this = $(this);
        $this.children('.mosaic-nojs').hide();
        $.fn.adidoMosaic.imgPreload(opts.images);
        var h = $this.height();
        var w = $this.width();
        h = h - ((opts.border * opts.y) + 1);
        w = w - ((opts.border * opts.x) + 1);
        
        var y = h / opts.y;
        var x = w / opts.x;
        var i = 0;
        var is = opts.images.length;
        var imgArr = new Array();

        var ieq = 0;
        var iy = 1;
        for (iy = 1; iy <= opts.y; iy++) {
            ix = 1;
            for (ix = 1; ix <= opts.x; ix++) {
                var e = $('<div></div>');
                var ex = x;
                var ey = y;
                /*  Add border classes */
                if (ix == 1 && iy < opts.y) {
                    e.addClass('border-i');
                } else if (ix == 1 && iy == opts.y) {
                    e.addClass('border-iii');
                } else if (iy == opts.y) {
                    e.addClass('border-iv');
                } else {
                    e.addClass('border-ii');
                }
                var ecss = { 'float': 'left', 'position': 'relative', 'overflow': 'hidden' };
                e.css(ecss).height(ey).width(ex).addClass('mosaic-tile');
                /* Create the image elements */
                ei = $('<img />');
                /* Calculate the required offset for the image */
                var eix = -((ix - 1) * x);
                var eiy = -((iy - 1) * y);
                /* Define the required CSS attributes for the image */
                var eicss = { 'position': 'absolute', 'top': eiy + 'px', 'left': eix + 'px' };
                /* Set the image src */
                ei.css(eicss).attr('src', opts.images[i]);
                e.append(ei);
                $this.append(e);
                imgArr[ieq] = ieq;
                ieq++;
            }
        }
        var mosaicTimer = setInterval(function() {
            if (i < (is - 1)) {
                i++;
            } else {
                i = 0;
            }
            $.fn.adidoMosaic.changeImage($this, opts, i, imgArr);
        }, 7500);

        $('.mosaicNext').click(function(e) {
            e.preventDefault();
            clearInterval(mosaicTimer);
            if (i < (is - 1)) {
                i++;
            } else {
                i = 0;
            }
            $.fn.adidoMosaic.changeImage($this, opts, i, imgArr);
        });
        $('.mosaicPrev').click(function(e) {
            e.preventDefault();
            clearInterval(mosaicTimer);
            if (i > 0) {
                i--;
            } else {
                i = (is - 1);
            }
            $.fn.adidoMosaic.changeImage($this, opts, i, imgArr);
        });
    });
};

$.fn.adidoMosaic.defaults = {
    h: 0,
    w: 0,
    x: 6,
    y: 6,
    images: null,
    border: 1,
    delay: 6000,
    anim: 'random'
};

$.fn.adidoMosaic.changeImage = function(e, o, i, a) {
    a.sort($.fn.adidoMosaic.randomOrder);
    var imgSrc = o.images[i];
    var mti = 0;
    var mtl = a.length;
    var mt = setInterval(function() {
        if (mti < mtl) {
            e.children('.mosaic-tile:eq(' + a[mti] + ')').children('img').fadeOut(100).attr('src', imgSrc).fadeIn(100);
            var mopts = {}
            // e.children('.mosaic-tile:eq(' + a[mti] + ')').children('img').hide('clip', mopts, 400).attr('src', imgSrc).show('clip', mopts, 400);
            mti++;
        } else {
            clearInterval(mt);
        }
    }, 200)
};

$.fn.adidoMosaic.randomOrder = function() {
    return (Math.round(Math.random()) - 0.5);
};
$.fn.adidoMosaic.imgPreload = function(ia) {
    var i = 0;
    var p = ia.length;
    var preBuffer = new Array();
    for (i = 0; i < p; i++) {
        preBuffer[i] = new Image();
        preBuffer[i].src = ia[i];
    }
};