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