1
+ var Class = require ( '../utils/Class' ) ;
1
2
var NOOP = require ( '../utils/NOOP' ) ;
2
3
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 ( {
8
5
9
- this . callback = NOOP ;
6
+ initialize :
10
7
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 ;
12
27
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 ;
15
35
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 ;
18
71
19
- var _this = this ;
72
+ var _this = this ;
20
73
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 ;
25
85
26
- _this . callback ( timestamp ) ;
86
+ _this . tick = timestamp ;
27
87
28
- _this . timeOutID = window . requestAnimationFrame ( step ) ;
29
- } ;
88
+ _this . callback ( timestamp ) ;
30
89
31
- var stepTimeout = function ( )
32
- {
33
- var d = Date . now ( ) ;
90
+ _this . timeOutID = window . requestAnimationFrame ( step ) ;
91
+ } ;
34
92
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 ( ) ;
36
103
37
- _this . callback ( d ) ;
104
+ var delay = Math . max ( 16 + _this . lastTime - d , 0 ) ;
38
105
39
- _this . timeOutID = window . setTimeout ( stepTimeout , _this . timeToCall ) ;
40
- } ;
106
+ _this . lastTime = _this . tick ;
41
107
42
- this . step = step ;
43
- this . stepTimeout = stepTimeout ;
44
- } ;
108
+ _this . tick = d ;
45
109
46
- RequestAnimationFrame . prototype . constructor = RequestAnimationFrame ;
110
+ _this . callback ( d ) ;
47
111
48
- RequestAnimationFrame . prototype = {
112
+ _this . timeOutID = window . setTimeout ( stepTimeout , delay ) ;
113
+ } ;
114
+ } ,
49
115
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
+ */
51
125
start : function ( callback , forceSetTimeOut )
52
126
{
127
+ if ( this . isRunning )
128
+ {
129
+ return ;
130
+ }
131
+
53
132
this . callback = callback ;
54
133
55
134
this . isSetTimeOut = forceSetTimeOut ;
56
135
57
136
this . isRunning = true ;
58
137
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 ) ;
62
139
} ,
63
140
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
+ */
65
147
stop : function ( )
66
148
{
67
149
this . isRunning = false ;
@@ -76,13 +158,19 @@ RequestAnimationFrame.prototype = {
76
158
}
77
159
} ,
78
160
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
+ */
79
167
destroy : function ( )
80
168
{
81
169
this . stop ( ) ;
82
170
83
171
this . callback = NOOP ;
84
172
}
85
173
86
- } ;
174
+ } ) ;
87
175
88
176
module . exports = RequestAnimationFrame ;
0 commit comments