OSDN Git Service

Lighten the _setEndFrame method of the
[sie/sie.git] / org / w3c / dom / smil.js
1 /*SIE under the MIT Lisence\r
2  */\r
3 /* Copyright 2016 dhrname and other contributors\r
4  * http://sie.osdn.jp/\r
5  *\r
6  * Permission is hereby granted, free of charge, to any person obtaining\r
7  * a copy of this software and associated documentation files (the\r
8  * "Software"), to deal in the Software without restriction, including\r
9  * without limitation the rights to use, copy, modify, merge, publish,\r
10  * distribute, sublicense, and/or sell copies of the Software, and to\r
11  * permit persons to whom the Software is furnished to do so, subject to\r
12  * the following conditions:\r
13  * \r
14  * The above copyright notice and this permission notice shall be\r
15  * included in all copies or substantial portions of the Software.\r
16  * \r
17  * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,\r
18  * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF\r
19  * MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND\r
20  * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE\r
21  * LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION\r
22  * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION\r
23  * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.\r
24  */\r
25 \r
26 /*$frame オブジェクト\r
27  * 全体のフレームの管理を行う\r
28  */\r
29 base("$frame").mix ( {\r
30   /*フレームレート。1ミリ秒何フレームか。計算を省略するためミリ秒使用*/\r
31   fpms: 0.024,\r
32 \r
33   /*タイムラインのリスト (時間区間の設定ができる)*/\r
34   timelines: [],\r
35 \r
36   /*開始フレーム数の候補。アニメーションの開始条件となる\r
37    * 単位はフレーム数であって、秒数ではない*/\r
38   begin: 0,\r
39 \r
40   /*活動継続時間 (Active Duration)のフレーム数。アニメーションの継続条件となる\r
41    * 単位はフレーム数であって、秒数ではない*/\r
42   activeTime: Number.MAX_VALUE,\r
43   \r
44   /*現在のフレーム数*/\r
45   currentFrame: 0,\r
46   \r
47   /*アニメーションを開始させるメソッド*/\r
48   startAnimation: function() {\r
49     /*__step関数は最後に書く*/\r
50     __step();\r
51   },\r
52   \r
53   /*アニメーションが停止した状態かどうか、停止しているならばtrue*/\r
54   isPaused: false,\r
55 \r
56   /*アニメーションを停止させるメソッド*/\r
57   pauseAnimation: function() {\r
58     this.isPaused = true;\r
59   },\r
60 \r
61   /*setFrame メソッド\r
62    * フレーム数を数値num まで進めるか、戻す*/\r
63   setFrame: function( /*number*/ num) {\r
64     if((num < this.begin) || (num >= (this.begin+this.activeTime))) {\r
65       return;\r
66     }\r
67     this.currentFrame = num;\r
68     var timelines = this.timelines;\r
69     for (var i=0;i<timelines.length;++i) {\r
70       if (timelines[i] === this) {\r
71         /*自分自身が含まれていると、永久に再帰を繰り返して、「スタック領域が不足」してしまう*/\r
72         continue;\r
73       }\r
74       timelines[i].setFrame(num);\r
75     }\r
76   },\r
77   \r
78   /*addLineメソッド\r
79    * タイムラインを追加したあと、trueを返す\r
80    * ただし、引数objのobj.beginとobj.activeTimeが定まっていない場合はfalseを返す*/\r
81   addLine: function( /*$frame*/ obj ) {\r
82     if(!obj || (!obj.begin && (obj.begin !== 0))\r
83     || (!obj.activeTime && (obj.activeTime !== 0)) ) {\r
84       /*どちらのプロパティも未確認の場合、タイムラインは追加されない*/\r
85       return false;\r
86     }\r
87     var timelines = this.timelines;\r
88     if ( timelines.indexOf(obj) >= 0 ) {\r
89       this.removeLine(obj);\r
90     }\r
91     timelines.push(obj);\r
92     timelines = void 0;
93     return true;\r
94   },\r
95   \r
96   /*removeLine メソッド\r
97    * 指定されたタイムラインのオブジェクトを、リストから削除する*/\r
98   removeLine: function( /*$frame*/ timeline ) {\r
99     var list = this.timelines,\r
100         j = list.indexOf(timeline);\r
101     if (j > -1) {\r
102       list.splice(j, 1);      //Arrayのspliceを利用して、リストからtimelineを排除\r
103     }\r
104     list = j = void 0;\r
105   }\r
106 } ).mix( function($frame) {\r
107   $frame.up("$list").mix( {\r
108     /*終了時刻(単位フレーム数)のキャッシュとして使う*/\r
109     end: 0,\r
110     \r
111     /*開始時刻から終了時刻までのフレーム数\r
112      * これがactiveTimeより短ければ、活動継続時間とみなす*/\r
113     beginEnd: Number.MAX_VALUE,\r
114     \r
115     /*開始時刻(単位フレーム数)リスト (後述のupdateStateメソッドで使う)*/\r
116     beginList: { \r
117       next: null,\r
118       value: Number.MAX_VALUE\r
119     },\r
120     \r
121     /*終了時刻(単位フレーム数)リスト (後述のupdateStateメソッドで使う)*/\r
122     endList: {\r
123        next: null,\r
124        value: Number.MAX_VALUE\r
125     },\r
126     \r
127     addBeginList: function (num) {\r
128       return ( this.beginList = {\r
129                   value: num,\r
130                   next: this.beginList\r
131                 } );\r
132     },\r
133     \r
134     addEndList: function (num) {\r
135       return ( this.endList = {\r
136                   value: num,\r
137                   next: this.endList\r
138                 } );\r
139     },\r
140     \r
141     /*引数に渡された時刻リストの中から、現在フレームf以下の、最大値を求めるメソッド\r
142      * -1を返したときはリストの中にf以下の値がないことを示す*/\r
143     getMaxList: function (f, list) {\r
144       var maxTime = -1; /*時刻の最大値*/\r
145       while( list ) {\r
146         var v = list.value;\r
147         /*f以下の開始リスト値のうち、最大値をstartTimeに代入*/\r
148         if ( (v <= f)\r
149              && (maxTime <= v) ) {\r
150           maxTime = v;\r
151         }\r
152         list = list.next;\r
153       }\r
154       return maxTime;\r
155     },\r
156       \r
157     /*現在の要素の状態を数値で示す(マジックナンバーは後述の大文字プロパティを使う)*/\r
158     state: 0,\r
159     \r
160     /*アニメーション待機状態を示す定数*/\r
161     WAITING: 0,\r
162     \r
163     /*アニメーション開始状態を示す定数*/\r
164     BEGINNING: 1,\r
165     \r
166     /*アニメーション再生中の状態を示す定数*/\r
167     PLAYING: 2,\r
168     \r
169     /*アニメーション終了状態を示す定数*/\r
170     ENDING: 3,\r
171     \r
172     /*終了処理をした後の待機状態を示す定数*/\r
173     POSTWAITING: 4,\r
174     \r
175     /*初期化用メソッド*/\r
176     init: function() {\r
177       this.state = this.WAITING;\r
178       this.begin = 0;\r
179       return this;\r
180     },\r
181     \r
182     /*引数で指定されたフレーム数に応じて、stateプロパティを更新するメソッド*/\r
183     updateState: function( /*number*/ f) {\r
184       if (f === void 0) {\r
185         /*引数fが指定されないときには状態を更新しない*/\r
186         return this;\r
187       }\r
188       var state = this.state,\r
189           wait = /*this.WAITING*/ 0,\r
190           begin = /*this.BEGINNING*/ 1,\r
191           play = /*this.PLAYING*/ 2,\r
192           end = /*this.ENDING*/ 3,\r
193           post = /*this.POSTWAITING*/ 4;\r
194       /*beginListプロパティと、endListプロパティの中で、\r
195        * 現在フレーム数 f より大きい数値は、更新できる条件と無関係なので、除外しておく\r
196        * だから、f以下の値の中から、最大値を探して、\r
197        * それをbeginプロパティの値cacheBeginと比較する*/\r
198       var startTime = this.getMaxList(f, this.beginList),\r
199           endTime = this.getMaxList(f, this.endList),\r
200           isWait = (state === wait),\r
201           cacheBegin = this.begin;\r
202       if ( !startTime && isWait) {\r
203           /*開始時刻が0ならば、アニメーションを開始*/\r
204           this.begin = 0;\r
205           this.state = begin;\r
206       } else if ( isWait || (state === post) ) {\r
207         if (startTime > cacheBegin) {\r
208           this.state = begin;\r
209           /*beginプロパティに開始時刻をキャッシュ用に保存*/\r
210           this.begin = startTime;\r
211         }\r
212       } else if (state === begin) {\r
213         if (endTime >= cacheBegin) {\r
214           /*終了時刻にもう到達したときは、直接BEGINNING状態からENDING状態へ移行*/\r
215           this.state = end;\r
216           /*endTimeを終了時刻とみなす*/\r
217           (endTime > 0) && (this.end = endTime);\r
218           /*activeTimeプロパティは、begin属性とend属性が反映されていないため、\r
219            * beginEndプロパティに別に設定しておく*/\r
220           this.beginEnd = 0;\r
221         } else {\r
222           this.state = play;\r
223         }\r
224       } else if (state === play) {\r
225         /*activeTimeプロパティを比較して、変数endTimeを書き換える*/\r
226         var act = cacheBegin + this.activeTime;\r
227         endTime = (endTime > act) ? act\r
228                                   : endTime;\r
229         if ( (f >= act) || (endTime >= cacheBegin) || (startTime > cacheBegin) ) {\r
230           /*終了時刻に到達したか、再び開始イベントが発火されたとき*/\r
231           this.state = end;\r
232           if (endTime > 0) {\r
233             /*endTimeを終了時刻とみなす*/\r
234             this.end = endTime;\r
235             /*activeTimeプロパティは、begin属性とend属性が反映されていないため、\r
236              * beginEndプロパティに別に設定しておく*/\r
237             this.beginEnd = endTime - cacheBegin;\r
238           }\r
239         }\r
240       } else if (state === end) {\r
241         if (startTime > cacheBegin) {\r
242           /*再生中に開始イベントが発火されて、終了状態となったとき*/\r
243           this.state = begin;\r
244           this.begin = startTime;\r
245         } else {\r
246           this.state = post;\r
247         }\r
248       } else {\r
249         this.state = begin;\r
250       }\r
251       cacheBegin = startTime = endTime = isWait = state = void 0;\r
252       return this;\r
253     },\r
254     \r
255     /*addEventメソッドで使われるイベントリスト(開始時に登録されたリスナー関数が呼び出される)*/\r
256     _beginListenerList: [],\r
257     \r
258     /*addEventメソッドで使われるイベントリスト(終了時に登録されたリスナー関数が呼び出される)*/\r
259     _endListenerList: [],\r
260     \r
261     /*addEventメソッドで使われるイベントリスト(再生時に登録されたリスナー関数が呼び出される)*/\r
262     _playListenerList: [],\r
263     \r
264     /*開始と再生と終了時に発火されるイベントリスナーを登録するメソッド*/\r
265     addEvent: function ( /*string*/ eventName, /*fnction*/ listener) {\r
266       var evtName = "_" +eventName+ "ListenerList";\r
267       /*プロトタイプ継承していた場合は新しく配列を作成*/\r
268       if (!this.hasOwnProperty(evtName)) {\r
269         this[evtName] = [];\r
270       }\r
271       this[evtName].push(listener);\r
272     },\r
273     \r
274     /*入力されたフレーム数fの場面に切り替えるメソッド*/\r
275     setFrame: function( /*number*/ f) {\r
276       this.currentFrame = f;\r
277       var state = this.updateState(f).state;\r
278       /*アニメーション開始と再生と、終了状態のときに、beginとplayとendイベントを呼び出しておいて、\r
279        * 次の状態(再生状態)に遷移する*/\r
280       if (state === /*this.PLAYING*/ 2) {\r
281         var list = this._playListenerList;\r
282         for (var i=0;i<list.length;++i) {\r
283           list[i](this);\r
284         }\r
285       } else if (state === /*this.BEGINNING*/ 1) {\r
286         list = this._beginListenerList;\r
287         for (var i=0;i<list.length;++i) {\r
288           list[i](this);\r
289         }\r
290         /*開始時刻と終了時刻が一致した場合はstateはENDING状態\r
291          * それ以外はPLAYING状態*/\r
292         state = this.updateState(f).state;\r
293       }\r
294       if (state === /*this.ENDING*/ 3) {\r
295         list = this._endListenerList;\r
296         for (var i=0;i<list.length;++i) {\r
297           list[i](this);\r
298         }\r
299         if (this.updateState(f).state === /*this.BEGINNING*/ 1) {\r
300           /*再生中にbeginイベントが呼び出された場合*/\r
301           this.updateState(f);\r
302         }\r
303       }\r
304       state = list = void 0;\r
305     }\r
306   } ).mix( function() {\r
307     /*後述の$beginや$endで使うメソッド*/\r
308     this.addList = this.addBeginList;\r
309   } );\r
310    \r
311   /*$begin オブジェクト\r
312    * 開始のタイミングを計算する*/\r
313   $frame.up("$begin").mix( {\r
314 \r
315     /*開始時刻やタイミングが書かれた文字列*/\r
316     string: "",\r
317 \r
318     /*イベントやindefinteで未解決かどうか*/\r
319     isResolved: false,\r
320     \r
321     /*イベントが適用される要素*/\r
322     eventTarget: document.documentElement,\r
323     \r
324     /*現在のフレーム数を改めて初期化*/\r
325     currentFrame: 0,\r
326     \r
327     /*イベント同期で使う時間差のフレーム数*/\r
328     eventOffset: 0,\r
329     \r
330     /*repeat(1)など文字列内に書かれたリピート回数*/\r
331     repeat: 0,\r
332     \r
333     /*accessKey(a)の"a"などキーイベントの対象となる文字列*/\r
334     accessKey: "",\r
335 \r
336     /*trim メソッド\r
337      * 文字列中の空白を除去*/\r
338     trim: function(str) {\r
339       /*strがString型以外のときは必ずエラーを出す*/\r
340       return str.replace(/[\s\n]+/g, "");\r
341     },\r
342 \r
343     /*offset メソッド\r
344      * 引数に渡された文字列から、ミリ秒単位に変換した時間を、解析して返す*/\r
345     offset: function(str) {\r
346       str = str || "0";\r
347       var plusminus = str.charAt(0),\r
348           /*parseFloatのエイリアス*/\r
349           _float = parseFloat,\r
350           s = _float( str.match(/[\d.]+ms$/) || "0") + sec() + min() + h();\r
351       if (plusminus === "-") {\r
352         s *= -1;\r
353       }\r
354       plusminus = _float = sec = min = h = void 0;\r
355       return s;\r
356       \r
357       /*00:00:0と00:0と、0sなどの文字列をミリ秒へ変換*/\r
358       function sec() {\r
359         return str2num( 1000, /[\d.]+s$/, /[\d.]+$/ );\r
360       };\r
361       function min() {\r
362         return str2num( 60000, /[\d.]+min$/, /\d\d:[^:]+$/ );\r
363       };\r
364       function h() {\r
365         return str2num( 3600000, /\d+:\d\d:/, /[\d.]+h$/ );\r
366       };\r
367       function str2num(s, /*RegExp*/ a, /*RegExp*/ b) {\r
368         return s*( _float(str.match(a) || "0") || _float(str.match(b) || "0") );\r
369       };\r
370     },\r
371 \r
372     /*event メソッド\r
373      * 引数の文字列から、idとイベントに相当する文字列のプロパティを持ったオブジェクトを返す\r
374      * idがない場合や、イベントがない場合は空文字列を該当のプロパティに入れる*/\r
375     event: function(str) {\r
376       str = str || "";\r
377       if (/[\+\-]/.test(str)) {\r
378         /*数値がある場合は切り取っておく*/\r
379         str = str.slice(0, str.search(/[\+\-]/));\r
380       }\r
381       if (str.indexOf(".") > -1) {\r
382         /*ドットが見つかった場合、IDとイベントに分けておく*/\r
383         var ide = str.split(".");\r
384         /* エラーが起きて、idが空文字列ならば、evtも空文字列。逆も然り*/\r
385         return {\r
386           id: (ide[1] && ide[0]),\r
387           event: (ide[0] && ide[1])\r
388         };\r
389       } else {\r
390         return {\r
391           id: "",\r
392           event: str\r
393         };\r
394       }\r
395     }, \r
396     \r
397     /*_parse メソッド\r
398      * 引数の文字列を解析して、フレーム数を算出し、結果を$frame.beginプロパティに出力\r
399      * また、イベントリスナーに登録をしておく*/\r
400     _parse: function (str) {\r
401       var plusminus = str.search(/[\+\-]/),\r
402           event = null,\r
403           ele,\r
404           /*endListのvalueプロパティには、活動継続フレーム数と開始フレーム数を足したものが入る*/\r
405           endList = this.$list.addEndList(Number.MAX_VALUE);\r
406       if (str === "indefinite") {\r
407         this.begin = Number.MAX_VALUE;\r
408       } else if (plusminus > 0) {\r
409         /*Event-Value +/- Clock-Value の場合*/\r
410         this.begin = this.offset( str.slice(plusminus) );\r
411         event = this.event(str);\r
412       } else if ( /[^\+\-\d]/.test(str.charAt(0)) ) {\r
413         /*Event-Valuen のみの場合*/\r
414         event = this.event(str);\r
415       } else {\r
416         /*+/- Clock-Value のみの場合*/\r
417         this.begin = this.offset( str );\r
418         /*イベントもindefiniteもないので、解決済みと考える*/\r
419         this.isResolved = true;\r
420       }\r
421       /*もしもあれば、リピートの回数を求める*/\r
422       this.repeat = /repeat\((\d+)\)/.test(str) ? +RegExp.$1 : 0;\r
423       /*もしもあれば、押されるはずのキーを求める*/\r
424       this.accessKey = /accessKey\(([^\)]+?)\)/.test(str) ? RegExp.$1 : "";\r
425       this.begin = Math.floor( this.begin * this.fpms);\r
426       if (str === "indefinite") {\r
427         /*begin属性の値がindefiniteの場合は、何もしない。\r
428          * 開始時刻はbeginElementメソッドに依存*/\r
429       } else if (event) {\r
430         ele = event.id ? this.eventTarget.ownerDocument.getElementById(event.id)\r
431                         : this.eventTarget;\r
432         /*イベントの時間差を設定しておく\r
433          * eventOffsetとobjListの変数はクロージャとしてlistener関数で使われる*/\r
434         var eventOffset = this.begin,\r
435             /*objListのvalueプロパティはあとで書き換えられる(イベントの場合のみ)*/\r
436             objList = this.$list.addList(Number.MAX_VALUE),\r
437         /*イベントのリスナーとして使う*/\r
438             listener = function(evt) {\r
439               objList.value = this.begin = eventOffset + base("$frame").currentFrame;\r
440               this.isResolved = true;\r
441             };\r
442         this.eventOffset = eventOffset;\r
443         if (this.repeat > 0) {\r
444           ele && ele.addEventListener("repeatEvent", (function(evt) {\r
445             if (evt.detail === this.repeat) {\r
446               listener.call(this, evt);\r
447             } }).bind(this), true);\r
448         } else if (this.accessKey) {\r
449           document.documentElement.addEventListener("keydown", (function(evt) {\r
450             if (evt.char === this.accessKey) {\r
451                 listener.call(this, evt);\r
452               } }).bind(this), false);\r
453         } else {\r
454           var evtName = /^(?:begin|end|repeat)$/.test(event.event) ? event.event + "Event"\r
455                           : event.event;\r
456           ele && ele.addEventListener(evtName, listener.bind(this), false);\r
457         }\r
458       } else {\r
459         /*開始リストに登録しておく($endの場合は終了リストに登録)*/\r
460         this.$list.addList(this.begin);\r
461       }\r
462       s = event = str = plusminus = ele = void 0;\r
463     },\r
464     \r
465     /*stringプロパティを解析して、\r
466      * 開始フレーム数の算出や、イベントリスナーの登録をするメソッド*/\r
467     parse: function() {\r
468       /*初期値を設定*/\r
469       this.begin = 0;\r
470       this.isResolved = false;\r
471       var str = this.trim(this.string);\r
472       if (str.indexOf(";") > -1){\r
473         /*;で区切られたリストを一つずつ解析*/\r
474         var list = str.split(";");\r
475         for (var i=0;i<list.length;++i) {\r
476           this._parse(list[i]);\r
477         }\r
478       } else {\r
479         this._parse(str);\r
480       }\r
481       s = str = void 0;\r
482       return this;\r
483     },\r
484     \r
485     /*$listと$activateオブジェクトを更新して、活動継続時間を求めるメソッド*/\r
486     updateList: function() {\r
487       this.$list = this.$list.up();\r
488       /*beginとend属性を考慮に入れないで、活動継続時間を求める*/\r
489       var s = ( this.$activate = this.$activate.up() );\r
490       /*$endオブジェクトに付属している$listプロパティを更新したものと一致させておく*/\r
491       s.end && (s.end.$list = this.$list);\r
492       this.activeTime = this.$list.activeTime = s.call() || Number.MAX_VALUE;\r
493       this.simpleDuration = s.simpleDur;\r
494       return this;\r
495     }\r
496     \r
497   /*$activate オブジェクト\r
498    * 活動継続時間などを計算するための計算実体\r
499    * $begin オブジェクトからの継承*/\r
500   } ).up("$activate").of( {\r
501     \r
502     /*単純継続時間のパースされる前の文字列*/\r
503     dur: "indefinite",\r
504     \r
505     /*活動をストップさせるためのオブジェクト*/\r
506     end: $frame.$begin.up("$end"),\r
507 \r
508     /*リピート回数*/\r
509     repeatCount: null,\r
510     \r
511     /*繰り返し時間*/\r
512     repeatDur: null,\r
513 \r
514     /*単純継続時間 (単位はフレーム数)*/\r
515     simpleDur: function() {\r
516       return ( (this.dur === "indefinite") || !this.dur ) ?\r
517                 null\r
518               : Math.floor(this.offset(this.dur) * this.fpms) ;\r
519     },\r
520 \r
521     /*最小値に制限される\r
522      * 最小値 <= 活動継続時間 とならなければならない*/\r
523      min: "0",\r
524      \r
525     /*最大値に制限される\r
526      * 活動継続時間 <= 最大値 とならなければならない*/\r
527      max: "indefinite",\r
528     \r
529     /*解決した(計算する)ときの時間*/\r
530     resolvedTime: function() {\r
531       return Date.now();\r
532     },\r
533     \r
534     /*関数型の呼び出しメソッド\r
535      * base.jsのofメソッドを活用して活動継続時間を算出\r
536      * ただし、begin属性とend属性については、別途、$frame.$listで定める\r
537      * 計算方法はSMILアニメーション 3.3.4節を参照\r
538      * http://www.w3.org/TR/smil-animation/#ComputingActiveDur\r
539      */\r
540     call: function() {\r
541       var ind = "indefinite",\r
542           dur = this.simpleDur,\r
543           isIndefRepeatCount = (this.repeatCount === ind),\r
544           isIndefRepeatDur = (this.repeatDur === ind),\r
545           isDur = dur || (dur === 0),\r
546           isRepeatCount = this.repeatCount || (this.repeatCount === 0),\r
547           isRepeatDur = this.repeatDur || (this.repeatDur === 0),\r
548           actList = [],\r
549           min = Math.floor(this.offset(this.min) * this.fpms),\r
550           max = (this.max === ind) ? null : Math.floor(this.offset(this.max) * this.fpms),\r
551           s;\r
552       if (indef()) {\r
553         /*注意点として、活動継続時間が不定かつ、min属性とmax属性が指定されたときの記述が仕様にないため、\r
554          * W3Cのテストスイート(animate-elem-66-t.svg)に従い、max属性の値を返す*/\r
555         if (max) {\r
556           return max;\r
557         }\r
558         return null;\r
559       }\r
560       if (isDur && this.repeatCount && !isIndefRepeatCount) {\r
561         actList.push( dur * this.repeatCount );\r
562       }\r
563       if (isRepeatDur && !isIndefRepeatDur) {\r
564         actList.push( Math.floor( this.offset(this.repeatDur) * this.fpms) );\r
565       }\r
566       if (isDur && !isRepeatCount && !isRepeatDur) {\r
567         /*repeatCountやrepeatDur属性が指定されていない場合*/\r
568         actList.push( dur );\r
569       }\r
570 \r
571       /*長くなるため、インライン関数を活用\r
572        * indef関数はbeginとend属性を考慮せずに、\r
573        * 活動継続時間が不定かどうか、もし、不定なら真を返す*/\r
574       function indef() {\r
575         return !!( (!isDur && !isRepeatDur)\r
576                    || (isIndefRepeatCount && !isRepeatDur)\r
577                    || (isIndefRepeatDur && !isRepeatCount)\r
578                    || (isIndefRepeatCount && isIndefRepeatDur)\r
579                  );\r
580       };\r
581       \r
582       ind = dur = isIndefRepeatCount = isIndefRepeatDurindef = isDur = isEnd = isRepeatDur = isRepeatCount = indef = void 0;\r
583 \r
584       if (actList.length === 1) {\r
585         s = actList[0];\r
586       } else if(actList.length > 1) {\r
587         /*属性が競合するときは、最小値をとること (SMILアニメーション 3.3.4節)*/\r
588         s = Math.min.apply(Math, actList);\r
589       } else {\r
590         return null;\r
591       }\r
592       if ( max && (min > max) ) {\r
593         return s;\r
594       }\r
595       min && (min > s) && (s = min);\r
596       max && (max < s) && (s = max);\r
597       return s;\r
598     }\r
599   } );\r
600   $frame.$begin.$end.of( {\r
601     call: function() {\r
602       if (!this.string) {\r
603         return null;\r
604       }\r
605       /*addListメソッドには、addBeginList関数が入っているはずなので、それを一時的に変更する*/\r
606       this.$list.addList = this.$list.addEndList;\r
607       this.parse(this.string);\r
608       this.$list.addList = this.$list.addBeginList;\r
609       return this.isResolved ? this.begin\r
610                              : "indefinite";\r
611     }\r
612   } ).mix( {\r
613     $list: $frame.$begin.$list.up()\r
614   } );\r
615 } );\r
616 /*$from オブジェクト\r
617  * 呈示値 (presentation value)の計算をする。値そのものを返すための計算実体*/\r
618 base("$from").of( {\r
619   /*呈示値が書かれた文字列*/\r
620   string: "",\r
621   \r
622   /*呈示値の数値の部分だけを抜き出した配列を返す*/\r
623   numList: function() {\r
624     var s  = this.string.match(/[\-\+]?[\d\.]+(?:[eE][\-\+]?[\d\.]+)?/g)\r
625              || [];\r
626     if (s) {\r
627       /*mapメソッドで代用してもよい*/\r
628       for (var i=0;i<s.length;++i) {\r
629         s[i] = parseFloat(s[i]);\r
630       }\r
631     }\r
632     return s;\r
633   },\r
634   \r
635   /*呈示値の文字部分だけを抜き出した配列を返す*/\r
636   strList: function() {\r
637     /*replaceメソッドで1E-10などの対策*/\r
638     return this.string.replace(/\d[eE][\-\+\d]/g, "")\r
639                       .match(/[^\d\-\+\.]+/g);\r
640   },\r
641   \r
642   from: base("$from").up().mix( {\r
643           from: null\r
644         } ),\r
645   \r
646   /*$toオブジェクトにこのオブジェクトを適用させる関数*/\r
647   call: function() {\r
648     /*advanceメソッドで使うために、stringを保持*/\r
649     this.numList.string = this.string;\r
650     if (this.numList.length\r
651           && (this.additive[0] === 0)\r
652           && (this.accumulate[0] === 0)\r
653           ) {\r
654       /*配列の項目がundefinedだと困るので、配列を初期化する*/\r
655       var additive = [],\r
656           accumulate = [];\r
657       for (var i=0;i<this.numList.length;++i) {\r
658         /*0で配列を初期化しておく*/\r
659         additive[i] = accumulate[i] = 0;\r
660       }\r
661       this.additive = additive;\r
662       this.accumulate = accumulate;\r
663     }\r
664     /*文字部分の配置パターンは4通りあるので、ここでstrListを処理\r
665      * (1) a 0 の場合\r
666      * (2) 0 a\r
667      * (3) a 0 a (ノーマルパターン)\r
668      * (4) 0 a 0\r
669      * これらのパターンのうち、(1)(2)(4)を(3)のパターンに統一したのが以下の処理*/\r
670     /*文字列が1aのように、数値で始まるかどうか。始まったら真*/\r
671     if (!this.string || !this.numList.length || !this.strList) {\r
672       return this.numList;\r
673     }\r
674     var isNormal = (this.numList.length < this.strList.length);\r
675     if (/^[\-\+]?[\d\.]/.test(this.string) && !isNormal) {\r
676       /*文字列が1aのように、数値で始まる場合*/\r
677       this.strList.unshift("");\r
678     }\r
679     if (/\d$/.test(this.string) && !isNormal) {\r
680       /*文字列がa1のように、数値で終わる場合*/\r
681       this.strList.push("");\r
682     }\r
683     return this.numList;\r
684   }\r
685     \r
686 } )\r
687  .mix( {\r
688    /*advanceメソッドの返り値で使われる小数点以下の桁数*/\r
689    degit: 0,\r
690    \r
691    /*additve属性やaccumulate属性が設定された、累積アニメーションか、加法アニメーションで使われる*/\r
692    additive: [0],\r
693    accumulate: [0],\r
694    \r
695    /*advance メソッド\r
696     * アニメーションの進行具合を示す進捗率 t (0 <= t <= 1)をもとに、現在の呈示値を算出するためのもの\r
697     * callメソッドが前もって呼び出されていることが前提となる*/\r
698     advance: function(t) {\r
699       if ( (t < 0) || (1 < t)) {\r
700         throw new Error("An Invalid Number Error");\r
701       }\r
702       if (!this.string) {\r
703         return "";\r
704       } else if (!this.from.length) {\r
705         /*discreteのために、this.stringに数値が入っていない場合の対処*/\r
706         if (t === 1) {\r
707           return this.string.trim();\r
708         }\r
709         return this.from.string.trim();\r
710       }\r
711       var str = "",\r
712           numList = this.numList,\r
713           strList = this.strList,\r
714           fromNumList = this.from,\r
715           deg = this.degit,\r
716           additive = this.additive,\r
717           accumulate = this.accumulate;\r
718       for (var i=0,nuli=numList.length;i<nuli;++i) {\r
719         /*原点Oを(0,0,...0)とおく\r
720          *$fromと$toを、原点Oからの二つのベクトル (n次空間のベクトル)、ベクトルOFとベクトルOTと考える\r
721          *$fromと$toの二つの端の点FとTを結ぶ線分を、t : 1-t で内分する点をPとおく\r
722          * このときのベクトルOPを求めたのが以下の式*/\r
723         str += ( t * numList[i] + (1 - t) * fromNumList[i] + additive[i] + accumulate[i]).toFixed(deg);\r
724         strList && ( str += strList[i+1] );\r
725       }\r
726       /*文字列はcallメソッドにより、a0aのパターンになっているので、aの部分を追加*/\r
727       str = (strList ? strList[0] : "") + str;\r
728       numList = strList = fromNumList = i = nuli = deg = additive = accumulate = void 0;\r
729       return str.trim();\r
730     },\r
731     \r
732     /*distanceメソッド\r
733      * fromベクトルから自分自身のベクトルへの距離 (ノルム)の数値を返す。callメソッドを使うので注意すること*/\r
734      distance: function(from) {\r
735        if (!from) {\r
736           return 0;\r
737        }\r
738        var toList = this.call(),\r
739            fromList = from.call ? from.call() : from,\r
740            s = 0;\r
741        if (!toList || !fromList) {\r
742          return 0;\r
743        }\r
744        for (var i=0, tli=toList.length; i<tli; ++i) {\r
745          s += (toList[i] - fromList[i])*(toList[i] - fromList[i]);\r
746        }\r
747        return Math.sqrt(s);\r
748      },\r
749      \r
750      /*setAdditive メソッド\r
751       * additve属性がsumのときに使われるメソッド\r
752       * 引数は親要素の、現在の属性値*/\r
753       setAdditive: function(str) {\r
754         if (!str) {\r
755           return 0;\r
756         }\r
757         var from = this.$from.up();\r
758         from.string = str;\r
759         return ( this.additive = from.call() );\r
760       },\r
761      \r
762      /*setAccumulate メソッド\r
763       * accumulate属性がsumのときに使われるメソッド\r
764       * 引数は現在のリピート回数*/\r
765       setAccumulate: function(num) {\r
766         if (!num || isNaN(num)) {\r
767           return 0;\r
768         }\r
769         return ( this.accumulate = this.numList.map( function(d) {\r
770           return d * num;\r
771         } ) );\r
772       }\r
773   } )\r
774   /*fromプロパティの初期化*/\r
775  .up("$to").from = null;\r
776  \r
777  /*計算モードを定めるための計算実体\r
778   *補間の細かい制御などを行う*/\r
779  base("$calcMode").mix({\r
780    /*計算モード (calcMode属性の値)*/\r
781    mode: "linear",\r
782 \r
783    /*keyTimesの区間\r
784     * たとえば、"0, 0.5, 0.7, 1"の場合、時間の区間はそれぞれ、0.5 (=0.5-0)  0.2 (=0.7-0.5)  0.3 (=1-0.7)である\r
785     * このうち、どれか一つが値として入力される*/\r
786    keyTime: 1,\r
787    \r
788    /*keySpline属性の値を設定*/\r
789    keySplines: null,\r
790 \r
791    /*callメソッドで使う関数\r
792     * 進捗率を時間の圧縮率( = keyTimeプロパティ)で割ることで、現在、どこまで進んでいるのかを求めることができる*/\r
793    _f: function (t) {\r
794          /*tは進捗率*/\r
795          var tkey = this.keyTime;\r
796          if ( (tkey === 0) && t) {\r
797            t = 0; \r
798          } else if (!tkey || !isFinite(tkey) ) {\r
799            return this.string;\r
800          } else {\r
801            t = t / tkey;\r
802            t = (t > 1) ? Math.floor(t) : t;\r
803          }\r
804          tkey = void 0;\r
805          return isNaN(t) ? this.string\r
806                          : this.to.advance(t);\r
807      },\r
808      \r
809      /*discreteモードのときには、上記の_f関数の代わりに、以下の関数を用いる*/\r
810      funcForDiscrete: function (t) {\r
811         if (isNaN(t)) {\r
812           return this.string;\r
813         } else if (t === 1) {\r
814           return this.to.string;\r
815         } else {\r
816           return this.to.advance(0);\r
817         }\r
818       }\r
819  }).of( {\r
820    \r
821    /*全体の行列ノルム(距離)*/\r
822    norm: 1,\r
823 \r
824    /*無効だった場合の呈示値*/\r
825    string: "",\r
826    \r
827    /*与えられたアニメーションの進捗率を使った時間の圧縮率を計算して呈示値を返すための関数を作る*/\r
828    call: function() {\r
829      var f = this._f.bind(this);\r
830      if (this.mode === "linear") {\r
831        this.to.call();\r
832        return f;\r
833      } else if (this.mode === "paced") {\r
834        /*keyTimes属性は無視され、ベクトルの距離の割合から計算される*/\r
835        this.keyTime = this.to.distance(this.to.from) / this.norm;\r
836        return f;\r
837      } else if (this.mode === "spline") {\r
838        var tk = this.keySplines,\r
839            /*必ず関数を返すようにするため、円周率を返す関数tfを返して、nullの代わりとする*/\r
840            tf = function(x) {\r
841                  return Math.PI;\r
842            };\r
843       tf.isNotAnimate = true;\r
844       if (!tk) {\r
845          return tf;\r
846        }\r
847       for (var i=0,tki = NaN;i<tk.length;++i) {\r
848        tki = tk[i];\r
849        if (isNaN(tki)) {\r
850          return tf;\r
851        }\r
852        if ( (tki < 0) || (1 < tki)) {\r
853          return tf;\r
854        }\r
855      }\r
856      this.to.call();\r
857      var x2 = tk[0],\r
858          y2 = tk[1],\r
859          x3 = tk[2],\r
860          y3 = tk[3],\r
861          x4 = 1,\r
862          y4 = 1,\r
863          Ax = x4-3*(x3-x2),\r
864          Bx = 3*(x3-2*x2),\r
865          Cx = 3*x2,\r
866          Ay = y4-3*(y3-y2),\r
867          By = 3*(y3-2*y2),\r
868          Cy = 3*y2,\r
869          _newton = Math.qubicnewton; //高速化のためのエイリアス\r
870      if ( ( (x2 === 0) || (x2 === 1) )\r
871           && (y2 === 0)\r
872           && ( (x3 === 1) || (x3 === 0) )\r
873           && (y3 === 1) ) {\r
874             /*linearモードと同じ効果 (収束ではない可能性を考慮)*/\r
875             this.to.call();\r
876             return f;\r
877      }\r
878      var tkey = this.keyTime;\r
879      if (tkey || isFinite(tkey) ) {\r
880        /*keyTimeから時間の収縮率を3次ベジェ曲線に適用しておく*/\r
881        Ax *= tkey;\r
882        Bx *= tkey;\r
883        Cx *= tkey;\r
884        Ay *= tkey;\r
885        By *= tkey;\r
886        Cy *= tkey;\r
887      }\r
888      tkey = tk = x2 = y2 = x3 = y3 = x4 = y4 = void 0;\r
889      return function (x) {\r
890         /*3次ベジェ曲線は媒介曲線\r
891          *x = (x4-3*(x3-x2)-x1)*t*t*t + 3*(x3-2*x2+x1)*t*t + 3*(x2-x1)*t + x1\r
892          *y = (y4-3*(y3-y2)-y1)*t*t*t + 3*(y3-2*y2+y1)*t*t + 3*(y2-y1)*t + y1\r
893          * ただし、0 <= t <= 1\r
894          * スプラインモードの場合、x1 = y1 = 0, x4 = y4 = 1\r
895          * ベジェ曲線のxの式が三次方程式であるため、その解 t から、ベジェ曲線の y を求める\r
896          * なお、ニュートン法の初期値はxとする\r
897          * なぜなら、xの式をみると、xが増加傾向となるスプラインモードでは、係数が負となる可能性が低いため*/\r
898         var t = _newton(Ax, Bx, Cx, -x, x);\r
899         return f(Ay*t*t*t + By*t*t + Cy*t);\r
900       };\r
901     } else if (this.mode === "discrete") {\r
902       this.to.call();\r
903       return this.funcForDiscrete.bind(this);\r
904     }\r
905   }\r
906 } ).to = base("$from").$to;\r
907 \r
908 \r
909 /*ニュートン法により、三次方程式 a0x^3 + a1x^2 + a2x + a3 の解を求める\r
910  * 引数bは初期値*/\r
911 Math.qubicnewton = function(a0, a1, a2, a3, b) {\r
912   var eps = 1e-15,                          //収束誤差\r
913       fb = a0 *b*b*b + a1 *b*b + a2*b + a3; //方程式の結果\r
914   if (fb === 0) {\r
915     return b;\r
916   }\r
917   /*限界の収束回数は100回*/\r
918   for (var i=0;i<100;i=(i+1)|0) {\r
919     /*数値nは与えられた三次方程式を微分したもの*/\r
920     var n = 3* a0 *b*b + 2 * a1 *b + a2;\r
921     if (!n || ( (fb < eps) && (fb > -eps) )) {\r
922       fb = eps = void 0;\r
923       return b;\r
924     } else {\r
925       /*以下は収束の漸化式*/\r
926       b =  b - fb / n;\r
927       fb = a0 *b*b*b + a1 *b*b + a2*b + a3;\r
928     }\r
929   }\r
930   return b; //収束しなかった結果\r
931 };\r
932 \r
933 /*$attribute オブジェクト\r
934  * アニメーションの時間調整と、呈示値の調整を一つのオブジェクトにまとめて行うことで、\r
935  * アニメーションサンドイッチの実装をする\r
936  * $calcModeオブジェクトから継承*/\r
937 base("$calcMode").up("$attribute").mix( {\r
938   \r
939   /*アニメーションの対象となる要素。たとえば、animate要素の親要素*/\r
940   element: null,\r
941   \r
942   /*$fromオブジェクトを作るためのひな形となるオブジェクト*/\r
943   $from: base("$from").up(),\r
944   \r
945   /*attributeName属性の値*/\r
946   attrName: "",\r
947   \r
948   /*属性の名前空間*/\r
949   attrNameSpace: null,\r
950   \r
951     /*指定された属性の規定値*/\r
952   defaultValue: "",\r
953   \r
954   /*もともと属性がターゲットの要素につけられていたかどうか*/\r
955   isDefault: false,\r
956   \r
957   /*attributeType属性がCSSだったときや、autoで属性名がCSSプロパティ名だったときには、true*/\r
958   isCSS: false,\r
959   \r
960   /*計算モードdicreteやsplineなど*/\r
961   mode: "linear",\r
962   \r
963   /*指定した要素の属性値を取得するメソッド*/\r
964   getAttr: function(/*string*/ name, def) {\r
965     var nameSpace = null;\r
966     if (name.indexOf("xlink:") > -1) {\r
967       nameSpace = "http://www.w3.org/1999/xlink";\r
968     }\r
969     var s = this._ele.getAttributeNS(nameSpace, name);\r
970     if (this.element) {\r
971         var view = this.element.ownerDocument.defaultView;\r
972       if (s === "inherit") {\r
973         return view.getComputedStyle(this.element.parentNode, "").getPropertyValue(this.attrName);\r
974       } else if (s === "currentColor") {\r
975         return view.getComputedStyle(this._ele, "").getPropertyValue("color");\r
976       }\r
977     }\r
978     /*DOM Level2やIE11では、getAttributeNSメソッドは空文字列を返す。他のブラウザではnullを返すことが多い\r
979      * \r
980      * >the empty string if that attribute does not have a specified or default value\r
981      * http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-ElGetAttrNS*/\r
982     return (s || def);\r
983   },\r
984   \r
985   _ele: document.documentElement,\r
986   \r
987   /*指定された要素にvalues属性が付いているかどうかのチェックできるメソッド*/\r
988   hasAttrValues: function () {\r
989     var ele = this._ele;\r
990     if (!ele) {\r
991       return false;\r
992     } else {\r
993       return ( ele.hasAttribute("from") || ele.hasAttribute("to")\r
994          || ele.hasAttribute("by") || ele.hasAttribute("values") );\r
995     }\r
996   },\r
997   \r
998   /*後述のsetAttributeメソッドで使うキャッシュ\r
999    * これを使うことで、二度同じ値を設定せずにすむので、高速化できる*/\r
1000   __cacheAttr: "",\r
1001   \r
1002   /*アニメーションするために、対象の属性やプロパティを変化させるメソッド*/\r
1003   setAttribute: function (value) {\r
1004     var attrName = this.attrName;\r
1005     if (!attrName) {\r
1006       return;\r
1007     }\r
1008     if (this.__cacheAttr === value) {\r
1009       /*同じ値であれば、再設定しない*/\r
1010       return;\r
1011     } else {\r
1012       this.__cacheAttr = value;\r
1013     }\r
1014     var ele = this.element;\r
1015     if (this.isCSS) {\r
1016       /*スタイルシートのプロパティを上書きしておく*/\r
1017       ele.style.setProperty(attrName, value, "");\r
1018     } else {\r
1019       ele.setAttributeNS(this.attrNameSpace, attrName, value);\r
1020     }\r
1021     value = attrName = ele = void 0;\r
1022   },\r
1023   \r
1024   /*setAttributeメソッドとは逆の効果で、無効化させるメソッド*/\r
1025   removeAttribute: function () {\r
1026     var attrName = this.attrName;\r
1027     if (!attrName) {\r
1028       return;\r
1029     }\r
1030     var ele = this.element;\r
1031     if (this.isDefault) {\r
1032       this.setAttribute(this.defaultValue);\r
1033     } else {\r
1034       /*初期段階でターゲットの要素に属性が指定されていない場合は、\r
1035        * 現在の属性値を削除するだけでよい*/\r
1036       ele.removeAttributeNS(this.attrNameSpace, attrName);\r
1037       /*スタイルシートのプロパティも削除しておく。removePropertyでないことに注意*/\r
1038       this.isCSS && ele.style.setProperty(attrName, this.defaultValue, "");\r
1039     }\r
1040     this.__cacheAttr = "";\r
1041     value = attrName = ele = void 0;\r
1042   },\r
1043   \r
1044   /*アニメーションの対象となる要素を値として返すメソッド\r
1045    * もっぱら、pushメソッドで使われる*/\r
1046   initTargetElement: function() {\r
1047     var ele = this._ele;\r
1048     var s = ele.parentNode || null;\r
1049     var id = ele.getAttribute("xlink:href");\r
1050     /*getAttributeNSメソッドでうまくいかなかったため、NSなしで代用*/\r
1051     if (id) {\r
1052       return ele.ownerDocument.getElementById(id.slice(1));\r
1053     }\r
1054     if ( id = ele.getAttributeNS(null, "targetElement") ) {\r
1055       return ele.ownerDocument.getElementById(id);\r
1056     }\r
1057     return s;\r
1058   },\r
1059   \r
1060   /*repeatイベントの発火時刻リスト\r
1061    * setSmilEventメソッドを見よ*/\r
1062   _repeatList: [],\r
1063   \r
1064   /*リピート回数を示すプロパティ\r
1065    * setSmilEventメソッドを見よ*/\r
1066   _repeatCount: 0,\r
1067   \r
1068   /*SMILイベント関連を発火させるためのメソッド\r
1069    * もっぱら、$attributeオブジェクトのpush メソッドで使われる*/\r
1070    setSmilEvent: function($list) {\r
1071     $list.addEvent("begin", function($list) {\r
1072         var target = this._ele,\r
1073             detail = 0;\r
1074         /*IE11のために、MouseEventsでSMILEventsの代用をする*/\r
1075         var evt = target.ownerDocument.createEvent("MouseEvents");\r
1076         evt.initMouseEvent("beginEvent" ,true, true, window, detail, 0, 0, 0, 0, false, false, false, false, 0, target);\r
1077         target.dispatchEvent(evt);\r
1078         /*repeatイベントのために、_repeatListプロパティを初期化する*/\r
1079         var list = this._repeatList = [],\r
1080             active = $list.activeTime,\r
1081             begin = $list.begin,\r
1082             simpleDuration = this.timeline.simpleDuration;\r
1083             if (simpleDuration && (simpleDuration !== active)\r
1084                   && (active !== Number.MAX_VALUE) ) {\r
1085               /*活動継続時間と単純持続時間が異なるとき、repeatイベントを設定*/\r
1086               for (var m= simpleDuration, n=1;m < active ; m+=simpleDuration) {\r
1087                 list.push( {\r
1088                   frame: begin + m,\r
1089                   /*リピートの回数 (n >= 1)*/\r
1090                   count: n\r
1091                 } );\r
1092                 ++n;\r
1093               }\r
1094             }\r
1095     }.bind(this) );\r
1096     \r
1097     $list.addEvent("play", function($list) {\r
1098       var target = this._ele,\r
1099           detail = 0,\r
1100           frame = $list.currentFrame,\r
1101           list = this._repeatList;\r
1102       if (!list.length) {\r
1103         return;\r
1104       }\r
1105       for (var i=0;i<list.length;++i) {\r
1106         if ( (this._repaetCount >= i+1)\r
1107             || (list[i].frame >= frame) ) {\r
1108           this._repeatCount = detail;\r
1109           break;\r
1110         } \r
1111         detail = list[i].count;\r
1112         var evt = target.ownerDocument.createEvent("MouseEvents");\r
1113         evt.initMouseEvent("repeatEvent" ,true, true, window, detail, 0, 0, 0, 0, false, false, false, false, 0, target);\r
1114         target.dispatchEvent(evt);\r
1115       }\r
1116     }.bind(this) );\r
1117     \r
1118     $list.addEvent("end", function() {\r
1119         var target = this._ele,\r
1120             detail = 0;\r
1121         var evt = target.ownerDocument.createEvent("MouseEvents");\r
1122         evt.initMouseEvent("endEvent" ,true, true, window, detail, 0, 0, 0, 0, false, false, false, false, 0, target);\r
1123         target.dispatchEvent(evt);\r
1124     }.bind(this) );\r
1125    },\r
1126 \r
1127   /*引数で指定した要素 ele の属性を解析して、フレームに追加する*/\r
1128   push: function(/*Element Node*/ ele) {\r
1129     if (!ele || !ele.hasAttribute) {\r
1130       return null;\r
1131     }\r
1132     /*キャッシュを初期化しておく*/\r
1133     this.__cacheAttr = "";\r
1134     \r
1135 \r
1136    /*getAttrメソッドとhasAttrValuesメソッドで必要*/\r
1137     this._ele = ele;\r
1138     \r
1139     /*initTargetElementメソッドを使って、elementプロパティの初期化*/\r
1140     this.element = this.initTargetElement();\r
1141     \r
1142     if (!this.hasAttrValues()) {\r
1143       /*from属性、to、by、values属性が指定されていない場合、アニメーションの効果が出ないように調整する\r
1144        *SMILアニメーションの仕様を参照\r
1145        *\r
1146        *>if none of the from, to, by or values attributes are specified, the animation will have no effect\r
1147        *「3.2.2. Animation function values」より引用\r
1148        *http://www.w3.org/TR/2001/REC-smil-animation-20010904/#AnimFuncValues\r
1149       */\r
1150       return null;\r
1151     }\r
1152  \r
1153     /*属性値の設定*/\r
1154     this.attrName = this.getAttr("attributeName", "");\r
1155     var attrName = this.attrName;\r
1156     \r
1157     /*属性タイプの設定*/\r
1158     var attrType = this.getAttr("attributeType", "auto");\r
1159     var computedStyle = this.element && this.element.ownerDocument.defaultView.getComputedStyle(this.element, "");\r
1160     if ( (attrType === "CSS")\r
1161          || ( (attrType === "auto") && this.element \r
1162              && computedStyle.getPropertyValue(attrName)\r
1163              && !/^(width|height|transform)$/.test(attrName)\r
1164             )\r
1165         ) {\r
1166         this.isCSS = true;\r
1167     }\r
1168     \r
1169     /*xlink関連の属性のときは名前空間を変更しておく*/\r
1170     if (attrName.indexOf("xlink") > -1) {\r
1171       this.attrNameSpace = "http://www.w3.org/1999/xlink";\r
1172     }\r
1173     /*thiseleはターゲットとなる要素(たとえば、親要素)*/\r
1174     var thisele = this.element;\r
1175     if (thisele) {\r
1176       /*規定値を設定しておく。属性を初期化するときに使われる*/\r
1177       this._ele = thisele;\r
1178       this.isDefault = thisele.hasAttributeNS(this.attrNameSpace, attrName);\r
1179       this.defaultValue = this.getAttr(attrName,\r
1180        computedStyle.getPropertyValue(attrName) );\r
1181       this._ele = ele; /*_eleプロパティを元に戻しておく*/\r
1182     }\r
1183     /*eleの属性の値を、それぞれオブジェクトに割り当て*/\r
1184     var $frame = base("$frame"),\r
1185         begin = $frame.$begin,\r
1186         frame = begin.up().mix( {\r
1187                   /*targetプロパティはbeginEventなどの発火で使う*/\r
1188                   target: ele,\r
1189                   eventTarget: (this.element || begin.eventTarget),\r
1190                   string: this.getAttr("begin", "0"),\r
1191                   $activate: begin.$activate.up().mix( {\r
1192                     dur: this.getAttr("dur", null),\r
1193                     end: begin.$end.up().mix( {\r
1194                           eventTarget: (this.element || begin.eventTarget),\r
1195                           string: this.getAttr("end", null)\r
1196                         } ),\r
1197                     repeatCount: this.getAttr("repeatCount", null),\r
1198                     repeatDur: this.getAttr("repeatDur", null),\r
1199                     min: this.getAttr("min", "0"),\r
1200                     max: this.getAttr("max", "indefinite")\r
1201                   } )\r
1202                 } ).updateList().parse();\r
1203     $frame.addLine(frame.$list.init());\r
1204     \r
1205     /*beginElementメソッドを追加*/\r
1206     var objList = frame.$list.addList(Number.MAX_VALUE),\r
1207         /*endListのvalueプロパティには、活動継続フレーム数と開始フレーム数を足したものが入る*/\r
1208         endList = frame.$list.addEndList(Number.MAX_VALUE);\r
1209     ele.beginElement = (frame.string !== "indefinite") ? function(){}\r
1210                         : function() {\r
1211                             objList.value = frame.begin = base("$frame").currentFrame;\r
1212                             frame.isResolved = true;\r
1213                             var evt = this.ownerDocument.createEvent("MouseEvents");\r
1214                             evt.initMouseEvent("beginEvent" ,true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, this);\r
1215                             this.dispatchEvent(evt);\r
1216                           };\r
1217     /*endElementメソッドを追加*/\r
1218     var endFrame = frame.$activate.end || {};\r
1219     ele.endElement = (endFrame.string !== "indefinite") ? function(){}\r
1220                         : function() {\r
1221                             if (frame.isResolved) {\r
1222                               endFrame.isResolved = true;\r
1223                               endList.value  = base("$frame").currentFrame;\r
1224                               var evt = this.ownerDocument.createEvent("MouseEvents");\r
1225                               evt.initMouseEvent("endEvent" ,true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, this);\r
1226                               this.dispatchEvent(evt);\r
1227                             }\r
1228                           };\r
1229     /*setFrameメソッドを使ったときの、再帰スタックの使いすぎを防ぐため*/\r
1230     frame.timelines = [];\r
1231     this.setSmilEvent(frame.$list);\r
1232     begin = ele = void 0;\r
1233     return frame;\r
1234   },\r
1235   \r
1236   /*setValuesメソッド\r
1237    * values属性やfrom属性やto属性を処理するためのメソッド\r
1238    * valuesは配列、それ以外の引数は文字列\r
1239    * 返り値は、values属性は配列、それ以外の属性のときは、\r
1240    * 自分自身となる$attributeオブジェクトのコピーを返す*/\r
1241    setValues: function(values, from, to, by) {\r
1242      var $from = this.$from,\r
1243          s = [this.up().mix( {\r
1244                to: $from.up().mix( {\r
1245                  from: $from.up()\r
1246                } )\r
1247              } )],\r
1248          sto = s[0].to;\r
1249      values = values && values.split(";");\r
1250      /*from属性はオプションなので、条件には付け加えない*/\r
1251      if (values && values.length) {\r
1252        /*values属性が指定された場合、他の属性は無視される\r
1253         * W3C仕様 SMIL アニメーション 3.2.2. アニメーション関数の値*/\r
1254         s = [];\r
1255        for (var i=1;i<values.length;++i) {\r
1256          s.push( this.up().mix( {\r
1257                to: $from.up().mix( {\r
1258                  from: $from.up()\r
1259                } )\r
1260              } ) );\r
1261          sto = s[s.length-1].to;\r
1262          sto.string = values[i];\r
1263          sto.from.string = values[i-1];\r
1264        }\r
1265      } else if (to) {\r
1266        sto.string = to;\r
1267        sto.from.string = from || "0";\r
1268      } else if (by) {\r
1269        sto.string = by;\r
1270        sto.from.string = from || "0";\r
1271        var toNumList = sto.call(),\r
1272            fromNumList = sto.from;\r
1273        for (var i=0;i<toNumList.length;++i) {\r
1274          /*初期値と差分を足していく*/\r
1275          toNumList[i] += fromNumList[i];\r
1276        }\r
1277      } else {\r
1278        return null;\r
1279      }\r
1280      $from = sto = toNumList = fromNumList = void 0;\r
1281      return s;\r
1282    },\r
1283    \r
1284    /*setKeyメソッド\r
1285     * 引数の要素のkeyTimes属性やkeySplines属性を処理するためのメソッド\r
1286     * 必要な他の属性処理はsetValuesメソッドに任せている*/\r
1287    setKey: function(ele) {\r
1288      this._ele = ele;\r
1289      var to = this.setValues(this.getAttr("values", null),\r
1290           this.getAttr("from", null),\r
1291           this.getAttr("to", null),\r
1292           this.getAttr("by", null) ),\r
1293          keyTimes = this.getAttr("keyTimes", null),\r
1294          keySplines = this.getAttr("keySplines", null),\r
1295          keys,\r
1296          splines = keySplines && keySplines.split(";"),\r
1297          isDiscrete = (this.mode === "discrete"),\r
1298          toiKeySplines;\r
1299     if (!isDiscrete && keyTimes && to) {\r
1300       keys = this.$from.numList.call( {\r
1301         string: keyTimes\r
1302       } );\r
1303       /*keysTime属性の最初は0でなければならない。そうでなければエラー(SVG 1.1 2ndの仕様を参照)*/\r
1304       if (keys.length && (keys[0] !== 0)) {\r
1305         return null;\r
1306       }\r
1307       /*toオブジェクトはtoとfromで一組となっているのでlengthが加算される*/\r
1308       if (keys.length && (keys.length !== (to.length+1))) {\r
1309         /*keyTimes属性とvalues属性のリストの個数が合致しない場合、アニメーションの効果がない\r
1310          * 仕様を参照 SMIL Animation 3.2.3. Animation function calculation modes\r
1311          * http://www.w3.org/TR/smil-animation/#AnimFuncCalcMode*/\r
1312         return null;\r
1313       }\r
1314       for (var i=0;i<to.length;++i) {\r
1315         to[i].keyTime = keys[i+1] - keys[i];\r
1316         if (splines) {\r
1317           toiKeySplines = this.$from.numList.call( {\r
1318             string: splines[i]\r
1319           } );\r
1320           /*空配列を返すため、nullに変えておく*/\r
1321           to[i].keySplines = toiKeySplines.length ? toiKeySplines : null;\r
1322         }\r
1323       }\r
1324     } else if (!isDiscrete && to) {\r
1325       var per = 1 / to.length;\r
1326       for (var i=0;i<to.length;++i) {\r
1327         to[i].keyTime = per;\r
1328         if (splines) {\r
1329           toiKeySplines = this.$from.numList.call( {\r
1330             string: splines[i]\r
1331           } );\r
1332           to[i].keySplines = toiKeySplines.length ? toiKeySplines : null;\r
1333         }\r
1334       }\r
1335     } else if (to) {\r
1336         /*discreteモードの処理*/\r
1337       if (keyTimes) {\r
1338         keys = this.$from.numList.call( {\r
1339           string: keyTimes\r
1340         } );\r
1341       /*keysTime属性の最初は0でなければならない。そうでなければエラー(SVG 1.1 2ndの仕様を参照)*/\r
1342         if (keys.length && (keys[0] !== 0)) {\r
1343           return null;\r
1344         }\r
1345         if (keys.length && (keys.length !== (to.length+1))) {\r
1346           return null;\r
1347         }\r
1348         for (var i=0;i<to.length;++i) {\r
1349           to[i].keyTime = keys[i+1] - keys[i];\r
1350         }\r
1351       } else {\r
1352         var per = 1 / (to.length+1);\r
1353         for (var i=0;i<to.length;++i) {\r
1354           to[i].keyTime = per;\r
1355         }\r
1356       }\r
1357       /*toオブジェクトが足らないので、一つ追加しておく*/\r
1358       to.push( to[to.length-1].up().mix( function(){\r
1359           if (!keys) {\r
1360             return;\r
1361           }\r
1362           this.keyTime = 1-keys[keys.length-1];\r
1363         } ).of( {\r
1364             call: function() {\r
1365               return function (t) {\r
1366                  return isNaN(t) ? this.string\r
1367                                  : this.to.advance(1);\r
1368               }.bind(this);\r
1369             }\r
1370           } \r
1371         ) );\r
1372     }\r
1373     if (this.mode === "paced") {\r
1374       /*ベクトル全体の距離を算出*/\r
1375       var norm = 0;\r
1376       to.forEach( function(x) {\r
1377         norm += x.to.distance(x.to.from);\r
1378       } );\r
1379       to.forEach( function(x) {\r
1380          x.norm = norm;\r
1381       } );\r
1382     }\r
1383     ele = keyTimes = keys = per = splines = void 0;\r
1384     return to;\r
1385    }\r
1386 } ).up("$setElement").mix( {\r
1387   /*to属性の値、文字列*/\r
1388   to: "",\r
1389   \r
1390   /*initメソッドで使われるアニメーション関数*/\r
1391   _setFrame: function ($list) {\r
1392     this.setAttribute(this.to);\r
1393   },\r
1394   \r
1395   /*開始を設定されたタイムライン ($beginオブジェクト)*/\r
1396   timeline: base("$frame").$begin,\r
1397   \r
1398   /*アニメが終了した際の後処理*/\r
1399   _setEndFrame: function ($list) {\r
1400     /*removeの場合、アニメーションを凍結せずに、もとに戻す*/\r
1401     if (this.fill === "remove") {\r
1402       this.removeAttribute();\r
1403     }\r
1404   },\r
1405   \r
1406   /*アニメーションの呈示値を呼び出す関数*/\r
1407   tocall: function() {},\r
1408   \r
1409   init: function(ele) {\r
1410     var line = this.push(ele);\r
1411     if (ele && ele.getAttributeNS) {\r
1412       this._ele = ele;\r
1413       this.to = this.getAttr("to", "");\r
1414       this.fill = this.getAttr("fill", "remove");\r
1415     }\r
1416     var thisele = this.element;\r
1417     if (line && thisele) {\r
1418       this.timeline = line;\r
1419       /*$begin.$listのイベントに属性処理を追加*/\r
1420       line.$list.addEvent("begin", this._setFrame.bind(this));\r
1421       line.$list.addEvent("play", this._setFrame.bind(this));\r
1422       line.$list.addEvent("end", this._setEndFrame.bind(this));\r
1423       /*アニメーションが再起動する可能性もあるため、$listのstateプロパティはここで初期化*/\r
1424       line.$list.state = line.$list.WAITING;\r
1425     }\r
1426     line = thisele = void 0;\r
1427   }\r
1428 }).up("$animateElement").mix( {\r
1429   /*アニメ関数の配列*/\r
1430   funcs: [],\r
1431 \r
1432   /*進捗率advanceから、呈示値を求める*/\r
1433   tocall: function(advance) {\r
1434     var tf = this.funcs;\r
1435     if (this.mode !== "discrete") {\r
1436       for (var i=0;i<tf.length;++i) {\r
1437         var tfi = tf[i];\r
1438         /*keyTime(keyTimes属性で指定されたような値)で実行するかどうかを判別*/\r
1439         if (tfi.endKeyTime >= advance) {\r
1440           return tfi(advance - tfi.startKeyTime);\r
1441         }\r
1442       }\r
1443     } else {\r
1444       var result = "";\r
1445       for (var i=0;i<tf.length;++i) {\r
1446         var tfi = tf[i];\r
1447         if (advance >= tfi.startKeyTime) {\r
1448           result = tfi(advance);\r
1449         }\r
1450       }\r
1451       advance = tf = tfi = void 0;\r
1452       return result;\r
1453     }\r
1454     tf = i = tfi = void 0;\r
1455     return "";\r
1456   },\r
1457   \r
1458   _setFrame: function($list) {\r
1459     var currentFrame = $list.currentFrame;\r
1460     /*durationは単純継続時間\r
1461      *advanceは継続時間内での、進捗率\r
1462      *  仕様を参照 http://www.w3.org/TR/smil-animation/#AnimFuncValues\r
1463      *進捗率advanceは、durationと進捗フレーム数とを割った余り(REMAINDER)で算出する\r
1464      * 仕様を参照 SMIL Animation 3.6.2 Interval timing\r
1465      * http://www.w3.org/TR/2001/REC-smil-animation-20010904/#IntervalTiming*/\r
1466     var line = this.timeline,\r
1467         duration = line.simpleDuration,\r
1468         /*単純継続時間が不定の場合、補間はせずに初期値が採用されるため、advanceは0となる\r
1469          * 仕様を参照 SMIL Animation 3.2.2. Animation function values のInterpolation and indefinite simple durations\r
1470          * http://www.w3.org/TR/2001/REC-smil-animation-20010904/#AnimFuncValues*/\r
1471         advance = duration ? ( (currentFrame - $list.begin) % duration ) / duration\r
1472                     : 0;\r
1473     this.setAttribute(this.tocall(advance));\r
1474     line = duration = advance = void 0;\r
1475   },\r
1476   \r
1477   /*凍結処理をするために、進捗率を最後まで進めて調整するメソッド\r
1478    * 返り値は調整された進捗率\r
1479    * もっぱら、_setEndFrameメソッドで使われる*/\r
1480   getAdvanceEnd: function($list) {\r
1481     var line = this.timeline,\r
1482         duration = line.simpleDuration;\r
1483     if (duration) {\r
1484       var time = (line.activeTime > $list.beginEnd) ? $list.beginEnd\r
1485                   : line.activeTime;\r
1486       var advance = ( time % duration ) / duration;\r
1487       /*例外が発生するため、進捗率が1を超えないように処理*/\r
1488       advance = (advance > 1) ? 1 : advance;\r
1489        /*活動継続時間と単純継続時間が一致すると、余りは0となるため以下の処理*/\r
1490       advance = advance || 1;\r
1491     } else {\r
1492       advance = 0;\r
1493     }\r
1494     return advance;\r
1495   },\r
1496   \r
1497   /*_setEndFrameメソッドは、終了処理と凍結作業をする*/\r
1498   _setEndFrame: function($list) {\r
1499     /*上書きされたメソッドを呼び出してアニメーションの凍結作業をする*/\r
1500     if (this.fill === "freeze") {\r
1501       this.setAttribute(this.tocall( this.getAdvanceEnd($list) ));\r
1502       line = duration = advance = void 0;\r
1503     } else {\r
1504       this.removeAttribute();\r
1505     }\r
1506   },\r
1507   \r
1508   /*getAttrメソッドをオーバライド*/\r
1509   getAttr: function (name, def) {\r
1510     var s= this.$attribute.getAttr.apply(this, arguments);\r
1511     if ((name === "from") && !s && this.defaultValue) {\r
1512       /*from属性がない場合、対象要素の既定値を返す*/\r
1513       return this.defaultValue;\r
1514     }\r
1515     return s;\r
1516   },\r
1517   \r
1518   _keywords: {\r
1519     aliceblue:    [240,248,255],\r
1520     antiquewhite: [250,235,215],\r
1521     aqua:         [0,255,255],\r
1522     aquamarine:   [127,255,212],\r
1523     azure:        [240,255,255],\r
1524     beige:        [245,245,220],\r
1525     bisque:       [255,228,196],\r
1526     black:        [0,0,0],\r
1527     blanchedalmond:[255,235,205],\r
1528     blue:         [0,0,255],\r
1529     blueviolet:   [138,43,226],\r
1530     brown:        [165,42,42],\r
1531     burlywood:    [222,184,135],\r
1532     cadetblue:    [95,158,160],\r
1533     chartreuse:   [127,255,0],\r
1534     chocolate:    [210,105,30],\r
1535     coral:        [255,127,80],\r
1536     cornflowerblue:[100,149,237],\r
1537     cornsilk:     [255,248,220],\r
1538     crimson:      [220,20,60],\r
1539     cyan:         [0,255,255],\r
1540     darkblue:     [0,0,139],\r
1541     darkcyan:     [0,139,139],\r
1542     darkgoldenrod:[184,134,11],\r
1543     darkgray:     [169,169,169],\r
1544     darkgreen:    [0,100,0],\r
1545     darkgrey:     [169,169,169],\r
1546     darkkhaki:    [189,183,107],\r
1547     darkmagenta:  [139,0,139],\r
1548     darkolivegreen:[85,107,47],\r
1549     darkorange:    [255,140,0],\r
1550     darkorchid:   [153,50,204],\r
1551     darkred:      [139,0,0],\r
1552     darksalmon:   [233,150,122],\r
1553     darkseagreen: [143,188,143],\r
1554     darkslateblue:[72,61,139],\r
1555     darkslategray:[47,79,79],\r
1556     darkslategrey:[47,79,79],\r
1557     darkturquoise:[0,206,209],\r
1558     darkviolet:   [148,0,211],\r
1559     deeppink:     [255,20,147],\r
1560     deepskyblue:  [0,191,255],\r
1561     dimgray:      [105,105,105],\r
1562     dimgrey:      [105,105,105],\r
1563     dodgerblue:   [30,144,255],\r
1564     firebrick:    [178,34,34],\r
1565     floralwhite:  [255,250,240],\r
1566     forestgreen:  [34,139,34],\r
1567     fuchsia:      [255,0,255],\r
1568     gainsboro:    [220,220,220],\r
1569     ghostwhite:   [248,248,255],\r
1570     gold:         [255,215,0],\r
1571     goldenrod:    [218,165,32],\r
1572     gray:         [128,128,128],\r
1573     grey:         [128,128,128],\r
1574     green:        [0,128,0],\r
1575     greenyellow:  [173,255,47],\r
1576     honeydew:     [240,255,240],\r
1577     hotpink:      [255,105,180],\r
1578     indianred:    [205,92,92],\r
1579     indigo:       [75,0,130],\r
1580     ivory:        [255,255,240],\r
1581     khaki:        [240,230,140],\r
1582     lavender:     [230,230,250],\r
1583     lavenderblush:[255,240,245],\r
1584     lawngreen:    [124,252,0],\r
1585     lemonchiffon: [255,250,205],\r
1586     lightblue:    [173,216,230],\r
1587     lightcoral:   [240,128,128],\r
1588     lightcyan:    [224,255,255],\r
1589     lightgoldenrodyellow:[250,250,210],\r
1590     lightgray:    [211,211,211],\r
1591     lightgreen:   [144,238,144],\r
1592     lightgrey:    [211,211,211],\r
1593     lightpink:    [255,182,193],\r
1594     lightsalmon:  [255,160,122],\r
1595     lightseagree: [32,178,170],\r
1596     lightskyblue: [135,206,250],\r
1597     lightslategray:[119,136,153],\r
1598     lightslategrey:[119,136,153],\r
1599     lightsteelblue:[176,196,222],\r
1600     lightyellow:  [255,255,224],\r
1601     lime:         [0,255,0],\r
1602     limegreen:    [50,205,50],\r
1603     linen:        [250,240,230],\r
1604     magenta:      [255,0,255],\r
1605     maroon:       [128,0,0],\r
1606     mediumaquamarine:[102,205,170],\r
1607     mediumblue:    [0,0,205],\r
1608     mediumorchid:  [186,85,211],\r
1609     mediumpurple:  [147,112,219],\r
1610     mediumseagreen:[60,179,113],\r
1611     mediumslateblue:[123,104,238],\r
1612     mediumspringgreen:[0,250,154],\r
1613     mediumturquoise:[72,209,204],\r
1614     mediumvioletred:[199,21,133],\r
1615     midnightblue:  [25,25,112],\r
1616     mintcream:     [245,255,250],\r
1617     mistyrose:     [255,228,225],\r
1618     moccasin:      [255,228,181],\r
1619     navajowhite:   [255,222,173],\r
1620     navy:          [0,0,128],\r
1621     oldlace:       [253,245,230],\r
1622     olive:         [128,128,0],\r
1623     olivedrab:     [107,142,35],\r
1624     orange:        [255,165,0],\r
1625     orangered:     [255,69,0],\r
1626     orchid:        [218,112,214],\r
1627     palegoldenrod: [238,232,170],\r
1628     palegreen:     [152,251,152],\r
1629     paleturquoise: [175,238,238],\r
1630     palevioletred: [219,112,147],\r
1631     papayawhip:    [255,239,213],\r
1632     peachpuff:     [255,218,185],\r
1633     peru:          [205,133,63],\r
1634     pink:          [255,192,203],\r
1635     plum:          [221,160,221],\r
1636     powderblue:    [176,224,230],\r
1637     purple:        [128,0,128],\r
1638     red:           [255,0,0],\r
1639     rosybrown:     [188,143,143],\r
1640     royalblue:     [65,105,225],\r
1641     saddlebrown:   [139,69,19],\r
1642     salmon:        [250,128,114],\r
1643     sandybrown:    [244,164,96],\r
1644     seagreen:      [46,139,87],\r
1645     seashell:      [255,245,238],\r
1646     sienna:        [160,82,45],\r
1647     silver:        [192,192,192],\r
1648     skyblue:       [135,206,235],\r
1649     slateblue:     [106,90,205],\r
1650     slategray:     [112,128,144],\r
1651     slategrey:     [112,128,144],\r
1652     snow:          [255,250,250],\r
1653     springgreen:   [0,255,127],\r
1654     steelblue:     [70,130,180],\r
1655     tan:           [210,180,140],\r
1656     teal:          [0,128,128],\r
1657     thistle:       [216,191,216],\r
1658     tomato:        [255,99,71],\r
1659     turquoise:     [64,224,208],\r
1660     violet:        [238,130,238],\r
1661     wheat:         [245,222,179],\r
1662     white:         [255,255,255],\r
1663     whitesmoke:    [245,245,245],\r
1664     yellow:        [255,255,0],\r
1665     yellowgreen:   [154,205,50]\r
1666   },\r
1667   \r
1668   setAdd: function (ele, to) {\r
1669     /*additive属性がsum (加法アニメーション)の場合*/\r
1670     if (ele.getAttributeNS(null, "additive") === "sum") {\r
1671       var attrValue = ele.parentNode.getAttributeNS(null, this.attrName);\r
1672       ele.addEventListener("beginEvent", function(evt) {\r
1673         to.forEach( function(x) {\r
1674           x.to.setAdditive(attrValue);\r
1675         } )\r
1676       }, false);\r
1677     }\r
1678   },\r
1679   setAccum: function (ele, to) {\r
1680     /*accumulate属性がsum (蓄積アニメーション)の場合*/\r
1681     if (ele.getAttributeNS(null, "accumulate") === "sum") {\r
1682       ele.addEventListener("repeatEvent", function(evt) {\r
1683         to.forEach( function(x) {\r
1684           x.to.call();\r
1685           x.to.setAccumulate(evt.detail);\r
1686         } )\r
1687       }, false);\r
1688     }\r
1689   },\r
1690   \r
1691   /*displayなど補間をしなくてもよい属性への対処するためのメソッド*/\r
1692   setString: function() {\r
1693     if (/^(?:display|class|edgeMode|(gradient|marker|pattern|maskContent|mask|patternContent|primitive)Units|in|in2|method|mode|operator|preserveAspectRatio|result|spacing|spreadMethod|stitchTiles|target|type|xlink:href|yChannelSelector|color-interpolation|(clip|fill)-rule|cursor|filter|font-(family|stretch|style|variant)|image-rendering|marker-(end|mid|start)|mask|overflow|pointer-events|shape-rendering|stroke-(linecap|linejoin)|text-(anchor|decoration|rendering)|visibility)$/.test(this.attrName) ) {\r
1694       this.mode = "discrete";\r
1695     }\r
1696   },\r
1697   \r
1698   /*小数点以下の桁数を指定するため、setValuesメソッドをオーバライドする*/\r
1699   degits: 1,\r
1700   setValues: function() {\r
1701     var s = this.$attribute.setValues.apply(this, arguments),\r
1702         degits = this.degits;\r
1703     s && s.forEach(function(x) {\r
1704       x.to.degit = degits;\r
1705     } );\r
1706     degits = void 0;\r
1707     return s;\r
1708   },\r
1709   \r
1710   /*#から始まる文字列#aabbcc、例えばを、rgb(.., .., ..,)形式へと変換するためのメソッド\r
1711    * initメソッドで使われる*/\r
1712   toRGB: function(rgbColor) {\r
1713            var keyword = this._keywords[rgbColor];\r
1714            if (keyword) {\r
1715              return "rgb(" + keyword.join(", ") + ")";\r
1716            }\r
1717            if (rgbColor && (rgbColor[0] === "#")) {  //#を含む場合\r
1718               var s = "rgb(",\r
1719                   _parseInt = parseInt;\r
1720               if (rgbColor.length < 5) {\r
1721                 var r = rgbColor[1],\r
1722                     g = rgbColor[2],\r
1723                     b = rgbColor[3],\r
1724                 rgbColor = "#" + r + r + g + g + b + b;\r
1725               }\r
1726               rgbColor.match(/\#(\w{2})(\w{2})(\w{2})/);\r
1727               s += _parseInt(RegExp.$1, 16)\r
1728                 + ", "\r
1729                 + _parseInt(RegExp.$2, 16)\r
1730                 + ", "\r
1731                 + _parseInt(RegExp.$3, 16)\r
1732                 + ")";\r
1733               r = g = b = void 0;\r
1734               return s;\r
1735            }\r
1736            return rgbColor;\r
1737         }\r
1738 \r
1739 /*initメソッドに追加処理\r
1740  * onメソッドについては、base.jsを参照のこと*/\r
1741 } ).on ("init", function(ele) {\r
1742   var to, \r
1743       keyTime = 0,\r
1744       /*関数toRGBはrgbColor形式への変換処理で使う*/\r
1745       toRGB = function(x) { return x; },\r
1746       isColor = /^(?:fill|stroke|stop-color|color)$/.test(this.attrName);\r
1747   if (isColor) {\r
1748     /*通常は、小数点以下の桁数を既定値の1桁とする\r
1749      *RGB形式では補間に、小数を使わないため、0桁に設定\r
1750      * (なお、この作業は、setKeyメソッドの前に済ませておく必要がある)*/\r
1751     this.degits = 0;\r
1752     /*たとえば、fill属性などである場合には、rgbColor形式への変換処理をする*/\r
1753     toRGB = this.toRGB.bind(this);\r
1754   }\r
1755   if (ele) {\r
1756     this.mode = ele.getAttributeNS(null, "calcMode") || "linear";\r
1757     this.setString();\r
1758     to = this.setKey(ele);\r
1759   }\r
1760   if (to) {\r
1761     this.funcs = to.map( function(x) {\r
1762       x.to.string = toRGB(x.to.string);\r
1763       x.to.from.string = toRGB(x.to.from.string);\r
1764       var s = x.call();\r
1765       /*x.keyTimeプロパティは区間を示しているため、区切り時刻に変換しておく\r
1766        * startKeyTimeプロパティは区間のスタート時点\r
1767        * endKeyTimeプロパティは区間のエンド地点*/\r
1768       s.startKeyTime = keyTime;\r
1769       keyTime = s.endKeyTime = keyTime + x.keyTime;\r
1770       return s;\r
1771     } )\r
1772      .filter( function(s) {\r
1773        if (!this.timeline.isResolved) {\r
1774          /*begin属性などにイベントを設定していた(未解決の)場合、後のs(0.1)がうまく作動せず、\r
1775           * 例外を出してしまうため、ここで返しておく*/\r
1776          return true;\r
1777        }\r
1778        /*splineモードで、かつ、アニメーションが無効な関数の場合は配列から外しておく\r
1779         * 無効な場合に関しては、$calcModeオブジェクトのcallメソッドを参照*/\r
1780        return (this.mode !== "spline") || !s.isNotAnimate;\r
1781     }, this );\r
1782     this.setAdd(ele, to);\r
1783     this.setAccum(ele, to);\r
1784   }\r
1785   keywords = toRGB = isColor = void 0;\r
1786 } )\r
1787 /*$animateTranformElementオブジェクト\r
1788  * animateTransform要素に関連するオブジェクト*/\r
1789  .up("$animateTransformElement")\r
1790  .mix({\r
1791    /*__transformListで何番目のアイテムかを示すプロパティ*/\r
1792    numberOfList: -1,\r
1793    \r
1794    /*type属性の値*/\r
1795    type: "translate",\r
1796    \r
1797    /*attributeName属性の値はtransformで固定*/\r
1798    attrName: "transform",\r
1799    \r
1800    /*明確にisCSSプロパティを設定しておくことで、プロトタイプチェーンを使わせず最適化*/\r
1801    isCSS: false,\r
1802    \r
1803    /*additive属性の値がsumのときにtrue*/\r
1804    isSum: false,\r
1805    \r
1806    /*transform属性の値に使われる数値は精密であることが求められるため、\r
1807     *小数点以下の桁数を決めるdegitsプロパティの値も大きくしておく*/\r
1808    degits: 15,\r
1809    \r
1810    /*tocallメソッド(後述の$motionElementオブジェクトも含む)で使うメソッド\r
1811     * __transformListの値を結合して、文字列として返す*/\r
1812    joinList: function(s) {\r
1813      var playList = this.element.__transformList;\r
1814      for (var i=0;i<playList.length;++i) {\r
1815        var item = playList[i],\r
1816            value = item.value;\r
1817        if (item.isSum) {\r
1818          s += " " + value;\r
1819        } else if (item.isPlaying) {\r
1820          /*他のanimateTransform要素がadditive属性の値にreplaceをすでに設定していた、\r
1821           *かつ、その要素がアニメーション再生中の場合はsを初期化*/\r
1822          s = value;\r
1823        }\r
1824      }\r
1825      return s.trim();\r
1826    },\r
1827    \r
1828    /*$animateElementオブジェクトのtocallメソッドをオーバライド*/\r
1829    tocall: function (advance) {\r
1830      if (this.numberOfList < 0) {\r
1831        throw new Error("Number of The List Error");\r
1832      }\r
1833      var currentItem = this.element.__transformList[this.numberOfList];\r
1834      currentItem.value = this.type+ "(" +this.$animateElement.tocall.call(this, advance)+ ")";\r
1835      currentItem.isPlaying = true;\r
1836      currentItem.isSum = this.isSum;\r
1837      return this.joinList(this.defaultValue || "");\r
1838    },\r
1839    \r
1840    /*後の_setFrameメソッドで使うダミー*/\r
1841    __setAttribute: function(){},\r
1842    \r
1843    _setFrame: function($list) {\r
1844     var currentFrame = $list.currentFrame;\r
1845      /*__transformListの中で、自分より後の項目に再生中のものがあれば、\r
1846       *アニメーションを再生させないで、後に続く項目に任せる*/\r
1847      var list = this.element.__transformList,\r
1848          isPostActive = false,\r
1849          length = list.length;\r
1850      if ( (length !== 1) && (this.numberOfList < (length - 1) ) ) {\r
1851        /*リストの項目が一つだけであったり、自分自身が最後尾であれば、アニメーションを再生する\r
1852         * また、後に続く項目で再生中のものがあったら、今回は再生しない*/\r
1853        for (var i=this.numberOfList+1;i<length;++i) {\r
1854          if (list[i].isPlaying) {\r
1855            isPostActive = true;\r
1856          }\r
1857        }\r
1858      }\r
1859      /*__setAttributeはダミーなので、アニメーションが再生されない*/\r
1860      this.setAttribute = isPostActive ? this.__setAttribute\r
1861                                     : this.$animateElement.setAttribute;\r
1862      /*上書きされたメソッドを呼び出す*/\r
1863      this.$animateElement._setFrame.call(this, $list);\r
1864    },\r
1865    \r
1866    _setEndFrame: function($list) {\r
1867      var list = this.element.__transformList;\r
1868      if (!list) {\r
1869        return;\r
1870      }\r
1871      var item = list[this.numberOfList];\r
1872      if (this.fill === "remove") {\r
1873        if (!item) {\r
1874          return;\r
1875        } else if (!this.isSum) {\r
1876          /*凍結処理をしないで、かつ、元の状態に戻して、効果が出ないようにする*/\r
1877          item.isPlaying = false;\r
1878        } else {\r
1879          /*凍結処理をしないで、かつ、効果を出すが、変形させないようにする*/\r
1880          item.value = "translate(0)";\r
1881        }\r
1882      } else {\r
1883        /*凍結処理をする\r
1884         * 自前のtocallメソッドはvalueプロパティを書きかえてしまうため、\r
1885         * 上書きメソッドを呼び出す*/\r
1886        item.value = this.type+ "(" \r
1887                                       +this.$animateElement.tocall.call( this, this.getAdvanceEnd($list) )+ ")";\r
1888      }\r
1889      this.setAttribute( this.joinList(this.defaultValue || "") );\r
1890      item = void 0;\r
1891    },\r
1892    \r
1893     /*setAddメソッドのオーバライド\r
1894      * additive属性のsumに対する振る舞いが異なるため*/\r
1895     setAdd: function() {},\r
1896   })\r
1897  .on("init", function (ele) {\r
1898    if (!ele || !ele.parentNode) {\r
1899      return;\r
1900    }\r
1901    this.getAttr = this.$attribute.getAttr;\r
1902    this.type = this.getAttr("type", "translate");\r
1903    this.attrName = "transform";\r
1904    var parent = this.element;\r
1905    this.isDefault = parent.hasAttributeNS(null, "transform");\r
1906    this.defaultValue = parent.getAttributeNS(null, "transform") || "";\r
1907    this.isSum = (this.getAttr("additive", "replace") === "sum");\r
1908    if (!parent.__transformList) {\r
1909      parent.__transformList = [];\r
1910      this.numberOfList = -1;\r
1911    }\r
1912    if (this.hasAttrValues()\r
1913     && (this.numberOfList < 0) ) {\r
1914      /*もし、今まで、このオブジェクトで、initメソッドを実行していなければ*/\r
1915      this.numberOfList = parent.__transformList.length;\r
1916      /*isPlayingプロパティはアニメーション再生終了後でもtrueとなるので注意*/\r
1917      parent.__transformList.push( {isPlaying: false,\r
1918                                    value: "translate(0)",\r
1919                                    isSum: this.isSum,\r
1920                                    isRemove: (this.fill === "remove")\r
1921                                   } );\r
1922    }\r
1923   } )\r
1924   .up("$motionElement")\r
1925   .mix( function() {\r
1926     /*$animateTransformElementオブジェクトのでは、うまくいかないため、\r
1927      * setRFrameとsetEndFrameメソッドを再定義*/\r
1928     this._setFrame = this.$animateElement._setFrame;\r
1929     this._setEndFrame = this.$animateElement._setEndFrame;\r
1930   })\r
1931   .mix( {\r
1932     numberOfList: -1,\r
1933     mode: "paced",\r
1934         \r
1935     /*hasAttrValuesメソッドのオーバライド\r
1936      * path属性に対応させるため*/\r
1937     hasAttrValues: function () {\r
1938       if (this.$attribute.hasAttrValues.call(this)) {\r
1939         return true;\r
1940       } else {\r
1941         return (this._ele.hasAttribute("path")\r
1942                  || this._ele.getElementsByTagNameNS(this.path.namespaceURI, "mpath").length);\r
1943       }\r
1944     },\r
1945     \r
1946     path: document.createElementNS("http://www.w3.org/2000/svg", "path"),\r
1947     \r
1948     rotate: "0",\r
1949     \r
1950     /*tocallメソッドのオーバライド*/\r
1951     tocall: function(advance) {\r
1952       /*モーションは仕様の関係上、かならず、CTMの一番初めに置かれ、前置積となる\r
1953      * なお、__transformListプロパティはtransform属性の値であり、CTMを表現する。\r
1954      * 必ず、CTMの一番目に設定する*/\r
1955       return ("translate(" +this.$animateElement.tocall.call(this, advance)+ ") "\r
1956               + this.joinList(this.defaultValue || "")).trim();\r
1957     },\r
1958     \r
1959     /*図の現在の角度rを求めて、rotate(rの文字列(最後に括弧はいらない)で返すメソッド*/\r
1960     getRotate: function(path, advanceLength, rotate) {\r
1961       /*パスセグメントの数値を求めてから、動いている図形の傾き角度r(ラジアンではなく度数)を算出する*/\r
1962       var length = path.getPathSegAtLength(advanceLength),\r
1963           seg = path.pathSegList.getItem(length),\r
1964           command = seg.pathSegTypeAsLetter,\r
1965           /*pi*180ではEdgeでうまく作動しない(原因は不明)*/\r
1966           pi = Math.PI;\r
1967       if (command === "M") {\r
1968         /*次のセグメントがどのコマンドによるかで、計算方式が違う*/\r
1969         var nextSeg = path.pathSegList.getItem(length+1),\r
1970             nextCommand = nextSeg.pathSegTypeAsLetter;\r
1971         if (nextCommand === "M") {\r
1972           return "";\r
1973         } else if (nextCommand === "L") {\r
1974           return ") rotate(" +(Math.atan2(nextSeg.y-seg.y, nextSeg.x-seg.x)/pi*180 + rotate)+ "";\r
1975         } else if (nextCommand === "C") {\r
1976           return ") rotate(" +(Math.atan2(nextSeg.y1-seg.y, nextSeg.x1-seg.x)/pi*180 + rotate)+ "";\r
1977         }\r
1978       } else if ((command === "L") && (length-1 >= 0)) {\r
1979         var preSeg = path.pathSegList.getItem(length-1);\r
1980         return ") rotate(" +(Math.atan2(seg.y-preSeg.y, seg.x-preSeg.x)/pi*180 + rotate)+ "";\r
1981       } else if (command === "C") {\r
1982         /*3次ベジェ曲線を微分する方法はニュートン法など数値解析の必要があるので、\r
1983          * 以下の通り、別の方法を採用する。\r
1984          * 現在位置から一歩進んだ曲線上の点Bをとり、それを、現在の点Aと結んで線分ABとしたとき、\r
1985          * その直線の傾きからおおよその角度を求める*/\r
1986          var point = path.getPointAtLength(advanceLength),\r
1987              x = point.x,\r
1988              y = point.y;\r
1989          /*一歩進んだ点*/\r
1990          point = path.getPointAtLength(advanceLength+1);\r
1991          return ") rotate(" +(Math.atan2(point.y-y, point.x-x)/pi*180 + rotate)+ "";\r
1992       }\r
1993     },\r
1994     \r
1995     /*$animateElement.tocallメソッドを置き換えるためのメソッド\r
1996      * mpath要素が指定されたときか、path属性のときにのみ使われる*/\r
1997     _tocallForPath: function(advance) {\r
1998       var path = this.path,\r
1999           advanceLength = advance * path.getTotalLength();\r
2000       /*全体の距離から、現在進めている距離を算出して、そこから、現在点を導き出す*/\r
2001       var point = path.getPointAtLength(advanceLength),\r
2002           rotate = 0; //追加すべき角度\r
2003       if (this.rotate === "0") {\r
2004         return point.x+ "," +point.y;\r
2005       } else if (this.rotate === "auto") {\r
2006         rotate = 0;\r
2007       } else if (this.rotate === "auto-reverse") {\r
2008         rotate = 180;\r
2009       } else {\r
2010         rotate = +this.rotate;\r
2011       }\r
2012       return point.x+ "," +point.y + this.getRotate(path, advanceLength, rotate);\r
2013     }\r
2014   } )\r
2015   .on("init", function (ele) {\r
2016     if (!ele || !ele.parentNode) {\r
2017      return;\r
2018     }\r
2019     /*type属性で変更されないように($animateTransformElementのinitメソッドを参照のこと)*/\r
2020     this.type = "translate";\r
2021     /*isSumプロパティは常にtrueにしておく。animateTransform要素とは挙動が違うため\r
2022      * また、$aniamteTransformElementのtocallメソッド参照*/\r
2023     this.isSum = true;\r
2024     this.mode = this.getAttr("mode", "paced");\r
2025     this.rotate = this.getAttr("rotate", "0");\r
2026     this.path = this.path.cloneNode(true);\r
2027     var mpath = ele.getElementsByTagNameNS(this.path.namespaceURI, "mpath");\r
2028     /*$animateは後で、プロパティを書き換えるために使う。tocallメソッドも参照*/\r
2029     var $animate = this.$animateElement;\r
2030     if (mpath.length) {\r
2031       var p = ele.ownerDocument.getElementById(\r
2032         mpath[0].getAttributeNS("http://www.w3.org/1999/xlink", "href").slice(1)\r
2033       );\r
2034       p && this.path.setAttributeNS(null, "d", p.getAttributeNS(null, "d"));\r
2035       this.$animateElement = $animate.up().mix ( {tocall: this._tocallForPath} );\r
2036     } else if (ele.hasAttributeNS(null, "path")) {\r
2037       this.path.setAttributeNS(null, "d", ele.getAttributeNS(null, "path"));\r
2038       this.$animateElement = $animate.up().mix ( {tocall: this._tocallForPath} );\r
2039     }\r
2040   } );\r
2041 \r
2042 /*$svgEventオブジェクトは、SVGEvent発火を監視するためのオブジェクト*/\r
2043 base("$frame").up("$svgEvent").mix( {\r
2044   /*イベントのスケジュール記録*/\r
2045   first: null,\r
2046   \r
2047   /*タイムラインの最後のキャッシュ*/\r
2048   lastTimeLine: null,\r
2049   \r
2050   /*setTimeTable メソッドはスケジュールの記録をつけるためのメソッド*/\r
2051   setTimeTable: function () {\r
2052     var timelines = this.timelines;\r
2053       for (var i=0, obj = null;i<timelines.length;++i) {\r
2054         if (!timelines[i].target || !timelines[i].isResolved) {\r
2055           /*一度スケジュールを作成して実行したり、未解決だったタイムラインは、処理しない*/\r
2056           continue;\r
2057         }\r
2058         /*タイムラインから、beginEventとendEventを発火するスケジュールを作成*/\r
2059         var timeline = timelines[i],\r
2060             begin = timeline.begin,\r
2061             target = timeline.target,\r
2062             simpleDur = timeline.simpleDuration,\r
2063             activeTime = timeline.activeTime;\r
2064         var first = {\r
2065               frame: begin,\r
2066               eventType: "begin",\r
2067               target: target,\r
2068               next: {\r
2069                 frame: begin+activeTime,\r
2070                 eventType: "end",\r
2071                 target: target,\r
2072                 next: null\r
2073               }\r
2074             };\r
2075         if (obj) {\r
2076           obj.next.next = first;\r
2077         } else if (!this.first) {\r
2078           /*firstプロパティがすでにある場合、書き換えない*/\r
2079           this.first = first;\r
2080         } else {\r
2081           /*firstプロパティがある場合、そのリストのリンクをたどっていって、\r
2082            * 最後の尾を変数firstとつなげる*/\r
2083           var fst = this.first;\r
2084           while(fst.next) {\r
2085             fst = fst.next;\r
2086           }\r
2087           fst.next = first;\r
2088         }\r
2089         obj = first;\r
2090         if (simpleDur && (activeTime !== simpleDur)) {\r
2091           /*活動継続時間と単純持続時間が異なるとき、repeatイベントを設定\r
2092            * ただし、repeatイベントはendイベントが発生する前に起きるものと仮定*/\r
2093           for (var a = first, m= begin + simpleDur, n=1;m < begin + activeTime; m+=simpleDur, ++n) {\r
2094             a.next = {\r
2095               frame: m,\r
2096               eventType: "repeat",\r
2097               target: target,\r
2098               /*リピートの回数 (n >= 1)*/\r
2099               count: n,\r
2100               next: a.next\r
2101             };\r
2102             a = a.next;\r
2103           }\r
2104         }\r
2105         /*一度、スケジュールを作っておいたタイムラインは次回から処理しないようにする*/\r
2106         timeline.target = null;\r
2107       }\r
2108     timelines = obj = first = begin = target = simpleDur = activeTime = void 0;\r
2109   },\r
2110   \r
2111   $frame: base("$frame"),\r
2112   \r
2113   setFrame: function (num) {\r
2114     var timelines = this.timelines,\r
2115         lastTimeLine = timelines[timelines.length-1],\r
2116         s = this.$frame.setFrame(num);\r
2117     /*キャッシュのlastTimeLineプロパティを使って、再びスケジュールの計算をさせないようにする*/\r
2118     if (this.lastTimeLine !== lastTimeLine) {\r
2119       this.lastTimeLine = lastTimeLine;\r
2120       this.setTimeTable();\r
2121     }\r
2122     /*スケジュールに記録しておいたものを実行して、イベントを発火\r
2123      * また、発火した場合は記録から取り除いて、次回から再び発火しないようにする*/\r
2124     var obj = this.first,\r
2125         cobj = obj,\r
2126         floor = Math.floor;\r
2127     while(obj) {\r
2128       var frame = obj.frame,\r
2129           target = obj.target,\r
2130           detail = 0;\r
2131       if (frame <= num) {\r
2132         /*IE11ではSVGEventsやDOMEventsを使うと問題が起きるため、MouseEventsで代用する*/\r
2133         if (obj.eventType === "repeat") {\r
2134           /*detailは何回リピートしたか*/\r
2135           detail = obj.count;\r
2136         }\r
2137         /*ポインタの連結を変更することで、リストからobj を除去\r
2138          * 一度除去したものはイベントを発生させない*/\r
2139         cobj.next = obj.next;\r
2140         if (this.first === obj) {\r
2141           cobj = obj.next;\r
2142           this.first = cobj;\r
2143         } else {\r
2144           cobj = obj;\r
2145         }\r
2146         var evt = target.ownerDocument.createEvent("MouseEvents");\r
2147         evt.initMouseEvent(obj.eventType+"Event" ,true, true, window, detail, 0, 0, 0, 0, false, false, false, false, 0, target);\r
2148         target.dispatchEvent(evt);\r
2149       } else {\r
2150         /*next プロパティを書き換えるためのobj オブジェクトのキャッシュ*/\r
2151         cobj = obj;\r
2152       }\r
2153       obj = obj.next;\r
2154     }\r
2155     obj = num = first = frame = target = cobj = detail = void 0;\r
2156     return s;\r
2157   }\r
2158 } );\r
2159 \r
2160 function getDocument() \r
2161 {\r
2162   var svg = document.getElementsByTagName("object"),\r
2163       svgns = "http://www.w3.org/2000/svg";\r
2164   if (svg) {\r
2165     for (var i=0;i<svg.length;++i) {\r
2166       getElement( svg[i].getSVGDocument() );\r
2167     }\r
2168   }\r
2169   /*SVG文書から呼び出されたときも処理する*/\r
2170   getElement(document);\r
2171   /*idはアニメの中止ハンドル*/\r
2172   var id = __step(),\r
2173       idstop = function() {\r
2174         /*アニメーションを中止する関数*/\r
2175         window.cancelAnimationRequest && cancelAnimationRequest(id);\r
2176       };\r
2177   base("$frame").on("pauseAnimation", idstop);\r
2178   window.addEventListener("unload", idstop);\r
2179   \r
2180   /*文書からアニメーション関連要素を取り出して、オブジェクトを初期化*/\r
2181   function getElement (svgDoc) {\r
2182       var $set = base("$calcMode").$attribute.$setElement,\r
2183           $animate = $set.$animateElement;\r
2184       init($set, "set");\r
2185       init($animate, "animate");\r
2186       init($animate, "animateColor");\r
2187       init($animate.$animateTransformElement, "animateTransform");\r
2188       init($animate.$animateTransformElement.$motionElement, "animateMotion");\r
2189         /*リンクのハッシュ読み取りで、ハイパーリンクのイベント処理\r
2190        * たとえば、a要素のxlink:href="#hoge"で、<animate id="hoge"のとき、\r
2191        * animate要素がハイパーリンク作動と同時に動くようになる\r
2192        * \r
2193        * ただし、SMIL アニメーションの仕様では、\r
2194        * animate要素の開始時刻まで、時を進める操作をするだけ*/\r
2195        svgDoc.defaultView.addEventListener("hashchange", function() {\r
2196            var hash = svgDoc.defaultView.location.hash.slice(1);\r
2197            svgDoc.getElementById(hash).beginElement();\r
2198          });\r
2199 \r
2200       function init (obj, name) {\r
2201         var eles = svgDoc.getElementsByTagNameNS(svgns, name)\r
2202         for (var i=0;i<eles.length;++i) {\r
2203           obj.up().init(eles.item(i));\r
2204         }\r
2205         eles = obj = void 0;\r
2206       };\r
2207   };\r
2208 }\r
2209 \r
2210 window.addEventListener && window.addEventListener("load", getDocument);\r
2211 \r
2212 function __step() {\r
2213 /*EdgeはhasFeatureメソッドでtrueを返す*/\r
2214 if (!document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Animation", "1.1")\r
2215     || window.navigator.userAgent.toLowerCase().indexOf("edge")) {\r
2216   if (window.requestAnimationFrame && requestAnimationFrame) {\r
2217     /*IE11などSMILアニメーションに対応していないブラウザ用*/\r
2218     /*cancelはアニメーションの中止ハンドル*/\r
2219     var cancel = {\r
2220        handle: null\r
2221       };\r
2222     (function(frame) {\r
2223       var $frame = base("$frame"),\r
2224           $f = $frame.$svgEvent,\r
2225           _cancel = cancel; /*cancelのエイリアス*/\r
2226       _cancel.handle = requestAnimationFrame(step);\r
2227       function step() {\r
2228         if (!$frame.isPaused) {\r
2229           frame++;\r
2230           try {\r
2231             $f.setFrame(frame);\r
2232           } catch(e) {\r
2233           }\r
2234           _cancel.handle = requestAnimationFrame(step);\r
2235         }\r
2236       };\r
2237     })(-1);\r
2238     return cancel;\r
2239   } else {\r
2240     setInterval( (function(frame) {\r
2241       var $f = base("$frame").$svgEvent;\r
2242       return function () {\r
2243         frame++;\r
2244         $f.setFrame(frame);\r
2245       };\r
2246     })(-1), 1 );\r
2247   }\r
2248 }\r
2249 }\r
2250 //#endif // _SMIL_IDL_\r