diff --git a/viewer/css/cmv-theme-overrides.css b/viewer/css/cmv-theme-overrides.css
index 55219bc4a..00401a31e 100644
--- a/viewer/css/cmv-theme-overrides.css
+++ b/viewer/css/cmv-theme-overrides.css
@@ -3,13 +3,13 @@
 }
 
 .cmv .dijitTitlePane {
-    margin-bottom: 2px;
     background-color: #FFF;
+    margin-bottom: 2px;
 }
 
 .cmv .dijitTitlePaneTitle {
-    color: #666;
     background-color: #F5F5F5;
+    color: #666;
 }
 
 .cmv .dijitTitlePaneTitleOpen {
@@ -25,13 +25,6 @@
     outline: none !important;
 }
 
-/* icons for the sidebar */
-.cmv .dijitTitlePane .dijitTitlePaneTitle .titlePaneIcon {
-    margin: 0 0 0 8px;
-    padding-top: 2px;
-}
-/* end custom icons */
-
 /* esri popup window overrides */
 
 .cmv .esriPopup .sizer {
@@ -41,32 +34,38 @@
 .cmv .esriPopup .esriPopupWrapper {
     background-color: #FFFFFF;
 }
+
 .cmv .esriPopup .attachmentsSection div {
     font-weight: bold;
 }
+
 .cmv .esriPopup .contentPane table.attrTable {
-    width: 100%;
     border-collapse: collapse;
+    width: 100%;
 }
+
 .cmv .esriPopup .contentPane table.attrTable td {
     padding: 2px;
 }
+
 .cmv .esriPopup .contentPane table.attrTable td.attrName {
-    text-align: right;
-    font-weight: bold;
     color: #333333;
-    width: 40%;
+    font-weight: bold;
     padding-right: 5px;
+    text-align: right;
+    width: 40%;
 }
+
 .cmv .esriPopup .contentPane table.attrTable td.attrValue {
     width: 60%;
 }
+
 .cmv .esriPopup .contentPane table.attrTable tr {
-    vertical-align: top;
     border-bottom: 1px solid rgb(221, 221, 221);
+    vertical-align: top;
 }
 .cmv .esriPopup .contentPane table.attrTable tr:nth-child(odd) {
-    background-color: none;
+    background-color: transparent;
 }
 .cmv .esriPopup .contentPane table.attrTable tr:nth-child(even) {
     background-color: rgb(238, 238, 238);
@@ -79,24 +78,23 @@
 .cmv .esriPopupMobile {
     z-index: 999;
 }
-.cmv .esriMobileNavigationBar {
-    background-color: #666666;
-    background: url("../images/linen.jpg") repeat-x scroll left top transparent;
-    color: #FFFFFF;
-}
+
+.cmv .esriMobileNavigationBar,
 .cmv .esriPopupMobile .titlePane {
-    background-color: #666666;
     background: url("../images/linen.jpg") repeat-x scroll left top transparent;
+    background-color: #666666;
     color: #FFFFFF;
 }
+
 .cmv .esriPopupMobile .pointer.bottom{
-    background:url("../images/pointertop.png");
     -webkit-transform: rotate(180deg);
     -moz-transform: rotate(180deg);
     -o-transform: rotate(180deg);
     -ms-transform: rotate(180deg);
     transform: rotate(180deg);
 }
+
+.cmv .esriPopupMobile .pointer.bottom,
 .cmv .esriPopupMobile .pointer.top {
     background:url("../images/pointertop.png");
 }
@@ -117,11 +115,12 @@
     background-repeat: repeat-x;
     border: 1px solid #BBB;
     border-bottom: 1px solid #A8A8A8;
-    padding: 0px 12px;
     color: #000;
     letter-spacing: 0;
+    padding: 0 12px;
     text-transform: none;
 }
+
 .cmv .simpleDirections .esriStopsGetDirections:before {
     content: '\f277';
     font-family: 'FontAwesome';
@@ -156,9 +155,9 @@
     background-image: -ms-linear-gradient(bottom, #fff 0%, #e6e6e6 100%);
     background-image: linear-gradient(bottom, #fff 0%, #e6e6e6 100%);
     background-repeat: repeat-x;
-    box-shadow: inset 0 2px 4px rgba(0,0,0,0.4), 0 1px 1px rgba(0,0,0,0.2);
-    border-top-color: #444;
     border-color: #666;
+    border-top-color: #444;
+    box-shadow: inset 0 2px 4px rgba(0,0,0,0.4), 0 1px 1px rgba(0,0,0,0.2);
     -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.4), 0 1px 1px rgba(0,0,0,0.2);
 }
 
@@ -185,11 +184,11 @@
 }
 
 .flat .dijitTabContainerTop-tabs .dijitTabChecked:before {
-    height: 3px;
     background-color: #666;
-    top: -1px;
+    height: 3px;
     left: -1px;
     right: -1px;
+    top: -1px;
 }
 
 .flat .dijitTitlePaneTitle {
@@ -209,20 +208,56 @@
     border-top: none;
 }
 
+.flat .dijitButton .dijitButtonNode .dijitIcon.fa,
+.flat .dijitDropDownButton .dijitButtonNode .dijitIcon.fa,
+.flat .dijitComboButton .dijitButtonNode .dijitIcon.fa {
+    margin-top: 4px;
+}
+
+.flat .dijitButton .dijitButtonNode,
+.flat .dijitDropDownButton .dijitButtonNode,
+.flat .dijitComboButton .dijitButtonNode,
+.flat .dijitToggleButton .dijitButtonNode,
+.flat .dijitComboBox .dijitButtonNode,
+.flat .dijitSpinnerButtonContainer.dijitButtonNode,
+.flat .dijitSelect .dijitButtonNode {
+    background-color: #E6E6E6;
+    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #e6e6e6));
+    background-image: -webkit-linear-gradient(top, #fff 0%, #e6e6e6 100%);
+    background-image: -moz-linear-gradient(top, #fff 0%, #e6e6e6 100%);
+    background-image: -o-linear-gradient(top, #fff 0%, #e6e6e6 100%);
+    background-image: -ms-linear-gradient(top, #fff 0%, #e6e6e6 100%);
+    background-image: linear-gradient(top, #fff 0%, #e6e6e6 100%);
+    background-repeat: repeat-x;
+    border-bottom-color: #A8A8A8;
+    border-color: #BBB;
+    padding: 4px 12px;
+}
+
+.flat .dijitComboBox .dijitArrowButton,
+.flat .dijitSelect .dijitArrowButton {
+    padding: 4px;
+}
+
+.flat .dijitSpinner .dijitSpinnerButtonContainer {
+  padding: 0;
+}
+
 .flat .dijitButtonHover .dijitButtonNode,
 .flat .dijitDropDownButtonHover .dijitButtonNode,
 .flat .dijitComboButton .dijitButtonNodeHover,
 .flat .dijitComboButton .dijitDownArrowButtonHover,
 .flat .dijitToggleButtonHover .dijitButtonNode,
 .flat .dijitDropDownButtonActive .dijitButtonNode {
-    background-position: 0 -15px;
-    text-decoration: none;
-    transition: background-position 0.1s linear;
-    -moz-transition: background-position 0.1s linear;
-    -ms-transition: background-position 0.1s linear;
-    -o-transition: background-position 0.1s linear;
-    -webkit-transition: background-position 0.1s linear;
+  background-position: 0 -15px;
+  text-decoration: none;
+  transition: background-position 0.1s linear;
+  -moz-transition: background-position 0.1s linear;
+  -ms-transition: background-position 0.1s linear;
+  -o-transition: background-position 0.1s linear;
+  -webkit-transition: background-position 0.1s linear;
 }
+
 .flat .dijitButtonActive .dijitButtonNode,
 .flat .dijitComboButton .dijitButtonNodeActive,
 .flat .dijitToggleButtonActive .dijitButtonNode,
@@ -235,11 +270,12 @@
     background-image: -ms-linear-gradient(bottom, #fff 0%, #e6e6e6 100%);
     background-image: linear-gradient(bottom, #fff 0%, #e6e6e6 100%);
     background-repeat: repeat-x;
-    box-shadow: inset 0 2px 4px rgba(0,0,0,0.4), 0 1px 1px rgba(0,0,0,0.2);
-    border-top-color: #444;
     border-color: #666;
+    border-top-color: #444;
     -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.4), 0 1px 1px rgba(0,0,0,0.2);
+    box-shadow: inset 0 2px 4px rgba(0,0,0,0.4), 0 1px 1px rgba(0,0,0,0.2);
 }
+
 .flat .dijitButtonDisabled .dijitButtonNode,
 .flat .dijitDropDownButtonDisabled .dijitButtonNode,
 .flat .dijitComboButtonDisabled .dijitButtonNode,
@@ -247,24 +283,25 @@
 .flat .dijitComboBoxDisabled .dijitButtonNode,
 .flat .dijitSpinnerDisabled .dijitButtonNode,
 .flat .dijitSelectDisabled .dijitButtonNode {
-    background-image: none;
-    box-shadow: none;
-    cursor: not-allowed;
-    filter: alpha(opacity=65);
-    opacity: 0.65;
-    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65);
-    -webkit-box-shadow: none;
+  background-image: none;
+  -webkit-box-shadow:none;
+  box-shadow: none;
+  cursor: not-allowed;
+  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65);
+  filter: alpha(opacity=65);
+  opacity: 0.65;
 }
 
 .flat .success .dijitButtonNode {
     background: #409843;
-    color: #FFF;
     border-color: #39883c;
+    color: #FFF;
 }
+
 .flat .danger .dijitButtonNode {
     background: #e32d29;
-    color: #FFF;
     border-color: #d4201b;
+    color: #FFF;
 }
 
 .flat .dijitTextBoxHover,
@@ -283,4 +320,4 @@
     background-color: #999;
 }
 
-/* end flat theme */
+/* end flat theme */
\ No newline at end of file
diff --git a/viewer/js/config/viewer.js b/viewer/js/config/viewer.js
index 1b97e572c..f91d67098 100644
--- a/viewer/js/config/viewer.js
+++ b/viewer/js/config/viewer.js
@@ -349,6 +349,7 @@ define([
                 title: i18n.viewer.widgets.identify,
                 iconClass: 'fa-info-circle',
                 open: false,
+                preload: true,
                 position: 3,
                 options: 'config/identify'
             },
@@ -650,6 +651,13 @@ define([
                 type: 'floating',
                 path: 'gis/dijit/Help',
                 title: i18n.viewer.widgets.help,
+                iconClass: 'fa-info-circle',
+                paneOptions: {
+                    draggable: false,
+                    html: '<a href="#"><i class="fa fa-fw fa-info-circle"></i>link</a>'.replace('link', i18n.viewer.widgets.help),
+                    domTarget: 'helpDijit',
+                    style: 'height:345px;width:450px;'
+                },
                 options: {}
             }
 
diff --git a/viewer/js/gis/dijit/FloatingTitlePane/css/FloatingTitlePane.css b/viewer/js/gis/dijit/FloatingTitlePane/css/FloatingTitlePane.css
index 149b45b6c..ed17fc8d1 100644
--- a/viewer/js/gis/dijit/FloatingTitlePane/css/FloatingTitlePane.css
+++ b/viewer/js/gis/dijit/FloatingTitlePane/css/FloatingTitlePane.css
@@ -1,10 +1,16 @@
-.floatingWidgetDock:before {
-    float: right;
+.dijitTitlePane .dijitTitlePaneTitle .titlePaneIcon {
+    margin: 0 0 0 8px;
+    padding-top: 2px;
+}
+
+.dijitTitlePane .dijitTitlePaneTitle .floatingWidgetDock:before {
     content: "\f112";
+    float: right;
     font-family: FontAwesome;
 }
-.floatingWidgetPopout:before {
-    float: right;
+
+.dijitTitlePane .dijitTitlePaneTitle .floatingWidgetPopout:before {
     content: "\f064";
+    float: right;
     font-family: FontAwesome;
 }
\ No newline at end of file
diff --git a/viewer/js/gis/dijit/FloatingWidgetDialog.js b/viewer/js/gis/dijit/FloatingWidgetDialog.js
index 42a0170fa..ee25613ca 100644
--- a/viewer/js/gis/dijit/FloatingWidgetDialog.js
+++ b/viewer/js/gis/dijit/FloatingWidgetDialog.js
@@ -1,13 +1,30 @@
 define([
     'dojo/_base/declare',
-    'dijit/Dialog'
-], function (declare, Dialog) {
+    'dijit/Dialog',
+    'dojo/_base/lang',
+    'dojo/on',
+    'dojo/dom-construct',
+
+    'xstyle/css!./FloatingWidgetDialog/css/FloatingWidgetDialog.css'
+], function (declare, Dialog, lang, on, domConstruct) {
 
     return declare([Dialog], {
         declaredClass: 'gis.dijit.FloatingWidget',
         title: 'Floating Widget',
         draggable: true,
         'class': 'floatingWidget',
+        postCreate: function () {
+            if (this.iconClass) {
+                this.iconNode = domConstruct.create('span', {
+                    'class': 'titlePaneIcon fa fa-fw ' + this.iconClass
+                }, this.titleNode, 'before');
+            }
+            if (this.html && this.domTarget) {
+                var link = domConstruct.place(this.html, this.domTarget);
+                this.own(on(link, 'click', lang.hitch(this, 'show')));
+            }
+            this.inherited(arguments);
+        },
         close: function () {
             this.hide();
         },
diff --git a/viewer/js/gis/dijit/FloatingWidgetDialog/css/FloatingWidgetDialog.css b/viewer/js/gis/dijit/FloatingWidgetDialog/css/FloatingWidgetDialog.css
new file mode 100644
index 000000000..0947a7266
--- /dev/null
+++ b/viewer/js/gis/dijit/FloatingWidgetDialog/css/FloatingWidgetDialog.css
@@ -0,0 +1,3 @@
+.dijitDialogTitleBar .titlePaneIcon {
+    margin: 0 4px 0 0;
+}
\ No newline at end of file
diff --git a/viewer/js/gis/dijit/Help.js b/viewer/js/gis/dijit/Help.js
index 461a374d1..5375d3b03 100644
--- a/viewer/js/gis/dijit/Help.js
+++ b/viewer/js/gis/dijit/Help.js
@@ -4,8 +4,6 @@ define([
     'dijit/_TemplatedMixin',
     'dijit/_WidgetsInTemplateMixin',
     'gis/dijit/_FloatingWidgetMixin',
-    'dojo/dom-construct',
-    'dojo/on',
     'dojo/_base/lang',
     'dojo/aspect',
     'dojo/text!./Help/templates/HelpDialog.html',
@@ -14,26 +12,19 @@ define([
     'dijit/layout/TabContainer',
     'dijit/layout/ContentPane',
     'xstyle/css!./Help/css/Help.css'
-], function (declare, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, _FloatingWidgetMixin, domConstruct, on, lang, aspect, template, i18n) {
+], function (declare, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, _FloatingWidgetMixin, lang, aspect, template, i18n) {
 
     return declare([_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, _FloatingWidgetMixin], {
         widgetsInTemplate: true,
         templateString: template,
         i18n: i18n,
-        html: '<a href="#">link</a>'.replace('link', i18n.link),
-        domTarget: 'helpDijit',
-        draggable: false,
         baseClass: 'helpDijit',
         postCreate: function () {
             this.inherited(arguments);
-            this.parentWidget.draggable = this.draggable;
             if (this.parentWidget.toggleable) {
                 this.own(aspect.after(this.parentWidget, 'toggle', lang.hitch(this, function () {
                     this.containerNode.resize();
                 })));
-            } else {
-                var help = domConstruct.place(this.html, this.domTarget);
-                on(help, 'click', lang.hitch(this.parentWidget, 'show'));
             }
         },
         onOpen: function () {
diff --git a/viewer/js/gis/dijit/Help/css/Help.css b/viewer/js/gis/dijit/Help/css/Help.css
index 5900f2ba1..d153d3176 100644
--- a/viewer/js/gis/dijit/Help/css/Help.css
+++ b/viewer/js/gis/dijit/Help/css/Help.css
@@ -1,21 +1,21 @@
-.helpDijit .listdbootstrapFix{
+.helpDijit .listdbootstrapFix {
     padding: 0 0 0 25px;
 }
 
 .helpDijit .helpContainer {
-	padding: 0px;
+	padding: 0;
 }
+
 .floatingWidget .helpDijit .helpContainer {
 	padding: 5px;
 }
+
 .helpDijit .helpNode {
-    width: 98%;
-    height: 325px;
-}
-.floatingWidget .helpDijit .helpNode {
-    width: 450px;
+    height:280px;
+    width: 100%;
 }
+
 .helpDijit .helpTabContainer {
-	width: 100%;
 	height: 100%;
+    width: 100%;
 }
\ No newline at end of file
diff --git a/viewer/js/gis/dijit/Help/nls/es/resource.js b/viewer/js/gis/dijit/Help/nls/es/resource.js
index 6c4cea412..3f80ea63d 100644
--- a/viewer/js/gis/dijit/Help/nls/es/resource.js
+++ b/viewer/js/gis/dijit/Help/nls/es/resource.js
@@ -1,5 +1,4 @@
 define ({
-    link: 'Ayuda',
     navigation: {
         title: 'Navegación',
         description: 'Mapa de navegación a través del ratón y el teclado:',
diff --git a/viewer/js/gis/dijit/Help/nls/fr/resource.js b/viewer/js/gis/dijit/Help/nls/fr/resource.js
index 6bda3e07f..719cc48f9 100644
--- a/viewer/js/gis/dijit/Help/nls/fr/resource.js
+++ b/viewer/js/gis/dijit/Help/nls/fr/resource.js
@@ -1,5 +1,4 @@
 define ({
-    link: 'Aide',
     navigation: {
         title: 'Navigation',
         description: 'Navigation dans la carte en utilisant la souris et le clavier:',
diff --git a/viewer/js/gis/dijit/Help/nls/pt-br/resource.js b/viewer/js/gis/dijit/Help/nls/pt-br/resource.js
index 2793d85a8..8dc3218cd 100644
--- a/viewer/js/gis/dijit/Help/nls/pt-br/resource.js
+++ b/viewer/js/gis/dijit/Help/nls/pt-br/resource.js
@@ -1,5 +1,4 @@
 define({
-    link: 'Ajuda',
     navigation: {
         title: 'Navegação',
         description: 'Navegação no mapa usando o rato e o teclado',
diff --git a/viewer/js/gis/dijit/Help/nls/pt-pt/resource.js b/viewer/js/gis/dijit/Help/nls/pt-pt/resource.js
index 2793d85a8..8dc3218cd 100644
--- a/viewer/js/gis/dijit/Help/nls/pt-pt/resource.js
+++ b/viewer/js/gis/dijit/Help/nls/pt-pt/resource.js
@@ -1,5 +1,4 @@
 define({
-    link: 'Ajuda',
     navigation: {
         title: 'Navegação',
         description: 'Navegação no mapa usando o rato e o teclado',
diff --git a/viewer/js/gis/dijit/Help/nls/resource.js b/viewer/js/gis/dijit/Help/nls/resource.js
index 137c491ff..f7816fc9c 100644
--- a/viewer/js/gis/dijit/Help/nls/resource.js
+++ b/viewer/js/gis/dijit/Help/nls/resource.js
@@ -1,6 +1,5 @@
 define({
     root: {
-        link: 'Help',
         navigation: {
             title: 'Navigation',
             description: 'Map navigation using mouse and keyboard:',
diff --git a/viewer/js/viewer/_SidebarMixin.js b/viewer/js/viewer/_SidebarMixin.js
index db65fe722..056371458 100644
--- a/viewer/js/viewer/_SidebarMixin.js
+++ b/viewer/js/viewer/_SidebarMixin.js
@@ -37,7 +37,7 @@ define([
                 });
                 var deferred = new Deferred();
                 require([
-                    module.uri.substring(0, module.uri.lastIndexOf('/')) + '/sidebar/Sidebar.js'
+                    'viewer/sidebar/Sidebar'
                 ], lang.hitch(this, function (sidebar) {
                     Sidebar = sidebar;
                     this.mapDeferred.then(lang.hitch(this, '_createSidebar'));
@@ -112,17 +112,7 @@ define([
                 iconClass: widgetConfig.iconClass
             };
 
-            var tab = this.sidebar.createTab(tabOptions);
-            tab.contentNode = put(tab.containerNode, 'div.sidebar-widget div.sidebar-widget-content');
-
-            var node = put(tab.contentNode, 'div');
-            widgetConfig.type = 'domNode';
-            widgetConfig.srcNodeRef = node;
-            this.createWidgets([
-                {
-                    options: widgetConfig
-                }
-            ]);
+            return this.sidebar.createTab(tabOptions);
         }
 
     });
diff --git a/viewer/js/viewer/_WidgetsMixin.js b/viewer/js/viewer/_WidgetsMixin.js
index 8ab99d897..01408f82a 100644
--- a/viewer/js/viewer/_WidgetsMixin.js
+++ b/viewer/js/viewer/_WidgetsMixin.js
@@ -2,6 +2,7 @@ define([
     'dojo/_base/declare',
     'dojo/_base/array',
     'dojo/_base/lang',
+    'dojo/aspect',
     'dojo/promise/all',
     'dojo/Deferred',
 
@@ -17,6 +18,7 @@ define([
     declare,
     array,
     lang,
+    aspect,
     promiseAll,
     Deferred,
 
@@ -145,33 +147,49 @@ define([
             }
 
             // build a titlePane or floating widget as the parent
+            widgetConfig.watched = widgetConfig.watched || 'open';
             if ((widgetConfig.type === 'titlePane' || widgetConfig.type === 'contentPane' || widgetConfig.type === 'floating')) {
                 parentId = widgetConfig.widgetKey + '_parent';
                 if (widgetConfig.type === 'titlePane') {
                     pnl = this._createTitlePaneWidget(parentId, widgetConfig);
                 } else if (widgetConfig.type === 'contentPane') {
                     pnl = this._createContentPaneWidget(parentId, widgetConfig);
+                    widgetConfig.preload = true;
                 } else if (widgetConfig.type === 'floating') {
                     pnl = this._createFloatingWidget(parentId, widgetConfig);
                 }
                 widgetConfig.parentWidget = pnl;
+                widgetConfig.preload = (widgetConfig.preload) || pnl.get(widgetConfig.watched) || (typeof(pnl.watch) !== 'function');
                 this._showWidgetLoader(pnl);
             }
 
-            // 2 ways to use require to accommodate widgets that may have an optional separate configuration file
             var deferred = new Deferred();
+            widgetConfig.preload = (typeof(widgetConfig.preload) === 'undefined') ? true : widgetConfig.preload;
+            if (!widgetConfig.preload) {
+                widgetConfig.watchHandle = pnl.watch(widgetConfig.watched, lang.hitch(this, '_loadWidget', widgetConfig, deferred));
+            } else {
+                this._loadWidget(widgetConfig, deferred);
+            }
+            return deferred;
+        },
+
+        _loadWidget: function (widgetConfig, deferred) {
+            // 2 ways to use require to accommodate widgets that may have an optional separate configuration file
             if (typeof(widgetConfig.options) === 'string') {
                 require([widgetConfig.options, widgetConfig.path], lang.hitch(this, function (options, WidgetClass) {
-                    deferred.resolve();
                     this.createWidget(widgetConfig, options, WidgetClass);
+                    deferred.resolve();
                 }));
             } else {
                 require([widgetConfig.path], lang.hitch(this, function (WidgetClass) {
-                    deferred.resolve();
                     this.createWidget(widgetConfig, widgetConfig.options, WidgetClass);
+                    deferred.resolve();
                 }));
             }
-            return deferred;
+            if (widgetConfig.watchHandle) {
+                widgetConfig.watchHandle.unwatch();
+                widgetConfig.watchHandle.remove();
+            }
         },
 
         createWidget: function (widgetConfig, options, WidgetClass) {
@@ -282,7 +300,8 @@ define([
 
         _createFloatingWidget: function (parentId, widgetConfig) {
             var options = lang.mixin({
-                title: widgetConfig.title
+                title: widgetConfig.title,
+                iconClass: widgetConfig.iconClass
             }, widgetConfig.paneOptions || {});
             if (parentId) {
                 options.id = parentId;
diff --git a/viewer/js/viewer/sidebar/Sidebar.js b/viewer/js/viewer/sidebar/Sidebar.js
index 7df98b78d..ca0f37115 100644
--- a/viewer/js/viewer/sidebar/Sidebar.js
+++ b/viewer/js/viewer/sidebar/Sidebar.js
@@ -15,6 +15,8 @@ define([
 
     'put-selector/put',
 
+    'viewer/sidebar/SidebarTab',
+
     'dojo/text!./templates/Sidebar.html',
 
     'xstyle/css!./css/Sidebar.css',
@@ -38,17 +40,14 @@ define([
 
     put,
 
+    SidebarTab,
+
     template
 ) {
     return declare([_WidgetBase, _TemplatedMixin], {
         templateString: template,
         baseClass: 'sidebar',
 
-        defaultTabParams: {
-            title: 'Title',
-            iconClass: 'fa-bars'
-        },
-
         viewPadding: {
             top: 0,
             left: 0,
@@ -76,7 +75,6 @@ define([
             // resize tab and any widgets within the tab when it is opened
             on(this.domNode, 'transitionend, oTransitionEnd, webkitTransitionEnd, animationend, webkitAnimationEnd', lang.hitch(this, '_resizeActiveTab'));
 
-
             // resize tab and any widgets within the tab when the browser is resized
             on(window, 'resize', lang.hitch(this, function () {
                 window.setTimeout(lang.hitch(this, '_resizeActiveTab'), 300); // 300ms to wait for the animation to complete
@@ -85,66 +83,37 @@ define([
         },
 
         createTab: function (options) {
-            options = lang.mixin(lang.clone(this.defaultTabParams), options || {});
-            var tab = {
-                id: options.id,
-                buttonNode: null,
-                containerNode: null,
-                titleNode: null,
-                closeBtnNode: null,
-                contentNode: null
-            };
-            //create and place dom elements for the tab button and pane
-            tab.buttonNode = put(this.tabsButtonNode, 'li a[role=tab] i.fa.' + options.iconClass + '<<');
-            tab.containerNode = put(this.tabsContainerNode, 'div.' + this.baseClass + '-pane');
-            tab.titleNode = put(tab.containerNode, 'div.' + this.baseClass + '-pane-title $', options.title);
-
-            if (this.showCloseIcon) {
-                tab.closeBtnNode = put(tab.titleNode, 'i.fa.fa-chevron-left.' + this.baseClass + '-closeIcon');
-                // listen for the tab close button click
-                on(tab.closeBtnNode, 'click', lang.hitch(this, 'tabClickHandler', tab));
+            options = options || {};
+            options.open = options.open || false;
+            options.baseClass = this.baseClass;
+            options.showCloseIcon = this.showCloseIcon;
+            options.tabsContainerNode = this.tabsContainerNode;
+            options.tabsButtonNode = this.tabsButtonNode;
+
+            var tab = new SidebarTab(options);
+            tab.watch('open', lang.hitch(this, 'checkTabs', tab));
+            if (options.open) {
+                tab.openTab();
             }
 
-            // listen for the tab button click
-            on(tab.buttonNode, 'click', lang.hitch(this, 'tabClickHandler', tab));
-
-            //keep a reference to this tab
             this.tabs.push(tab);
-
-            //return the tabs pane node
             return tab;
         },
 
-        openTab: function (tab) {
+        checkTabs: function (tab) {
             array.forEach(this.tabs, function (childTab) {
-                put(childTab.buttonNode, '!active');
-                put(childTab.containerNode, '!active');
-                put(childTab.contentNode, '!active');
+                if (childTab.get('id') !== tab.get('id')) {
+                    childTab.closeTab(true);
+                }
             });
-            put(tab.buttonNode, '.active');
-            put(tab.containerNode, '.active');
-            put(tab.contentNode, '.active');
-            put(this.tabsButtonNode, '.active');
-            put(this.domNode, '!collapsed');
-            put(this.mapContainer, '!sidebar-collapsed');
-        },
-
-        closeTab: function () {
-            array.forEach(this.tabs, function (tab) {
-                put(tab.buttonNode, '!active');
-                put(tab.containerNode, '!active');
-                put(tab.contentNode, '!active');
-            }, this);
-            put(this.tabsButtonNode, '!active');
-            put(this.domNode, '.collapsed');
-            put(this.mapContainer, '.sidebar-collapsed');
-        },
-
-        tabClickHandler: function (tab) {
-            if (domClass.contains(tab.buttonNode, 'active')) {
-                this.closeTab(tab);
+            if (tab.get('open')) {
+                domClass.add(this.tabsButtonNode, 'active');
+                domClass.remove(this.domNode, 'collapsed');
+                domClass.remove(this.mapContainer, 'sidebar-collapsed');
             } else {
-                this.openTab(tab);
+                domClass.remove(this.tabsButtonNode, 'active');
+                domClass.add(this.domNode, 'collapsed');
+                domClass.add(this.mapContainer, 'sidebar-collapsed');
             }
         },
 
diff --git a/viewer/js/viewer/sidebar/SidebarTab.js b/viewer/js/viewer/sidebar/SidebarTab.js
new file mode 100644
index 000000000..db4945f77
--- /dev/null
+++ b/viewer/js/viewer/sidebar/SidebarTab.js
@@ -0,0 +1,87 @@
+define([
+    'dojo/_base/declare',
+    'dijit/_WidgetBase',
+
+    'dojo/_base/lang',
+    'dojo/on',
+    'dojo/dom-class',
+
+    'put-selector/put'
+
+], function (
+    declare,
+    _WidgetBase,
+
+    lang,
+    on,
+    domClass,
+
+    put
+
+) {
+    return declare([_WidgetBase], {
+        id: null,
+        title: 'Title',
+        iconClass: 'fa-bars',
+        open: false,
+        baseClass: null,
+        tabsButtonNode: null,
+        tabsContainerNode: null,
+        buttonNode: null,
+        contentNode: null,
+        titleNode: null,
+        closeBtnNode: null,
+        containerNode: null,
+
+        postCreate: function () {
+            this.inherited(arguments);
+
+            //create and place dom element for the tab button
+            this.buttonNode = put(this.tabsButtonNode, 'li a[role=tab] i.fa.' + this.iconClass + '<<');
+
+            //create and place dom elements for the tab pane
+            this.contentNode = put(this.tabsContainerNode, 'div.' + this.baseClass + '-pane');
+            this.titleNode = put(this.contentNode, 'div.' + this.baseClass + '-pane-title $', this.title);
+            this.containerNode = put(this.contentNode, 'div.sidebar-widget div.sidebar-widget-content');
+            if (this.showCloseIcon) {
+                this.closeBtnNode = put(this.titleNode, 'i.fa.fa-chevron-left.' + this.baseClass + '-closeIcon');
+                // listen for the tab close button click
+                on(this.closeBtnNode, 'click', lang.hitch(this, 'tabClickHandler'));
+            }
+
+            // listen for the tab button click
+            on(this.buttonNode, 'click', lang.hitch(this, 'tabClickHandler'));
+
+        },
+
+        openTab: function (silent) {
+            domClass.add(this.buttonNode, 'active');
+            domClass.add(this.containerNode, 'active');
+            domClass.add(this.contentNode, 'active');
+            if (silent) {
+                this.open = true;
+                return;
+            }
+            this.set('open', true);
+        },
+
+        closeTab: function (silent) {
+            domClass.remove(this.buttonNode, 'active');
+            domClass.remove(this.containerNode, 'active');
+            domClass.remove(this.contentNode, 'active');
+            if (silent) {
+                this.open = false;
+                return;
+            }
+            this.set('open', false);
+        },
+
+        tabClickHandler: function () {
+            if (domClass.contains(this.buttonNode, 'active')) {
+                this.closeTab();
+            } else {
+                this.openTab();
+            }
+        }
+    });
+});
\ No newline at end of file