Browse Source

trying out panel actions buttons

Torkel Ödegaard 11 years ago
parent
commit
f45797ec4b

+ 7 - 2
src/app/directives/panelMenu.js

@@ -13,6 +13,11 @@ function (angular, $, _) {
           '<span class="panel-title drag-handle pointer">' +
             '<span class="panel-title-text drag-handle">{{panel.title | interpolateTemplateVars}}</span>' +
             '<span class="panel-links-icon"></span>' +
+            '<span class="panel-actions">' +
+               '<a href="asd" class="panel-menu-link"><i class="icon-th-list"></i></a>' +
+               '<a href="asd" class="panel-menu-link">View</a>' +
+               '<a href="asd" class="panel-menu-link">Edit</a>' +
+            '</span>';
           '</span>';
 
       function createMenuTemplate($scope) {
@@ -119,7 +124,7 @@ function (angular, $, _) {
             $menu = $(menuTemplate);
             $menu.css('left', menuLeftPos);
             $menu.mouseleave(function() {
-              dismiss(1000);
+              //dismiss(1000);
             });
 
             menuScope = $scope.$new();
@@ -134,7 +139,7 @@ function (angular, $, _) {
             $(".panel-container").removeClass('panel-highlight');
             $panelContainer.toggleClass('panel-highlight');
 
-            dismiss(2500);
+            //dismiss(2500);
           };
 
           if ($scope.panelMeta.titlePos && $scope.panel.title) {

+ 2 - 1
src/app/panels/graph/graph.js

@@ -72,10 +72,11 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
               height = parseInt(height.replace('px', ''), 10);
             }
 
+            height -= 5; // padding
             height -= scope.panel.title ? 24 : 9; // subtract panel title bar
 
             if (scope.panel.legend.show && !scope.panel.legend.rightSide) {
-              height = height - 21; // subtract one line legend
+              height = height - 26; // subtract one line legend
             }
 
             elem.css('height', height + 'px');

+ 1 - 0
src/app/panels/singlestat/singleStatPanel.js

@@ -29,6 +29,7 @@ function (angular, app, _, $) {
               height = parseInt(height.replace('px', ''), 10);
             }
 
+            height -= 5; // padding
             height -= panel.title ? 24 : 9; // subtract panel title bar
 
             elem.css('height', height + 'px');

+ 13 - 0
src/app/partials/submenu.html

@@ -36,6 +36,19 @@
 					</li>
 				</ul>
 
+				<ul class="grafana-segment-list pull-right" style="margin-right: 0">
+					<li class="grafana-target-segment annotation-segment">
+						<a ng-click="disableAnnotation(annotation)">
+							back to dashboard
+						</a>
+					</li>
+					<li class="grafana-target-segment annotation-segment">
+						<a ng-click="disableAnnotation(annotation)">
+							fullscreen view
+						</a>
+					</li>
+				</ul>
+
 				<div class="clearfix"></div>
 			</div>
 		</div>

+ 25 - 0
src/css/less/panel.less

@@ -10,6 +10,11 @@
   background: @grafanaPanelBackground;
   margin: 5px;
   position: relative;
+  &:hover {
+    .panel-actions {
+      display: block;
+    }
+  }
 }
 
 .panel-content {
@@ -27,6 +32,8 @@
   font-weight: bold;
   position: relative;
   cursor: context-menu;
+  width: 100%;
+  display: block;
 
   &.has-panel-links {
     .panel-title-text:after {
@@ -124,3 +131,21 @@
     border: 1px solid @grayDark;
   }
 }
+
+.panel-actions {
+  display: none;
+  position: absolute;
+  right: 0;
+  top: -2px;
+  width: 112px;
+  a {
+    opacity: 0.35;
+    border: 1px solid black;
+    padding: 5px 10px;
+    font-size: 75%;
+    background: @grafanaTargetFuncBackground;
+    &:hover {
+      opacity: 1;
+    }
+  }
+}