diff --git a/examples/full.html b/examples/full.html
index c2605a96..25de1190 100644
--- a/examples/full.html
+++ b/examples/full.html
@@ -117,6 +117,7 @@
 	<script type="text/javascript" src="../js/Localization.js"></script>
 	<script type="text/javascript" src="../js/Variables.js"></script>
 	<script type="text/javascript" src="../js/SharedJS.js"></script>
+	<script type="text/javascript" src="../js/FileManager.js"></script>
   <script type="text/javascript">
  		mxBasePath = 'https://jgraph.github.io/mxgraph/javascript/src/';
   </script>
diff --git a/js/FileManager.js b/js/FileManager.js
new file mode 100644
index 00000000..05bdb754
--- /dev/null
+++ b/js/FileManager.js
@@ -0,0 +1,130 @@
+var InsightMakerFileExtension = ".InsightMaker";
+
+// Append file extension to file (if not already there)
+function appendFileExtension(filename,extension) {
+	var extension_position=filename.length-extension.length;
+	var current_extension=filename.slice(extension_position);
+	if(current_extension.toLowerCase()!=extension.toLowerCase()) {
+		filename+=extension;
+	}
+	return filename;
+}
+
+// Set the title to include the model name
+function setTitle(filename) {
+	var title;
+	if(filename) {
+		title = filename+"| Insight Maker";
+		
+	} else {
+		title = "Insight Maker";
+	}
+	window.parent.document.title = title;
+}
+
+// Get xml data for the current model
+function getModelXML2() {
+	var enc = new mxCodec();
+	var graph_dom=enc.encode(graph.getModel());
+	var xml_data="<InsightMakerModel>"+graph_dom.innerHTML+"</InsightMakerModel>";
+	return xml_data;
+}
+
+// Makes a new model
+function newModel() {
+	clearModel();
+}
+
+function downloadWebFile(filename, content) {
+	// There is already a downloadFile in API.js
+	// But it does not appear to work in Firefox
+	var downloadlink = document.body.appendChild(document.createElement("a"));
+	downloadlink.download = filename;
+	downloadlink.href = "data:text/plain;base64," + btoa(content);
+	downloadlink.click();
+	downloadlink.parentElement.removeChild(downloadlink);
+};
+
+// High-level File manager. Does save and load of models
+var FileManagerWeb = new function() {
+	var self = this;
+	var filename = null;
+	
+	this.set_filename = function(filename) {
+		self.filename=filename;
+		setTitle(filename);
+	}
+	
+	this.saveModel = function() {
+		Ext.MessageBox.prompt('Model name', 'Enter name of model', function(btn, model_name){
+			if(btn=='cancel') {
+				return;
+			}
+			if (btn == 'ok'){
+				var xml_data = getModelXML2();
+				model_name=appendFileExtension(model_name,InsightMakerFileExtension);
+				self.set_filename(model_name);
+				downloadWebFile(model_name,xml_data);
+			}
+		});
+
+	};
+	
+	this.loadModel = function() {
+		openFile({
+			read: "text",
+			multiple: false,
+			accept: InsightMakerFileExtension,
+			onCompleted: function(model) {
+				importMXGraph(model.contents);
+				self.set_filename(model.name);
+			}
+		});
+	};
+	
+	this.newModel = function() {
+		self.set_filename(null);
+		newModel();
+	}
+};
+
+// FileMenu for environment.WebOffline
+var FileMenuWeb = {
+text: getText('File'),
+itemId: "filegroup",
+glyph: 0xf15b,
+menu: [
+	{
+		glyph: 0xf016,
+		text: getText('New'),
+		tooltip: getText('New model'),
+		handler: FileManagerWeb.newModel,
+		scope: this
+	}, 
+	{
+		glyph: 0xf115, /*0xf115 alternative icon we could have used */
+		text: getText('Load'),
+		tooltip: getText('Load model'),
+		handler: FileManagerWeb.loadModel,
+		scope: this
+	}, 
+	{
+		glyph: 0xf0c7,
+		text: getText('Save'),
+		tooltip: getText('Save model'),
+		handler: FileManagerWeb.saveModel,
+		scope: this
+	}
+]
+};
+
+// Get the correct FileMenu depending on the environment
+var FileMenu;
+switch(viewConfig.environment) {
+	case environment.InsightMakerOnline:
+		FileMenu = [];
+		break;
+	case environment.WebOffline:
+		FileMenu = [FileMenuWeb];
+		break;
+}
diff --git a/js/RibbonPanel.js b/js/RibbonPanel.js
index a2aeebe5..05778e51 100755
--- a/js/RibbonPanel.js
+++ b/js/RibbonPanel.js
@@ -1087,7 +1087,7 @@ var RibbonPanel = function(graph, mainPanel, configPanel) {
 		collapsible: false,
 		tbar: new Ext.toolbar.Toolbar({
 			enableOverflow: true,
-			items: [
+			items: FileMenu.concat([
 
 				{
 					hidden: (!viewConfig.primitiveGroup),
@@ -1641,7 +1641,7 @@ var RibbonPanel = function(graph, mainPanel, configPanel) {
 				}
 				
 
-			]
+			])
 		})
 
 	});
diff --git a/js/SharedJS.js b/js/SharedJS.js
index 861494e6..9aebe7c1 100755
--- a/js/SharedJS.js
+++ b/js/SharedJS.js
@@ -8,7 +8,22 @@ terms of the Insight Maker Public License (https://InsightMaker.com/impl).
 
 */
 
+var environment = {
+	InsightMakerOnline: 1,
+	WebOffline: 2,
+	NodeWebKit: 3 /* Not yet implmented. Suggestion for future */
+}
+
+function environmentAutoDetect() {
+	if(location.hostname.match("insightmaker.com")!=null) {
+		return environment.InsightMakerOnline;
+	} else {
+		return environment.WebOffline;
+	}
+}
+
 var viewConfig = {
+	environment: environmentAutoDetect(),
 	showTopLinks: true,
 	sideBarWidth: 330,
 	referenceBarWidth: 240,