Skip to content

Commit 5523fa1

Browse files
Mugen87Mugen87
committed
Added THREE.Timer.
1 parent 220c160 commit 5523fa1

File tree

4 files changed

+296
-19
lines changed

4 files changed

+296
-19
lines changed

‎examples/js/misc/Timer.js

+143
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
/**
2+
* @author Mugen87 / https://github.com/Mugen87
3+
*/
4+
5+
THREE.Timer = ( function () {
6+
7+
function Timer() {
8+
9+
this._previousTime = 0;
10+
this._currentTime = 0;
11+
12+
this._deltaTime = 0;
13+
this._elapsedTime = 0;
14+
15+
this._timeScale = 1;
16+
17+
this._useFixedDeltaTime = false;
18+
this._fixedDeltaTime = 16.67; // ms, corresponds to approx. 60 FPS
19+
20+
// use Page Visibility API to avoid large time delta values
21+
22+
this._usePageVisibilityAPI = ( typeof document !== 'undefined' && document.hidden !== undefined );
23+
24+
if ( this._usePageVisibilityAPI === true ) {
25+
26+
this._pageVisibilityHandler = handleVisibilityChange.bind( this );
27+
28+
document.addEventListener( 'visibilitychange', this._pageVisibilityHandler, false );
29+
30+
}
31+
32+
}
33+
34+
Object.assign( Timer.prototype, {
35+
36+
disableFixedDeltaTime: function () {
37+
38+
this._useFixedDeltaTime = false;
39+
40+
return this;
41+
42+
},
43+
44+
dispose: function () {
45+
46+
if ( this._usePageVisibilityAPI === true ) {
47+
48+
document.removeEventListener( 'visibilitychange', this._pageVisibilityHandler );
49+
50+
}
51+
52+
return this;
53+
54+
},
55+
56+
enableFixedDeltaTime: function () {
57+
58+
this._useFixedDeltaTime = true;
59+
60+
return this;
61+
62+
},
63+
64+
getDeltaTime: function () {
65+
66+
return this._deltaTime / 1000;
67+
68+
},
69+
70+
getElapsedTime: function () {
71+
72+
return this._elapsedTime / 1000;
73+
74+
},
75+
76+
getFixedDeltaTime: function () {
77+
78+
return this._fixedDeltaTime / 1000;
79+
80+
},
81+
82+
getTimeScale: function () {
83+
84+
return this._timeScale;
85+
86+
},
87+
88+
setFixedDeltaTime: function ( fixedDeltaTime ) {
89+
90+
this._fixedDeltaTime = fixedDeltaTime * 1000;
91+
92+
return this;
93+
94+
},
95+
96+
setTimeScale: function ( timeScale ) {
97+
98+
this._timeScale = timeScale;
99+
100+
return this;
101+
102+
},
103+
104+
now: function () {
105+
106+
return ( typeof performance === 'undefined' ? Date : performance ).now();
107+
108+
},
109+
110+
update: function () {
111+
112+
if ( this._useFixedDeltaTime === true ) {
113+
114+
this._deltaTime = this._fixedDeltaTime;
115+
116+
} else {
117+
118+
this._previousTime = this._currentTime;
119+
this._currentTime = this.now();
120+
121+
this._deltaTime = this._currentTime - this._previousTime;
122+
123+
}
124+
125+
this._deltaTime *= this._timeScale;
126+
127+
this._elapsedTime += this._deltaTime; // _elapsedTime is the accumulation of all previous deltas
128+
129+
return this;
130+
131+
}
132+
133+
} );
134+
135+
function handleVisibilityChange() {
136+
137+
if ( document.hidden === false ) this._currentTime = this.now(); // reset
138+
139+
}
140+
141+
return Timer;
142+
143+
} )();

‎examples/jsm/misc/Timer.js

