app.js 5.4 KB
Newer Older
M
r69  
Mr.doob 已提交
1 2 3 4
/**
 * @author mrdoob / http://mrdoob.com/
 */

M
r70  
Mr.doob 已提交
5
var APP = {
M
r69  
Mr.doob 已提交
6

M
r70  
Mr.doob 已提交
7
	Player: function () {
M
r69  
Mr.doob 已提交
8

M
r70  
Mr.doob 已提交
9 10
		var loader = new THREE.ObjectLoader();
		var camera, scene, renderer;
M
r69  
Mr.doob 已提交
11

M
r71  
Mr.doob 已提交
12
		var events = {};
M
r69  
Mr.doob 已提交
13

M
r87  
Mr.doob 已提交
14 15 16
		var dom = document.createElement( 'div' );

		this.dom = dom;
M
r69  
Mr.doob 已提交
17

M
r70  
Mr.doob 已提交
18 19
		this.width = 500;
		this.height = 500;
M
r69  
Mr.doob 已提交
20

M
r70  
Mr.doob 已提交
21
		this.load = function ( json ) {
M
r69  
Mr.doob 已提交
22

M
r70  
Mr.doob 已提交
23
			renderer = new THREE.WebGLRenderer( { antialias: true } );
M
r71  
Mr.doob 已提交
24
			renderer.setClearColor( 0x000000 );
M
r70  
Mr.doob 已提交
25
			renderer.setPixelRatio( window.devicePixelRatio );
M
r74  
Mr.doob 已提交
26

M
r88  
Mr.doob 已提交
27
			var project = json.project;
M
r79  
Mr.doob 已提交
28

M
r88  
Mr.doob 已提交
29 30 31 32
			if ( project.gammaInput ) renderer.gammaInput = true;
			if ( project.gammaOutput ) renderer.gammaOutput = true;
			if ( project.shadows ) renderer.shadowMap.enabled = true;
			if ( project.vr ) renderer.vr.enabled = true;
M
r87  
Mr.doob 已提交
33 34

			dom.appendChild( renderer.domElement );
M
r69  
Mr.doob 已提交
35

M
r71  
Mr.doob 已提交
36 37
			this.setScene( loader.parse( json.scene ) );
			this.setCamera( loader.parse( json.camera ) );
M
r69  
Mr.doob 已提交
38

M
r71  
Mr.doob 已提交
39
			events = {
M
r72  
Mr.doob 已提交
40 41 42
				init: [],
				start: [],
				stop: [],
M
r70  
Mr.doob 已提交
43 44 45 46 47
				keydown: [],
				keyup: [],
				mousedown: [],
				mouseup: [],
				mousemove: [],
M
r71  
Mr.doob 已提交
48 49 50
				touchstart: [],
				touchend: [],
				touchmove: [],
M
r70  
Mr.doob 已提交
51 52 53
				update: []
			};

M
r74  
Mr.doob 已提交
54
			var scriptWrapParams = 'player,renderer,scene,camera';
M
r72  
Mr.doob 已提交
55
			var scriptWrapResultObj = {};
M
r74  
Mr.doob 已提交
56

M
r72  
Mr.doob 已提交
57
			for ( var eventKey in events ) {
M
r74  
Mr.doob 已提交
58

M
r72  
Mr.doob 已提交
59 60
				scriptWrapParams += ',' + eventKey;
				scriptWrapResultObj[ eventKey ] = eventKey;
M
r74  
Mr.doob 已提交
61

M
r72  
Mr.doob 已提交
62
			}
M
r74  
Mr.doob 已提交
63 64

			var scriptWrapResult = JSON.stringify( scriptWrapResultObj ).replace( /\"/g, '' );
M
r72  
Mr.doob 已提交
65

M
r70  
Mr.doob 已提交
66 67 68 69
			for ( var uuid in json.scripts ) {

				var object = scene.getObjectByProperty( 'uuid', uuid, true );

M
r74  
Mr.doob 已提交
70 71 72 73 74 75 76
				if ( object === undefined ) {

					console.warn( 'APP.Player: Script without object.', uuid );
					continue;

				}

M
r71  
Mr.doob 已提交
77
				var scripts = json.scripts[ uuid ];
M
r70  
Mr.doob 已提交
78

M
r71  
Mr.doob 已提交
79
				for ( var i = 0; i < scripts.length; i ++ ) {
M
r70  
Mr.doob 已提交
80

M
r71  
Mr.doob 已提交
81
					var script = scripts[ i ];
M
r70  
Mr.doob 已提交
82

M
r74  
Mr.doob 已提交
83
					var functions = ( new Function( scriptWrapParams, script.source + '\nreturn ' + scriptWrapResult + ';' ).bind( object ) )( this, renderer, scene, camera );
M
r70  
Mr.doob 已提交
84

M
r71  
Mr.doob 已提交
85
					for ( var name in functions ) {
M
r70  
Mr.doob 已提交
86

M
r71  
Mr.doob 已提交
87
						if ( functions[ name ] === undefined ) continue;
M
r70  
Mr.doob 已提交
88

M
r71  
Mr.doob 已提交
89
						if ( events[ name ] === undefined ) {
M
r70  
Mr.doob 已提交
90

M
r74  
Mr.doob 已提交
91
							console.warn( 'APP.Player: Event type not supported (', name, ')' );
M
r70  
Mr.doob 已提交
92 93 94 95
							continue;

						}

M
r71  
Mr.doob 已提交
96
						events[ name ].push( functions[ name ].bind( object ) );
M
r70  
Mr.doob 已提交
97 98 99 100

					}

				}
M
r69  
Mr.doob 已提交
101 102 103

			}

M
r72  
Mr.doob 已提交
104 105
			dispatch( events.init, arguments );

M
r70  
Mr.doob 已提交
106
		};
M
r69  
Mr.doob 已提交
107

M
r70  
Mr.doob 已提交
108
		this.setCamera = function ( value ) {
M
r69  
Mr.doob 已提交
109

M
r70  
Mr.doob 已提交
110 111 112
			camera = value;
			camera.aspect = this.width / this.height;
			camera.updateProjectionMatrix();
M
r69  
Mr.doob 已提交
113

M
r87  
Mr.doob 已提交
114
			if ( renderer.vr.enabled ) {
M
r71  
Mr.doob 已提交
115

M
r88  
Mr.doob 已提交
116
				dom.appendChild( WEBVR.createButton( renderer ) );
M
r71  
Mr.doob 已提交
117 118 119

			}

M
r70  
Mr.doob 已提交
120
		};
M
r69  
Mr.doob 已提交
121

M
r71  
Mr.doob 已提交
122 123 124 125
		this.setScene = function ( value ) {

			scene = value;

M
r74  
Mr.doob 已提交
126
		};
M
r71  
Mr.doob 已提交
127

M
r70  
Mr.doob 已提交
128
		this.setSize = function ( width, height ) {
M
r69  
Mr.doob 已提交
129

M
r70  
Mr.doob 已提交
130 131
			this.width = width;
			this.height = height;
M
r69  
Mr.doob 已提交
132

M
r79  
Mr.doob 已提交
133 134 135 136
			if ( camera ) {

				camera.aspect = this.width / this.height;
				camera.updateProjectionMatrix();
M
r69  
Mr.doob 已提交
137

M
r79  
Mr.doob 已提交
138 139 140 141 142 143 144
			}

			if ( renderer ) {

				renderer.setSize( width, height );

			}
M
r69  
Mr.doob 已提交
145

M
r70  
Mr.doob 已提交
146
		};
M
r69  
Mr.doob 已提交
147

M
r73  
Mr.doob 已提交
148
		function dispatch( array, event ) {
M
r69  
Mr.doob 已提交
149

M
r70  
Mr.doob 已提交
150
			for ( var i = 0, l = array.length; i < l; i ++ ) {
M
r69  
Mr.doob 已提交
151

M
r75  
Mr.doob 已提交
152
				array[ i ]( event );
M
r69  
Mr.doob 已提交
153

M
r70  
Mr.doob 已提交
154
			}
M
r69  
Mr.doob 已提交
155

M
r73  
Mr.doob 已提交
156
		}
M
r69  
Mr.doob 已提交
157

158
		var time, prevTime;
M
r69  
Mr.doob 已提交
159

160 161 162
		function animate() {

			time = performance.now();
M
r69  
Mr.doob 已提交
163

M
r75  
Mr.doob 已提交
164 165 166 167 168 169 170 171 172
			try {

				dispatch( events.update, { time: time, delta: time - prevTime } );

			} catch ( e ) {

				console.error( ( e.message || e ), ( e.stack || "" ) );

			}
M
r71  
Mr.doob 已提交
173

M
r87  
Mr.doob 已提交
174
			renderer.render( scene, camera );
M
r69  
Mr.doob 已提交
175

M
r71  
Mr.doob 已提交
176 177
			prevTime = time;

M
r73  
Mr.doob 已提交
178
		}
M
r69  
Mr.doob 已提交
179

M
r70  
Mr.doob 已提交
180
		this.play = function () {
M
r69  
Mr.doob 已提交
181

M
r87  
Mr.doob 已提交
182 183
			prevTime = performance.now();

M
r70  
Mr.doob 已提交
184 185 186 187 188
			document.addEventListener( 'keydown', onDocumentKeyDown );
			document.addEventListener( 'keyup', onDocumentKeyUp );
			document.addEventListener( 'mousedown', onDocumentMouseDown );
			document.addEventListener( 'mouseup', onDocumentMouseUp );
			document.addEventListener( 'mousemove', onDocumentMouseMove );
M
r71  
Mr.doob 已提交
189 190 191
			document.addEventListener( 'touchstart', onDocumentTouchStart );
			document.addEventListener( 'touchend', onDocumentTouchEnd );
			document.addEventListener( 'touchmove', onDocumentTouchMove );
M
r69  
Mr.doob 已提交
192

M
r72  
Mr.doob 已提交
193
			dispatch( events.start, arguments );
M
r70  
Mr.doob 已提交
194

M
r94  
Mr.doob 已提交
195
			renderer.setAnimationLoop( animate );
M
r74  
Mr.doob 已提交
196

M
r70  
Mr.doob 已提交
197 198 199 200 201 202 203 204 205
		};

		this.stop = function () {

			document.removeEventListener( 'keydown', onDocumentKeyDown );
			document.removeEventListener( 'keyup', onDocumentKeyUp );
			document.removeEventListener( 'mousedown', onDocumentMouseDown );
			document.removeEventListener( 'mouseup', onDocumentMouseUp );
			document.removeEventListener( 'mousemove', onDocumentMouseMove );
M
r71  
Mr.doob 已提交
206 207 208
			document.removeEventListener( 'touchstart', onDocumentTouchStart );
			document.removeEventListener( 'touchend', onDocumentTouchEnd );
			document.removeEventListener( 'touchmove', onDocumentTouchMove );
M
r70  
Mr.doob 已提交
209

M
r72  
Mr.doob 已提交
210
			dispatch( events.stop, arguments );
M
r70  
Mr.doob 已提交
211

M
r94  
Mr.doob 已提交
212
			renderer.setAnimationLoop( null );
M
r74  
Mr.doob 已提交
213

M
r70  
Mr.doob 已提交
214 215
		};

M
Mr.doob 已提交
216 217
		this.dispose = function () {

M
r87  
Mr.doob 已提交
218
			while ( dom.children.length ) {
M
Mr.doob 已提交
219

M
r87  
Mr.doob 已提交
220
				dom.removeChild( dom.firstChild );
M
Mr.doob 已提交
221 222 223 224 225

			}

			renderer.dispose();

M
r79  
Mr.doob 已提交
226 227 228 229
			camera = undefined;
			scene = undefined;
			renderer = undefined;

M
Mr.doob 已提交
230 231
		};

M
r70  
Mr.doob 已提交
232 233
		//

M
r73  
Mr.doob 已提交
234
		function onDocumentKeyDown( event ) {
M
r70  
Mr.doob 已提交
235

M
r71  
Mr.doob 已提交
236
			dispatch( events.keydown, event );
M
r70  
Mr.doob 已提交
237

M
r73  
Mr.doob 已提交
238
		}
M
r70  
Mr.doob 已提交
239

M
r73  
Mr.doob 已提交
240
		function onDocumentKeyUp( event ) {
M
r70  
Mr.doob 已提交
241

M
r71  
Mr.doob 已提交
242
			dispatch( events.keyup, event );
M
r70  
Mr.doob 已提交
243

M
r73  
Mr.doob 已提交
244
		}
M
r70  
Mr.doob 已提交
245

M
r73  
Mr.doob 已提交
246
		function onDocumentMouseDown( event ) {
M
r70  
Mr.doob 已提交
247

M
r71  
Mr.doob 已提交
248
			dispatch( events.mousedown, event );
M
r70  
Mr.doob 已提交
249

M
r73  
Mr.doob 已提交
250
		}
M
r70  
Mr.doob 已提交
251

M
r73  
Mr.doob 已提交
252
		function onDocumentMouseUp( event ) {
M
r70  
Mr.doob 已提交
253

M
r71  
Mr.doob 已提交
254
			dispatch( events.mouseup, event );
M
r70  
Mr.doob 已提交
255

M
r73  
Mr.doob 已提交
256
		}
M
r70  
Mr.doob 已提交
257

M
r73  
Mr.doob 已提交
258
		function onDocumentMouseMove( event ) {
M
r70  
Mr.doob 已提交
259

M
r71  
Mr.doob 已提交
260 261
			dispatch( events.mousemove, event );

M
r73  
Mr.doob 已提交
262
		}
M
r71  
Mr.doob 已提交
263

M
r73  
Mr.doob 已提交
264
		function onDocumentTouchStart( event ) {
M
r71  
Mr.doob 已提交
265 266 267

			dispatch( events.touchstart, event );

M
r73  
Mr.doob 已提交
268
		}
M
r71  
Mr.doob 已提交
269

M
r73  
Mr.doob 已提交
270
		function onDocumentTouchEnd( event ) {
M
r71  
Mr.doob 已提交
271 272 273

			dispatch( events.touchend, event );

M
r73  
Mr.doob 已提交
274
		}
M
r71  
Mr.doob 已提交
275

M
r73  
Mr.doob 已提交
276
		function onDocumentTouchMove( event ) {
M
r71  
Mr.doob 已提交
277 278

			dispatch( events.touchmove, event );
M
r69  
Mr.doob 已提交
279

M
r73  
Mr.doob 已提交
280
		}
M
r69  
Mr.doob 已提交
281

M
r70  
Mr.doob 已提交
282
	}
M
r69  
Mr.doob 已提交
283 284

};