1+ var Class = require ( '../utils/Class' ) ;
12var NOOP = require ( '../utils/NOOP' ) ;
23
3- // Abstracts away the use of RAF or setTimeOut for the core game update loop.
4- var RequestAnimationFrame = function ( )
5- {
6- // @property {boolean } isRunning - true if RequestAnimationFrame is running, otherwise false.
7- this . isRunning = false ;
4+ var RequestAnimationFrame = new Class ( {
85
9- this . callback = NOOP ;
6+ initialize :
107
11- this . tick = 0 ;
8+ /**
9+ * Abstracts away the use of RAF or setTimeOut for the core game update loop.
10+ * This is invoked automatically by the Phaser.Game instance.
11+ *
12+ * @class RequestAnimationFrame
13+ * @memberOf Phaser.DOM
14+ * @constructor
15+ * @since 3.0.0
16+ */
17+ function RequestAnimationFrame ( )
18+ {
19+ /**
20+ * True if RequestAnimationFrame is running, otherwise false.
21+ *
22+ * @property {boolean } isRunning
23+ * @default false
24+ * @since 3.0.0
25+ */
26+ this . isRunning = false ;
1227
13- // @property {boolean } isSetTimeOut - True if the browser is using setTimeout instead of rAf.
14- this . isSetTimeOut = false ;
28+ /**
29+ * The callback to be invoked each step.
30+ *
31+ * @property {function } callback
32+ * @since 3.0.0
33+ */
34+ this . callback = NOOP ;
1535
16- // @property {number } timeOutID - The callback setTimeout or rAf callback ID used when calling cancel.
17- this . timeOutID = null ;
36+ /**
37+ * The most recent timestamp. Either a DOMHighResTimeStamp under RAF or `Date.now` under SetTimeout.
38+ *
39+ * @property {DOMHighResTimeStamp|number } tick
40+ * @default 0
41+ * @since 3.0.0
42+ */
43+ this . tick = 0 ;
44+
45+ /**
46+ * True if the step is using setTimeout instead of RAF.
47+ *
48+ * @property {boolean } isSetTimeOut
49+ * @default false
50+ * @since 3.0.0
51+ */
52+ this . isSetTimeOut = false ;
53+
54+ /**
55+ * The setTimeout or RAF callback ID used when canceling them.
56+ *
57+ * @property {?number } timeOutID
58+ * @default null
59+ * @since 3.0.0
60+ */
61+ this . timeOutID = null ;
62+
63+ /**
64+ * The previous time the step was called.
65+ *
66+ * @property {number } lastTime
67+ * @default 0
68+ * @since 3.0.0
69+ */
70+ this . lastTime = 0 ;
1871
19- var _this = this ;
72+ var _this = this ;
2073
21- // timestamp = DOMHighResTimeStamp
22- var step = function ( timestamp )
23- {
24- _this . tick = timestamp ;
74+ /**
75+ * The RAF step function.
76+ * Updates the local tick value, invokes the callback and schedules another call to requestAnimationFrame.
77+ *
78+ * @property {function } step
79+ * @since 3.0.0
80+ */
81+ this . step = function step ( timestamp )
82+ {
83+ // DOMHighResTimeStamp
84+ _this . lastTime = _this . tick ;
2585
26- _this . callback ( timestamp ) ;
86+ _this . tick = timestamp ;
2787
28- _this . timeOutID = window . requestAnimationFrame ( step ) ;
29- } ;
88+ _this . callback ( timestamp ) ;
3089
31- var stepTimeout = function ( )
32- {
33- var d = Date . now ( ) ;
90+ _this . timeOutID = window . requestAnimationFrame ( step ) ;
91+ } ;
3492
35- _this . tick = d ;
93+ /**
94+ * The SetTimeout step function.
95+ * Updates the local tick value, invokes the callback and schedules another call to setTimeout.
96+ *
97+ * @property {function } stepTimeout
98+ * @since 3.0.0
99+ */
100+ this . stepTimeout = function stepTimeout ( )
101+ {
102+ var d = Date . now ( ) ;
36103
37- _this . callback ( d ) ;
104+ var delay = Math . max ( 16 + _this . lastTime - d , 0 ) ;
38105
39- _this . timeOutID = window . setTimeout ( stepTimeout , _this . timeToCall ) ;
40- } ;
106+ _this . lastTime = _this . tick ;
41107
42- this . step = step ;
43- this . stepTimeout = stepTimeout ;
44- } ;
108+ _this . tick = d ;
45109
46- RequestAnimationFrame . prototype . constructor = RequestAnimationFrame ;
110+ _this . callback ( d ) ;
47111
48- RequestAnimationFrame . prototype = {
112+ _this . timeOutID = window . setTimeout ( stepTimeout , delay ) ;
113+ } ;
114+ } ,
49115
50- // Starts the requestAnimationFrame running or setTimeout if unavailable in browser
116+ /**
117+ * Starts the requestAnimationFrame or setTimeout process running.
118+ *
119+ * @method Phaser.DOM.RequestAnimationFrame#start
120+ * @since 3.0.0
121+ *
122+ * @param {function } callback - The callback to invoke each step.
123+ * @param {boolean } forceSetTimeOut - Should it use SetTimeout, even if RAF is available?
124+ */
51125 start : function ( callback , forceSetTimeOut )
52126 {
127+ if ( this . isRunning )
128+ {
129+ return ;
130+ }
131+
53132 this . callback = callback ;
54133
55134 this . isSetTimeOut = forceSetTimeOut ;
56135
57136 this . isRunning = true ;
58137
59- var _this = this ;
60-
61- this . timeOutID = ( forceSetTimeOut ) ? window . setTimeout ( _this . stepTimeout , 0 ) : window . requestAnimationFrame ( _this . step ) ;
138+ this . timeOutID = ( forceSetTimeOut ) ? window . setTimeout ( this . stepTimeout , 0 ) : window . requestAnimationFrame ( this . step ) ;
62139 } ,
63140
64- // Stops the requestAnimationFrame from running.
141+ /**
142+ * Stops the requestAnimationFrame or setTimeout from running.
143+ *
144+ * @method Phaser.DOM.RequestAnimationFrame#stop
145+ * @since 3.0.0
146+ */
65147 stop : function ( )
66148 {
67149 this . isRunning = false ;
@@ -76,13 +158,19 @@ RequestAnimationFrame.prototype = {
76158 }
77159 } ,
78160
161+ /**
162+ * Stops the step from running and clears the callback reference.
163+ *
164+ * @method Phaser.DOM.RequestAnimationFrame#destroy
165+ * @since 3.0.0
166+ */
79167 destroy : function ( )
80168 {
81169 this . stop ( ) ;
82170
83171 this . callback = NOOP ;
84172 }
85173
86- } ;
174+ } ) ;
87175
88176module . exports = RequestAnimationFrame ;
0 commit comments