Skip to content

N
nexpie-grafana-theme
Commit 4c59ec81 by Torkel Ödegaard
Options

work on share panel view, and better look for checkbox

parent 440ea666
Showing with 86 additions and 40 deletions
src/app/controllers/sharePanelCtrl.js
...@@ -28,6 +28,9 @@ function (angular, _) { ...@@ -28,6 +28,9 @@ function (angular, _) {
$scope.shareUrl += "&from=" + from; $scope.shareUrl += "&from=" + from;
$scope.shareUrl += "&to=" + to; $scope.shareUrl += "&to=" + to;
$scope.forCurrent = true;
$scope.toPanel = true;
$timeout(function() { $timeout(function() {
var input = $element.find('[data-share-panel-url]'); var input = $element.find('[data-share-panel-url]');
input.focus(); input.focus();
......
src/app/directives/tip.js
...@@ -17,4 +17,18 @@ function (angular, kbn) { ...@@ -17,4 +17,18 @@ function (angular, kbn) {
} }
}; };
}); });
angular
.module('grafana.directives')
.directive('tip', function($compile) {
return {
restrict: 'E',
link: function(scope, elem, attrs) {
var _t = '<i class="grafana-tip icon-'+(attrs.icon||'question-sign')+'" bs-tooltip="\''+
kbn.addslashes(elem.text())+'\'"></i>';
elem.replaceWith($compile(angular.element(_t))(scope));
}
};
});
}); });
src/app/panels/graph/styleEditor.html
<div class="editor-row"> <div class="editor-row">
<div class="section"> <div class="section">
<h5>Chart Options</h5> <h5>Chart Options</h5>
<div class="editor-option"> <div class="editor-option text-center">
<label class="small">Bars</label><input type="checkbox" ng-model="panel.bars" ng-checked="panel.bars" ng-change="render()"> <label for="barsCheck" class="small">Bars</label>
</div> <input id="barsCheck" type="checkbox" ng-model="panel.bars" ng-checked="panel.bars" ng-change="render()">
<div class="editor-option"> <label for="barsCheck" class="cr1"></label>
<label class="small">Lines</label><input type="checkbox" ng-model="panel.lines" ng-checked="panel.lines" ng-change="render()"> </div>
</div> <div class="editor-option text-center">
<div class="editor-option"> <label for="linesCheck" class="small">Lines</label>
<label class="small">Points</label><input type="checkbox" ng-model="panel.points" ng-checked="panel.points" ng-change="render()"> <input id="linesCheck" type="checkbox" ng-model="panel.lines" ng-checked="panel.lines" ng-change="render()">
<label for="linesCheck" class="cr1"></label>
</div>
<div class="editor-option text-center">
<label for="pointsCheck" class="small">Points</label>
<input id="pointsCheck" type="checkbox" ng-model="panel.points" ng-checked="panel.points" ng-change="render()">
<label for="pointsCheck" class="cr1"></label>
</div> </div>
</div> </div>
......
src/app/panels/timepicker/module.html
...@@ -9,9 +9,7 @@ ...@@ -9,9 +9,7 @@
border: 0px !important; border: 0px !important;
} }
</style> </style>
<!-- This is a complete hack. The form actually exists in the modal, but due to transclusion <form name="input" style="margin:0">
$scope.input isn't available on the controller unless the form element is in this file -->
<form name="input" style="margin:3px 0 0 0">
<ul class="nav nav-pills timepicker-dropdown"> <ul class="nav nav-pills timepicker-dropdown">
<li class="dropdown"> <li class="dropdown">
...@@ -47,6 +45,5 @@ ...@@ -47,6 +45,5 @@
<a ng-click="timeSrv.refreshDashboard()"><i class="icon-refresh"></i></a> <a ng-click="timeSrv.refreshDashboard()"><i class="icon-refresh"></i></a>
</li> </li>
</ul> </ul>
</form> </form>
</div> </div>
src/app/partials/dasheditor.html
...@@ -28,9 +28,10 @@ ...@@ -28,9 +28,10 @@
<label class="small">Time correction</label> <label class="small">Time correction</label>
<select ng-model="dashboard.timezone" class='input-small' ng-options="f for f in ['browser','utc']"></select> <select ng-model="dashboard.timezone" class='input-small' ng-options="f for f in ['browser','utc']"></select>
</div> </div>
<div class="editor-option"> <div class="editor-option text-center">
<label class="small">Hide controls (CTRL+H)</label> <label for="hideControls" class="small">Hide controls (CTRL+H)</label>
<input type="checkbox" ng-model="dashboard.hideControls" ng-checked="dashboard.hideControls"> <input id="hideControls" type="checkbox" ng-model="dashboard.hideControls" ng-checked="dashboard.hideControls">
<label for="hideControls" class="cr1"></label>
</div> </div>
</div> </div>
</div> </div>
...@@ -71,16 +72,20 @@ ...@@ -71,16 +72,20 @@
<div ng-if="editor.index == 2"> <div ng-if="editor.index == 2">
<div class="editor-row"> <div class="editor-row">
<div class="section"> <div class="section">
<div class="editor-option"> <div class="editor-option text-center">
<label class="small">Templating</label> <label for="templateFeature" class="small">Templating</label>
<input type="checkbox" ng-model="dashboard.templating.enable" ng-checked="dashboard.templating.enable" ng-change="checkFeatureToggles()"x > <input id="templateFeature" type="checkbox" ng-model="dashboard.templating.enable" ng-checked="dashboard.templating.enable" ng-change="checkFeatureToggles()"x >
</div> <label for="templateFeature" class="cr1"></label>
<div class="editor-option"> </div>
<label class="small">Annotations</label> <div class="editor-option text-center">
<input type="checkbox" ng-model="dashboard.annotations.enable" ng-checked="dashboard.annotations.enable" ng-change="checkFeatureToggles()"> <label for="annotationFeature" class="small">Annotations</label>
</div> <input id="annotationFeature" type="checkbox" ng-model="dashboard.annotations.enable" ng-checked="dashboard.annotations.enable" ng-change="checkFeatureToggles()">
<div class="editor-option" ng-repeat="pulldown in dashboard.nav"> <label for="annotationFeature" class="cr1"></label>
<label class="small" style="text-transform:capitalize;">{{pulldown.type}}</label><input type="checkbox" ng-model="pulldown.enable" ng-checked="pulldown.enable"> </div>
<div class="editor-option text-center" ng-repeat="pulldown in dashboard.nav">
<label class="small" style="text-transform:capitalize;">{{pulldown.type}}</label>
<input id="pulldown{{pulldown.type}}" type="checkbox" ng-model="pulldown.enable" ng-checked="pulldown.enable">
<label for="pulldown{{pulldown.type}}" class="cr1"></label>
</div> </div>
</div> </div>
</div> </div>
......
src/app/partials/share-panel.html
...@@ -16,13 +16,15 @@ ...@@ -16,13 +16,15 @@
<div class="modal-body"> <div class="modal-body">
<div class="editor-row"> <div class="editor-row">
<div class="editor-option"> <div class="editor-option text-center">
<label class="small">Current time range</label> <label for="currentTime" class="small">Current time range</label>
<input type="checkbox"></input> <input id="currentTime" type="checkbox" ng-model="forCurrent" ng-checked="forCurrent"></input>
</div> <label for="currentTime" class="cr1"></label>
<div class="editor-option"> </div>
<label class="small">To fullscreen panel</label> <div class="editor-option text-center">
<input type="checkbox"></input> <label for="toPanel" class="small">To fullscreen panel</label>
<input id="toPanel" type="checkbox" ng-model="toPanel" ng-checked="toPanel"></input>
<label for="toPanel" class="cr1"></label>
</div> </div>
</div> </div>
......
src/css/less/forms.less 0 → 100644
input[type=text].input-fluid {
width: 100%;
box-sizing: border-box;
padding: 14px;
}
input[type="checkbox"] {
display: none;
}
input[type="checkbox"]+.cr1 {
display: inline-block;
height: 19px;
clear: none;
text-indent: 2px;
margin-top: 4px;
padding: 0 0 0 20px;
vertical-align:middle;
background:url(../img/checkbox.png) left top no-repeat;
cursor:pointer;
}
input[type="checkbox"]:checked+label {
background:url(../img/checkbox.png) 0px -18px no-repeat;
}
src/css/less/grafana.less
...@@ -5,6 +5,7 @@ ...@@ -5,6 +5,7 @@
@import "tables_lists.less"; @import "tables_lists.less";
@import "search.less"; @import "search.less";
@import "panel.less"; @import "panel.less";
@import "forms.less";
.hide-controls { .hide-controls {
padding: 0; padding: 0;
...@@ -55,7 +56,6 @@ ...@@ -55,7 +56,6 @@
.modal { .modal {
max-width: 800px; max-width: 800px;
left: 0; left: 0;
right: 0; right: 0;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
...@@ -529,10 +529,3 @@ select.grafana-target-segment-input { ...@@ -529,10 +529,3 @@ select.grafana-target-segment-input {
.grafana-tip { .grafana-tip {
padding-left: 5px; padding-left: 5px;
} }
input[type=text].input-fluid {
width: 100%;
box-sizing: border-box;
padding: 14px;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment