ux(dashboard): added back hide controls toggle and shortcut, #6442

public/app/core/directives/dash_class.js

@@ -18,13 +18,17 @@ function (_, $, coreModule) {
           elem.toggleClass('panel-in-fullscreen', false);
           elem.toggleClass('panel-in-fullscreen', false);
         });
         });
 
 
-        $scope.$watch('dashboard.editMode', function() {
+        var lastHideControlsVal;
+        $scope.$watch('dashboard.hideControls', function() {
           if (!$scope.dashboard) {
           if (!$scope.dashboard) {
             return;
             return;
           }
           }
 
 
-          var editMode = $scope.dashboard.editMode;
-          elem.toggleClass('dash-edit-mode', editMode === true);
+          var hideControls = $scope.dashboard.hideControls;
+          if (lastHideControlsVal !== hideControls) {
+            elem.toggleClass('hide-controls', hideControls);
+            lastHideControlsVal = hideControls;
+          }
         });
         });
 
 
         $scope.$watch('playlistSrv', function(newValue) {
         $scope.$watch('playlistSrv', function(newValue) {

public/app/core/services/keybindingSrv.ts

@@ -85,6 +85,10 @@ export class KeybindingSrv {
       scope.broadcastRefresh();
       scope.broadcastRefresh();
     });
     });
 
 
+    this.bind('ctrl+h', () => {
+      dashboard.hideControls = !dashboard.hideControls;
+    });
+
     this.bind(['ctrl+s', 'command+s'], () => {
     this.bind(['ctrl+s', 'command+s'], () => {
       scope.appEvent('save-dashboard');
       scope.appEvent('save-dashboard');
     });
     });

public/app/features/dashboard/model.ts

@@ -22,6 +22,7 @@ export class DashboardModel {
   rows: DashboardRow[];
   rows: DashboardRow[];
   time: any;
   time: any;
   timepicker: any;
   timepicker: any;
+  hideControls: any;
   templating: any;
   templating: any;
   annotations: any;
   annotations: any;
   refresh: any;
   refresh: any;
@@ -51,6 +52,7 @@ export class DashboardModel {
     this.timezone = data.timezone || '';
     this.timezone = data.timezone || '';
     this.editable = data.editable !== false;
     this.editable = data.editable !== false;
     this.sharedCrosshair = data.sharedCrosshair || false;
     this.sharedCrosshair = data.sharedCrosshair || false;
+    this.hideControls = data.hideControls || false;
     this.time = data.time || { from: 'now-6h', to: 'now' };
     this.time = data.time || { from: 'now-6h', to: 'now' };
     this.timepicker = data.timepicker || {};
     this.timepicker = data.timepicker || {};
     this.templating = this.ensureListExist(data.templating);
     this.templating = this.ensureListExist(data.templating);

public/app/features/dashboard/partials/settings.html

@@ -56,6 +56,12 @@
                         label-class="width-11">
                         label-class="width-11">
         </gf-form-switch>
         </gf-form-switch>
 				<gf-form-switch class="gf-form"
 				<gf-form-switch class="gf-form"
+                        label="Hide Controls"
+                        tooltip="Hide row controls. Shortcut: CTRL+H"
+                        checked="dashboard.hideControls"
+                        label-class="width-11">
+        </gf-form-switch>
+        <gf-form-switch class="gf-form"
                         label="Shared Crosshair"
                         label="Shared Crosshair"
                         tooltip="Shared Crosshair line on all graphs. Shortcut: CTRL+O"
                         tooltip="Shared Crosshair line on all graphs. Shortcut: CTRL+O"
                         checked="dashboard.sharedCrosshair"
                         checked="dashboard.sharedCrosshair"

public/sass/pages/_dashboard.scss

@@ -18,6 +18,7 @@
   .dashnav-refresh-action,
   .dashnav-refresh-action,
   .dashnav-zoom-out,
   .dashnav-zoom-out,
   .dashnav-action-icons,
   .dashnav-action-icons,
+  .dash-row-menu,
   .dashnav-move-timeframe  {
   .dashnav-move-timeframe  {
     display: none;
     display: none;
   }
   }
@@ -27,6 +28,15 @@
   }
   }
 }
 }
 
 
+.hide-controls {
+  .add-row-panel-hint {
+    display: none;
+  }
+  .dash-row-menu {
+    display: none;
+  }
+}
+
 div.flot-text {
 div.flot-text {
   color: $text-color !important;
   color: $text-color !important;
 }
 }