if (!window.Idiom) {
    var Idiom = {};
}

Idiom.Slideshowlet = Class.create();

Idiom.Slideshowlet._ = {
    sslts:{},
    index:0,
    generateID:function() {
        this.index++;
        return ('sslt_' + (this.index - 1));
    },
    get:function(id) {
        if (this.sslts[id]) {
            return this.sslts[id];
        }

        return null;

    }
};


Idiom.Slideshowlet.prototype = {
    initialize:function(config) {
        this.config = config || {};

        this.id = config.id || Idiom.Slideshowlet._.generateID();

        this.transMutex = false;

        var sslt = this;

        this.ele = this.config.ele || document.createElement('div');
        this.imgArr = this.config.imgArr || [];
        this.imgWidth = this.config.imgWidth || 350;
        this.eleWidth = this.config.eleWidth || Element.getWidth(this.ele);

        this.dataArr = this.config.dataArr || [];

        this.lookAhead = this.config.lookAhead || 1;

        this.midpt = this.config.midpt ? this.config.midpt : 258;
        this.inactiveOpacity = this.config.inactiveOpacity || 0.2;

        this.transDuration = this.config.transDuration || 0.2;


        this.captionArr = this.config.captionArr || [];

        this.ssltEle = document.createElement('div');
        Element.addClassName(this.ssltEle, 'ssltEle');
        this.ssltEle.style.width = ((this.imgArr.length * (this.imgWidth + 30) )) + 'px';

        this.imgHolders = [];

        this.imgArr.each(function(img, ix) {
            var imgHolder = document.createElement('div');
            Element.addClassName(imgHolder, 'ssltImgCnt');
            sslt.ssltEle.appendChild(imgHolder);
            sslt.imgHolders.push(imgHolder);

            Element.setOpacity(imgHolder, sslt.inactiveOpacity);
            if (sslt.config.clickHandler) {
                Event.observe(imgHolder, 'click', function() {
                    sslt.config.clickHandler(ix, {sslt:sslt});
                });
            }

            if (sslt.dataArr) {
                imgHolder.dataObj = sslt.dataArr[ix] || null;
            }

        });

        this.ele.appendChild(this.ssltEle);


        this.controlsEle = document.createElement('div');
        Element.addClassName(this.controlsEle, 'ssltControls');
        this.controlsEle.innerHTML = '<div class="moveLeft"></div><div class="moveRight"></div>';
        this.activeImgIndex = 0;

        this.ele.appendChild(this.controlsEle);

        var moveLeftEle = this.moveLeftEle = Element.select(this.controlsEle, '.moveLeft')[0];
        var moveRightEle = this.moveRightEle = Element.select(this.controlsEle, '.moveRight')[0];

        Element.hide(moveLeftEle);


        Event.observe(moveLeftEle, 'click', function() {
            sslt.moveLeft();
        });
        Event.observe(moveRightEle, 'click', function() {
            sslt.moveRight();
        });

        Event.observe(moveLeftEle, 'mouseover', function() {
            Element.addClassName(moveLeftEle, 'hover');
        });
        Event.observe(moveLeftEle, 'mouseout', function() {
            Element.removeClassName(moveLeftEle, 'hover');
        });

        Event.observe(moveRightEle, 'mouseover', function() {
            Element.addClassName(moveRightEle, 'hover');
        });
        Event.observe(moveRightEle, 'mouseout', function() {
            Element.removeClassName(moveRightEle, 'hover');
        });

        (!this.lookAhead ? [0,1,2] : $A($R(0, this.lookAhead, true))).each(function(ix) {
            sslt.putImg(sslt.imgArr[ix], ix, sslt.captionArr ? sslt.captionArr[ix] : null);
        });

        this.ssltEle.style.left = (this.getLeftPosition(this.activeImgIndex) ) + 'px';

        Element.setOpacity(sslt.imgHolders[0], 1);

        Idiom.Slideshowlet._.sslts[this.id] = this;


    },
    putImg:function(imgSrc, index, caption) {   //hacky way of getting the caption/data in

        if (index < this.imgArr.length) {
            var sslt = this;

            var ih = sslt.imgHolders[index || 0];

            var img = document.createElement('img');
            Element.addClassName(img, 'ssltImg');
            ih.appendChild(img);

            if (caption) {
                if (caption.ele) {
                    Element.addClassName(caption.ele, 'ssltImgCaption');
                    ih.appendChild(caption.ele);
                }
                else {
                    var captionEle = document.createElement('div');
                    Element.addClassName(captionEle, 'ssltImgCaption');
                    captionEle.innerHTML = caption;
                    ih.appendChild(captionEle);

                }

            }

            var imgObj = new Image();
            imgObj.onload = function() {
                img.src = imgSrc;
            };

            imgObj.src = imgSrc;


        }
        //        caption = 'sfsdf';


    },


    moveLeft:function() {

        if (!this.transMutex) {
            this.setActiveImg(this.activeImgIndex - 1);
        }


    },
    moveRight:function() {

        if (!this.transMutex) {
            this.setActiveImg(this.activeImgIndex + 1);
        }


    },

    setActiveImg:function(index) {

        var sslt = this;

        for (var i = 0; i <= index; i++) {
            if (this.imgArr[i] && this.imgHolders[i].childNodes.length == 0) {
                this.putImg(this.imgArr[i], i, this.captionArr ? this.captionArr[i] : null);
            }
        }

        (!this.lookAhead ? [1] : $A($R(1, this.lookAhead, false))).each(function(ix) {
            if ((index < sslt.imgArr.length - 1) && sslt.imgHolders[index + ix] && sslt.imgHolders[index + ix].childNodes.length == 0) {
                sslt.putImg(sslt.imgArr[index + ix], index + ix, sslt.captionArr ? sslt.captionArr[index + ix] : null);
            }
        });


        //        if ((index < this.imgArr.length - 1) && this.imgHolders[index + 1].childNodes.length == 0) {
        //            this.putImg(this.imgArr[index + 1], index + 1, this.captionArr ? this.captionArr[index + 1] : null);
        //        }

        if (index < this.imgArr.length && index >= 0) {
            sslt.transMutex = true;
            new Effect.Parallel([
                new Effect.Opacity(sslt.imgHolders[sslt.activeImgIndex], {transition:Effect.Transitions.linear, from:1, to:sslt.inactiveOpacity, sync:true}),
                new Effect.Opacity(sslt.imgHolders[index], {transition:Effect.Transitions.linear, from:sslt.inactiveOpacity, to:1, sync:true}),
                new Effect.Move(sslt.ssltEle, {sync:true, transition:Effect.Transitions.linear, x: sslt.getLeftPosition(index), mode:'absolute'})
            ], {
                duration:this.transDuration,
                //                transition:Effect.Transitions.linear,
                afterFinish:function() {
                    sslt.activeImgIndex = index;
                    sslt.transMutex = false;
                    if(index==0){
                        Element.hide(sslt.moveLeftEle);
                    }
                    else{
                        Element.show(sslt.moveLeftEle);
                    }
                    if(index==sslt.imgArr.length-1){
                        Element.hide(sslt.moveRightEle);
                    }
                    else{
                        Element.show(sslt.moveRightEle);
                    }
                }
            });


        }
    },

    resetSslt:function(options) {
        //        if(options.)
        this.ssltEle.style.left = this.getLeftPosition(this.activeImgIndex) + 'px';
    },
    getLeftPosition:function(ind) {

        return (((-1) * (this.imgWidth + 30) * (ind)) + this.midpt);
    }

};