Import: Fixes to import from json file and import from graphite. Issues was…

Import: Fixes to import from json file and import from graphite. Issues was lingering state from previous dashboard. Closes #840, Closes #853

Import: Fixes to import from json file and import from graphite. Issues was…
Import: Fixes to import from json file and import from graphite. Issues was lingering state from previous dashboard. Closes #840, Closes #853
f4e24038 · Torkel Ödegaard · 81747e16 · f4e24038 · f4e24038 · f4e24038
Commit f4e24038 authored Sep 24, 2014 by Torkel Ödegaard
11 changed files
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,8 @@
 **Fixes**
 - [Issue #847](https://github.com/grafana/grafana/issues/847). Graph: Fix for series draw order not being the same after hiding/unhiding series
 - [Issue #851](https://github.com/grafana/grafana/issues/851). Annotations: Fix for annotations not reloaded when switching between 2 dashboards with annotations
+- [Issue #846](https://github.com/grafana/grafana/issues/846). Edit panes: Issue when open row or json editor when scrolled down the page, unable to scroll and you did not see editor
+- [Issue #840](https://github.com/grafana/grafana/issues/840). Import: Fixes to import from json file and import from graphite. Issues was lingering state from previous dashboard.
 # 1.8.0 (2014-09-22)

--- a/src/app/controllers/dashboardCtrl.js
+++ b/src/app/controllers/dashboardCtrl.js
@@ -19,19 +19,18 @@ function (angular, $, config, _) {
      dashboardSrv,
      dashboardViewStateSrv,
      panelMoveSrv,
-      timer,
      $timeout) {
    $scope.editor = { index: 0 };
    $scope.panelNames = config.panels;
    var resizeEventTimeout;
-    $scope.init = function() {
+    this.init = function(dashboardData) {
      $scope.availablePanels = config.panels;
-      $scope.onAppEvent('setup-dashboard', $scope.setupDashboard);
-      $scope.onAppEvent('show-json-editor', $scope.showJsonEditor);
      $scope.reset_row();
      $scope.registerWindowResizeEvent();
+      $scope.onAppEvent('show-json-editor', $scope.showJsonEditor);
+      $scope.setupDashboard(dashboardData);
    };
    $scope.registerWindowResizeEvent = function() {
@@ -41,7 +40,7 @@ function (angular, $, config, _) {
      });
    };
-    $scope.setupDashboard = function(event, dashboardData) {
+    $scope.setupDashboard = function(dashboardData) {
      $rootScope.performance.dashboardLoadStart = new Date().getTime();
      $rootScope.performance.panelsInitialized = 0;
      $rootScope.performance.panelsRendered = 0;
@@ -129,6 +128,5 @@ function (angular, $, config, _) {
      return $scope.editorTabs;
    };
-    $scope.init();
  });
 });
--- a/src/app/controllers/grafanaCtrl.js
+++ b/src/app/controllers/grafanaCtrl.js
@@ -10,7 +10,7 @@ function (angular, config, _, $, store) {
  var module = angular.module('grafana.controllers');
-  module.controller('GrafanaCtrl', function($scope, alertSrv, grafanaVersion, $rootScope) {
+  module.controller('GrafanaCtrl', function($scope, alertSrv, grafanaVersion, $rootScope, $controller) {
    $scope.grafanaVersion = grafanaVersion[0] === '@' ? 'master' : grafanaVersion;
    $scope.consoleEnabled = store.getBool('grafanaConsole');
@@ -32,6 +32,10 @@ function (angular, config, _, $, store) {
      store.set('grafanaConsole', $scope.consoleEnabled);
    };
+    $scope.initDashboard = function(dashboardData, viewScope) {
+      $controller('DashboardCtrl', { $scope: viewScope }).init(dashboardData);
+    };
    $rootScope.onAppEvent = function(name, callback) {
      var unbind = $rootScope.$on(name, callback);
      this.$on('$destroy', unbind);

--- a/src/app/controllers/graphiteImport.js
+++ b/src/app/controllers/graphiteImport.js
 define([
  'angular',
  'app',
-  'lodash'
+  'lodash',
+  'kbn'
 ],
-function (angular, app, _) {
+function (angular, app, _, kbn) {
  'use strict';
  var module = angular.module('grafana.controllers');
-  module.controller('GraphiteImportCtrl', function($scope, $rootScope, $timeout, datasourceSrv) {
+  module.controller('GraphiteImportCtrl', function($scope, $rootScope, $timeout, datasourceSrv, $location) {
    $scope.init = function() {
      $scope.datasources = datasourceSrv.getMetricSources();
@@ -79,7 +80,7 @@ function (angular, app, _) {
        }
        panel = {
-          type: 'graphite',
+          type: 'graph',
          span: 12 / graphsPerRow,
          title: graph[1].title,
          targets: [],
@@ -95,7 +96,9 @@ function (angular, app, _) {
        currentRow.panels.push(panel);
      });
-      $scope.emitAppEvent('setup-dashboard', newDashboard);
+      window.grafanaImportDashboard = newDashboard;
+      $location.path('/dashboard/import/' + kbn.slugifyForUrl(newDashboard.title));
      $scope.dismiss();
    }

--- a/src/app/controllers/row.js
+++ b/src/app/controllers/row.js
@@ -13,6 +13,7 @@ function (angular, app, _) {
      title: "Row",
      height: "150px",
      collapse: false,
+      editable: true,
      panels: [],
    };

--- a/src/app/directives/dashUpload.js
+++ b/src/app/directives/dashUpload.js
 define([
-  'angular'
+  'angular',
+  'kbn'
 ],
-function (angular) {
+function (angular, kbn) {
  'use strict';
  var module = angular.module('grafana.directives');
-  module.directive('dashUpload', function(timer, alertSrv) {
+  module.directive('dashUpload', function(timer, alertSrv, $location) {
    return {
      restrict: 'A',
      link: function(scope) {
@@ -14,9 +15,10 @@ function (angular) {
          var files = evt.target.files; // FileList object
          var readerOnload = function() {
            return function(e) {
-              var dashboard = JSON.parse(e.target.result);
              scope.$apply(function() {
-                scope.emitAppEvent('setup-dashboard', dashboard);
+                window.grafanaImportDashboard = JSON.parse(e.target.result);
+                var title = kbn.slugifyForUrl(window.grafanaImportDashboard.title);
+                $location.path('/dashboard/import/' + title);
              });
            };
          };

--- a/src/app/partials/dashboard.html
+++ b/src/app/partials/dashboard.html
-<div ng-controller="DashboardCtrl" body-class class="dashboard" ng-class="{'dashboard-fullscreen': dashboardViewState.fullscreen}">
+<div body-class class="dashboard" ng-class="{'dashboard-fullscreen': dashboardViewState.fullscreen}">
 	<div ng-include="'app/partials/dashboard_topnav.html'">
 	</div>

--- a/src/app/partials/import.html
+++ b/src/app/partials/import.html
@@ -16,11 +16,15 @@
    </div>
  </div>
-  <div class="editor-row" style="margin-top: 10px;">
+  <div class="editor-row" style="margin-top: 10px;max-height: 400px; overflow-y: scroll;max-width: 500px;">
-    <table class="table table-condensed table-striped">
+    <table class="grafana-options-table">
      <tr ng-repeat="dash in dashboards">
-        <td style="padding-right: 20px;"><button class="btn btn-success" ng-click="import(dash.name)">Import</button>
+        <td style="">{{dash.name}}</td>
-        <td style="width: 100%; vertical-align: middle;">{{dash.name}}</td>
+				<td style="padding-left: 20px;">
+					<a class="pointer" ng-click="import(dash.name)">
+						import
+					</a>
+				</td>
      </tr>
    </table>
  </div>

--- a/src/app/routes/dashboard-from-db.js
+++ b/src/app/routes/dashboard-from-db.js
@@ -22,7 +22,13 @@ function (angular) {
        templateUrl: 'app/partials/dashboard.html',
        controller : 'DashFromDBProvider',
        reloadOnSearch: false,
+      })
+      .when('/dashboard/import/:id', {
+        templateUrl: 'app/partials/dashboard.html',
+        controller : 'DashFromImportCtrl',
+        reloadOnSearch: false,
      });
  });
  module.controller('DashFromDBProvider', function($scope, $rootScope, datasourceSrv, $routeParams, alertSrv) {
@@ -31,12 +37,23 @@ function (angular) {
    var isTemp = window.location.href.indexOf('dashboard/temp') !== -1;
    db.getDashboard($routeParams.id, isTemp)
-      .then(function(dashboard) {
+    .then(function(dashboard) {
-        $scope.emitAppEvent('setup-dashboard', dashboard);
+      $scope.initDashboard(dashboard, $scope);
-      }).then(null, function(error) {
+    }).then(null, function(error) {
-        $scope.emitAppEvent('setup-dashboard', { title: 'Grafana'});
+      $scope.initDashboard({ title: 'Grafana'}, $scope);
-        alertSrv.set('Error', error, 'error');
+      alertSrv.set('Error', error, 'error');
-      });
+    });
+  });
+  module.controller('DashFromImportCtrl', function($scope, $location, alertSrv) {
+    if (!window.grafanaImportDashboard) {
+      alertSrv.set('Not found', 'Cannot reload page with unsaved imported dashboard', 'warning', 7000);
+      $location.path('');
+      return;
+    }
+    $scope.initDashboard(window.grafanaImportDashboard, $scope);
  });
 });
--- a/src/app/routes/dashboard-from-file.js
+++ b/src/app/routes/dashboard-from-file.js
@@ -52,7 +52,7 @@ function (angular, $, config, _) {
    };
    file_load($routeParams.jsonFile).then(function(result) {
-      $scope.emitAppEvent('setup-dashboard', result);
+      $scope.initDashboard(result, $scope);
    });
  });

--- a/src/app/routes/dashboard-from-script.js
+++ b/src/app/routes/dashboard-from-script.js
@@ -53,7 +53,7 @@ function (angular, $, config, _, kbn, moment) {
    };
    script_load($routeParams.jsFile).then(function(result) {
-      $scope.emitAppEvent('setup-dashboard', result.data);
+      $scope.initDashboard(result.data, $scope);
    });
  });