From 9fc6c4888fc5644ea16998938d7af015adc08a51 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Tue, 26 Aug 2014 09:32:30 +0200 Subject: [PATCH] converting more modals to edit panels --- src/app/controllers/annotationsEditorCtrl.js | 37 +++--- src/app/directives/bootstrap-tagsinput.js | 4 +- src/app/directives/dashEditLink.js | 5 +- src/app/partials/annotations_editor.html | 123 ++++++++++--------- src/app/partials/dasheditor.html | 33 ++--- src/app/partials/paneleditor.html | 45 ++++--- src/app/partials/roweditor.html | 24 ++-- src/app/partials/submenu.html | 4 +- src/css/less/bootswatch.dark.less | 6 +- src/css/less/grafana.less | 6 +- 10 files changed, 152 insertions(+), 135 deletions(-) diff --git a/src/app/controllers/annotationsEditorCtrl.js b/src/app/controllers/annotationsEditorCtrl.js index 99acea2c18c..6baf6279b02 100644 --- a/src/app/controllers/annotationsEditorCtrl.js +++ b/src/app/controllers/annotationsEditorCtrl.js @@ -1,14 +1,15 @@ define([ 'angular', 'app', - 'lodash' + 'lodash', + 'jquery' ], -function (angular, app, _) { +function (angular, app, _, $) { 'use strict'; var module = angular.module('grafana.controllers'); - module.controller('AnnotationsEditorCtrl', function($scope, datasourceSrv) { + module.controller('AnnotationsEditorCtrl', function($scope, datasourceSrv, $timeout) { var annotationDefaults = { name: '', datasource: null, @@ -22,12 +23,20 @@ function (angular, app, _) { $scope.init = function() { $scope.currentAnnotation = angular.copy(annotationDefaults); $scope.currentIsNew = true; + $scope.editor = { index: 0 }; $scope.datasources = datasourceSrv.getAnnotationSources(); $scope.annotations = $scope.dashboard.annotations.list; if ($scope.datasources.length > 0) { $scope.currentDatasource = $scope.datasources[0]; } + + $scope.$watch('editor.index', function(newVal) { + console.log("value", newVal); + if (newVal !== 2) { + $scope.reset(); + } + }); }; $scope.setDatasource = function() { @@ -42,9 +51,12 @@ function (angular, app, _) { if (!$scope.currentDatasource) { $scope.currentDatasource = $scope.datasources[0]; } + + $scope.editor.index = 2; + $(".tooltip.in").remove(); }; - $scope.update = function() { + $scope.reset = function() { $scope.currentAnnotation = angular.copy(annotationDefaults); $scope.currentIsNew = true; }; @@ -62,21 +74,4 @@ function (angular, app, _) { }); - module.controller('EditViewCtrl', function($scope) { - $scope.editPanelSrc = null; - - $scope.onAppEvent('show-edit-panel', function(evt, payload) { - if (payload.src === $scope.editPanelSrc) { - $scope.dismiss(); - return; - } - $scope.editPanelSrc = payload.src; - }); - - $scope.dismiss = function() { - $scope.editPanelSrc = null; - }; - - }); - }); diff --git a/src/app/directives/bootstrap-tagsinput.js b/src/app/directives/bootstrap-tagsinput.js index 613cc872d78..a8b7eb6a7ad 100644 --- a/src/app/directives/bootstrap-tagsinput.js +++ b/src/app/directives/bootstrap-tagsinput.js @@ -102,7 +102,7 @@ function (angular, $) { var li = '' + '' + (item.text || '') + ''; if (item.submenu && item.submenu.length) { @@ -131,4 +131,4 @@ function (angular, $) { } }; }); -}); \ No newline at end of file +}); diff --git a/src/app/directives/dashEditLink.js b/src/app/directives/dashEditLink.js index c2e781ba3ae..6baf3f05de7 100644 --- a/src/app/directives/dashEditLink.js +++ b/src/app/directives/dashEditLink.js @@ -32,13 +32,16 @@ function (angular, $) { var editorScope; var lastEditor; - scope.onAppEvent('show-dash-editor', function(evt, payload) { if (lastEditor === payload.src) { editorScope.dismiss(); return; } + if (lastEditor) { + editorScope.dismiss(); + } + lastEditor = payload.src; editorScope = payload.scope.$new(); editorScope.dismiss = function() { diff --git a/src/app/partials/annotations_editor.html b/src/app/partials/annotations_editor.html index 38508216f5f..e921354bc72 100644 --- a/src/app/partials/annotations_editor.html +++ b/src/app/partials/annotations_editor.html @@ -1,67 +1,72 @@
-
-
Annotations
-
- - - - - - - - - - - - - -
Name
- - - {{annotation.name}} - -
-
+
+
+ + Annotations +
-
-

Add Annotation

-

Edit Annotation

+
+
+
+
-
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
+
-
-
+
-
+
+ + + + + + + +
+ + + {{annotation.name}} + +
+
-
- - - -
+
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+ + +
+
+ +
+ +
diff --git a/src/app/partials/dasheditor.html b/src/app/partials/dasheditor.html index 3169859da01..3fd45081e8a 100644 --- a/src/app/partials/dasheditor.html +++ b/src/app/partials/dasheditor.html @@ -49,30 +49,31 @@
-

Rows

+
Rows
- - - - - - - +
Title
{{row.title}}{{row.title}}
-

Add Row

- - - - -
- +
+
+
Add Row
+
+ + +
+
+ + +
+
+ +
@@ -115,5 +116,5 @@ - + diff --git a/src/app/partials/paneleditor.html b/src/app/partials/paneleditor.html index 62692c5f88e..ebc8a40ac63 100644 --- a/src/app/partials/paneleditor.html +++ b/src/app/partials/paneleditor.html @@ -1,23 +1,30 @@ -
-
-
-
-
-
-
-
-
+
+
+ + +
-
-
-
+
+
+
+
-
-
-
-
- - -
\ No newline at end of file +
+
+
+
+ +
+
+
+ +
+
+
+
+ +
+ +
diff --git a/src/app/partials/roweditor.html b/src/app/partials/roweditor.html index ab66b08356a..673230948cc 100644 --- a/src/app/partials/roweditor.html +++ b/src/app/partials/roweditor.html @@ -1,12 +1,19 @@ -
-
Row settings
+
+
+ + Row settings +
-
+
-
-
+
+
-
+
+ +
+ +
@@ -44,8 +51,7 @@
-
- - + +
diff --git a/src/app/partials/submenu.html b/src/app/partials/submenu.html index a9b2230237e..2929b9abc12 100644 --- a/src/app/partials/submenu.html +++ b/src/app/partials/submenu.html @@ -10,8 +10,8 @@
diff --git a/src/css/less/bootswatch.dark.less b/src/css/less/bootswatch.dark.less index 5a484bb1753..4b6ca9edfdb 100644 --- a/src/css/less/bootswatch.dark.less +++ b/src/css/less/bootswatch.dark.less @@ -223,7 +223,7 @@ div.subnav { li.active > a:hover { border-color: transparent; background-color: transparent; - border-bottom: 1px solid @blueDark; + border-bottom: 2px solid @blue; color: @white; } @@ -545,7 +545,7 @@ a:hover { .modal { .border-radius(1px); border-top: solid 1px lighten(@grayDark, 5%); - background-color: @grayDark; + background-color: @grafanaPanelBackground; } .modal-header { @@ -553,7 +553,7 @@ a:hover { } .modal-footer { - background-color: @grayDark; + background-color: @grafanaPanelBackground; border-top: 1px solid @grayDark; .border-radius(0 0 0px 0px); .box-shadow(none); diff --git a/src/css/less/grafana.less b/src/css/less/grafana.less index 5aba7086ae6..f4696d14095 100644 --- a/src/css/less/grafana.less +++ b/src/css/less/grafana.less @@ -564,29 +564,29 @@ select.grafana-target-segment-input { min-height: 100px; overflow: hidden; } + .dashboard-editor-footer { overflow: hidden; } .dashboard-editor-header { overflow: hidden; - border-bottom: 1px solid @fullEditBorder; .tabs { float: left; } - .nav { margin: 0; } } .dashboard-editor-title { + border-bottom: 1px solid @grayDark; padding-right: 20px; float: left; color: @linkColor; font-size: 20px; font-weight: normal; - line-height: 34px; + line-height: 38px; margin: 0; .icon { padding: 0 8px 0 5px;