网页动画2

function correctFrame(tween){

    var frame=tween.totalFrames,

        frame=tween.curFrame,

       duration=tween.dur,

        expected=(frame*duration*1000/frames),

        elapsed=(new Date()-tween.startTime),

         tweak=0;

      if (elapsed<duration*1000)

             tweak=Math.round(elapsed/expected-1)*frame);

         else tweak=frames-(frame+1);

     if (tweak>0 && isFinite(tweak)){

           if (frame+tweak>=frames) tweak=frames-(frame+1);

           tween.currFrame+=tweak; }}

 

animate:function(args,duration,onComplete,easing,animType){

             this.anim(args,{duration:duration,

                                callback:complete,easing:easing},animType);

              return this;},

 

anim:function(args,opt,animType,defaultDur,defaultEase,cb){

     animType=animType||

      opt=opt||{};

        var anim=Ext.lib.Anim[animType](

               this.dom,args,(opt.duration||defaultDur)||.35,

              opt.easing||defaultEase)||'easeOut',

          function(){

              Ext.callback(cb,this);

              Ext.callback(opt.callback,opt.scope||this,[this,opt]);}this};

           opt.anim=anim;

          return anim;}

 

Ext.lib.AnimBase=function(el,attributes,duration,method){

              if(el) { this.init(el,attributes,duration,method);}};

      Ext.lib.AnimBase.prototype={

             doMethod:function(attr,start,end){

             setAttr: function(attr,val,unit){

              getAttr:function(attr){

              setRunAttr:function(attr){

              init:function(el,attribute,duration,method){  }

 

EXTLIB: Anim={

           motion:function(el,args,duration,easing,cb,scope){

               return this.run(el,args,duration,easing,cb,scope,EXTLIB.Motion);}

run:function(el,args,duration,easing,cb,scope,type){

                type=type||EXTLIB.AnimBase;

              var anim=new type(el,args,duration,EXTLIB,Easing[easing]||easing);

               anim.animate(function(){if(cb)cb.call(scope);});

               return anim;}};

init:function(el,attribute,duration,method){

               var me=this,actualFrames=0,ease=EXTLIB,Easing,anmgr=EXTLIB,AnimMgr;

                me.attrs=attribute||{};

                me.dur=duartion||1;

                me.method=method||ease.easeNone;

                me.useSec=true;

                 me.curFrame=0;

                  me.totalFrame=anmgr.fps;

                  me.el=Ext.getDom(el);

                   me.isAnimated=false;

                   me.startTime=null;

                   me.runAttrs={};

                   me.animate=function(callback,scope){}

                   me.stop=function(finish){}

                    function onStart(){}

                    function onTween(){}

                    function onComplete(){}

                    me.onStart=new Ext.util.Event(me);

                    me.onTween=new Ext.util.Event(me);

                    me.onComplete=new Ext.util.Event(me);

                        (me._onStart=new Ext.util.Event(me).addListener(onStart);

                        (me._onTween=new Ext.util.Event(me).addListener(onTween);

                        (me._onComplete=new Ext.util.Event(me)).addListener(onComplete);}

 

me.animate=function(callback,scope){

           function f(){

                 var me=this;

                  me.onComplete.removeListener(f);

                if(typeof callback=="function"){callback.call(scope||me,me);}};

             var me=this;

              me.onComplete.addListener(f,me);

              me.curFrame=0;

              me.totalFrames=(me.useSec)?Math.ceil(anmgr,fps*duration):duration;

              if(!me.isAnimated)anmgr.registerElement(me);

                }

 

function onStart(){

            me.onStart.fire();

            me.runAttrs={};

          for (var attr in me.attrs){me.setRunAttr(attr);}

             me.isAnimated=!!(me.startTime=new Date());

             acturalFrames=0;}

 

setRunAttr:function(attr){

           var me=this,isEmpty=Ext.isEmpty,

               a=me.attrs[attr],

                unit=a.unit,

                 by=a.by,

                from=a.from,

                to=a.to,

                ra=(me.runAttrs[attr]={}),

                start, end;

         if(isEmpty(to)&& isEmpty(by)) return false;

             start=!isEmpty(from)?from:me.getAttr(attr);

              end=!isEmpty(to)?to:[];

         if(!isEmpty(by)){

                if(Ext.isArray(start)){

                     Ext.each(start,function(v,i,s){end[i]=v+by[i];});}

                 else end=start+by;}

                 ra.start=start;ra.end=end;

                 ra.unit=!isEmpty(unit)?unit:(defaultUnitRE.test(attr)?'px':'');}

 

function onTween(){

           me.onTween.fire({

                      duratin:new Date()-me.startTime,

                      curFrame:me.curFrame});

             for (var attr in me.runAttrs){

                     var ra=me.runAttrs[attr];

                   me.setAttr(attr,me.doMethod(attr,ra.start,ra.end),ra.unit);}

                 actualFrames++;};

 

setRunAttr:function(attr){

              var me=this,isEmpty=Ext.isEmpty;

              superclass.setRunAttr.call(me,attr);

              if(colorRE.test(attr)){

                      var attribute=me.attrs[attr],

                              ra=me.runAttrs[attr],

                            start=parseColor(ra.start),

                             end=parseColor(ra.end);

              if(isEmpty(attribute.to)&&!isEmpty(attribute.by)){

                          end=parseColor(attribute.by);

                       Ext.each(start,function(v,i){end[i]=v+end[i];});}

                 ra.start=start;

                 ra.end=end;}}

 

doMethod:function(attr,start,end){

               var me=this,val,floor=Math.floor;

               if(colorRE.test(attr)){

                       val=[];

                       Ext.each(start,function(v,i){

                           val[i]=superclass.doMethod.call(me,attr,v,end[i]);});

                            val='rgb('+floor(val[o])+','+floor(val[l])+','+floor(val[2])+')';}

                            else{val=superclass.doMethod.call(me,attr,start,end);}

                            return val;}

 

setRunAttr:function(attr){

              var me=this;

            if(pointsRE.test(attr)){

              var el=me.el,attrs=me.attrs,

                   points=attrs.points,

                    control=points.control||[],

                     runAttrs=me.runAttrs,getXY=EXTLIB.Dom.getXY,

                     from=attrs.points.from||getXY(el),start;

 function translateValues(val,start,to){

               var pageXY =to?getXY(me.el):[0,0];

                return val?[(val[0]||0)-pageXY[0]+start[0],

                        (val[l]||0)-pageXY[l]+start[l]]:null;}

              control=typeof control=="string"?[control]:Ext.toArray(control);

            Ext.fly(el,'_anim').position();

             EXTLIB.Dom.SetXY(el,from);

              runAttrs[attr]=[start=me.getAttr('points')].concat(control);

            runAttrs[attr].push(

                      translateValues(points.to||point.by||null,start,!Ext.isEmpty(points.to)));}

               else{

                  superclass.setRunAttr.call(me,attr);}}

                   

                         

     

 

           

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值