Editor: Tried to use CodeMirror for editing userData and found out it can't be resized.

editor/css/main.css

@@ -23,6 +23,17 @@ textarea {
 	word-wrap: normal;
 }
 
+	textarea.success {
+		border-color: #8b8 !important;
+	}
+
+	textarea.fail {
+		border-color: #f00 !important;
+		background-color: rgba(255,0,0,0.05);
+	}
+
+textarea, input { outline: none; } /* osx */
+
 .Panel {
 	-moz-user-select: none;
 	-webkit-user-select: none;
@@ -55,21 +66,6 @@ textarea {
 	display: none;
 }
 
-/* codemirror */
-
-.CodeMirror {
-	border: 1px solid #ccc;
-}
-
-	.CodeMirror.success {
-		border-color: #8b8;
-	}
-
-	.CodeMirror.fail {
-		border-color: #f00;
-		background-color: rgba(255,0,0,0.05);
-	}
-
 /* scene types */
 
 .type {

editor/js/Sidebar.Object3D.js

@@ -196,6 +196,8 @@ Sidebar.Object3D = function ( editor ) {
 	container.add( objectVisibleRow );
 
 	// user data
+	
+	var timeout;
 
 	var objectUserDataRow = new UI.Panel();
 	var objectUserData = new UI.TextArea().setWidth( '150px' ).setHeight( '40px' ).setColor( '#444' ).setFontSize( '12px' ).onChange( update );
@@ -204,13 +206,14 @@ Sidebar.Object3D = function ( editor ) {
 		try {
 
 			JSON.parse( objectUserData.getValue() );
-			objectUserData.setBorderColor( '#ccc' );
-			objectUserData.setBackgroundColor( '' );
+
+			objectUserData.dom.classList.add( 'success' );
+			objectUserData.dom.classList.remove( 'fail' );
 
 		} catch ( error ) {
 
-			objectUserData.setBorderColor( '#f00' );
-			objectUserData.setBackgroundColor( 'rgba(255,0,0,0.25)' );
+			objectUserData.dom.classList.remove( 'success' );
+			objectUserData.dom.classList.add( 'fail' );
 
 		}
 

editor/js/Sidebar.Script.js

@@ -22,8 +22,8 @@ Sidebar.Script = function ( editor ) {
 	var timeout;
 
 	var scriptSourceRow = new UI.Panel();
-	var scriptSource = new UI.CodeEditor( 'javascript' ).setWidth( '240px' ).setHeight( '180px' ).setFontSize( '12px' );
-	scriptSource.onChange( function () {
+	var scriptSource = new UI.TextArea( 'javascript' ).setWidth( '240px' ).setHeight( '180px' ).setFontSize( '12px' );
+	scriptSource.onKeyUp( function () {
 
 		clearTimeout( timeout );
 
@@ -37,13 +37,13 @@ Sidebar.Script = function ( editor ) {
 				var script = new Function( 'scene', 'time', source ).bind( object.clone() );
 				script( new THREE.Scene(), 0 );
 
-				scriptSource.editor.display.wrapper.classList.add( 'success' );
-				scriptSource.editor.display.wrapper.classList.remove( 'fail' );
+				scriptSource.dom.classList.add( 'success' );
+				scriptSource.dom.classList.remove( 'fail' );
 
 			} catch ( error ) {
 
-				scriptSource.editor.display.wrapper.classList.remove( 'success' );
-				scriptSource.editor.display.wrapper.classList.add( 'fail' );
+				scriptSource.dom.classList.remove( 'success' );
+				scriptSource.dom.classList.add( 'fail' );
 
 				return;
 
@@ -53,7 +53,7 @@ Sidebar.Script = function ( editor ) {
 
 			editor.signals.objectChanged.dispatch( object );
 
-		}, 300 );
+		}, 500 );
 
 	} );	
 

editor/js/libs/ui.editor.js

@@ -10,11 +10,11 @@ UI.CodeEditor = function ( mode ) {
 	dom.className = 'CodeEditor';
 
 	var editor = CodeMirror( dom, { mode: mode, indentWithTabs: true, lineWrapping: true, matchBrackets: true } );
-	editor.on( 'change', function () {
+	editor.onKeyUp( 'keyup', function () {
 
-		if ( scope.onChangeCallback !== undefined ) {
+		if ( scope.onKeyUpCallback !== undefined ) {
 
-			scope.onChangeCallback();
+			scope.onKeyUpCallback();
 
 		}
 
@@ -63,9 +63,9 @@ UI.CodeEditor.prototype.setValue = function ( value ) {
 
 };
 
-UI.CodeEditor.prototype.onChange = function ( callback ) {
+UI.CodeEditor.prototype.onKeyUp = function ( callback ) {
 
-	this.onChangeCallback = callback;
+	this.onKeyUpCallback = callback;
 
 	return this;