function $S(iterable) {
    var results = [];
    for (var i = 0; i < iterable.length; i++) results.push(iterable[i]);
    return results;
}
Function.prototype.SBind = function() {
    var __method = this, args = $S(arguments), object = args.shift();
    return function() {
        return __method.apply(object, args.concat($S(arguments)));
    }
};

function Focus() { this.initialize.apply(this, arguments) };
Focus.prototype = {
    initialize: function(imgObj, focus, tim, speed) {
        this.imgs = imgObj;
        this.tim = tim * 1000 || 2000;
        this.speed = speed || 0.3;
        this.img_m = null; // 大图
        this.img_m2 = null; // 大图2
        this.lis = []; // 小图列表
        this.mask = null; // 蒙板
        this.title = null; // 标题
        this.con = null; // 内容
        this.cur = 0; // 当前位置
        this.t = null; // 整体计时
        this.tm = null; // mask位置
        this.ti = null; // img 切换
        this.stoped = true; // 停止状态
        this.tem = 0; // 临时数据
        this.loaded = { imgs: [], num: 0 }; // 加载进度
        this.count = null;
        this.getElement(document.getElementById(focus));
        this.preload();
    },
    preload: function() {
        for (var i = 0; i < this.imgs.length; i++) {
            this.loaded.imgs[i] = new Image();
            this.loaded.imgs[i].onload = this.load_num.SBind(this);
            this.loaded.imgs[i].src = this.imgs[i].max;
            
        }
        this.count = document.getElementById("li_cur_total");
        this.count.innerHTML = "1/" + this.imgs.length;
    },
    load_num: function() {
        this.loaded.num++;
        if (this.loaded.num == this.imgs.length)
            this.start();
    },
    getElement: function(focus) { // 获得蒙板，小图列表，标题/内容容器等。。。
        var ds = focus.getElementsByTagName('div');
        for (var i = 0; i < ds.length; i++)
            switch (ds[i].className) {
            case 'f_img_roll':
                this.img_m = document.createElement('img');
                this.img_m2 = document.createElement('img');
                this.img_m.alt = this.imgs[0].con;
                this.img_m2.alt = this.imgs[0].con;
                this.img_m.title = this.imgs[0].con;
                this.img_m2.title = this.imgs[0].con;
                this.img_m.src = this.imgs[0].max;
                this.img_m.style.zIndex = 11;
                this.img_m2.style.zIndex = 10;
                ds[i].onmouseover = this.stop.SBind(this);
                ds[i].onmouseout = this.start.SBind(this);
                ds[i].appendChild(this.img_m);
                ds[i].appendChild(this.img_m2);
                this.img_m.style.cursor = "pointer";
                var xurl = this.imgs[0].url;
                var xobj = this.img_m;
                (function() {
                    xobj.onclick = function() {
                        window.open(xurl);
                    };
                })();
            case 'f_img_tree':
                var oThis = this;
                var ul = document.createElement('ul');
                var li = document.createElement("li");
                var sp_count = document.createElement("span");
                sp_count.id = "li_cur_total";
                sp_count.innerHTML = "";
                li.appendChild(sp_count);
                ul.appendChild(li);
                var li = document.createElement("li");
                var img_b = document.createElement('img');
                img_b.src = "images/bctrl.gif";
                img_b.style.cursor = "pointer";
                img_b.onclick = function() {
                    oThis.cur--;
                    if (oThis.cur < 0) oThis.cur = oThis.imgs.length - 1;
                    oThis.img_swap.apply(oThis, [oThis.cur]);
                };
                li.appendChild(img_b);
                ul.appendChild(li);
                var li = document.createElement("li");
                img_b = document.createElement('img');
                img_b.src = "images/play.gif";
                img_b.style.cursor = "pointer";
                img_b.onclick = function() {
                    if (!oThis.stoped) {
                        oThis.stop.apply(oThis);
                    }
                    else {
                        oThis.start.apply(oThis);
                    }
                };
                li.appendChild(img_b);
                ul.appendChild(li);
                var li = document.createElement("li");
                img_b = document.createElement('img');
                img_b.src = "images/fctrl.gif";
                img_b.style.cursor = "pointer";
                img_b.onclick = function() {
                    if (oThis.cur == oThis.imgs.length) oThis.cur = 0;
                    oThis.img_swap.apply(oThis);
                };
                li.appendChild(img_b);
                ul.appendChild(li);
                ds[i].appendChild(ul);
                break;
            case 'con':
                this.con = ds[i];
                this.con.innerHTML = this.imgs[0].con;
                break;
        }
    },

    nextFrame: function(n) {
        if (this.t) clearTimeout(this.t);
        if (this.tm) clearInterval(this.tm);
        if (this.ti) clearInterval(this.ti);
        if (n) this.cur = n - 1;
        var left = 0, posTo = 0;
        if (n != 0 && this.imgs[this.cur + 1]) {
            posTo = this.lis[this.cur + 1].offsetLeft + this.lis[0].parentNode.offsetLeft;
            this.cur = this.cur + 1;
        } else {
            posTo = this.lis[0].offsetLeft + this.lis[0].parentNode.offsetLeft;
            this.cur = 0;
        }
        this.tem = this.mask.offsetLeft;
        this.tem > posTo ? left = 1 : left = 0;
        this.tm = setInterval(this.moveTo.SBind(this, left, posTo), 25);
        document.getElementById("li_cur_total").innerHTML = this.cur + "/" + this.imgs.length;
    },

    moveTo: function(left, posTo) {
        if (!left) {
            if ((this.tem + 2) >= posTo + 1) {
                clearInterval(this.tm);
                this.mask.style.left = posTo + 'px';
                this.img_swap();
                return;
            }
            this.tem += (posTo - this.tem) * this.speed
        } else {
            if ((this.tem - 2) <= posTo - 1) {
                clearInterval(this.tm);
                this.mask.style.left = posTo + 'px';
                this.img_swap();
                return;
            }
            this.tem -= (this.tem - posTo) * this.speed;
        }
        this.mask.style.left = this.tem + 'px';
    },
    img_swap: function(x) {
        var t, b;
        if (x == null)
            this.cur++;
        else
            this.cur = x;
        if (this.cur == this.imgs.length) this.cur = 0;
        if (this.cur < 0) this.cur = this.imgs.length - 1;
        if (this.img_m.style.zIndex > this.img_m2.style.zIndex) {
            t = this.img_m;
            b = this.img_m2;
        } else {
            t = this.img_m2;
            b = this.img_m;
        }

        b.style.cursor = "pointer";
        var xurl = this.imgs[this.cur].url;
        var xobj = b;
        (function() {
            xobj.onclick = function() {
                window.open(xurl);
            };
        })();
        
        var span_show = (this.cur + 1 + "/" + this.imgs.length);
        this.con.innerHTML = this.imgs[this.cur].con;
        this.count.innerHTML = span_show;
        b.src = this.imgs[this.cur].max;
        /MSIE/.test(navigator.userAgent) ?
		this.tem = t.style.filter ? t.style.filter.replace(/^.+=(\d+).+$/, '$1') : 100
		: this.tem = t.style.opacity ? t.style.opacity * 100 : 100;
        if (this.ti) clearInterval(this.ti);
        this.ti = setInterval(this.img_hid.SBind(this, t, b), 25);
    },
    img_hid: function(t, b) {
        this.tem -= 7;
        if (/MSIE/.test(navigator.userAgent))
            t.style.filter = 'alpha(opacity=' + this.tem + ')';
        else
            t.style.opacity = this.tem / 100;
        if (this.tem <= 0) {
            clearInterval(this.ti);
            var tz = t.style.zIndex;
            var bz = b.style.zIndex;
            t.style.zIndex = bz
            b.style.zIndex = tz;
            if (/MSIE/.test(navigator.userAgent))
                t.style.filter = 'alpha(opacity=100)';
            else
                t.style.opacity = 1;
            if (this.stoped) return;
            this.start(); // 继续循环this.nextFrame.SBind(this, null)
        }
    },
    start: function() {
        if (this.t) clearTimeout(this.t);
        if (!this.cur) this.cur = 0;
        this.t = setTimeout(this.img_swap.SBind(this, null), this.tim);
        this.stoped = false;
    },
    stop: function() {
        clearTimeout(this.t);
        this.stoped = true;
    }
}