Merge pull request #154 from EverythingMe/90-ui-issues

[#90] save only modified fields when changing query name/description
getredash · Mar 26, 2014 · ff9fadd · ff9fadd
2 parents a46c651 + 40adba4
commit ff9fadd
Show file tree

Hide file tree

Showing 16 changed files with 346 additions and 266 deletions.
diff --git a/rd_ui/app/index.html b/rd_ui/app/index.html
@@ -120,6 +120,7 @@
 <script src="/scripts/services/notifications.js"></script>
 <script src="/scripts/services/dashboards.js"></script>
 <script src="/scripts/controllers/controllers.js"></script>
+<script src="/scripts/controllers/dashboard.js"></script>
 <script src="/scripts/controllers/admin_controllers.js"></script>
 <script src="/scripts/controllers/query_view.js"></script>
 <script src="/scripts/controllers/query_edit.js"></script>
@@ -130,6 +131,7 @@
 <script src="/scripts/visualizations/pivot.js"></script>
 <script src="/scripts/directives/directives.js"></script>
 <script src="/scripts/directives/query_directives.js"></script>
+<script src="/scripts/directives/dashboard_directives.js"></script>
 <script src="/scripts/filters.js"></script>
 <!-- endbuild -->
 

diff --git a/rd_ui/app/scripts/app.js b/rd_ui/app/scripts/app.js
@@ -17,16 +17,9 @@ angular.module('redash', [
 ]).config(['$routeProvider', '$locationProvider', '$compileProvider', 'growlProvider',
     function($routeProvider, $locationProvider, $compileProvider, growlProvider) {
 
-        function getQuery(Query, $q, $route) {
-            var defer = $q.defer();
-
-            Query.get({
-                'id': $route.current.params.queryId
-            }, function(query) {
-                defer.resolve(query);
-            });
-
-            return defer.promise;
+        function getQuery(Query, $route) {
+            var query = Query.get({'id': $route.current.params.queryId });
+            return query.$promise;
         };
 
         $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|http|data):/);
@@ -57,15 +50,15 @@ angular.module('redash', [
             controller: 'QueryViewCtrl',
             reloadOnSearch: false,
             resolve: {
-                'query': ['Query', '$q', '$route', getQuery]
+                'query': ['Query', '$route', getQuery]
             }
         });
         $routeProvider.when('/queries/:queryId/source', {
             templateUrl: '/views/query.html',
             controller: 'QueryEditCtrl',
             reloadOnSearch: false,
             resolve: {
-                'query': ['Query', '$q', '$route', getQuery]
+                'query': ['Query', '$route', getQuery]
             }
         });
         $routeProvider.when('/admin/status', {

diff --git a/rd_ui/app/scripts/controllers/controllers.js b/rd_ui/app/scripts/controllers/controllers.js
@@ -1,77 +1,4 @@
 (function () {
-    var DashboardCtrl = function ($scope, $routeParams, $http, $timeout, Dashboard) {
-        $scope.refreshEnabled = false;
-        $scope.refreshRate = 60;
-        $scope.dashboard = Dashboard.get({slug: $routeParams.dashboardSlug}, function(dashboard) {
-            $scope.$parent.pageTitle = dashboard.name;
-        });
-
-        var autoRefresh = function() {
-            if ($scope.refreshEnabled) {
-                $timeout(function() {
-                    Dashboard.get({slug: $routeParams.dashboardSlug}, function(dashboard) {
-                        var newWidgets = _.groupBy(_.flatten(dashboard.widgets), 'id');
-
-                        _.each($scope.dashboard.widgets, function(row) {
-                            _.each(row, function(widget, i) {
-                                var newWidget = newWidgets[widget.id];
-                                if (newWidget && newWidget[0].visualization.query.latest_query_data_id != widget.visualization.query.latest_query_data_id ) {
-                                    row[i] = newWidget[0];
-                                }
-                            });
-                        });
-
-                        autoRefresh();
-                    });
-
-                }, $scope.refreshRate);
-            };
-        }
-
-        $scope.triggerRefresh = function(){
-            $scope.refreshEnabled = !$scope.refreshEnabled;
-
-            if ($scope.refreshEnabled) {
-                var refreshRate = _.min(_.flatten($scope.dashboard.widgets), function(widget) {
-                    return widget.visualization.query.ttl;
-                }).visualization.query.ttl;
-
-                $scope.refreshRate = _.max([120, refreshRate * 2])*1000;
-
-                autoRefresh();
-            }
-        };
-    };
-
-    var WidgetCtrl = function ($scope, $http, $location, Query) {
-        $scope.deleteWidget = function() {
-            if (!confirm('Are you sure you want to remove "' + $scope.widget.visualization.name + '" from the dashboard?')) {
-                return;
-            }
-
-            $http.delete('/api/widgets/' + $scope.widget.id).success(function() {
-                $scope.dashboard.widgets = _.map($scope.dashboard.widgets, function(row) {
-                    return _.filter(row, function(widget) {
-                        return widget.id != $scope.widget.id;
-                    })
-                });
-            });
-        };
-
-        $scope.open = function(query, visualization) {
-            $location.path('/queries/' + query.id);
-            $location.hash(visualization.id);
-        }
-
-        $scope.query = new Query($scope.widget.visualization.query);
-        $scope.queryResult = $scope.query.getQueryResult();
-
-        $scope.updateTime = (new Date($scope.queryResult.getUpdatedAt())).toISOString();
-        $scope.nextUpdateTime = moment(new Date(($scope.query.updated_at + $scope.query.ttl + $scope.query.runtime + 300) * 1000)).fromNow();
-
-        $scope.updateTime = '';
-    }
-
     var QueriesCtrl = function($scope, $http, $location, $filter, Query) {
         $scope.$parent.pageTitle = "All Queries";
         $scope.gridConfig = {
@@ -222,8 +149,6 @@
     }
 
     angular.module('redash.controllers', [])
-        .controller('DashboardCtrl', ['$scope', '$routeParams', '$http', '$timeout', 'Dashboard', DashboardCtrl])
-        .controller('WidgetCtrl', ['$scope', '$http', '$location', 'Query', WidgetCtrl])
         .controller('QueriesCtrl', ['$scope', '$http', '$location', '$filter', 'Query', QueriesCtrl])
         .controller('IndexCtrl', ['$scope', 'Dashboard', IndexCtrl])
         .controller('MainCtrl', ['$scope', 'Dashboard', 'notifications', MainCtrl]);

diff --git a/rd_ui/app/scripts/controllers/dashboard.js b/rd_ui/app/scripts/controllers/dashboard.js
@@ -0,0 +1,78 @@
+(function() {
+  var DashboardCtrl = function($scope, $routeParams, $http, $timeout, Dashboard) {
+    $scope.refreshEnabled = false;
+    $scope.refreshRate = 60;
+    $scope.dashboard = Dashboard.get({
+      slug: $routeParams.dashboardSlug
+    }, function(dashboard) {
+      $scope.$parent.pageTitle = dashboard.name;
+    });
+
+    var autoRefresh = function() {
+      if ($scope.refreshEnabled) {
+        $timeout(function() {
+          Dashboard.get({
+            slug: $routeParams.dashboardSlug
+          }, function(dashboard) {
+            var newWidgets = _.groupBy(_.flatten(dashboard.widgets), 'id');
+
+            _.each($scope.dashboard.widgets, function(row) {
+              _.each(row, function(widget, i) {
+                var newWidget = newWidgets[widget.id];
+                if (newWidget && newWidget[0].visualization.query.latest_query_data_id != widget.visualization.query.latest_query_data_id) {
+                  row[i] = newWidget[0];
+                }
+              });
+            });
+
+            autoRefresh();
+          });
+
+        }, $scope.refreshRate);
+      };
+    }
+
+    $scope.triggerRefresh = function() {
+      $scope.refreshEnabled = !$scope.refreshEnabled;
+
+      if ($scope.refreshEnabled) {
+        var refreshRate = _.min(_.flatten($scope.dashboard.widgets), function(widget) {
+          return widget.visualization.query.ttl;
+        }).visualization.query.ttl;
+
+        $scope.refreshRate = _.max([120, refreshRate * 2]) * 1000;
+
+        autoRefresh();
+      }
+    };
+  };
+
+  var WidgetCtrl = function($scope, $http, $location, Query) {
+    $scope.deleteWidget = function() {
+      if (!confirm('Are you sure you want to remove "' + $scope.widget.visualization.name + '" from the dashboard?')) {
+        return;
+      }
+
+      $http.delete('/api/widgets/' + $scope.widget.id).success(function() {
+        $scope.dashboard.widgets = _.map($scope.dashboard.widgets, function(row) {
+          return _.filter(row, function(widget) {
+            return widget.id != $scope.widget.id;
+          })
+        });
+      });
+    };
+
+    $scope.query = new Query($scope.widget.visualization.query);
+    $scope.queryResult = $scope.query.getQueryResult();
+
+    $scope.updateTime = (new Date($scope.queryResult.getUpdatedAt())).toISOString();
+    $scope.nextUpdateTime = moment(new Date(($scope.query.updated_at + $scope.query.ttl + $scope.query.runtime + 300) * 1000)).fromNow();
+
+    $scope.updateTime = '';
+  };
+
+  angular.module('redash.controllers')
+    .controller('DashboardCtrl', ['$scope', '$routeParams', '$http', '$timeout', 'Dashboard', DashboardCtrl])
+    .controller('WidgetCtrl', ['$scope', '$http', '$location', 'Query', WidgetCtrl])
+
+})();
diff --git a/rd_ui/app/scripts/controllers/query_edit.js b/rd_ui/app/scripts/controllers/query_edit.js
@@ -25,8 +25,8 @@
     KeyboardShortcuts.bind(shortcuts);
 
     $scope.onQuerySave = function(savedQuery) {
-      $scope.isDirty = false;
       queryText = savedQuery.query;
+      $scope.isDirty = $scope.query.query !== queryText;
     };
 
     $scope.deleteVisualization = function($e, vis) {

diff --git a/rd_ui/app/scripts/controllers/query_view.js b/rd_ui/app/scripts/controllers/query_view.js
@@ -21,7 +21,7 @@
       $scope.queryExecuting = lock;
     };
 
-    $scope.saveQuery = function(duplicate) {
+    $scope.saveQuery = function(duplicate, data) {
       var
       successMessage = "Query saved",
       oldId = $scope.query.id;
@@ -32,9 +32,15 @@
         $scope.query.ttl = -1;
       }
 
+      if (data) {
+        data.id = $scope.query.id;
+      } else {
+        data = $scope.query;
+      }
+
       delete $scope.query.latest_query_data;
 
-      $scope.query.$save(function(savedQuery) {
+      Query.save(data, function(savedQuery) {
         $scope.onQuerySave(savedQuery);
 
         if (oldId != savedQuery.id) {
@@ -48,6 +54,14 @@
       });
     };
 
+    $scope.saveDescription = function() {
+      $scope.saveQuery(false, {'description': $scope.query.description});
+    };
+
+    $scope.saveName = function() {
+      $scope.saveQuery(false, {'name': $scope.query.name});
+    };
+
     $scope.duplicateQuery = function() {
       $scope.saveQuery(true);
     };
@@ -75,6 +89,11 @@
         $scope.executeQuery();
     };
 
+    $scope.setVisualizationTab = function (visualization) {
+      $scope.selectedTab = visualization.id;
+      $location.hash(visualization.id);
+    };
+
     $scope.$watch('query.name', function() {
       $scope.$parent.pageTitle = $scope.query.name;
     });