+147
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
/**
2+
* @author Mugen87 / https://github.com/Mugen87
3+
*/
4+
5+
6+
7+
var Timer = ( function () {
8+
9+
function Timer() {
10+
11+
this._previousTime = 0;
12+
this._currentTime = 0;
13+
14+
this._deltaTime = 0;
15+
this._elapsedTime = 0;
16+
17+
this._timeScale = 1;
18+
19+
this._useFixedDeltaTime = false;
20+
this._fixedDeltaTime = 16.67; // ms, corresponds to approx. 60 FPS
21+
22+
// use Page Visibility API to avoid large time delta values
23+
24+
this._usePageVisibilityAPI = ( typeof document !== 'undefined' && document.hidden !== undefined );
25+
26+
if ( this._usePageVisibilityAPI === true ) {
27+
28+
this._pageVisibilityHandler = handleVisibilityChange.bind( this );
29+
30+
document.addEventListener( 'visibilitychange', this._pageVisibilityHandler, false );
31+
32+
}
33+
34+
}
35+
36+
Object.assign( Timer.prototype, {
37+
38+
disableFixedDeltaTime: function () {
39+
40+
this._useFixedDeltaTime = false;
41+
42+
return this;
43+
44+
},
45+
46+
dispose: function () {
47+
48+
if ( this._usePageVisibilityAPI === true ) {
49+
50+
document.removeEventListener( 'visibilitychange', this._pageVisibilityHandler );
51+
52+
}
53+
54+
return this;
55+
56+
},
57+
58+
enableFixedDeltaTime: function () {
59+
60+
this._useFixedDeltaTime = true;
61+
62+
return this;
63+
64+
},
65+
66+
getDeltaTime: function () {
67+
68+
return this._deltaTime / 1000;
69+
70+
},
71+
72+
getElapsedTime: function () {
73+
74+
return this._elapsedTime / 1000;
75+
76+
},
77+
78+
getFixedDeltaTime: function () {
79+
80+
return this._fixedDeltaTime / 1000;
81+
82+
},
83+
84+
getTimeScale: function () {
85+
86+
return this._timeScale;
87+
88+
},
89+
90+
setFixedDeltaTime: function ( fixedDeltaTime ) {
91+
92+
this._fixedDeltaTime = fixedDeltaTime * 1000;
93+
94+
return this;
95+
96+
},
97+
98+
setTimeScale: function ( timeScale ) {
99+
100+
this._timeScale = timeScale;
101+
102+
return this;
103+
104+
},
105+
106+
now: function () {
107+
108+
return ( typeof performance === 'undefined' ? Date : performance ).now();
109+
110+
},
111+
112+
update: function () {
113+
114+
if ( this._useFixedDeltaTime === true ) {
115+
116+
this._deltaTime = this._fixedDeltaTime;
117+
118+
} else {
119+
120+
this._previousTime = this._currentTime;
121+
this._currentTime = this.now();
122+
123+
this._deltaTime = this._currentTime - this._previousTime;
124+
125+
}
126+
127+
this._deltaTime *= this._timeScale;
128+
129+
this._elapsedTime += this._deltaTime; // _elapsedTime is the accumulation of all previous deltas
130+
131+
return this;
132+
133+
}
134+
135+
} );
136+
137+
function handleVisibilityChange() {
138+
139+
if ( document.hidden === false ) this._currentTime = this.now(); // reset
140+
141+
}
142+
143+
return Timer;
144+
145+
} )();
146+
147+
export { Timer };

‎examples/webgl_morphtargets_sphere.html

+5-19
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,11 @@
1919

2020
import { OrbitControls } from './jsm/controls/OrbitControls.js';
2121
import { GLTFLoader } from './jsm/loaders/GLTFLoader.js';
22+
import { Timer } from './jsm/misc/Timer.js';
2223

2324
var container;
2425

25-
var camera, scene, renderer, clock;
26+
var camera, scene, renderer, timer;
2627

2728
var mesh;
2829

@@ -41,7 +42,7 @@
4142

4243
scene = new THREE.Scene();
4344

44-
clock = new THREE.Clock();
45+
timer = new Timer();
4546

4647
var light = new THREE.PointLight( 0xff2200, 0.7 );
4748
light.position.set( 100, 100, 100 );
@@ -109,8 +110,6 @@
109110

110111
window.addEventListener( 'resize', onWindowResize, false );
111112

112-
document.addEventListener( 'visibilitychange', onVisibilityChange );
113-
114113
}
115114

116115
function onWindowResize() {
@@ -122,30 +121,17 @@
122121

123122
}
124123

125-
function onVisibilityChange() {
126-
127-
if ( document.hidden === true ) {
128-
129-
clock.stop();
130-
131-
} else {
132-
133-
clock.start();
134-
135-
}
136-
137-
}
138-
139124
function animate() {
140125

141126
requestAnimationFrame( animate );
127+
timer.update();
142128
render();
143129

144130
}
145131

146132
function render() {
147133

148-
var delta = clock.getDelta();
134+
var delta = timer.getDeltaTime();
149135

150136
if ( mesh !== undefined ) {
151137

‎utils/modularize.js

+1
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,7 @@ var files = [
124124
{ path: 'misc/MorphBlendMesh.js', dependencies: [], ignoreList: [] },
125125
{ path: 'misc/Ocean.js', dependencies: [ { name: 'OceanShaders', path: 'shaders/OceanShaders.js' } ], ignoreList: [] },
126126
{ path: 'misc/RollerCoaster.js', dependencies: [], ignoreList: [] },
127+
{ path: 'misc/Timer.js', dependencies: [], ignoreList: [] },
127128
{ path: 'misc/Volume.js', dependencies: [ { name: 'VolumeSlice', path: 'misc/VolumeSlice.js' } ], ignoreList: [] },
128129
{ path: 'misc/VolumeSlice.js', dependencies: [], ignoreList: [] },
129130

0 commit comments

Comments
 (0)