diff --git a/frontend-js/src/main/js/Export.js b/frontend-js/src/main/js/Export.js
index 311d4d1067ead70809db74a05737e9ef9546f193..56646be12d94c0ec22203fb93cfd7afb11f12f1a 100644
--- a/frontend-js/src/main/js/Export.js
+++ b/frontend-js/src/main/js/Export.js
@@ -3,6 +3,9 @@
 var Promise = require("bluebird");
 
 var CustomMapOptions = require('./map/CustomMapOptions');
+var ElementExportPanel = require('./gui/export/ElementExportPanel');
+var GraphicsExportPanel = require('./gui/export/GraphicsExportPanel');
+var NetworkExportPanel = require('./gui/export/NetworkExportPanel');
 var Header = require('./gui/Header');
 var ObjectWithListeners = require('./ObjectWithListeners');
 
@@ -18,6 +21,7 @@ var Functions = require('./Functions');
  */
 function Export(options) {
   var self = this;
+  self._panels = [];
   if (!(options instanceof CustomMapOptions)) {
     options = new CustomMapOptions(options);
   }
@@ -42,8 +46,91 @@ Export.prototype._createGui = function() {
     project : self.getProject(),
   });
   self.getElement().appendChild(headerDiv);
+
+  var panels = [ {
+    name : "ELEMENTS",
+    panelClass : ElementExportPanel,
+  }, {
+    name : "NETWORK",
+    panelClass : NetworkExportPanel,
+  }, {
+    name : "GRAPHICS",
+    panelClass : GraphicsExportPanel,
+  } ];
+
+  var tabDiv = Functions.createElement({
+    type : "div",
+    name : "tabView",
+    className : "tabbable boxed parentTabs"
+  });
+  self.getElement().appendChild(tabDiv);
+
+  var tabMenuDiv = Functions.createElement({
+    type : "ul",
+    className : "nav nav-tabs"
+  });
+  tabDiv.appendChild(tabMenuDiv);
+
+  var tabContentDiv = Functions.createElement({
+    type : "div",
+    className : "tab-content"
+  });
+  tabDiv.appendChild(tabContentDiv);
+
+  for (var i = 0; i < panels.length; i++) {
+    self.addTab(panels[i], tabMenuDiv, tabContentDiv);
+  }
+
 }
 
+Export.prototype.addTab = function(params, navElement, contentElement) {
+  var self = this;
+
+  var name = params.name;
+
+  var tabId = "left_panel_ab_" + this._tabIdCount;
+  self._tabIdCount++;
+
+  var navClass = '';
+  var contentClass = 'tab-pane';
+  if (navElement.children.length === 0) {
+    navClass = "active";
+    contentClass = "tab-pane active";
+  }
+
+  var navLi = document.createElement("li");
+  navLi.className = navClass;
+
+  var navLink = document.createElement("a");
+  navLink.href = "#" + tabId;
+  if (name !== undefined) {
+    if (name.length > 12) {
+      name = name.substring(0, 10) + "...";
+    }
+    navLink.innerHTML = name;
+  }
+  navLink.onclick = function() {
+    $(this).tab('show');
+  };
+  navLi.appendChild(navLink);
+  if (name !== undefined) {
+    navLink.innerHTML = name;
+  }
+  navElement.appendChild(navLi);
+
+  var contentDiv = document.createElement("div");
+  contentDiv.style.height = "100%";
+  contentDiv.className = contentClass;
+  contentDiv.id = tabId;
+
+  contentElement.appendChild(contentDiv);
+
+  this._panels.push(new params.panelClass({
+    element : contentDiv,
+    project : self.getProject(),
+  }));
+};
+
 Export.prototype.setProject = function(project) {
   this._project = project;
 };
