Add example extension.

website/extensions/example/example.js

@@ -0,0 +1,24 @@
+ExampleExtension = function ()
+{
+	this.ext = null;
+};
+
+ExampleExtension.prototype.IsEnabled = function ()
+{
+	return false;
+};
+
+ExampleExtension.prototype.Init = function (extensionInterface)
+{
+	this.ext = extensionInterface;
+	var buttonsDiv = this.ext.GetButtonsDiv ()
+	var buttonImage = document.createElement ('img');
+	buttonImage.className = 'topbutton';
+	buttonImage.src = 'extensions/example/example.png';
+	buttonImage.title = 'Example button.';
+	var myThis = this;
+	buttonImage.onclick = function () {
+		alert (JSON.stringify (myThis.ext.GetModelJson ()));
+	};
+	buttonsDiv.appendChild (buttonImage);
+};

website/include/importerapp.css

@@ -33,6 +33,18 @@ html, body
 	overflow : auto;
 }
 
+div.buttons
+{
+	overflow : auto;
+	float : left;
+}
+
+div.rightbuttons
+{
+	overflow : auto;
+	float : right;
+}
+
 #logo
 {
 	color : #ffffff;
@@ -59,9 +71,10 @@ img.topbutton
 {
 	width : 25px;
 	height : 25px;
-	margin : 9px 5px 0px 5px;
+	padding : 8px 4px;
-	border : 0px;
 	cursor : pointer;
+	display : block;
+	float : left;
 }
 
 #left

website/include/importerapp.js

@@ -1,8 +1,26 @@
+ExtensionInterface = function (app)
+{
+	this.app = app;
+};
+
+ExtensionInterface.prototype.GetButtonsDiv = function ()
+{
+	return this.app.extensionButtons.GetButtonsDiv ();
+};
+
+ExtensionInterface.prototype.GetModelJson = function ()
+{
+	return this.app.viewer.GetJsonData ();
+};
+
 ImporterApp = function ()
 {
 	this.viewer = null;
 	this.fileNames = null;
 	this.inGenerate = false;
+	this.extensions = [];
+	this.importerButtons = null;
+	this.extensionButtons = null;
 	this.dialog = null;
 };
 
@@ -28,18 +46,19 @@ ImporterApp.prototype.Init = function ()
 	
 	var myThis = this;
 	var top = document.getElementById ('top');
-	var importerButtons = new ImporterButtons (top);
+	this.importerButtons = new ImporterButtons (top);
-	importerButtons.AddLogo ('Online 3D Viewer <span class="version">v 0.5.1</span>', function () { myThis.WelcomeDialog (); });
+	this.importerButtons.AddLogo ('Online 3D Viewer <span class="version">v 0.5.1</span>', function () { myThis.WelcomeDialog (); });
-	importerButtons.AddButton ('images/openfile.png', 'Open File', function () { myThis.OpenFile (); });
+	this.importerButtons.AddButton ('images/openfile.png', 'Open File', function () { myThis.OpenFile (); });
-	importerButtons.AddButton ('images/fitinwindow.png', 'Fit In Window', function () { myThis.FitInWindow (); });
+	this.importerButtons.AddButton ('images/fitinwindow.png', 'Fit In Window', function () { myThis.FitInWindow (); });
-	importerButtons.AddToggleButton ('images/fixup.png', 'images/fixupgray.png', 'Enable/Disable Fixed Up Vector', function () { myThis.SetFixUp (); });
+	this.importerButtons.AddToggleButton ('images/fixup.png', 'images/fixupgray.png', 'Enable/Disable Fixed Up Vector', function () { myThis.SetFixUp (); });
-	importerButtons.AddButton ('images/top.png', 'Set Up Vector (Z)', function () { myThis.SetNamedView ('z'); });
+	this.importerButtons.AddButton ('images/top.png', 'Set Up Vector (Z)', function () { myThis.SetNamedView ('z'); });
-	importerButtons.AddButton ('images/bottom.png', 'Set Up Vector (-Z)', function () { myThis.SetNamedView ('-z'); });
+	this.importerButtons.AddButton ('images/bottom.png', 'Set Up Vector (-Z)', function () { myThis.SetNamedView ('-z'); });
-	importerButtons.AddButton ('images/front.png', 'Set Up Vector (Y)', function () { myThis.SetNamedView ('y'); });
+	this.importerButtons.AddButton ('images/front.png', 'Set Up Vector (Y)', function () { myThis.SetNamedView ('y'); });
-	importerButtons.AddButton ('images/back.png', 'Set Up Vector (-Y)', function () { myThis.SetNamedView ('-y'); });
+	this.importerButtons.AddButton ('images/back.png', 'Set Up Vector (-Y)', function () { myThis.SetNamedView ('-y'); });
-	importerButtons.AddButton ('images/left.png', 'Set Up Vector (X)', function () { myThis.SetNamedView ('x'); });
+	this.importerButtons.AddButton ('images/left.png', 'Set Up Vector (X)', function () { myThis.SetNamedView ('x'); });
-	importerButtons.AddButton ('images/right.png', 'Set Up Vector (-X)', function () { myThis.SetNamedView ('-x'); });
+	this.importerButtons.AddButton ('images/right.png', 'Set Up Vector (-X)', function () { myThis.SetNamedView ('-x'); });
 	
+	this.extensionButtons = new ExtensionButtons (top);
 	this.dialog = new FloatingDialog ();
 
 	window.addEventListener ('resize', this.Resize.bind (this), false);
@@ -65,6 +84,16 @@ ImporterApp.prototype.Init = function ()
 	}
 };
 
