MagicShow.prototype.appendimg = function(big, mid, small, img) {
    this.msBigImg.push(this.setimgrandom(big));
    this.msMidImg.push(this.setimgrandom(mid));
    this.msSmallImg.push(this.setimgrandom(small));
    this.msImg.push(this.setimgrandom(img));
};

MagicShow.prototype.deleteimg = function() {
    this.msBigImg = [];
    this.msMidImg = [];
    this.msSmallImg = [];
    this.msImg = [];
};

MagicShow.prototype.setimgrandom = function(imgurl) {
    return imgurl;// + "?rdnum=" + Math.random();
};

MagicShow.ImageFilter = function(){};
MagicShow.ImageFilter.timer = null;

MagicShow.ImageFilter.stop = function() {
    clearInterval(MagicShow.ImageFilter.timer);
    MagicShow.ImageFilter.timer = null;
    while (MagicShow.ImageFilter.AniNewObjs.length > 0) {
        obj = MagicShow.ImageFilter.AniNewObjs.pop();
        if (MagicShow.ImageFilter.OriObj && MagicShow.ImageFilter.OriObj.parentNode && MagicShow.ImageFilter.OriObj != obj)
            MagicShow.ImageFilter.OriObj.parentNode.removeChild(obj);
			
        if(MagicShow.msShowType.info.name!="TypeAb"){MagicShow.ImageFilter.AniOptions.pop();}//when TypeA don't filter
    }
    MagicShow.ImageFilter.OriObj = null;
};

MagicShow.ImageFilter.OriObj = null;
MagicShow.ImageFilter.AniNewObjs = [];
MagicShow.ImageFilter.AniOptions = [];

MagicShow.ImageFilter.show = function(obj, einfo, sinfo, duration, callback, tui, firstcallback) {

    if (tui != undefined) {
    	MagicShow.ImageFilter.OriObj = obj;

        MagicShow.debug(einfo.src + (tui ? " 左" : " 右") + "推 " + sinfo.src);

        obj1 = document.createElement("div");
        obj2 = document.createElement("img");
        obj.parentNode.appendChild(obj1);
        obj1.appendChild(obj2);

        obj1.style.position = "relative";
        //obj1.style.background = "no-repeat center center url(" + sinfo.src + ")";

        sinfo1 = {width: (einfo.width || obj.offsetWidth), height: (einfo.height || obj.offsetHeight), left: 0, top: 0 - (einfo.height || obj.offsetHeight)};
        einfo1 = {width: (einfo.width || obj.offsetWidth), height: (einfo.height || obj.offsetHeight), left: (einfo.width || obj.offsetWidth), top: 0 - (einfo.height || obj.offsetHeight)};

        if (tui === false) {
            sinfo.left = 0 - sinfo.left;
            einfo1.left = 0 - einfo1.left;
        }
		
		aaa1 = sinfo.imgwidth / sinfo1.width;
		aaa2 = sinfo.imgheight / sinfo1.height;
	
		aaa = Math.max(aaa1, aaa2);
		
		newWidth = parseInt(sinfo.imgwidth / aaa);
		newHeight = parseInt(sinfo.imgheight / aaa);
		if(sinfo.imgheight==0){newHeight=sinfo1.height;}
		
		obj2.style.height = newHeight + 'px';
		obj2.src = sinfo.src;

		if (newWidth < sinfo1.width)
			obj2.style.marginLeft = parseInt((sinfo1.width - newWidth) / 2) + "px";
		if (newHeight < sinfo1.height)
			obj2.style.marginTop = parseInt((sinfo1.height - newHeight) / 2) + "px";

        optall1 = MagicShow.ImageFilter.opts(obj1, einfo1, sinfo1, duration || 200);
        optall = MagicShow.ImageFilter.opts(obj, einfo, sinfo, duration || 200);

        MagicShow.ImageFilter.AniNewObjs.push(obj);
        if(MagicShow.msShowType.info.name!="TypeAb"){MagicShow.ImageFilter.AniOptions.push(optall);}

        MagicShow.ImageFilter.AniNewObjs.push(obj1);
        if(MagicShow.msShowType.info.name!="TypeAb"){MagicShow.ImageFilter.AniOptions.push(optall1);}

    } else {
        optall = MagicShow.ImageFilter.opts(obj, einfo, sinfo, duration || 200);
        MagicShow.ImageFilter.AniNewObjs.push(obj);
        if(MagicShow.msShowType.info.name!="TypeAb"){MagicShow.ImageFilter.AniOptions.push(optall);}
    }

	clearInterval(MagicShow.ImageFilter.timer);
	MagicShow.runCount = 0;
	MagicShow.ImageFilter.animate(MagicShow.ImageFilter.AniNewObjs, MagicShow.ImageFilter.AniOptions, callback);
	!firstcallback || firstcallback();
	
    MagicShow.ImageFilter.timer = setInterval(function(){MagicShow.ImageFilter.animate(MagicShow.ImageFilter.AniNewObjs, MagicShow.ImageFilter.AniOptions, callback);}, 10);
};

MagicShow.runCount = 0;
MagicShow.ImageFilter.animate = function(objs, optalls, callback) {
    var ballcomplete = true;
	
	MagicShow.runCount++;
    for (var i=0; i<objs.length; i++) {

        obj = objs[i];
        optall = optalls[i];
        for(var name in optall) {
            if (name != "width" && name != "height" && name != "left" && name != "top")
                continue;

            if (optall[name] == undefined) {
                optall[name] = {complete: true};
                continue;
            }

            if (optall[name].complete)
                continue;

            optall[name].c += optall[name].direct * optall[name].step;

            if (optall[name].direct == -1) {
                optall[name].c = Math.max(optall[name].c, optall[name].e);
            } else if (optall[name].direct == 1) {
                optall[name].c = Math.min(optall[name].c, optall[name].e);
            }

            obj.style[name] = parseInt(optall[name].c) + 'px';
            if (parseInt(optall[name].c) == optall[name].e)
                optall[name].complete = true;

            ballcomplete = ballcomplete && optall[name].complete;

        }
    }

    if (ballcomplete) {
        MagicShow.ImageFilter.stop();
        !callback || callback();
    }
};

MagicShow.ImageFilter.opts = function(obj, einfo, sinfo, duration) {
    sinfo = sinfo || {};
    optall = {};

    for(var name in einfo) {
        if (name != "width" && name != "height" && name != "left" && name != "top")
            continue;

        if (sinfo[name] == undefined) {
            sinfo[name] = parseFloat(obj.style[name].match(/^([\d+-.]+)(.*)$/)[1]);
        }

        optall[name] = {complete: false,
            s: sinfo[name],
            c: sinfo[name],
            e: einfo[name],
            step: Math.abs(einfo[name] - sinfo[name]) / Math.max(1, duration / 10),
            direct: (einfo[name] > sinfo[name] ? 1 : -1)};
    }


    return optall;
};