diff --git a/rd_service/server.py b/rd_service/server.py
index 75fcbf16b..dbeef29ee 100644
--- a/rd_service/server.py
+++ b/rd_service/server.py
@@ -269,7 +269,7 @@ class VisualizationHandler(BaseAuthenticatedHandler):
vis = data.models.Visualization(**kwargs)
vis.save()
- self.write_json(vis.to_dict())
+ self.write_json(vis.to_dict(with_query=False))
class CsvQueryResultsHandler(BaseAuthenticatedHandler):
diff --git a/rd_ui/app/scripts/controllers.js b/rd_ui/app/scripts/controllers.js
index 24540519c..725e0bd2a 100644
--- a/rd_ui/app/scripts/controllers.js
+++ b/rd_ui/app/scripts/controllers.js
@@ -33,12 +33,14 @@
$scope.updateTime = '';
}
- var QueryFiddleCtrl = function ($scope, $window, $routeParams, $http, $location, growl, notifications, Query) {
+ var QueryFiddleCtrl = function ($scope, $window, $location, $routeParams, $http, $location, growl, notifications, Query) {
+ var DEFAULT_TAB = 'table';
var pristineHash = null;
- $scope.dirty = undefined;
-
var leavingPageText = "You will lose your changes if you leave";
+ $scope.dirty = undefined;
+ $scope.newVisualization = undefined;
+
$window.onbeforeunload = function(){
if (currentUser.canEdit($scope.query) && $scope.dirty) {
return leavingPageText;
@@ -72,11 +74,9 @@
$scope.$parent.pageTitle = "Query Fiddle";
- // more tabs added when query loads
- $scope.tabs = [{'key': 'table', 'name': 'Table'},
- {'key': 'pivot', 'name': 'Pivot Table'},
- {'key': 'add', 'name': 'New Visualization'}];
-
+ $scope.$watch(function() {return $location.hash()}, function(hash) {
+ $scope.selectedTab = hash || DEFAULT_TAB;
+ });
$scope.lockButton = function (lock) {
$scope.queryExecuting = lock;
@@ -194,11 +194,6 @@
pristineHash = q.getHash();
$scope.dirty = false;
$scope.queryResult = $scope.query.getQueryResult();
-
- _.each(q.visualizations, function(vis) {
- $scope.tabs.splice(-1, 0, {'key': 'vis' + vis.id, 'name': vis.name});
- });
-
});
} else {
$scope.query = new Query({query: "", name: "New Query", ttl: -1, user: currentUser.name});
@@ -381,7 +376,7 @@
.controller('DashboardCtrl', ['$scope', '$routeParams', '$http', 'Dashboard', DashboardCtrl])
.controller('WidgetCtrl', ['$scope', '$http', '$location', 'Query', WidgetCtrl])
.controller('QueriesCtrl', ['$scope', '$http', '$location', '$filter', 'Query', QueriesCtrl])
- .controller('QueryFiddleCtrl', ['$scope', '$window', '$routeParams', '$http', '$location', 'growl', 'notifications', 'Query', QueryFiddleCtrl])
+ .controller('QueryFiddleCtrl', ['$scope', '$window', '$location', '$routeParams', '$http', '$location', 'growl', 'notifications', 'Query', QueryFiddleCtrl])
.controller('IndexCtrl', ['$scope', 'Dashboard', IndexCtrl])
.controller('MainCtrl', ['$scope', 'Dashboard', 'notifications', MainCtrl]);
})();
diff --git a/rd_ui/app/scripts/directives.js b/rd_ui/app/scripts/directives.js
index ebe99bdc7..ca0a955ff 100644
--- a/rd_ui/app/scripts/directives.js
+++ b/rd_ui/app/scripts/directives.js
@@ -3,6 +3,23 @@
var directives = angular.module('redash.directives', []);
+ directives.directive('rdTab', ['$location', function($location) {
+ return {
+ restrict: 'E',
+ scope: {
+ 'id': '@',
+ 'name': '@'
+ },
+ template: '{{name}}',
+ replace: true,
+ link: function(scope) {
+ scope.$watch(function(){return scope.$parent.selectedTab}, function(tab) {
+ scope.selectedTab = tab;
+ });
+ }
+ }
+ }]);
+
directives.directive('rdTabs', ['$location', '$rootScope', function($location, $rootScope) {
return {
restrict: 'E',
@@ -28,36 +45,56 @@
}
}]);
- directives.directive('addVisulatizationForm', ['Visualization', 'growl', function(Visualization, growl) {
+ directives.directive('editVisulatizationForm', ['Visualization', 'growl', function(Visualization, growl) {
return {
restrict: 'E',
- templateUrl: '/views/add_visualization.html',
+ templateUrl: '/views/edit_visualization.html',
replace: true,
scope: {
- query: "="
+ query: '=',
+ vis: '=?'
},
- link: function(scope) {
+ link: function(scope, element, attrs) {
scope.visTypes = Visualization.prototype.TYPES;
scope.visOptions = _.map(Visualization.prototype.TYPES, function (type) {
return {type: type, name: Visualization.prototype.NAMES[type]};
});
- scope.vis = {
- 'query_id': scope.query.id,
- 'type': scope.visTypes.CHART,
- 'name': scope.query.name,
- 'description': scope.query.description,
- 'options': {}
- };
+ if (!scope.vis) {
+ // create new visualization
+ // wait for query to load to populate with defaults
+ var unwatch = scope.$watch('query', function(q) {
+ if (q.id) {
+ unwatch();
+ scope.vis = {
+ 'query_id': q.id,
+ 'type': scope.visTypes.CHART,
+ 'name': q.name,
+ 'description': q.description,
+ 'options': {}
+ };
+ }
+ }, true);
+ }
scope.typeChanged = function() {
console.log('evme', 'typeChanged');
scope.vis.options = {};
};
- scope.createVis = function() {
+ scope.submit = function() {
Visualization.save(scope.vis, function success(result) {
+ growl.addSuccessMessage("Visualization saved");
+
scope.vis = result;
+
+ var visIds = _.pluck(scope.query.visualizations, 'id');
+ var index = visIds.indexOf(result.id);
+ if (index > -1) {
+ scope.query.visualizations[index] = result;
+ } else {
+ scope.query.visualizations.push(result);
+ }
}, function error() {
growl.addErrorMessage("Visualization could not be saved");
});
diff --git a/rd_ui/app/views/add_visualization.html b/rd_ui/app/views/edit_visualization.html
similarity index 96%
rename from rd_ui/app/views/add_visualization.html
rename to rd_ui/app/views/edit_visualization.html
index 5c0c27ab9..3c85498df 100644
--- a/rd_ui/app/views/add_visualization.html
+++ b/rd_ui/app/views/edit_visualization.html
@@ -1,4 +1,4 @@
-