+ImporterApp.prototype.AddExtension = function (extension)
+{
+	if (!extension.IsEnabled ()) {
+		return;
+	}
+	
+	var extInterface = new ExtensionInterface (this);
+	extension.Init (extInterface);
+};
+
 ImporterApp.prototype.WelcomeDialog = function ()
 {
 	var dialogText = [
@@ -482,7 +511,6 @@ ImporterApp.prototype.ResetHash = function ()
 	}
 };
 
-
 ImporterApp.prototype.LoadFilesFromHash = function ()
 {
 	if (window.location.hash.length < 2) {
@@ -522,4 +550,5 @@ window.onload = function ()
 {
 	var importerApp = new ImporterApp ();
 	importerApp.Init ();
+	importerApp.AddExtension (new ExampleExtension ());
 };

website/include/importermenu.js

@@ -149,7 +149,9 @@ ImporterMenu.prototype.AddSubItem = function (parent, name, parameters)
 
 ImporterButtons = function (parent)
 {
-	this.parent = parent;
+	this.buttonsDiv = document.createElement ('div');
+	this.buttonsDiv.className = 'buttons';
+	parent.appendChild (this.buttonsDiv);
 };
 
 ImporterButtons.prototype.AddLogo = function (title, onClick)
@@ -158,7 +160,7 @@ ImporterButtons.prototype.AddLogo = function (title, onClick)
 	logoDiv.id = 'logo';
 	logoDiv.innerHTML = title;
 	logoDiv.onclick = onClick;
-	this.parent.appendChild (logoDiv);
+	this.buttonsDiv.appendChild (logoDiv);
 };
 
 ImporterButtons.prototype.AddButton = function (image, title, onClick)
@@ -168,7 +170,7 @@ ImporterButtons.prototype.AddButton = function (image, title, onClick)
 	buttonImage.src = image;
 	buttonImage.title = title;
 	buttonImage.onclick = onClick;
-	this.parent.appendChild (buttonImage);
+	this.buttonsDiv.appendChild (buttonImage);
 };
 
 ImporterButtons.prototype.AddToggleButton = function (image, toggleImage, title, onClick)
@@ -187,7 +189,19 @@ ImporterButtons.prototype.AddToggleButton = function (image, toggleImage, title,
 		}
 		onClick ();
 	};
-	this.parent.appendChild (buttonImage);
+	this.buttonsDiv.appendChild (buttonImage);
+};
+
+ExtensionButtons = function (parent)
+{
+	this.buttonsDiv = document.createElement ('div');
+	this.buttonsDiv.className = 'rightbuttons';
+	parent.appendChild (this.buttonsDiv);
+};
+
+ExtensionButtons.prototype.GetButtonsDiv = function ()
+{
+	return this.buttonsDiv;
 };
 
 ImporterProgressBar = function (parent)

website/index.html

@@ -6,7 +6,7 @@
 <head>
 
 	<meta http-equiv="content-type" content="text/html;charset=utf-8">
-	<link rel="stylesheet" type="text/css" href="include/importer.css">
+	<link rel="stylesheet" type="text/css" href="include/importerapp.css">
 	<link rel="stylesheet" type="text/css" href="include/floatingdialog.css">
 
 	<script type="text/javascript" src="../jsmodeler/three.min.js"></script>
@@ -17,6 +17,8 @@
 	<script type="text/javascript" src="include/importerviewer.js"></script>
 	<script type="text/javascript" src="include/importermenu.js"></script>
 	<script type="text/javascript" src="include/importerapp.js"></script>
+	
+	<script type="text/javascript" src="extensions/example/example.js"></script>
 
 	<script>
 	  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){