diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2DetailsPanel.js b/web/gui/src/main/webapp/app/view/topo2/topo2DetailsPanel.js
index 921ebef..5e88295 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2DetailsPanel.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2DetailsPanel.js
@@ -31,10 +31,12 @@
     // TODO: Topo2<Device|Link|Host>Panel should only be concerned with the content displayed
 
     // Injected Services
-    var Panel;
+    var Panel, flash;
 
     // Internal State
-    var detailsPanel, summaryPanel;
+    var useDetails = true,
+        detailsPanel,
+        summaryPanel;
 
     // configuration
     var id = 'topo2-p-detail',
@@ -73,6 +75,10 @@
             },
             show: function () {
 
+                if (!useDetails) {
+                    return;
+                }
+
                 var summaryInstance = summaryPanel.getInstance(),
                     position = 0;
 
@@ -85,6 +91,25 @@
                     .style('top', panelPadding + position + 'px');
                 detailsPanel.el.show();
             },
+            hide: function () {
+                detailsPanel.el.hide();
+            },
+            toggleUseDetailsFlag: function (x) {
+                var kev = (x === 'keyev'),
+                    verb;
+
+                useDetails = kev ? !useDetails : !!x;
+                verb = useDetails ? 'Enable' : 'Disable';
+
+                if (useDetails) {
+                    this.show();
+                } else {
+                    this.hide();
+                }
+
+                flash.flash(verb + ' details panel');
+                return useDetails;
+            },
         });
 
         detailsPanel = new Panel(id, options);
@@ -96,9 +121,10 @@
 
     angular.module('ovTopo2')
     .factory('Topo2DetailsPanelService', [
-        'Topo2PanelService',
-        function (_ps_) {
+        'Topo2PanelService', 'FlashService',
+        function (_ps_, _flash_) {
             Panel = _ps_;
+            flash = _flash_;
 
             return getInstance;
         },
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js b/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js
index b396f30..7e2ad18 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js
@@ -18,13 +18,14 @@
 
     // Injected Services
     var $log, fs, ks, flash, wss, t2ps, t2bgs, ps, t2is, t2sp, t2vs, t2rs,
-        t2fs, t2tbs;
+        t2fs, t2tbs, t2dp;
 
     // Commmands
     function actionMap() {
         return {
             L: [cycleDeviceLabels, 'Cycle device labels'],
             B: [toggleBackground, 'Toggle background'],
+            D: [toggleDetails, 'Toggle details panel'],
             I: [toggleInstancePanel, 'Toggle ONOS Instance Panel'],
             O: [toggleSummary, 'Toggle the Summary Panel'],
             R: [resetZoom, 'Reset pan / zoom'],
@@ -146,6 +147,10 @@
         t2bgs.toggle(x);
     }
 
+    function toggleDetails(x) {
+        t2dp().toggleUseDetailsFlag(x);
+    }
+
     function toggleInstancePanel(x) {
         updatePrefsState('insts', t2is.toggle(x));
     }
@@ -223,10 +228,10 @@
         '$log', 'FnService', 'KeyService', 'FlashService', 'WebSocketService',
         'Topo2PrefsService', 'Topo2BackgroundService', 'PrefsService',
         'Topo2InstanceService', 'Topo2SummaryPanelService', 'Topo2ViewService',
-        'Topo2RegionService',
+        'Topo2RegionService', 'Topo2DetailsPanelService',
 
         function (_$log_, _fs_, _ks_, _flash_, _wss_, _t2ps_, _t2bgs_, _ps_,
-                  _t2is_, _t2sp_, _t2vs_, _t2rs_) {
+                  _t2is_, _t2sp_, _t2vs_, _t2rs_, _t2dp_) {
 
             $log = _$log_;
             fs = _fs_;
@@ -240,6 +245,7 @@
             t2sp = _t2sp_;
             t2vs = _t2vs_;
             t2rs = _t2rs_;
+            t2dp = _t2dp_;
 
             return {
                 init: init,