From 4ffd21be099c0d919fef806c920fa9ca0a7e4835 Mon Sep 17 00:00:00 2001 From: Arik Fraimovich Date: Tue, 29 Apr 2014 10:35:47 +0300 Subject: [PATCH 1/5] Migration to add text column to widgets and make visualization_id nullable. --- migrations/add_text_to_widgets.py | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 migrations/add_text_to_widgets.py diff --git a/migrations/add_text_to_widgets.py b/migrations/add_text_to_widgets.py new file mode 100644 index 0000000000..50a40fd914 --- /dev/null +++ b/migrations/add_text_to_widgets.py @@ -0,0 +1,13 @@ +from playhouse.migrate import Migrator +from redash import db +from redash import models + + +if __name__ == '__main__': + db.connect_db() + migrator = Migrator(db.database) + with db.database.transaction(): + migrator.add_column(models.Widget, models.Widget.text, 'text') + migrator.set_nullable(models.Widget, models.Widget.visualization, True) + + db.close_db(None) \ No newline at end of file From 850ac9f4c881ae08a37e97ea5e7eff80e27e97bc Mon Sep 17 00:00:00 2001 From: Arik Fraimovich Date: Tue, 29 Apr 2014 10:36:00 +0300 Subject: [PATCH 2/5] Add underscore.string lib. --- rd_ui/app/index.html | 2 +- rd_ui/bower.json | 3 ++- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/rd_ui/app/index.html b/rd_ui/app/index.html index 67cac81ddb..e1c4f48044 100644 --- a/rd_ui/app/index.html +++ b/rd_ui/app/index.html @@ -109,7 +109,7 @@ - + diff --git a/rd_ui/bower.json b/rd_ui/bower.json index 5f9c86d88b..e95631a331 100644 --- a/rd_ui/bower.json +++ b/rd_ui/bower.json @@ -20,7 +20,8 @@ "cornelius": "https://github.com/restorando/cornelius.git", "gridster": "0.2.0", "mousetrap": "~1.4.6", - "angular-ui-select2": "~0.0.5" + "angular-ui-select2": "~0.0.5", + "underscore.string": "~2.3.3" }, "devDependencies": { "angular-mocks": "~1.0.7", From 289d38b2a6f4e3b1cea028c034f3c43492110823 Mon Sep 17 00:00:00 2001 From: Arik Fraimovich Date: Tue, 29 Apr 2014 10:36:56 +0300 Subject: [PATCH 3/5] Add textbox widget support. --- rd_ui/app/scripts/controllers/dashboard.js | 41 +++++++------- .../directives/dashboard_directives.js | 36 +++++++++---- rd_ui/app/scripts/services/resources.js | 7 +++ rd_ui/app/views/dashboard.html | 11 +++- rd_ui/app/views/new_widget_form.html | 54 ++++++++++++------- redash/models.py | 23 ++++---- tests/test_controllers.py | 17 ++++++ 7 files changed, 130 insertions(+), 59 deletions(-) diff --git a/rd_ui/app/scripts/controllers/dashboard.js b/rd_ui/app/scripts/controllers/dashboard.js index de388bdc02..878b5f3b49 100644 --- a/rd_ui/app/scripts/controllers/dashboard.js +++ b/rd_ui/app/scripts/controllers/dashboard.js @@ -1,13 +1,16 @@ (function() { - var DashboardCtrl = function($scope, Events, $routeParams, $http, $timeout, Dashboard) { + var DashboardCtrl = function($scope, Events, Widget, $routeParams, $http, $timeout, Dashboard) { Events.record(currentUser, "view", "dashboard", dashboard.id); $scope.refreshEnabled = false; $scope.refreshRate = 60; - $scope.dashboard = Dashboard.get({ - slug: $routeParams.dashboardSlug - }, function(dashboard) { + $scope.dashboard = Dashboard.get({ slug: $routeParams.dashboardSlug }, function (dashboard) { $scope.$parent.pageTitle = dashboard.name; + $scope.dashboard.widgets = _.map($scope.dashboard.widgets, function (row) { + return _.map(row, function (widget) { + return new Widget(widget); + }); + }); }); var autoRefresh = function() { @@ -51,39 +54,41 @@ }; }; - var WidgetCtrl = function($scope, Events, $http, $location, Query) { + var WidgetCtrl = function($scope, Events, Widget, $http, $location, Query) { $scope.deleteWidget = function() { - if (!confirm('Are you sure you want to remove "' + $scope.widget.visualization.name + '" from the dashboard?')) { + if (!confirm('Are you sure you want to remove "' + $scope.widget.getName() + '" from the dashboard?')) { return; } Events.record(currentUser, "delete", "widget", $scope.widget.id); - $http.delete('/api/widgets/' + $scope.widget.id).success(function() { + $scope.widget.$delete(function() { $scope.dashboard.widgets = _.map($scope.dashboard.widgets, function(row) { return _.filter(row, function(widget) { - return widget.id != $scope.widget.id; + return widget.id != undefined; }) }); }); }; - // TODO: fire event for query view for each query Events.record(currentUser, "view", "widget", $scope.widget.id); - Events.record(currentUser, "view", "query", $scope.widget.visualization.query.id); - Events.record(currentUser, "view", "visualization", $scope.widget.visualization.id); - $scope.query = new Query($scope.widget.visualization.query); - $scope.queryResult = $scope.query.getQueryResult(); + if ($scope.widget.visualization) { + Events.record(currentUser, "view", "query", $scope.widget.visualization.query.id); + Events.record(currentUser, "view", "visualization", $scope.widget.visualization.id); - $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.query = new Query($scope.widget.visualization.query); + $scope.queryResult = $scope.query.getQueryResult(); + $scope.nextUpdateTime = moment(new Date(($scope.query.updated_at + $scope.query.ttl + $scope.query.runtime + 300) * 1000)).fromNow(); - $scope.updateTime = ''; + $scope.type = 'visualization'; + } else { + $scope.type = 'textbox'; + } }; angular.module('redash.controllers') - .controller('DashboardCtrl', ['$scope', 'Events', '$routeParams', '$http', '$timeout', 'Dashboard', DashboardCtrl]) - .controller('WidgetCtrl', ['$scope', 'Events', '$http', '$location', 'Query', WidgetCtrl]) + .controller('DashboardCtrl', ['$scope', 'Events', 'Widget', '$routeParams', '$http', '$timeout', 'Dashboard', DashboardCtrl]) + .controller('WidgetCtrl', ['$scope', 'Events', 'Widget', '$http', '$location', 'Query', WidgetCtrl]) })(); \ No newline at end of file diff --git a/rd_ui/app/scripts/directives/dashboard_directives.js b/rd_ui/app/scripts/directives/dashboard_directives.js index c1bc2dde3e..3689070745 100644 --- a/rd_ui/app/scripts/directives/dashboard_directives.js +++ b/rd_ui/app/scripts/directives/dashboard_directives.js @@ -46,7 +46,7 @@ row: rowIndex + 1, ySize: 1, xSize: widget.width, - name: widget.visualization.query.name + name: widget.getName()//visualization.query.name }); }); }); @@ -125,25 +125,37 @@ value: 2 }]; + $scope.type = 'visualization'; + + $scope.isVisualization = function () { + return $scope.type == 'visualization'; + }; + + $scope.isTextBox = function () { + return $scope.type == 'textbox'; + }; + + $scope.setType = function (type) { + $scope.type = type; + }; + var reset = function() { $scope.saveInProgress = false; $scope.widgetSize = 1; $scope.queryId = null; $scope.selectedVis = null; $scope.query = null; - - } + $scope.text = ""; + }; reset(); - $scope.loadVisualizations = function() { + $scope.loadVisualizations = function () { if (!$scope.queryId) { return; } - Query.get({ - id: $scope.queryId - }, function(query) { + Query.get({ id: $scope.queryId }, function(query) { if (query) { $scope.query = query; if (query.visualizations.length) { @@ -157,19 +169,21 @@ $scope.saveInProgress = true; var widget = new Widget({ - 'visualization_id': $scope.selectedVis.id, + 'visualization_id': $scope.selectedVis && $scope.selectedVis.id, 'dashboard_id': $scope.dashboard.id, 'options': {}, - 'width': $scope.widgetSize + 'width': $scope.widgetSize, + 'text': $scope.text }); widget.$save().then(function(response) { // update dashboard layout $scope.dashboard.layout = response['layout']; + var newWidget = new Widget(response['widget']); if (response['new_row']) { - $scope.dashboard.widgets.push([response['widget']]); + $scope.dashboard.widgets.push([newWidget]); } else { - $scope.dashboard.widgets[$scope.dashboard.widgets.length - 1].push(response['widget']); + $scope.dashboard.widgets[$scope.dashboard.widgets.length - 1].push(newWidget); } // close the dialog diff --git a/rd_ui/app/scripts/services/resources.js b/rd_ui/app/scripts/services/resources.js index 621de4f583..429f9c61af 100644 --- a/rd_ui/app/scripts/services/resources.js +++ b/rd_ui/app/scripts/services/resources.js @@ -363,6 +363,13 @@ var Widget = function ($resource) { var WidgetResource = $resource('/api/widgets/:id', {id: '@id'}); + WidgetResource.prototype.getName = function () { + if (this.visualization) { + return this.visualization.query.name + ' (' + this.visualization.name + ')'; + } + return _.str.truncate(this.text, 20); + }; + return WidgetResource; } diff --git a/rd_ui/app/views/dashboard.html b/rd_ui/app/views/dashboard.html index d881680ac6..624187cbe3 100644 --- a/rd_ui/app/views/dashboard.html +++ b/rd_ui/app/views/dashboard.html @@ -21,7 +21,7 @@

-
+

@@ -43,7 +43,16 @@

+

+
+ +
+
+ {{widget.text}} + + +
diff --git a/rd_ui/app/views/new_widget_form.html b/rd_ui/app/views/new_widget_form.html index 10b41b43c6..395babf3dd 100644 --- a/rd_ui/app/views/new_widget_form.html +++ b/rd_ui/app/views/new_widget_form.html @@ -6,32 +6,46 @@

Add Widget

-

-

-
- -
- -
+

+ +

-
-
- - -
+
+ + Markdown supported. +
-
- - -
+
+

+

+
+ +
+ +
+

+ +
+
+ + +
+
+
+ +
+ +
-
+ +
- +
diff --git a/redash/models.py b/redash/models.py index 44c3138199..a79c48f460 100644 --- a/redash/models.py +++ b/redash/models.py @@ -255,11 +255,11 @@ def to_dict(self, with_widgets=False): if with_widgets: widgets = Widget.select(Widget, Visualization, Query, QueryResult, User)\ .where(Widget.dashboard == self.id)\ - .join(Visualization)\ - .join(Query)\ - .join(User)\ + .join(Visualization, join_type=peewee.JOIN_LEFT_OUTER)\ + .join(Query, join_type=peewee.JOIN_LEFT_OUTER)\ + .join(User, join_type=peewee.JOIN_LEFT_OUTER)\ .switch(Query)\ - .join(QueryResult) + .join(QueryResult, join_type=peewee.JOIN_LEFT_OUTER) widgets = {w.id: w.to_dict() for w in widgets} widgets_layout = map(lambda row: map(lambda widget_id: widgets.get(widget_id, None), row), layout) else: @@ -324,8 +324,8 @@ def __unicode__(self): class Widget(BaseModel): id = peewee.PrimaryKeyField() - visualization = peewee.ForeignKeyField(Visualization, related_name='widgets') - + visualization = peewee.ForeignKeyField(Visualization, related_name='widgets', null=True) + text = peewee.TextField(null=True) width = peewee.IntegerField() options = peewee.TextField() dashboard = peewee.ForeignKeyField(Dashboard, related_name='widgets', index=True) @@ -339,14 +339,19 @@ class Meta: db_table = 'widgets' def to_dict(self): - return { + d = { 'id': self.id, 'width': self.width, 'options': json.loads(self.options), - 'visualization': self.visualization.to_dict(), - 'dashboard_id': self._data['dashboard'] + 'dashboard_id': self._data['dashboard'], + 'text': self.text } + if self.visualization and self.visualization.id: + d['visualization'] = self.visualization.to_dict() + + return d + def __unicode__(self): return u"%s" % self.id diff --git a/tests/test_controllers.py b/tests/test_controllers.py index 31412991e8..7bdd09d6f0 100644 --- a/tests/test_controllers.py +++ b/tests/test_controllers.py @@ -182,6 +182,23 @@ def test_create_widget(self): [rv4.json['widget']['id']]]) self.assertEquals(rv4.json['new_row'], True) + def test_create_text_widget(self): + dashboard = dashboard_factory.create() + + data = { + 'visualization_id': None, + 'text': 'Sample text.', + 'dashboard_id': dashboard.id, + 'options': {}, + 'width': 2 + } + + with app.test_client() as c, authenticated_user(c): + rv = json_request(c.post, '/api/widgets', data=data) + + self.assertEquals(rv.status_code, 200) + self.assertEquals(rv.json['widget']['text'], 'Sample text.') + def test_delete_widget(self): widget = widget_factory.create() From 676cf32c22c33d5a5da1b87c6f8f277bcd07c4a2 Mon Sep 17 00:00:00 2001 From: Arik Fraimovich Date: Tue, 29 Apr 2014 11:15:19 +0300 Subject: [PATCH 4/5] Markdown support for textbox. --- rd_ui/app/index.html | 2 +- rd_ui/app/scripts/filters.js | 114 ++++++++++++++------------- rd_ui/app/views/dashboard.html | 2 +- rd_ui/app/views/new_widget_form.html | 11 ++- rd_ui/bower.json | 3 +- 5 files changed, 72 insertions(+), 60 deletions(-) diff --git a/rd_ui/app/index.html b/rd_ui/app/index.html index e1c4f48044..8f5cdcbeba 100644 --- a/rd_ui/app/index.html +++ b/rd_ui/app/index.html @@ -110,10 +110,10 @@ + - diff --git a/rd_ui/app/scripts/filters.js b/rd_ui/app/scripts/filters.js index 0ecb0e4e6f..4e3665e038 100644 --- a/rd_ui/app/scripts/filters.js +++ b/rd_ui/app/scripts/filters.js @@ -1,61 +1,67 @@ var durationHumanize = function (duration) { - var humanized = ""; - if (duration == undefined) { - humanized = "-"; - } else if (duration < 60) { - humanized = Math.round(duration) + "s"; - } else if (duration > 3600*24) { - var days = Math.round(parseFloat(duration) / 60.0 / 60.0 / 24.0); - humanized = days + "days"; - } else if (duration >= 3600) { - var hours = Math.round(parseFloat(duration) / 60.0 / 60.0); - humanized = hours + "h"; - } else { - var minutes = Math.round(parseFloat(duration) / 60.0); - humanized = minutes + "m"; - } - return humanized; + var humanized = ""; + if (duration == undefined) { + humanized = "-"; + } else if (duration < 60) { + humanized = Math.round(duration) + "s"; + } else if (duration > 3600 * 24) { + var days = Math.round(parseFloat(duration) / 60.0 / 60.0 / 24.0); + humanized = days + "days"; + } else if (duration >= 3600) { + var hours = Math.round(parseFloat(duration) / 60.0 / 60.0); + humanized = hours + "h"; + } else { + var minutes = Math.round(parseFloat(duration) / 60.0); + humanized = minutes + "m"; + } + return humanized; } angular.module('redash.filters', []). - filter('durationHumanize', function () { - return durationHumanize; - }) + filter('durationHumanize', function () { + return durationHumanize; + }) - .filter('refreshRateHumanize', function () { - return function (ttl) { - if (ttl==-1) { - return "Never"; - } else { - return "Every " + durationHumanize(ttl); - } - } - }) + .filter('refreshRateHumanize', function () { + return function (ttl) { + if (ttl == -1) { + return "Never"; + } else { + return "Every " + durationHumanize(ttl); + } + } + }) - .filter('toHuman', function() { - return function(text) { - return text.replace(/_/g, ' ').replace(/(?:^|\s)\S/g, function (a) { - return a.toUpperCase(); - }); - } - }) + .filter('toHuman', function () { + return function (text) { + return text.replace(/_/g, ' ').replace(/(?:^|\s)\S/g, function (a) { + return a.toUpperCase(); + }); + } + }) + + .filter('colWidth', function () { + return function (widgetWidth) { + if (widgetWidth == 1) { + return 6; + } + return 12; + } + }) - .filter('colWidth', function () { - return function (widgetWidth) { - if (widgetWidth == 1) { - return 6; - } - return 12; - } - }) - - .filter('capitalize', function () { - return function (text) { - if (text) { - return text[0].toUpperCase() + text.slice(1).toLowerCase(); - } else { - return null; - } - - } - }); \ No newline at end of file + .filter('capitalize', function () { + return function (text) { + if (text) { + return _.str.capitalize(text); + } else { + return null; + } + + } + }) + + .filter('markdown', ['$sce', function($sce) { + return function(text) { + return $sce.trustAsHtml(marked(text)); + } + }]); \ No newline at end of file diff --git a/rd_ui/app/views/dashboard.html b/rd_ui/app/views/dashboard.html index 624187cbe3..b50b6559f3 100644 --- a/rd_ui/app/views/dashboard.html +++ b/rd_ui/app/views/dashboard.html @@ -48,7 +48,7 @@

- {{widget.text}} +

diff --git a/rd_ui/app/views/new_widget_form.html b/rd_ui/app/views/new_widget_form.html index 395babf3dd..9ebb9f8fca 100644 --- a/rd_ui/app/views/new_widget_form.html +++ b/rd_ui/app/views/new_widget_form.html @@ -11,9 +11,14 @@

Add Widget

-
- - Markdown supported. +
+
+ +
+
+ Preview: +

+
diff --git a/rd_ui/bower.json b/rd_ui/bower.json index e95631a331..8302555402 100644 --- a/rd_ui/bower.json +++ b/rd_ui/bower.json @@ -21,7 +21,8 @@ "gridster": "0.2.0", "mousetrap": "~1.4.6", "angular-ui-select2": "~0.0.5", - "underscore.string": "~2.3.3" + "underscore.string": "~2.3.3", + "marked": "~0.3.2" }, "devDependencies": { "angular-mocks": "~1.0.7", From 14112fd45ba00d7b7df620982f8db86f020a6c6d Mon Sep 17 00:00:00 2001 From: Arik Fraimovich Date: Tue, 29 Apr 2014 11:23:32 +0300 Subject: [PATCH 5/5] Remove unused dependencies --- rd_ui/app/scripts/controllers/dashboard.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/rd_ui/app/scripts/controllers/dashboard.js b/rd_ui/app/scripts/controllers/dashboard.js index 878b5f3b49..b1daba4dda 100644 --- a/rd_ui/app/scripts/controllers/dashboard.js +++ b/rd_ui/app/scripts/controllers/dashboard.js @@ -54,7 +54,7 @@ }; }; - var WidgetCtrl = function($scope, Events, Widget, $http, $location, Query) { + var WidgetCtrl = function($scope, Events, Query) { $scope.deleteWidget = function() { if (!confirm('Are you sure you want to remove "' + $scope.widget.getName() + '" from the dashboard?')) { return; @@ -89,6 +89,6 @@ angular.module('redash.controllers') .controller('DashboardCtrl', ['$scope', 'Events', 'Widget', '$routeParams', '$http', '$timeout', 'Dashboard', DashboardCtrl]) - .controller('WidgetCtrl', ['$scope', 'Events', 'Widget', '$http', '$location', 'Query', WidgetCtrl]) + .controller('WidgetCtrl', ['$scope', 'Events', 'Query', WidgetCtrl]) })(); \ No newline at end of file