1 <html><head><title>Roo/lib/AnimBase.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
2 * Portions of this file are based on pieces of Yahoo User Interface Library
3 * Copyright (c) 2007, Yahoo! Inc. All rights reserved.
4 * YUI licensed under the BSD License:
5 * http://developer.yahoo.net/yui/license.txt
6 * <script type="text/javascript">
10 </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
11 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">libFlyweight</span><span class="jsdoc-syntax">;
13 </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">) {
14 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">libFlyweight</span><span class="jsdoc-syntax">) {
15 </span><span class="jsdoc-var">libFlyweight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Element.Flyweight</span><span class="jsdoc-syntax">();
17 </span><span class="jsdoc-var">libFlyweight.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
18 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">libFlyweight</span><span class="jsdoc-syntax">;
21 </span><span class="jsdoc-comment">// since this uses fly! - it cant be in DOM (which does not have fly yet..)
25 </span><span class="jsdoc-var">Roo.lib.AnimBase </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">method</span><span class="jsdoc-syntax">) {
26 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">) {
27 </span><span class="jsdoc-var">this.init</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">method</span><span class="jsdoc-syntax">);
31 </span><span class="jsdoc-var">Roo.lib.AnimBase.fly </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">fly</span><span class="jsdoc-syntax">;
35 </span><span class="jsdoc-var">Roo.lib.AnimBase.prototype </span><span class="jsdoc-syntax">= {
37 </span><span class="jsdoc-var">toString</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
38 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getEl</span><span class="jsdoc-syntax">();
39 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.id </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">el.tagName</span><span class="jsdoc-syntax">;
40 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"Anim " </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">);
43 </span><span class="jsdoc-var">patterns</span><span class="jsdoc-syntax">: {
44 </span><span class="jsdoc-var">noNegatives</span><span class="jsdoc-syntax">: /width|height|opacity|padding/i,
45 </span><span class="jsdoc-var">offsetAttribute</span><span class="jsdoc-syntax">: /^((width|height)|(top|left))$/,
46 </span><span class="jsdoc-var">defaultUnit</span><span class="jsdoc-syntax">: /width|height|top$|bottom$|left$|right$/i,
47 </span><span class="jsdoc-var">offsetUnit</span><span class="jsdoc-syntax">: /\d+(em|%|en|ex|pt|in|cm|mm|pc)$/i
51 </span><span class="jsdoc-var">doMethod</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">) {
52 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.method</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.currentFrame</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">end </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.totalFrames</span><span class="jsdoc-syntax">);
56 </span><span class="jsdoc-var">setAttribute</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">unit</span><span class="jsdoc-syntax">) {
57 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.patterns.noNegatives.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">)) {
58 </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">> 0) ? </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">: 0;
61 </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getEl</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-string">'_anim'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">unit</span><span class="jsdoc-syntax">);
65 </span><span class="jsdoc-var">getAttribute</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">) {
66 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getEl</span><span class="jsdoc-syntax">();
67 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">);
69 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-string">'auto' </span><span class="jsdoc-syntax">&& !</span><span class="jsdoc-var">this.patterns.offsetUnit.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">)) {
70 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">parseFloat</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">);
73 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.patterns.offsetAttribute.exec</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">) || [];
74 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= !!( </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[3] );
75 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">= !!( </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[2] );
78 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">|| (</span><span class="jsdoc-var">fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'absolute' </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">)) {
79 </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'offset' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.charAt</span><span class="jsdoc-syntax">(0)</span><span class="jsdoc-var">.toUpperCase</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.substr</span><span class="jsdoc-syntax">(1)];
80 } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
81 </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">= 0;
84 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">;
88 </span><span class="jsdoc-var">getDefaultUnit</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">) {
89 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.patterns.defaultUnit.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">)) {
90 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'px'</span><span class="jsdoc-syntax">;
93 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
96 </span><span class="jsdoc-var">animateX </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">) {
97 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">f </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
98 </span><span class="jsdoc-var">this.onComplete.removeListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">);
99 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">callback </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"function"</span><span class="jsdoc-syntax">) {
100 </span><span class="jsdoc-var">callback.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
103 </span><span class="jsdoc-var">this.onComplete.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
104 </span><span class="jsdoc-var">this.animate</span><span class="jsdoc-syntax">();
108 </span><span class="jsdoc-var">setRuntimeAttribute</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">) {
109 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">;
110 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">;
111 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">attributes </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.attributes</span><span class="jsdoc-syntax">;
113 </span><span class="jsdoc-var">this.runtimeAttributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">] = {};
115 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">isset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">) {
116 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">);
119 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">isset</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'to'</span><span class="jsdoc-syntax">]) && !</span><span class="jsdoc-var">isset</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'by'</span><span class="jsdoc-syntax">])) {
120 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
123 </span><span class="jsdoc-var">start </span><span class="jsdoc-syntax">= ( </span><span class="jsdoc-var">isset</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'from'</span><span class="jsdoc-syntax">]) ) ? </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'from'</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">this.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">);
126 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">isset</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'to'</span><span class="jsdoc-syntax">])) {
127 </span><span class="jsdoc-var">end </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'to'</span><span class="jsdoc-syntax">];
128 } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">isset</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'by'</span><span class="jsdoc-syntax">])) {
129 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">start.constructor </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">) {
130 </span><span class="jsdoc-var">end </span><span class="jsdoc-syntax">= [];
131 </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">len </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">start.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">len</span><span class="jsdoc-syntax">; ++</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) {
132 </span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'by'</span><span class="jsdoc-syntax">][</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
134 } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
135 </span><span class="jsdoc-var">end </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">start </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'by'</span><span class="jsdoc-syntax">];
139 </span><span class="jsdoc-var">this.runtimeAttributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.start </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">;
140 </span><span class="jsdoc-var">this.runtimeAttributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.end </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">;
143 </span><span class="jsdoc-var">this.runtimeAttributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.unit </span><span class="jsdoc-syntax">= ( </span><span class="jsdoc-var">isset</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.unit</span><span class="jsdoc-syntax">) ) ? </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'unit'</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">this.getDefaultUnit</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">);
147 </span><span class="jsdoc-var">init</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">attributes</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">method</span><span class="jsdoc-syntax">) {
149 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">isAnimated </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
152 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">startTime </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
155 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">actualFrames </span><span class="jsdoc-syntax">= 0;
158 </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
161 </span><span class="jsdoc-var">this.attributes </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">attributes </span><span class="jsdoc-syntax">|| {};
164 </span><span class="jsdoc-var">this.duration </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">duration </span><span class="jsdoc-syntax">|| 1;
167 </span><span class="jsdoc-var">this.method </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">method </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.lib.Easing.easeNone</span><span class="jsdoc-syntax">;
170 </span><span class="jsdoc-var">this.useSeconds </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
173 </span><span class="jsdoc-var">this.currentFrame </span><span class="jsdoc-syntax">= 0;
176 </span><span class="jsdoc-var">this.totalFrames </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.AnimMgr.fps</span><span class="jsdoc-syntax">;
179 </span><span class="jsdoc-var">this.getEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
180 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
184 </span><span class="jsdoc-var">this.isAnimated </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
185 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">isAnimated</span><span class="jsdoc-syntax">;
189 </span><span class="jsdoc-var">this.getStartTime </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
190 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">startTime</span><span class="jsdoc-syntax">;
193 </span><span class="jsdoc-var">this.runtimeAttributes </span><span class="jsdoc-syntax">= {};
196 </span><span class="jsdoc-var">this.animate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
197 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isAnimated</span><span class="jsdoc-syntax">()) {
198 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
201 </span><span class="jsdoc-var">this.currentFrame </span><span class="jsdoc-syntax">= 0;
203 </span><span class="jsdoc-var">this.totalFrames </span><span class="jsdoc-syntax">= ( </span><span class="jsdoc-var">this.useSeconds </span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.lib.AnimMgr.fps </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.duration</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">this.duration</span><span class="jsdoc-syntax">;
205 </span><span class="jsdoc-var">Roo.lib.AnimMgr.registerElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
209 </span><span class="jsdoc-var">this.stop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">finish</span><span class="jsdoc-syntax">) {
210 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">finish</span><span class="jsdoc-syntax">) {
211 </span><span class="jsdoc-var">this.currentFrame </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.totalFrames</span><span class="jsdoc-syntax">;
212 </span><span class="jsdoc-var">this._onTween.fire</span><span class="jsdoc-syntax">();
214 </span><span class="jsdoc-var">Roo.lib.AnimMgr.stop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
217 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">onStart </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
218 </span><span class="jsdoc-var">this.onStart.fire</span><span class="jsdoc-syntax">();
220 </span><span class="jsdoc-var">this.runtimeAttributes </span><span class="jsdoc-syntax">= {};
221 </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">attr </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">this.attributes</span><span class="jsdoc-syntax">) {
222 </span><span class="jsdoc-var">this.setRuntimeAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">);
225 </span><span class="jsdoc-var">isAnimated </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
226 </span><span class="jsdoc-var">actualFrames </span><span class="jsdoc-syntax">= 0;
227 </span><span class="jsdoc-var">startTime </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">();
231 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">onTween </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
232 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">= {
233 </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.getStartTime</span><span class="jsdoc-syntax">(),
234 </span><span class="jsdoc-var">currentFrame</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.currentFrame
235 </span><span class="jsdoc-syntax">};
237 </span><span class="jsdoc-var">data.toString </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
238 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">(
239 </span><span class="jsdoc-string">'duration: ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">data.duration </span><span class="jsdoc-syntax">+
240 </span><span class="jsdoc-string">', currentFrame: ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">data.currentFrame
241 </span><span class="jsdoc-syntax">);
244 </span><span class="jsdoc-var">this.onTween.fire</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">);
246 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">runtimeAttributes </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.runtimeAttributes</span><span class="jsdoc-syntax">;
248 </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">attr </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">runtimeAttributes</span><span class="jsdoc-syntax">) {
249 </span><span class="jsdoc-var">this.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.doMethod</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">runtimeAttributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">runtimeAttributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.end</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">runtimeAttributes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.unit</span><span class="jsdoc-syntax">);
252 </span><span class="jsdoc-var">actualFrames </span><span class="jsdoc-syntax">+= 1;
255 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">onComplete </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
256 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">actual_duration </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">startTime</span><span class="jsdoc-syntax">) / 1000 ;
258 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">= {
259 </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">actual_duration</span><span class="jsdoc-syntax">,
260 </span><span class="jsdoc-var">frames</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">actualFrames</span><span class="jsdoc-syntax">,
261 </span><span class="jsdoc-var">fps</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">actualFrames </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">actual_duration
262 </span><span class="jsdoc-syntax">};
264 </span><span class="jsdoc-var">data.toString </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
265 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">(
266 </span><span class="jsdoc-string">'duration: ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">data.duration </span><span class="jsdoc-syntax">+
267 </span><span class="jsdoc-string">', frames: ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">data.frames </span><span class="jsdoc-syntax">+
268 </span><span class="jsdoc-string">', fps: ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">data.fps
269 </span><span class="jsdoc-syntax">);
272 </span><span class="jsdoc-var">isAnimated </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
273 </span><span class="jsdoc-var">actualFrames </span><span class="jsdoc-syntax">= 0;
274 </span><span class="jsdoc-var">this.onComplete.fire</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">);
278 </span><span class="jsdoc-var">this._onStart </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Event</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
279 </span><span class="jsdoc-var">this.onStart </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Event</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
280 </span><span class="jsdoc-var">this.onTween </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Event</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
281 </span><span class="jsdoc-var">this._onTween </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Event</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
282 </span><span class="jsdoc-var">this.onComplete </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Event</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
283 </span><span class="jsdoc-var">this._onComplete </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Event</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
284 </span><span class="jsdoc-var">this._onStart.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">onStart</span><span class="jsdoc-syntax">);
285 </span><span class="jsdoc-var">this._onTween.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">onTween</span><span class="jsdoc-syntax">);
286 </span><span class="jsdoc-var">this._onComplete.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">onComplete</span><span class="jsdoc-syntax">);
289 })();</span></code></body></html>