﻿$.fn.ImageArray=function (opt) {

    var defaultOptions={
        url: null,
        visible: 0,
        imgWidth: 90,
        imgHeight: 90,
        maxX: 10,
        maxY: 0,
        linkTarget: '_parent',
        randomize: true
        //direction: 'horizontal'
    }

    var options=$.extend(defaultOptions,opt);

    var param={
        imageCount: 0,
        liList: new Array(),
        paramSeparator: (options.url.indexOf('?')> -1)?'&':'?'
    }

    return this.each(function () {
        // initialize carouse params
        $(this).hide();
        initCarousel($(this));
    });


    function initCarousel(div) {
        var bigNumber=9999999;
        //var isV=param.isVertical;
        // initialize params
        $(div).css({ 'position': 'relative' });
        $(div).html('<ul></ul>');
        var ul=$('ul',div);
        if(options.maxY>0) ul.css({ 'height': options.imgHeight*options.maxY });
        if(options.maxX>0) ul.css({ 'width': options.imgWidth*options.maxX });
        if(!window.parent&&options.linkTarget=='_parent') options.linkTarget='_self';

        // get the first options.visible * 2 images
        //var endIndex=options.visible*2;
        loadImages(function (data) {
            param.imageCount=data.images.length;
            for(var i=0;i<param.imageCount;i++) { if(options.visible<=0||i<options.visible) { ul.append(param.liList[i]); } else { break; } };
            $(div).show();
        });
    }

    function loadImages(callback) {
        var jsonUrl=buildUrl();
        if(jsonUrl&&callback) $.getJSON(jsonUrl,function (data) {
            var images=data.images;
            //param.downloadIndex = data.to+1;
            var r = randomizeIndexArray(options.randomize?images.length:0);
            for(var i=0;i<images.length;i++) {
                var j=(options.randomize?r[i]:i);                
                if(!images[j].src) images[j].src='http://www.infomine.com/global/assets/images/1x1trans.gif';
                var li=$('<li><a target="'+options.linkTarget+'" href="'+images[j].url+'"><img src="'+images[j].src+'" border="0" /></a></li>');
                li.css({ 'width': options.imgWidth,'float': 'left','overflow': 'hidden' });
                param.liList.push(li);
            }
            callback(data);
        });
    }

    function randomizeIndexArray(j) {
        var k=new Array(j);
        for(var i=j-1;i>=0;i--) {
            if(!k[i] && k[i]!=0) {
                var x=Math.floor(Math.random()*j);
                k[i]=((!k[x] && k[x]!=0)?x:k[x]);
                k[x]=i;
            }
        }
        return k;
    }

    function buildUrl() {
        return options.url+param.paramSeparator+"&jsoncallback=?";
    }

    function css(el,prop) {
        return (el[0])?(parseInt($.css(el[0],prop))||0):0;
    };

    function width(el) {
        return (el[0])?(el[0].offsetWidth+css(el,'marginLeft')+css(el,'marginRight')):0;
    };

    function height(el) {
        return (el[0])?(el[0].offsetHeight+css(el,'marginTop')+css(el,'marginBottom')):0;
    };

    function debug(msg) {
        $('#debug').text(msg);
    }



}
