From 7a94bed2509159c23d92a0aa87346230bb63978f Mon Sep 17 00:00:00 2001
From: Arik Fraimovich <arik@arikfr.com>
Date: Fri, 23 Dec 2016 22:58:15 +0200
Subject: [PATCH] Close #1453: more minimal notification of draft status for
 query/dashboard

---
 client/app/assets/css/redash.css           |  2 +-
 client/app/pages/dashboards/dashboard.html | 95 +++++++++++-----------
 client/app/pages/queries/query.html        |  4 +-
 3 files changed, 51 insertions(+), 50 deletions(-)

diff --git a/client/app/assets/css/redash.css b/client/app/assets/css/redash.css
index a615cd1690..4c8d167628 100644
--- a/client/app/assets/css/redash.css
+++ b/client/app/assets/css/redash.css
@@ -312,7 +312,7 @@ to add those CSS styles here. */
 }
 
 .rd-form-control {
-  width: 100%;
+  width: 90%;
 }
 
 pivot-table-renderer > table, grid-renderer > div, visualization-renderer > div {
diff --git a/client/app/pages/dashboards/dashboard.html b/client/app/pages/dashboards/dashboard.html
index 74598a8f17..53186137fa 100644
--- a/client/app/pages/dashboards/dashboard.html
+++ b/client/app/pages/dashboards/dashboard.html
@@ -1,56 +1,59 @@
 <div class="container">
-  <page-header title="{{$ctrl.dashboard.name}}">
-    <span ng-if="!$ctrl.dashboard.is_archived && !public" class="hidden-print">
-        <div class="btn-group" uib-dropdown>
-          <button id="split-button" type="button"
-          ng-class="{'btn-default': $ctrl.refreshRate === null,'btn-primary':$ctrl.refreshRate !== null}"
-          class="btn" ng-click="$ctrl.loadDashboard(true)">
-            {{$ctrl.refreshRate === null ? 'Refresh' : $ctrl.refreshRate.name}}
-          </button>
-          <button type="button" class="btn" uib-dropdown-toggle
-          ng-class="{'btn-default': $ctrl.refreshRate === null,'btn-primary':$ctrl.refreshRate !== null}">
-            <span class="caret"></span>
-            <span class="sr-only">Split button!</span>
-          </button>
-          <ul class="dropdown-menu" ng-model="$ctrl.refreshRate" uib-dropdown-menu role="menu" aria-labelledby="split-button">
-            <li role="menuitem" ng-repeat="refreshRate in $ctrl.refreshRates">
-              <a href="#" ng-click="$ctrl.setRefreshRate(refreshRate)">{{refreshRate.name}}</a>
-            </li>
-            <li role="menuitem" ng-if="$ctrl.refreshRate !== null">
-              <a href="#" ng-click="$ctrl.setRefreshRate(null)">Stop auto refresh</a>
-            </li>
-          </ul>
-        </div>
-        <button type="button" class="btn btn-sm" ng-class="{'btn-default': !$ctrl.isFullscreen, 'btn-primary': $ctrl.isFullscreen}" tooltip="Enable/Disable Fullscreen display" ng-click="$ctrl.toggleFullscreen()">
-          <span class="zmdi zmdi-fullscreen"></span>
-        </button>
-        <button type="button" class="btn btn-sm" ng-class="{'btn-default': !$ctrl.dashboard.publicAccessEnabled, 'btn-primary': $ctrl.dashboard.publicAccessEnabled}" tooltip="Enable/Disable Share URL" ng-click="$ctrl.openShareForm()" ng-if="$ctrl.dashboard.canEdit() || $ctrl.dashboard.publicAccessEnabled">
-          <span class="zmdi zmdi-share"></span>
-        </button>
-    </span>
-    <div class="btn-group hidden-print" role="group" ng-show="$ctrl.dashboard.canEdit()" uib-dropdown>
-      <button class="btn btn-default btn-sm dropdown-toggle" uib-dropdown-toggle>
-        <span class="zmdi zmdi-more"></span>
-      </button>
-      <ul class="dropdown-menu pull-right" uib-dropdown-menu>
-        <li ng-if="!$ctrl.dashboard.is_archived"><a ng-click="$ctrl.editDashboard()">Edit Dashboard</a></li>
-        <li ng-if="!$ctrl.dashboard.is_archived"><a ng-click="$ctrl.addWidget()">Add Widget</a></li>
-        <li ng-if="$ctrl.showPermissionsControl"><a ng-click="$ctrl.showManagePermissionsModal()">Manage Permissions</a></li>
-        <li ng-if="!$ctrl.dashboard.is_draft"><a ng-click="$ctrl.togglePublished()">Unpublish Dashboard</a></li>
-        <li ng-if="$ctrl.dashboard.is_draft"><a ng-click="$ctrl.togglePublished()">Publish Dashboard</a></li>
-        <li ng-if="!$ctrl.dashboard.is_archived"><a ng-click="$ctrl.archiveDashboard()">Archive Dashboard</a></li>
-      </ul>
+  <div class="row bg-white p-10 p-l-15 p-r-15 m-b-10">
+    <div class="col-sm-9">
+      <h3>{{$ctrl.dashboard.name}} <span class="label label-warning" ng-if="$ctrl.dashboard.is_draft">Draft</span></h3>
     </div>
-  </page-header>
+    <div class="col-sm-3 text-right">
+      <h3>
+        <span ng-if="!$ctrl.dashboard.is_archived && !public" class="hidden-print">
+            <div class="btn-group" uib-dropdown>
+              <button id="split-button" type="button"
+                      ng-class="{'btn-default': $ctrl.refreshRate === null,'btn-primary':$ctrl.refreshRate !== null}"
+                      class="btn" ng-click="$ctrl.loadDashboard(true)">
+                {{$ctrl.refreshRate === null ? 'Refresh' : $ctrl.refreshRate.name}}
+              </button>
+              <button type="button" class="btn" uib-dropdown-toggle
+                      ng-class="{'btn-default': $ctrl.refreshRate === null,'btn-primary':$ctrl.refreshRate !== null}">
+                <span class="caret"></span>
+                <span class="sr-only">Split button!</span>
+              </button>
+              <ul class="dropdown-menu" ng-model="$ctrl.refreshRate" uib-dropdown-menu role="menu" aria-labelledby="split-button">
+                <li role="menuitem" ng-repeat="refreshRate in $ctrl.refreshRates">
+                  <a href="#" ng-click="$ctrl.setRefreshRate(refreshRate)">{{refreshRate.name}}</a>
+                </li>
+                <li role="menuitem" ng-if="$ctrl.refreshRate !== null">
+                  <a href="#" ng-click="$ctrl.setRefreshRate(null)">Stop auto refresh</a>
+                </li>
+              </ul>
+            </div>
+            <button type="button" class="btn btn-sm" ng-class="{'btn-default': !$ctrl.isFullscreen, 'btn-primary': $ctrl.isFullscreen}" tooltip="Enable/Disable Fullscreen display" ng-click="$ctrl.toggleFullscreen()">
+              <span class="zmdi zmdi-fullscreen"></span>
+            </button>
+            <button type="button" class="btn btn-sm" ng-class="{'btn-default': !$ctrl.dashboard.publicAccessEnabled, 'btn-primary': $ctrl.dashboard.publicAccessEnabled}" tooltip="Enable/Disable Share URL" ng-click="$ctrl.openShareForm()" ng-if="$ctrl.dashboard.canEdit() || $ctrl.dashboard.publicAccessEnabled">
+              <span class="zmdi zmdi-share"></span>
+            </button>
+        </span>
+            <div class="btn-group hidden-print" role="group" ng-show="$ctrl.dashboard.canEdit()" uib-dropdown>
+              <button class="btn btn-default btn-sm dropdown-toggle" uib-dropdown-toggle>
+                <span class="zmdi zmdi-more"></span>
+              </button>
+              <ul class="dropdown-menu pull-right" uib-dropdown-menu>
+                <li ng-if="!$ctrl.dashboard.is_archived"><a ng-click="$ctrl.editDashboard()">Edit Dashboard</a></li>
+                <li ng-if="!$ctrl.dashboard.is_archived"><a ng-click="$ctrl.addWidget()">Add Widget</a></li>
+                <li ng-if="$ctrl.showPermissionsControl"><a ng-click="$ctrl.showManagePermissionsModal()">Manage Permissions</a></li>
+                <li ng-if="!$ctrl.dashboard.is_draft"><a ng-click="$ctrl.togglePublished()">Unpublish Dashboard</a></li>
+                <li ng-if="$ctrl.dashboard.is_draft"><a ng-click="$ctrl.togglePublished()">Publish Dashboard</a></li>
+                <li ng-if="!$ctrl.dashboard.is_archived"><a ng-click="$ctrl.archiveDashboard()">Archive Dashboard</a></li>
+              </ul>
+            </div>
+      </h3>
+    </div>
+  </div>
 
   <div class="col-lg-12 p-5 m-b-10 bg-orange c-white" ng-if="$ctrl.dashboard.is_archived">
     This dashboard is archived and won't appear in the dashboards list or search results.
   </div>
 
-  <div class="col-lg-12 p-5 m-b-10 bg-orange c-white" ng-if="$ctrl.dashboard.is_draft">
-    This dashboard is a draft.
-  </div>
-
   <div class="m-b-5">
     <filters ng-if="$ctrl.dashboard.dashboard_filters_enabled"></filters>
   </div>
diff --git a/client/app/pages/queries/query.html b/client/app/pages/queries/query.html
index 3242f658ca..88c2849774 100644
--- a/client/app/pages/queries/query.html
+++ b/client/app/pages/queries/query.html
@@ -21,6 +21,7 @@
     <div class="col-sm-9">
       <h3>
         <edit-in-place editable="canEdit" done="saveName" ignore-blanks="true" value="query.name"></edit-in-place>
+        <span class="label label-warning" ng-if="query.is_draft">Draft</span>
       </h3>
       <p>
         <em>
@@ -77,9 +78,6 @@ <h3>
     <div class="col-lg-12 p-5 bg-orange c-white" ng-if="query.is_archived">
       This query is archived and can't be used in dashboards, and won't appear in search results.
     </div>
-    <div class="col-lg-12 p-5 bg-orange c-white" ng-if="query.is_draft">
-      This query is a draft.
-    </div>
   </div>
 
   <!-- editor -->