web 动起来

 

var iChart=550,timeout,iDuration=100,t=0,c=500;

              var moveEl=Ext.get("idMove"),lineEl=Ext.get("idLine");

              var run=function(){

                  if(t<iDuration){t++;

                      moveEl.setLeft(Math.ceil(algorithm(t,0,c,iDuration)));

                      lineEl.setLeft(Math.ceil(Ext.lib.Easing.easeNone(t,0,iChart,iDuration)));

                      timeout=setTimeout(run,10);}

                     else{t=0;

                        moveEl.setLeft(c);

                        lineEl.setLeft(iChart);}}

                   var animal=function(){

                        moveEl.setLeft(0);

                        lineEl.setLeft(0);

                         clearTimeout(timeout);

                          run();}

 

proxy:animate({

              top:{from:b.y,to:b.y-20},

               left:{from:b.x,to:b.x-20},

              borderwidth:{from:0,to:10},

              opacity:{from:1,to:0},

              height:{from:b.height,to:b.height+20*scale},

              width:{from:b.width,to:b.width+20*scale}},

              o.duration||l,

               function(){

               proxy.remove();

              --count>0?animFn():el.afterFx(o);})

 

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

            animType=animType||'run',opt=opt||{};

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

                     this.dom,

                      args,

                   (opt.duration||defaultDur)||.35,

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

              function(){Ext.callback(cb,this);},this);

                 opt.anim=anim;

                  return anim;}

 

afterFx:function(o){

          if(o.afterStyle){this.applyStyles(o.afterStyle);}

          if(o.afterCls){ this.addClass(o.afterCls);}

          if(o.remove===true){this.remove();}

           Ext.callback(o.callback,o.scope,[this]);

          if(!o.concurrent){

                 this.fxQueue.shift();

                 this.nextFx();}}

 

queueFx: function(o,fn){

          var me=this;

           if(!me.fxQueue){me.fxQueue=[];}

           if(!me.hasFxBlock()){

                Ext.applyIf(o,me.fxDefaults);

               if(!o.concurrent){

                      var run=me.beforeFx(o);

                       fn.block=o.block;

                       this.fxQueue.push(fn);

                       if(run){me.nextFx();}}

                       else{fn.call(me);}}

                      return this;}

 

createCanvas:function(ct){

              this.ct=Ext.get(ct);

             if(!this.el){

                var canvas=document.createElement("canvas");

                  this.ct.dom.appendChild(canvas);

                  this.el=Ext.get(canvas);}

                this.el=Ext.get(this.el);

                this.el.setSize(w,h);

                this.canvas=Ext.getDom(this.el);

                this.el.position('absolute',this.zIndex);

                this.ctx=this.el.dom.getContext("2d");}

 

if(!window.CanvasRenderingContext2D){

         (function(){

              var m=Math,mr=m.round,ms=m.sin,mc=m.cos;

              var z=10,z2=z/2;

              var G_vmlCanvasManager_={

                   init: function (opt_doc){},

                   inti_:function(doc){}

                   fixElement_:function (el){ }

                   initElement:function(el){}

             function onPropertyChange(e){}

             function onResize(e){}

             G_vmlCanvasManager_.init();

             CanvasRenderingContext2D=CanvasRenderingContext2D_;

             CanvasGradient=CanvasGradient_;

             CanvasPattern=CanvasPattern_;

                 })();}

 

init_:functin(doc){

        if(doc.readyState=="complete"){

          if(!doc.namespaces[g_vml_"]){

                          doc.namespaces.add("g_vml_","urn:schemas-microsoft-com:wml");}

                 var ss=doc.createStyleSheet();

                 ss.cssText="canvas{display:inline-block:overflow:hidden;text-align:left;"

               +"width:300px;height:150px}g_vml_

     var (var i=0;i<els.length;i++)

           if(!els[i].getContext)this.initElement(els[i]);}}

 

initElement:function(el){

           el=this.fixElement_(el);

          if(this.context_){return this.context_;}

                      return this.context_=new CanvasRenderingContext2D_(this);

               el.attachEvent('onpropertychange',onPropertyChange);

              el.attachEvent('onresize',onResize);

                 var attrs=el.attributes;

              if(attrs.width&&attrs.width.specified){

                       el.style.width=attrs.width.nodeValue+"px"}

                 else {el.width=el.clientWidth;}

               if(attrs.height && attrs.height.specified){

                          el.style.height=attrs.height.nodeValue+"px";}

                else{el.height=el.clientHeight;}

             return el;}