Editor: Started implementing UI.Dialog.

editor/index.html

@@ -96,7 +96,10 @@
 
 			var sidebar = new Sidebar( editor ).setId( 'sidebar' );
 			document.body.appendChild( sidebar.dom );
-
+			
+			var dialog = new UI.Dialog();
+			document.body.appendChild( dialog.dom );
+			
 			//
 
 			editor.setTheme( editor.config.getKey( 'theme' ) );
@@ -149,6 +152,17 @@
 				signals.materialChanged.add( saveState );
 				signals.sceneGraphChanged.add( saveState );
 
+				var showDialog = function ( content ) {
+
+					dialog.clear();
+
+					dialog.add( content );
+					dialog.showModal();
+
+				};
+
+				signals.showDialog.add( showDialog );
+
 			} );
 
 			//

editor/js/Editor.js

@@ -9,6 +9,8 @@ var Editor = function () {
 		playAnimation: new SIGNALS.Signal(),
 		stopAnimation: new SIGNALS.Signal(),
 
+		showDialog: new SIGNALS.Signal(),
+
 		// notifications
 
 		themeChanged: new SIGNALS.Signal(),
@@ -65,6 +67,14 @@ Editor.prototype = {
 
 	},
 
+	showDialog: function ( value ) {
+	
+		this.signals.showDialog.dispatch( value );
+	
+	},
+	
+	//
+
 	setScene: function ( scene ) {
 
 		this.scene.name = scene.name;

editor/js/Menubar.File.js

@@ -154,6 +154,13 @@ Menubar.File = function ( editor ) {
 
 	}
 
+	function onExportTestOptionClick() {
+
+		var text = new UI.Text( 'blah' );
+		editor.showDialog( text );
+
+	}
+
 	// create file input element for scene import
 
 	var fileInput = document.createElement( 'input' );
@@ -176,7 +183,10 @@ Menubar.File = function ( editor ) {
 		createOption( 'Export Object', onExportObjectOptionClick ),
 		createOption( 'Export Scene', onExportSceneOptionClick ),
 		createOption( 'Export OBJ', onExportOBJOptionClick ),
-		createOption( 'Export STL', onExportSTLOptionClick )
+		createOption( 'Export STL', onExportSTLOptionClick ),
+		createDivider(),
+		
+		createOption( 'Export Test', onExportTestOptionClick )
 	];
 
 	var optionsPanel = UI.MenubarHelper.createOptionsPanel( menuConfig );

editor/js/libs/ui.js

@@ -106,7 +106,17 @@ UI.Panel.prototype.add = function () {
 
 	for ( var i = 0; i < arguments.length; i ++ ) {
 
-		this.dom.appendChild( arguments[ i ].dom );
+		var argument = arguments[ i ];
+
+		if ( argument instanceof UI.Element ) {
+
+			this.dom.appendChild( argument.dom );
+
+		} else {
+
+			console.error( 'UI.Panel:', argument, 'is not an instance of UI.Element.' )
+
+		}
 
 	}
 
@@ -118,8 +128,18 @@ UI.Panel.prototype.add = function () {
 UI.Panel.prototype.remove = function () {
 
 	for ( var i = 0; i < arguments.length; i ++ ) {
+	
+		var argument = arguments[ i ];
+
+		if ( argument instanceof UI.Element ) {
+
+			this.dom.removeChild( argument.dom );
+
+		} else {
 
-		this.dom.removeChild( arguments[ i ].dom );
+			console.error( 'UI.Panel:', argument, 'is not an instance of UI.Element.' )
+
+		}
 
 	}
 
@@ -1085,4 +1105,50 @@ UI.Button.prototype.setLabel = function ( value ) {
 
 	return this;
 
-};
+};
+
+
+// Dialog
+
+UI.Dialog = function ( value ) {
+
+	var scope = this;
+	
+	var dom = document.createElement( 'dialog' );
+
+	if ( dom.showModal === undefined ) {
+
+		// fallback
+
+		dom = document.createElement( 'div' );
+		dom.style.display = 'none';
+
+		dom.showModal = function () {
+
+			dom.style.position = 'absolute';
+			dom.style.left = '100px';
+			dom.style.top = '100px';
+			dom.style.zIndex = 1;
+			dom.style.display = '';
+
+		};
+
+	}
+
+	dom.className = 'Dialog';
+
+	this.dom = dom;
+
+	return this;
+
+};
+
+UI.Dialog.prototype = Object.create( UI.Panel.prototype );
+
+UI.Dialog.prototype.showModal = function () {
+
+	this.dom.showModal();
+
+	return this;
+
+};