Mercurial > MadButterfly

comparison nodejs/animate.js @ 806:bf54c0408d35

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Use wall time to compute percentage of an animation action
author Thinker K.F. Li <thinker@codemud.net>
date Wed, 01 Sep 2010 18:03:45 +0800
parents ae2faf140dc2
children 9b6c26cf9102
comparison
equal deleted inserted replaced
805:ae2faf140dc2 806:bf54c0408d35
6 * This is configuration for animate module. For slower or speeder 6 * This is configuration for animate module. For slower or speeder
7 * machines, ffs can be decreased or increased respective. 7 * machines, ffs can be decreased or increased respective.
8 */ 8 */
9 var ffs = 20; 9 var ffs = 20;
10 var frame_interval = 1000 / ffs; 10 var frame_interval = 1000 / ffs;
11 var tm_flag = 1;
12 11
13 function linear_draw() { 12 function linear_draw() {
14 var percent; 13 var percent;
15 14
16 this.percent = this.percent + this.step; 15 percent = (Date.now() - this._start_tm) / this.duration;
17 percent = this.percent;
18 if (percent > 1) percent = 1;
19
20 this.c++;
21 if(percent >= 1) { 16 if(percent >= 1) {
17 percent = 1;
18
22 this.obj.timer.stop(); 19 this.obj.timer.stop();
23 delete this.obj.timer; 20 delete this.obj.timer;
24 sys.puts(this.c);
25 sys.puts(Date.now() - this._start_tm);
26 } 21 }
27 22
28 this.obj[2] = (this.targetx-this.startposx)*percent+this.startposx; 23 this.obj[2] = (this.targetx-this.startposx)*percent+this.startposx;
29 this.obj[5] = (this.targety-this.startposy)*percent+this.startposy; 24 this.obj[5] = (this.targety-this.startposy)*percent+this.startposy;
30 this.app.refresh(); 25 this.app.refresh();
31 if(tm_flag) {
32 var self = this;
33 if(percent < 1)
34 this.obj.timer = setTimeout(function() { self.draw(); }, frame_interval);
35 }
36 } 26 }
37 27
38 function linear_draw_start() { 28 function linear_draw_start() {
39 var obj = this.obj; 29 var obj = this.obj;
40 var self = this; 30 var self = this;
42 if(obj.timer) 32 if(obj.timer)
43 obj.timer.stop(); 33 obj.timer.stop();
44 34
45 this.startposx = obj[2]; 35 this.startposx = obj[2];
46 this.startposy = obj[5]; 36 this.startposy = obj[5];
47 this.c = 0;
48 this.step = 1000 / (this.duration * ffs);
49 this.percent = 0;
50 this._start_tm = Date.now(); 37 this._start_tm = Date.now();
51 if(tm_flag == 1) 38 obj.timer = setInterval(function() { self.draw(); }, frame_interval);
52 obj.timer = setTimeout(function() { self.draw(); }, frame_interval);
53 else
54 obj.timer = setInterval(function() { self.draw(); }, frame_interval);
55 } 39 }
56 40
57 function linear(app,obj,shiftx,shifty,duration) { 41 function linear(app,obj,shiftx,shifty,duration) {
58 obj.animated_linear = this; 42 obj.animated_linear = this;
59 this.app = app; 43 this.app = app;
71 /* ------------------------------------------------------------ */ 55 /* ------------------------------------------------------------ */
72 function rotate(app, obj, ang, duration) { 56 function rotate(app, obj, ang, duration) {
73 this._app = app; 57 this._app = app;
74 this._obj = obj; 58 this._obj = obj;
75 this._ang = ang; 59 this._ang = ang;
76 this._duration = duration; 60 this._duration = duration * 1000;
77 } 61 }
78 62
79 function rotate_start() { 63 function rotate_start() {
80 var obj = this._obj; 64 var obj = this._obj;
81 var self = this; 65 var self = this;
82 66
83 this._step = 1 / (ffs * this._duration);
84 this._percent = 0;
85 this._start_mtx = [obj[0], obj[1], obj[2], obj[3], obj[4], obj[5]]; 67 this._start_mtx = [obj[0], obj[1], obj[2], obj[3], obj[4], obj[5]];
68 this._start_tm = Date.now();
86 obj.timer = setInterval(function() { self.draw(); }, frame_interval); 69 obj.timer = setInterval(function() { self.draw(); }, frame_interval);
87 } 70 }
88 71
89 function rotate_draw() { 72 function rotate_draw() {
90 var percent; 73 var percent;
91 var ang; 74 var ang;
92 var sv, cv; 75 var sv, cv;
93 var obj = this._obj; 76 var obj = this._obj;
94 var mtx, shift; 77 var mtx, shift;
95 78
96 this._percent = percent = this._percent + this._step; 79 percent = (Date.now() - this._start_tm) / this._duration;
97 if(percent > 1) { 80 if(percent >= 1) {
98 percent = 1; 81 percent = 1;
99 obj.timer.stop(); 82 obj.timer.stop();
100 } 83 }
101 84
102 ang = percent * this._ang; 85 ang = percent * this._ang;