diff --git a/frontend-js/src/main/js/gui/leftPanel/Panel.js b/frontend-js/src/main/js/gui/Panel.js
similarity index 94%
rename from frontend-js/src/main/js/gui/leftPanel/Panel.js
rename to frontend-js/src/main/js/gui/Panel.js
index 24fe869450a4966497fd0977b65c2da06bea22d2..cadd37854b99af4227b3ba3aeead2c3a1a2445f3 100644
--- a/frontend-js/src/main/js/gui/leftPanel/Panel.js
+++ b/frontend-js/src/main/js/gui/Panel.js
@@ -2,12 +2,12 @@
 
 /* exported logger */
 
-var GuiConnector = require('../../GuiConnector');
-var AbstractGuiElement = require('../AbstractGuiElement');
-var PanelControlElementType = require('../PanelControlElementType');
-var Functions = require('../../Functions');
+var GuiConnector = require('../GuiConnector');
+var AbstractGuiElement = require('./AbstractGuiElement');
+var PanelControlElementType = require('./PanelControlElementType');
+var Functions = require('../Functions');
 
-var logger = require('../../logger');
+var logger = require('../logger');
 
 function Panel(params) {
   AbstractGuiElement.call(this, params);
diff --git a/frontend-js/src/main/js/gui/export/ElementExportPanel.js b/frontend-js/src/main/js/gui/export/ElementExportPanel.js
new file mode 100644
index 0000000000000000000000000000000000000000..7b82bf8d7a3403e1ed022bd2e08a41230b0f5253
--- /dev/null
+++ b/frontend-js/src/main/js/gui/export/ElementExportPanel.js
@@ -0,0 +1,23 @@
+"use strict";
+
+/* exported logger */
+
+var Panel = require('../Panel');
+
+var GuiConnector = require('../../GuiConnector');
+var logger = require('../../logger');
+var Functions = require('../../Functions');
+
+function ElementExportPanel(params) {
+  params.panelName = "elementExport";
+  params.scrollable = true;
+  Panel.call(this, params);
+
+  var self = this;
+
+}
+
+ElementExportPanel.prototype = Object.create(Panel.prototype);
+ElementExportPanel.prototype.constructor = ElementExportPanel;
+
+module.exports = ElementExportPanel;
diff --git a/frontend-js/src/main/js/gui/export/GraphicsExportPanel.js b/frontend-js/src/main/js/gui/export/GraphicsExportPanel.js
new file mode 100644
index 0000000000000000000000000000000000000000..0fe3658f26c1fdb0290e816ae66a42b969b2d92a
--- /dev/null
+++ b/frontend-js/src/main/js/gui/export/GraphicsExportPanel.js
@@ -0,0 +1,23 @@
+"use strict";
+
+/* exported logger */
+
+var Panel = require('../Panel');
+
+var GuiConnector = require('../../GuiConnector');
+var logger = require('../../logger');
+var Functions = require('../../Functions');
+
+function GraphicsExportPanel(params) {
+  params.panelName = "elementExport";
+  params.scrollable = true;
+  Panel.call(this, params);
+
+  var self = this;
+
+}
+
+GraphicsExportPanel.prototype = Object.create(Panel.prototype);
+GraphicsExportPanel.prototype.constructor = GraphicsExportPanel;
+
+module.exports = GraphicsExportPanel;
diff --git a/frontend-js/src/main/js/gui/export/NetworkExportPanel.js b/frontend-js/src/main/js/gui/export/NetworkExportPanel.js
new file mode 100644
index 0000000000000000000000000000000000000000..5e3949392b78533ddb24caa722efbbb77e1f599f
--- /dev/null
+++ b/frontend-js/src/main/js/gui/export/NetworkExportPanel.js
@@ -0,0 +1,23 @@
+"use strict";
+
+/* exported logger */
+
+var Panel = require('../Panel');
+
+var GuiConnector = require('../../GuiConnector');
+var logger = require('../../logger');
+var Functions = require('../../Functions');
+
+function NetworkExportPanel(params) {
+  params.panelName = "elementExport";
+  params.scrollable = true;
+  Panel.call(this, params);
+
+  var self = this;
+
+}
+
+NetworkExportPanel.prototype = Object.create(Panel.prototype);
+NetworkExportPanel.prototype.constructor = NetworkExportPanel;
+
+module.exports = NetworkExportPanel;
diff --git a/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js b/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js
index 19d3fa9b1a29651433d1be53a06e12008849c5cf..b726c20a02327aa9e705274e1c2abd6e299cbb81 100644
--- a/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js
+++ b/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js
@@ -4,7 +4,7 @@
 
 var Promise = require("bluebird");
 
-var Panel = require('./Panel');
+var Panel = require('../Panel');
 var PanelControlElementType = require('../PanelControlElementType');
 
 var logger = require('../../logger');
diff --git a/frontend-js/src/main/js/gui/leftPanel/OverlayPanel.js b/frontend-js/src/main/js/gui/leftPanel/OverlayPanel.js
index 99e5be32a5e80ea3677e71344f403494f68b7d5d..a06f4c93fd4e91ca68ff499239e79621ac39266a 100644
--- a/frontend-js/src/main/js/gui/leftPanel/OverlayPanel.js
+++ b/frontend-js/src/main/js/gui/leftPanel/OverlayPanel.js
@@ -2,7 +2,7 @@
 
 /* exported logger */
 
-var Panel = require('./Panel');
+var Panel = require('../Panel');
 var PanelControlElementType = require('../PanelControlElementType');
 
 var GuiConnector = require('../../GuiConnector');
diff --git a/frontend-js/src/main/js/gui/leftPanel/ProjectInfoPanel.js b/frontend-js/src/main/js/gui/leftPanel/ProjectInfoPanel.js
index 9daf37590e24325b13df5e7ccf09413ded6699ba..863f19e64313fbbe2161fddc90553707401d96c0 100644
--- a/frontend-js/src/main/js/gui/leftPanel/ProjectInfoPanel.js
+++ b/frontend-js/src/main/js/gui/leftPanel/ProjectInfoPanel.js
@@ -3,7 +3,7 @@
 /* exported logger */
 
 var ConfigurationType = require('../../ConfigurationType');
-var Panel = require('./Panel');
+var Panel = require('../Panel');
 var PanelControlElementType = require('../PanelControlElementType');
 var PublicationListDialog = require('./PublicationListDialog');
 
diff --git a/frontend-js/src/main/js/gui/leftPanel/SubmapPanel.js b/frontend-js/src/main/js/gui/leftPanel/SubmapPanel.js
index 4bf412882cfb7e4dbb7e1863ec4ff16351703c75..cec06d686bb7501aa8db3fb18c491b9c94dae50a 100644
--- a/frontend-js/src/main/js/gui/leftPanel/SubmapPanel.js
+++ b/frontend-js/src/main/js/gui/leftPanel/SubmapPanel.js
@@ -4,7 +4,7 @@ var Promise = require("bluebird");
 
 /* exported logger */
 
-var Panel = require('./Panel');
+var Panel = require('../Panel');
 var PanelControlElementType = require('../PanelControlElementType');
 
 var logger = require('../../logger');
diff --git a/frontend-js/src/test/js/gui/leftPanel/Panel-test.js b/frontend-js/src/test/js/gui/Panel-test.js
similarity index 73%
rename from frontend-js/src/test/js/gui/leftPanel/Panel-test.js
rename to frontend-js/src/test/js/gui/Panel-test.js
index 88d3dd98fd626b96e8fc870e6337a847130f0f98..f1d8211feb384b3056a92480cd74e059da2f351a 100644
--- a/frontend-js/src/test/js/gui/leftPanel/Panel-test.js
+++ b/frontend-js/src/test/js/gui/Panel-test.js
@@ -2,15 +2,15 @@
 
 /* exported logger */
 
-var Helper = require('../../helper');
+var Helper = require('../helper');
 
-require('../../mocha-config.js');
+require('../mocha-config.js');
 
-var Panel = require('../../../../main/js/gui/leftPanel/Panel');
+var Panel = require('../../../main/js/gui/Panel');
 
 var chai = require('chai');
 var assert = chai.assert;
-var logger = require('../../logger');
+var logger = require('../logger');
 
 describe('Panel', function() {