浏览代码

Editor: Scripting working again.

Mr.doob 10 年之前
父节点
当前提交
7431f1a3e0

+ 2 - 5
editor/index.html

@@ -123,10 +123,7 @@
 
 
 					if ( state !== undefined ) {
 					if ( state !== undefined ) {
 
 
-						var loader = new THREE.ObjectLoader();
-						var scene = loader.parse( state );
-
-						editor.setScene( scene );
+						editor.fromJSON( state );
 
 
 					}
 					}
 
 
@@ -160,7 +157,7 @@
 
 
 						timeout = setTimeout( function () {
 						timeout = setTimeout( function () {
 
 
-							editor.storage.set( editor.scene.toJSON() );
+							editor.storage.set( editor.toJSON() );
 
 
 							editor.signals.savingFinished.dispatch();
 							editor.signals.savingFinished.dispatch();
 
 

+ 46 - 1
editor/js/Editor.js

@@ -74,7 +74,7 @@ var Editor = function () {
 	this.geometries = {};
 	this.geometries = {};
 	this.materials = {};
 	this.materials = {};
 	this.textures = {};
 	this.textures = {};
-	// this.scripts = {};
+	this.scripts = {};
 
 
 	this.selected = null;
 	this.selected = null;
 	this.helpers = {};
 	this.helpers = {};
@@ -355,6 +355,51 @@ Editor.prototype = {
 
 
 		this.focus( this.scene.getObjectById( id, true ) );
 		this.focus( this.scene.getObjectById( id, true ) );
 
 
+	},
+
+	//
+
+	fromJSON: function ( json ) {
+
+		var loader = new THREE.ObjectLoader();
+
+		// backwards
+
+		if ( json.scene === undefined ) {
+
+			var scene = loader.parse( json );
+
+			this.setScene( scene );
+
+			return;
+
+		}
+
+		// TODO: Clean this up somehow
+
+		var camera = loader.parse( json.camera );
+
+		this.camera.position.copy( camera.position );
+		this.camera.rotation.copy( camera.rotation );
+		this.camera.aspect = camera.aspect;
+		this.camera.near = camera.near;
+		this.camera.far = camera.far;
+		
+		this.setScene( loader.parse( json.scene ) );
+		this.scripts = json.scripts;
+
+	},
+
+	toJSON: function () {
+
+		return {
+
+			camera: this.camera.toJSON(),
+			scene: this.scene.toJSON(),
+			scripts: this.scripts
+
+		};
+
 	}
 	}
 
 
 }
 }

+ 14 - 41
editor/js/Menubar.File.js

@@ -213,48 +213,21 @@ Menubar.File = function ( editor ) {
 			'	</head>',
 			'	</head>',
 			'	<body ontouchstart="">',
 			'	<body ontouchstart="">',
 			'		<script src="js/three.min.js"></script>',
 			'		<script src="js/three.min.js"></script>',
-			'		<script src="js/OrbitControls.js"></script>',
+			'		<script src="js/app.js"></script>',
 			'		<script>',
 			'		<script>',
 			'',
 			'',
-			'			var camera, controls, scene, renderer;',
+			'			var loader = new THREE.XHRLoader();',
+			'			loader.load( \'app.json\', function ( text ) {',
 			'',
 			'',
-			'			var loader = new THREE.ObjectLoader();',
-			'			loader.load( \'scene.json\', function ( object ) {',
+			'				var player = new APP.Player();',
+			'				player.load( JSON.parse( text ) );',
+			'				player.setSize( window.innerWidth, window.innerHeight );',
+			'				player.play();',
 			'',
 			'',
-			'				scene = object;',
-			'',
-			'				camera = new THREE.PerspectiveCamera( ' + camera.fov + ', 1, ' + camera.near + ', ' + camera.far + ' );',
-			'				camera.position.set( ' + camera.position.x + ', ' + camera.position.y + ', ' + camera.position.z + ' );',
-			'				camera.rotation.set( ' + camera.rotation.x + ', ' + camera.rotation.y + ', ' + camera.rotation.z + ' );',
-			'',
-			'				controls = new THREE.OrbitControls( camera );',
-			'				controls.addEventListener( \'change\', render );',
-			'',
-			'				renderer = new THREE.WebGLRenderer();',
-			'				renderer.setSize( window.innerWidth, window.innerHeight );',
-			'				document.body.appendChild( renderer.domElement );',
-			'',
-			'				camera.aspect = window.innerWidth / window.innerHeight;',
-			'				camera.updateProjectionMatrix();',
-			'',
-			'				animate();',
-			'				render();',
+			'				document.body.appendChild( player.dom );',
 			'',
 			'',
 			'			} );',
 			'			} );',
 			'',
 			'',
-			'			var render = function () {',
-			'',
-			'				renderer.render( scene, camera );',
-			'',
-			'			};',
-			'',
-			'			var animate = function () {',
-			'',
-			'				requestAnimationFrame( animate );',
-			'				controls.update();',
-			'',
-			'			};',
-			'',
 			'		</script>',
 			'		</script>',
 			'	</body>',
 			'	</body>',
 			'</html>'
 			'</html>'
@@ -263,11 +236,11 @@ Menubar.File = function ( editor ) {
 
 
 		//
 		//
 
 
-		var output = editor.scene.toJSON();
+		var output = editor.toJSON();
 		output = JSON.stringify( output, null, '\t' );
 		output = JSON.stringify( output, null, '\t' );
 		output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
 		output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
 
 
-		zip.file( 'scene.json', output );
+		zip.file( 'app.json', output );
 
 
 		//
 		//
 
 
@@ -278,14 +251,14 @@ Menubar.File = function ( editor ) {
 		} );
 		} );
 
 
 		var loader = new THREE.XHRLoader( manager );
 		var loader = new THREE.XHRLoader( manager );
-		loader.load( '../build/three.min.js', function ( content ) {
+		loader.load( 'js/libs/app.js', function ( content ) {
 
 
-			zip.file( 'js/three.min.js', content );
+			zip.file( 'js/app.js', content );
 
 
 		} );
 		} );
-		loader.load( '../examples/js/controls/OrbitControls.js', function ( content ) {
+		loader.load( '../build/three.min.js', function ( content ) {
 
 
-			zip.file( 'js/OrbitControls.js', content );
+			zip.file( 'js/three.min.js', content );
 
 
 		} );
 		} );
 
 

+ 1 - 1
editor/js/Menubar.Play.js

@@ -20,7 +20,7 @@ Menubar.Play = function ( editor ) {
 
 
 			isPlaying = true;
 			isPlaying = true;
 			title.setTextContent( 'Stop' );
 			title.setTextContent( 'Stop' );
-			signals.startPlayer.dispatch( editor.scene.toJSON() );
+			signals.startPlayer.dispatch();
 
 
 		} else {
 		} else {
 
 

+ 2 - 3
editor/js/Player.js

@@ -15,12 +15,11 @@ var Player = function ( editor ) {
 
 
 	var player = new APP.Player();
 	var player = new APP.Player();
 
 
-	signals.startPlayer.add( function ( json ) {
+	signals.startPlayer.add( function () {
 
 
 		container.setDisplay( '' );
 		container.setDisplay( '' );
 
 
-		player.load( json );
-		player.setCamera( editor.camera );
+		player.load( editor.toJSON() );
 		player.setSize( container.dom.offsetWidth, container.dom.offsetHeight );
 		player.setSize( container.dom.offsetWidth, container.dom.offsetHeight );
 		player.play();
 		player.play();
 
 

+ 23 - 1
editor/js/Sidebar.Script.Editor.js

@@ -4,6 +4,8 @@
 
 
 Sidebar.Script.Editor = function ( editor ) {
 Sidebar.Script.Editor = function ( editor ) {
 
 
+	var signals = editor.signals;
+
 	var timeout;
 	var timeout;
 
 
 	var scriptSource = new UI.TextArea( 'javascript' ).setWidth( '240px' ).setHeight( '180px' ).setFontSize( '12px' );
 	var scriptSource = new UI.TextArea( 'javascript' ).setWidth( '240px' ).setHeight( '180px' ).setFontSize( '12px' );
@@ -33,7 +35,7 @@ Sidebar.Script.Editor = function ( editor ) {
 
 
 			}
 			}
 
 
-			editor.scripts[ object.uuid ] = [ source ];
+			editor.scripts[ object.uuid ] = source;
 
 
 			editor.signals.objectChanged.dispatch( object );
 			editor.signals.objectChanged.dispatch( object );
 
 
@@ -41,6 +43,26 @@ Sidebar.Script.Editor = function ( editor ) {
 
 
 	} );
 	} );
 
 
+	signals.objectSelected.add( function ( object ) {
+
+		if ( object !== null ) {
+
+			var script = editor.scripts[ object.uuid ];
+
+			if ( script !== undefined ) {
+
+				scriptSource.setValue( script );
+
+			} else {
+
+				scriptSource.setValue( '' );
+
+			}
+
+		}
+
+	} );
+
 	return scriptSource;
 	return scriptSource;
 
 
 }
 }

+ 0 - 14
editor/js/Sidebar.Script.js

@@ -27,20 +27,6 @@ Sidebar.Script = function ( editor ) {
 
 
 			container.setDisplay( 'block' );
 			container.setDisplay( 'block' );
 
 
-			/*
-			var scripts = editor.scripts[ object.uuid ];
-
-			if ( scripts !== undefined ) {
-
-				scriptSource.setValue( scripts[ 0 ] );
-
-			} else {
-
-				scriptSource.setValue( '' );
-
-			}
-			*/
-
 		} else {
 		} else {
 
 
 			container.setDisplay( 'none' );
 			container.setDisplay( 'none' );

+ 45 - 47
editor/js/libs/app.js

@@ -2,88 +2,86 @@
  * @author mrdoob / http://mrdoob.com/
  * @author mrdoob / http://mrdoob.com/
  */
  */
 
 
-var APP = {};
+var APP = {
 
 
-APP.Player = function () {
+	Player: function () {
 
 
-	var loader = new THREE.ObjectLoader();
-	var camera, scene, renderer;
-	var scripts;
-	
-	this.dom = undefined;
+		var loader = new THREE.ObjectLoader();
+		var camera, scene, renderer;
 
 
-	this.load = function ( json ) {
+		var scripts = {
+			update: []
+		};
+	
+		this.dom = undefined;
 
 
-		renderer = new THREE.WebGLRenderer( { antialias: true } );
+		this.load = function ( json ) {
 
 
-		scene = loader.parse( json );
+			renderer = new THREE.WebGLRenderer( { antialias: true } );
+			renderer.setPixelRatio( window.devicePixelRatio );
 
 
-		/*
-		scripts = [];
+			camera = loader.parse( json.camera );
 
 
-		scene.traverse( function ( child ) {
+			scene = loader.parse( json.scene );
 
 
-			if ( child.script !== undefined ) {
+			scripts.update = [];
 
 
-				var script = new Function( 'scene', 'time', child.script.source ).bind( child );
-				scripts.push( script );
+			for ( var uuid in json.scripts ) {
 
 
-			}
+				var source = json.scripts[ uuid ];
+				var object = scene.getObjectByProperty( 'uuid', uuid, true );
 
 
-		} );
-		*/
+				var script = ( new Function( 'scene', 'time', source ).bind( object ) )();
 
 
-		this.dom = renderer.domElement;
+				if ( script.update !== undefined ) {
 
 
-	};
+					scripts.update.push( script.update );
 
 
-	this.setCamera = function ( master ) {
+				}
 
 
-		camera = master.clone();
+			}
 
 
-	};
+			this.dom = renderer.domElement;
 
 
-	this.setSize = function ( width, height ) {
+		};
 
 
-		renderer.setSize( width, height );
+		this.setSize = function ( width, height ) {
 
 
-	};
+			camera.aspect = width / height;
+			camera.updateProjectionMatrix();
 
 
-	var request;
+			renderer.setSize( width, height );
 
 
-	var animate = function ( time ) {
+		};
 
 
-		request = requestAnimationFrame( animate );
+		var request;
 
 
-		/*
-		for ( var i = 0; i < scripts.length; i ++ ) {
+		var animate = function ( time ) {
 
 
-			scripts[ i ]( scene, time );
+			request = requestAnimationFrame( animate );
 
 
-		}
-		*/
+			for ( var i = 0, l = scripts.update.length; i < l; i ++ ) {
 
 
-		renderer.render( scene, camera );
+				scripts.update[ i ]( scene, time );
 
 
-	};
+			}
 
 
-	this.play = function () {
+			renderer.render( scene, camera );
 
 
-		request = requestAnimationFrame( animate );
+		};
 
 
-	};
+		this.play = function () {
 
 
-	this.stop = function () {
+			request = requestAnimationFrame( animate );
 
 
-		cancelAnimationFrame( request );
+		};
 
 
-	};
+		this.stop = function () {
 
 
-};
+			cancelAnimationFrame( request );
 
 
-APP.Script = function ( source ) {
+		};
 
 
-	this.uuid = THREE.Math.generateUUID();
-	this.source = source;
+	}
 
 
 };
 };