var JA_RSSLIDER = new Class({
    options: {
        w: 100,
        h: 200,
        num_elem: 4,
        total: 0,
        url: '',
        mode: 'horizontal',
        direction: 'right',
        wrapper: 'ja-slide-wrapper',
        duration: 1000,
        interval: 3000,
        auto: 1
    },

    initialize: function(options) {
        this.options = options;
        if (this.options.total) {
            if (this.options.total < this.options.num_elem) this.options.num_elem = this.options.total;
            this.elements = new Array(this.options.total);
        } else
            this.elements = new Array();

        this.current = 0;
        $(this.options.wrapper).setStyle('position', 'relative');
        $(this.options.wrapper).setStyle('overflow', 'hidden');
        if (this.options.mode == 'virtical') {
            $(this.options.wrapper).setStyle('width', this.options.w);
            $(this.options.wrapper).setStyle('height', this.options.h * this.options.num_elem);
        } else {
            this.options.w = this.options.w + this.options.paddingThumb;
            $(this.options.wrapper).setStyle('width', this.options.w * this.options.num_elem);
            $(this.options.wrapper).setStyle('height', this.options.h);
        }

        this.objs = new Array();
        this.objs[0] = document.getElementById("ja-rsslidescroll_1");
        this.objs[1] = document.getElementById("ja-rsslidescroll_2");

        this.img = new Element('img');
        this.img.setProperty('id', 'ja-rsslideimg-full');

        this.ef_u = {};
        this.ef_d = {};
        this.ef_l = {};
        this.ef_r = {};
        for (i = 0; i <= this.options.num_elem; i++) {
            this.ef_u[i] = { 'top': [i * this.options.h, (i - 1) * this.options.h] };
            this.ef_d[i] = { 'top': [(i - 1) * this.options.h, i * this.options.h] };
            this.ef_l[i] = { 'left': [i * this.options.w, (i - 1) * this.options.w] };
            this.ef_r[i] = { 'left': [(i - 1) * this.options.w, i * this.options.w] };
        }
    },

    getFx: function() {
        if (this.options.mode == 'virtical') {
            if (this.options.direction == 'up') {
                return this.ef_u;
            } else {
                return this.ef_d;
            }
        } else {
            if (this.options.direction == 'left') {
                return this.ef_l;
            } else {
                return this.ef_r;
            }
        }
    },

    add: function(text) {
        var divobj = new Element('DIV', { 'id': 'jsslide_' + this.elements.length, 'class': 'jsslide' });
        divobj.innerHTML = text;
        divobj.setStyle('position', 'absolute');
        divobj.setStyle('width', this.options.w);
        divobj.setStyle('height', this.options.h);
        if (this.elements.length > 1) {
            divobj.injectAfter(this.elements[this.elements.length - 2]);
        } else {
            divobj.inject($(this.options.wrapper));
        }
        this.hide(divobj);
        this.elements.push(divobj);
    },

    //Update element i
    update: function(text, ind) {
        divobj = new Element('DIV', { 'id': 'jsslide_' + ind, 'class': 'jsslide' });
        divobj.innerHTML = text;
        divobj.setStyle('position', 'absolute');
        divobj.setStyle('width', this.options.w);
        //divobj.setStyle('height', this.options.h);
        divobj.inject($(this.options.wrapper));
        this.hide(divobj);
        this.elements[ind] = divobj;
    },

    hide: function(el) {
        if (this.options.mode == 'virtical') {
            el.setStyle('top', '-999em');
            el.setStyle('left', '0');
        } else {
            el.setStyle('top', '0');
            el.setStyle('left', '-999em');
        }
    },

    setPos: function(elems) {
        if (!elems) elems = this.getRunElems();
        for (var i = 0; i < elems.length; i++) {
            var el = elems[i];
            if (el) {
                if (this.options.mode == 'virtical') {
                    if (this.options.direction == 'up') {
                        el.setStyle('top', this.options.h * i);
                    } else {
                        el.setStyle('top', this.options.h * (i - 1));
                    }
                } else {
                    if (this.options.direction == 'left') {
                        el.setStyle('left', this.options.w * i);
                    } else {
                        el.setStyle('left', this.options.w * (i - 1));
                    }
                }
            }
        }
    },

    getRunElems: function() {
        var objs = new Array();
        if (this.options.direction == 'left' || this.options.direction == 'up') {
            adj = 0;
        } else {
            adj = this.elements.length - 1;
        }
        for (var i = 0; i <= this.options.num_elem; i++) {
            objs[i] = this.elements[(this.current + i + adj) % this.elements.length];
        }
        if (this.options.total <= this.options.num_elem) {
            if (this.options.direction == 'left' || this.options.direction == 'up') {
                objs[this.options.num_elem] = null;
            } else {
                objs[0] = null;
            }
        }
        return objs;
    },

    start: function() {
        this.clearTimeOut();
        if (!this.elements[this.next()]) {
            this.nextRun();
            return;
        }
        if (this.elements[this.next()] == 'fetching') {
            this.nextRun();
            return;
        }
        if (this.running) return;
        this.running = 1;

        var objs = this.getRunElems();
        this.setPos(objs);
        this.x = new Fx.Elements(objs, { duration: this.options.duration, onComplete: this.end.bind(this) });
        this.x.start(this.getFx());
        this.current = this.nextCurr();
        this.onChangeImage(this.current);
    },
    startExt: function() {
        this.clearTimeOut();
        if (!this.elements[this.next()]) {
            this.nextRun();
            return;
        }
        if (this.elements[this.next()] == 'fetching') {
            this.nextRun();
            return;
        }
        if (this.running) return;
        this.running = 1;

        var objs = this.getRunElems();
        this.setPos(objs);
        this.x = new Fx.Elements(objs, { duration: this.options.duration, onComplete: this.end.bind(this) });
        this.x.start(this.getFx());
        this.current = this.nextCurr();
        this.onChangeImage(this.current);
    },

    end: function() {
        this.running = 0;
        if (this.onchange) {
            this.timeOut = setTimeout(this.end.bind(this), 100);
        }
        else {
            this.nextRun();
        }
        window.fireEvent('changeImg');
    },

    clearTimeOut: function() {
        if (this.timeOut) {
            clearTimeout(this.timeOut);
            this.timeOut = 0;
        }
    },

    nextRun: function() {
        this.clearTimeOut();
        if (this.options.total <= this.options.num_elem) return;
        if (this.options.auto) {
            this.timeOut = setTimeout(this.start.bind(this), this.options.interval);
            this.fetchNext();
        }
    },
    nextRunExt: function() {
        this.clearTimeOut();
        if (this.options.total <= this.options.num_elem) return;
        if (this.options.auto) {
            this.timeOut = setTimeout(this.start.bind(this), this.options.interval);
            this.fetchNext();
        }
    },

    nextCurr: function() {
        var next = 0;
        if (this.options.direction == 'left' || this.options.direction == 'up') {
            next = (this.current + 1) % this.elements.length;
        } else {
            next = (this.current + this.elements.length - 1) % this.elements.length;
        }
        return next;
    },

    next: function() {
        var next = 0;
        if (this.options.direction == 'left' || this.options.direction == 'up') {
            next = (this.current + this.options.num_elem) % this.elements.length;
        } else {
            next = (this.current + this.elements.length - 1) % this.elements.length;
        }
        return next;
    },

    fetchNext: function() {
        var next = this.next();
    },

    fetchUpdate: function(text, next) {
        this.update(text, next);
    },

    onChangeImage: function(idactive) {

      
        if (!this.options.mouseis) {
            $('jsslide_' + this.options.active).removeClass('active');
            this.options.active = idactive;
            $('jsslide_' + idactive).addClass('active');
            //$('ja-rsslideimg-full').src = $('img_rsslide_id_' + idactive).src;
            this.bigImage(idactive);
        }
    },

    bigImage: function(idactive) {
        if (!this.onchange) {


            this.onchange = 1;
            this.objs[1].style.Opacity = 0;
            //var nameimg = $('img_rsslide_id_' + idactive).alt;
            var nameimg = document.getElementById('img_rsslide_id_' + idactive).getAttribute('fullImage');
            var alt = document.getElementById('img_rsslide_id_' + idactive).alt;
            // alert(alt);
            document.getElementById('ctl00_phdLeftContent_Usc_Gallery1_divDesImg').innerHTML = alt;
            if (this.options.lightbox) {
                text = '<a onclick="return hs.expand(this, {captionId: \'caption1\'})" href="' + this.options.url[idactive] + '" class="ja_rsslide_link" id="ja_rsslide_link_' + idactive + '"><img width="511" height="299" src="' + this.options.livesite + '/' + this.options.folder + nameimg + '" width="' + this.options.bw + '"  alt="' + alt + '" title="' + alt + '" /></a>';
            }
            else {
                text = '<img alt="' + alt + '" title="' + alt + '"  width="511" height="299" src="' + this.options.livesite + '/' + this.options.folder + nameimg + '" width="' + this.options.bw + '" />';
            }
            this.objs[1].innerHTML = text;
            xbi = new Fx.Elements(this.objs, { wait: false, duration: this.options.bigduration, onComplete: this.animation2.bind(this, this.objs) });
            ef = {};
            ef[0] = { 'opacity': [1, 0] };
            ef[1] = { 'opacity': [0, 0] };
            xbi.start(ef);
        }
        //initLightbox();//canh added
        return false;
    },


    animation2: function() {
        this.objs[1].style.display = "block";
        xbi = new Fx.Elements(this.objs, { wait: false, duration: this.options.bigduration, onComplete: this.swap.bind(this, this.objs) });
        ef = {};
        ef[0] = { 'opacity': [0, 0] };
        ef[1] = { 'opacity': [0, 1] };
        xbi.start(ef);
        return false;
    },

    swap: function() {
        term = this.objs[0];
        this.objs[0] = this.objs[1];
        this.objs[1] = term;
        this.onchange = 0;
    },

    setDirection: function(direction) {
        this.options.direction = direction;
    }


});