From dd4b87a112ab74fb65407c754cff7da20b0d5417 Mon Sep 17 00:00:00 2001 From: Rashid Khan Date: Fri, 28 Feb 2014 13:22:23 -0700 Subject: [PATCH] Use string instead of path in directives to take advantage of requirejs cache busting --- src/kibana/apps/dashboard/directives/grid.js | 12 +-- src/kibana/apps/dashboard/directives/panel.js | 2 +- src/kibana/apps/dashboard/index.js | 81 ++++--------------- src/kibana/controllers/kibana.js | 2 +- src/kibana/directives/config.js | 24 +++++- src/kibana/partials/nav_config.html | 2 +- 6 files changed, 45 insertions(+), 78 deletions(-) diff --git a/src/kibana/apps/dashboard/directives/grid.js b/src/kibana/apps/dashboard/directives/grid.js index 060582fd04bb..5814e8825d8a 100644 --- a/src/kibana/apps/dashboard/directives/grid.js +++ b/src/kibana/apps/dashboard/directives/grid.js @@ -31,8 +31,8 @@ define(function (require) { var init = function () { initGrid(); elem.on('click', 'li i.remove', function (event) { - var target = event.target.parentNode; - gridster.remove_widget(event.target.parentNode); + var target = event.target.parentNode.parentNode; + gridster.remove_widget(target); }); $scope.control.unserializeGrid($scope.grid); @@ -75,7 +75,6 @@ define(function (require) { }; $scope.control.serializeGrid = function () { - console.log(gridster.serialize()); return gridster.serialize(); }; @@ -90,10 +89,13 @@ define(function (require) { }); var wgd = gridster.add_widget('
  • ', panel.size_x, panel.size_y, panel.col, panel.row); - wgd.append(''); + + var template = ''; + + var element = $compile(template)($scope); + wgd.append(element); wgd.data('params', panel.params); - $compile(wgd)($scope); }; // Start the directive diff --git a/src/kibana/apps/dashboard/directives/panel.js b/src/kibana/apps/dashboard/directives/panel.js index fc4e9e5bfd5b..6709a2a572a4 100644 --- a/src/kibana/apps/dashboard/directives/panel.js +++ b/src/kibana/apps/dashboard/directives/panel.js @@ -11,7 +11,7 @@ define(function (require) { }, compile: function (elem, attrs) { var params = JSON.parse(attrs.params); - elem.replaceWith(params.type + ''); + elem.html(params.type + ''); } }; }); diff --git a/src/kibana/apps/dashboard/index.js b/src/kibana/apps/dashboard/index.js index 7e77a58aef66..c63e3de63936 100644 --- a/src/kibana/apps/dashboard/index.js +++ b/src/kibana/apps/dashboard/index.js @@ -23,11 +23,18 @@ define(function (require) { // the controller and view $scope.gridControl = {}; - $scope.openSave = function () { - var template = 'kibana/apps/dashboard/partials/save_dashboard.html'; - + var setConfigTemplate = function (template) { // Close if already open - $scope.configTemplate = $scope.configTemplate === template ? undefined : template; + if ($scope.configTemplate === template) { + delete $scope.configTemplate; + return; + } else { + $scope.configTemplate = template; + } + }; + + $scope.openSave = function () { + setConfigTemplate(require('text!./partials/save_dashboard.html')); $scope.configSubmit = function () { $scope.save($scope.dashboard.title); @@ -35,10 +42,7 @@ define(function (require) { }; $scope.openLoad = function () { - var template = 'kibana/apps/dashboard/partials/load_dashboard.html'; - - // Close if already open - $scope.configTemplate = $scope.configTemplate === template ? undefined : template; + setConfigTemplate(require('text!./partials/load_dashboard.html')); var search = courier.createSource('search') .index(configFile.kibanaIndex) @@ -75,65 +79,8 @@ define(function (require) { }; $scope.dashboard = { - title: 'Logstash Dashboard', - panels: [ - { - col: 1, - row: 1, - size_x: 5, - size_y: 2, - params: { type: 'line' } - }, - { - col: 6, - row: 1, - size_x: 4, - size_y: 2, - params: { type: 'bar' } - }, - { - col: 10, - row: 1, - size_x: 3, - size_y: 1, - params: { type: 'table' } - }, - { - col: 10, - row: 2, - size_x: 3, - size_y: 1, - params: { type: 'pie' } - }, - { - col: 1, - row: 3, - size_x: 3, - size_y: 1, - params: { type: 'scatter' } - }, - { - col: 4, - row: 3, - size_x: 3, - size_y: 1, - params: { type: 'map' } - }, - { - col: 7, - row: 3, - size_x: 3, - size_y: 1, - params: { type: 'sparkline' } - }, - { - col: 10, - row: 3, - size_x: 3, - size_y: 1, - params: { type: 'heatmap' } - } - ] + title: 'New Dashboard', + panels: [] }; $scope.configurable = { diff --git a/src/kibana/controllers/kibana.js b/src/kibana/controllers/kibana.js index 3f2f42c000f6..1efaec9e1f75 100644 --- a/src/kibana/controllers/kibana.js +++ b/src/kibana/controllers/kibana.js @@ -34,7 +34,7 @@ define(function (require) { }; $scope.configure = function () { - $scope.configureTemplateUrl = 'kibana/partials/global_config.html'; + $scope.configureTemplateUrl = require('text!../partials/global_config.html'); }; /** diff --git a/src/kibana/directives/config.js b/src/kibana/directives/config.js index cb243f3876b8..bae4f40b1db7 100644 --- a/src/kibana/directives/config.js +++ b/src/kibana/directives/config.js @@ -14,7 +14,7 @@ define(function (require) { * ``` */ - module.directive('config', function () { + module.directive('config', function ($compile) { return { restrict: 'E', scope: { @@ -25,12 +25,30 @@ define(function (require) { }, link: function ($scope, element, attr) { $scope[attr.configObject] = $scope.configObject; + + $scope.$watch('configTemplate', function (newTemplate, oldTemplate) { + if (_.isString($scope.configTemplate) && oldTemplate !== newTemplate) { + + var template = '' + + '
    ' + + '
    ' + + $scope.configTemplate + + '
    ' + + '
    ' + + ' ' + + '
    ' + + '
    ' + + ''; + + element.html($compile(template)($scope)); + } + }); + $scope.close = function () { if (_.isFunction($scope.configClose)) $scope.configClose(); $scope.configTemplate = undefined; }; - }, - templateUrl: 'kibana/partials/nav_config.html' + } }; }); }); \ No newline at end of file diff --git a/src/kibana/partials/nav_config.html b/src/kibana/partials/nav_config.html index a8985e178922..f57b0dcb7ef1 100644 --- a/src/kibana/partials/nav_config.html +++ b/src/kibana/partials/nav_config.html @@ -1,6 +1,6 @@
    -
    +