Skip to content

N
nexpie-grafana-theme
Commit a5d39cd5 by Torkel Ödegaard
Options

added global dashboard wide hideControls option

parent 63358ede
Showing with 34 additions and 73 deletions
src/app/components/require.config.js
...@@ -53,8 +53,8 @@ require.config({ ...@@ -53,8 +53,8 @@ require.config({
}, },
rq: { rq: {
deps: ['setImmediate'], deps: ['setImmediate'],
exports: 'RQ' exports: 'RQ'
}, },
angular: { angular: {
......
src/app/components/settings.js
...@@ -12,8 +12,8 @@ function (_) { ...@@ -12,8 +12,8 @@ function (_) {
var defaults = { var defaults = {
elasticsearch : "http://"+window.location.hostname+":9200", elasticsearch : "http://"+window.location.hostname+":9200",
panel_names : [], panel_names : [],
kibana_index : 'kibana-int', kibana_index : 'kibana-int',
graphiteUrl : null, graphiteUrl : null,
default_route : '/dashboard/file/default.json' default_route : '/dashboard/file/default.json'
}; };
......
src/app/controllers/zoom.js
define([ define([
'angular', 'angular',
'app', 'app',
'underscore' 'underscore',
'moment',
], ],
function (angular, app, _) { function (angular, app, _, moment) {
'use strict'; 'use strict';
var module = angular.module('kibana.controllers'); var module = angular.module('kibana.controllers');
...@@ -30,6 +31,7 @@ function (angular, app, _) { ...@@ -30,6 +31,7 @@ function (angular, app, _) {
if(factor > 1) { if(factor > 1) {
filterSrv.removeByType('time'); filterSrv.removeByType('time');
} }
filterSrv.set({ filterSrv.set({
type:'time', type:'time',
from:moment.utc(_from).toDate(), from:moment.utc(_from).toDate(),
......
src/app/dashboards/default.json
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
"spyable": true, "spyable": true,
"targets": [ "targets": [
{ {
"target": "summarize(sum(prod.apps.tradera_site.*.counters.global.request_status.code_404.count), '30s')" "target": ""
} }
] ]
} }
......
src/app/panels/graphite/graphiteSrv.js
...@@ -66,7 +66,7 @@ function ($, RQ, config) { ...@@ -66,7 +66,7 @@ function ($, RQ, config) {
until: $.plot.formatDate(options.range.to, '%H%:%M_%Y%m%d'), until: $.plot.formatDate(options.range.to, '%H%:%M_%Y%m%d'),
targets: options.targets, targets: options.targets,
maxDataPoints: options.maxDataPoints maxDataPoints: options.maxDataPoints
} };
var graphiteParameters = build_graphite_options(graphOptions, true); var graphiteParameters = build_graphite_options(graphOptions, true);
getGraphiteData(graphiteParameters) getGraphiteData(graphiteParameters)
...@@ -76,7 +76,7 @@ function ($, RQ, config) { ...@@ -76,7 +76,7 @@ function ($, RQ, config) {
.fail(function() { .fail(function() {
requestion(null, 'Error in ajax call to graphite'); requestion(null, 'Error in ajax call to graphite');
}); });
} };
} }
function getGraphiteData(parameters) { function getGraphiteData(parameters) {
......
src/app/panels/graphite/module.html
...@@ -56,10 +56,6 @@ ...@@ -56,10 +56,6 @@
<i ng-show="!options" class="icon-caret-right"></i><i ng-show="options" class="icon-caret-down"></i> View <i ng-show="!options" class="icon-caret-right"></i><i ng-show="options" class="icon-caret-down"></i> View
</a> |&nbsp </a> |&nbsp
</span> </span>
<span ng-show='panel.zoomlinks && data'>
<!--<a class='small' ng-click='zoom(0.5)'><i class='icon-zoom-in'></i> Zoom In</a>-->
<a class='small' ng-click='zoom(2)'><i class='icon-zoom-out'></i> Zoom Out</a>
</span>
</div> </div>
<form class="form-inline bordered histogram-options" ng-show="options"> <form class="form-inline bordered histogram-options" ng-show="options">
<span> <span>
......
src/app/panels/graphite/module.js
...@@ -20,6 +20,7 @@ define([ ...@@ -20,6 +20,7 @@ define([
'moment', 'moment',
'./timeSeries', './timeSeries',
'./graphiteSrv', './graphiteSrv',
'rq',
'jquery.flot', 'jquery.flot',
'jquery.flot.events', 'jquery.flot.events',
'jquery.flot.selection', 'jquery.flot.selection',
...@@ -28,7 +29,7 @@ define([ ...@@ -28,7 +29,7 @@ define([
'jquery.flot.stack', 'jquery.flot.stack',
'jquery.flot.stackpercent' 'jquery.flot.stackpercent'
], ],
function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) { function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
'use strict'; 'use strict';
...@@ -323,7 +324,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) { ...@@ -323,7 +324,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
$scope.legend = []; $scope.legend = [];
var data = []; var data = [];
if(results.length == 0 ) { if(results.length === 0 ) {
requestion('no data in response from graphite'); requestion('no data in response from graphite');
} }
...@@ -369,34 +370,6 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) { ...@@ -369,34 +370,6 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
$scope.panel.targets.push({target: ''}); $scope.panel.targets.push({target: ''});
}; };
// function $scope.zoom
// factor :: Zoom factor, so 0.5 = cuts timespan in half, 2 doubles timespan
$scope.zoom = function(factor) {
var _range = filterSrv.timeRange('last');
var _timespan = (_range.to.valueOf() - _range.from.valueOf());
var _center = _range.to.valueOf() - _timespan/2;
var _to = (_center + (_timespan*factor)/2);
var _from = (_center - (_timespan*factor)/2);
// If we're not already looking into the future, don't.
if(_to > Date.now() && _range.to < Date.now()) {
var _offset = _to - Date.now();
_from = _from - _offset;
_to = Date.now();
}
if(factor > 1) {
filterSrv.removeByType('time');
}
filterSrv.set({
type:'time',
from:moment.utc(_from).toDate(),
to:moment.utc(_to).toDate(),
field:$scope.panel.time_field
});
};
$scope.openConfigureModal = function($event) { $scope.openConfigureModal = function($event) {
$event.preventDefault(); $event.preventDefault();
$event.stopPropagation(); $event.stopPropagation();
...@@ -408,7 +381,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) { ...@@ -408,7 +381,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
} }
setTimeout(function() { setTimeout(function() {
$scope.$emit('render'); $scope.$emit('render');
}, 200); }, 200);
}); });
...@@ -460,30 +433,6 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) { ...@@ -460,30 +433,6 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
render_panel(data); render_panel(data);
}); });
var scale = function(series,factor) {
return _.map(series,function(p) {
return [p[0],p[1]*factor];
});
};
var scaleSeconds = function(series,interval) {
return _.map(series,function(p) {
return [p[0],p[1]/kbn.interval_to_seconds(interval)];
});
};
var derivative = function(series) {
return _.map(series, function(p,i) {
var _v;
if(i === 0 || p[1] === null) {
_v = [p[0],null];
} else {
_v = series[i-1][1] === null ? [p[0],null] : [p[0],p[1]-(series[i-1][1])];
}
return _v;
});
};
// Function for rendering panel // Function for rendering panel
function render_panel(data) { function render_panel(data) {
// IE doesn't work without this // IE doesn't work without this
...@@ -622,7 +571,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) { ...@@ -622,7 +571,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
if(_int >= 2628000) { if(_int >= 2628000) {
return "%Y-%m"; return "%Y-%m";
} }
if(_int >= 86400) { if(_int >= 10000) {
return "%Y-%m-%d"; return "%Y-%m-%d";
} }
if(_int >= 60) { if(_int >= 60) {
...@@ -633,6 +582,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) { ...@@ -633,6 +582,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
} }
var $tooltip = $('<div>'); var $tooltip = $('<div>');
elem.bind("plothover", function (event, pos, item) { elem.bind("plothover", function (event, pos, item) {
var group, value, timestamp; var group, value, timestamp;
if (item) { if (item) {
......
src/app/panels/graphite/timeSeries.js
...@@ -121,7 +121,7 @@ function (_, Interval) { ...@@ -121,7 +121,7 @@ function (_, Interval) {
ts.ZeroFilled.prototype._getFlotPairsConnect = function (result, time, i, times) { ts.ZeroFilled.prototype._getFlotPairsConnect = function (result, time, i, times) {
result.push([times[i], this._data[times[i]] || 0 ]); result.push([times[i], this._data[times[i]] || 0 ]);
return result; return result;
} };
/** /**
* ** called as a reduce stragegy in getFlotPairs() ** * ** called as a reduce stragegy in getFlotPairs() **
......
src/app/partials/dashboard.html
...@@ -10,14 +10,14 @@ ...@@ -10,14 +10,14 @@
</div> </div>
</nil> </nil>
<div class="container-fluid main"> <div class="container-fluid main" ng-class="{'grafana-dashboard-hide-controls': dashboard.current.hideControls}">
<div class="row-fluid"> <div class="row-fluid">
<div class="row-fluid container" style="margin-top:10px; width:98%"> <div class="row-fluid container" style="margin-top:10px; width:98%">
<div ng-show="fullEditMode" class="modal-backdrop fade in"></div> <div ng-show="fullEditMode" class="modal-backdrop fade in"></div>
<!-- Rows --> <!-- Rows -->
<div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboard.current.rows" ng-style="row_style(row)"> <div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboard.current.rows" ng-style="row_style(row)">
<div class="row-control"> <div class="row-control">
<div class="row-fluid" style="padding:0px;margin:0px;position:relative;"> <div class="row-fluid grafana-row" style="padding:0px;margin:0px;position:relative;">
<div class="row-close span12" ng-show="row.collapse" data-placement="bottom" > <div class="row-close span12" ng-show="row.collapse" data-placement="bottom" >
<span class="row-button" bs-modal="'app/partials/roweditor.html'" class="pointer"> <span class="row-button" bs-modal="'app/partials/roweditor.html'" class="pointer">
......
src/app/partials/dasheditor.html
...@@ -19,6 +19,10 @@ ...@@ -19,6 +19,10 @@
<div class="span1"> <div class="span1">
<label class="small"> Hints <tip>Show 'Add panel' hints in empty spaces</tip></label><input type="checkbox" ng-model="dashboard.current.panel_hints" ng-checked="dashboard.current.panel_hints" /> <label class="small"> Hints <tip>Show 'Add panel' hints in empty spaces</tip></label><input type="checkbox" ng-model="dashboard.current.panel_hints" ng-checked="dashboard.current.panel_hints" />
</div> </div>
<div class="span2">
<label class="small">Hide controls</label>
<input type="checkbox" ng-model="dashboard.current.hideControls" ng-checked="dashboard.current.hideControls">
</div>
<div class="span3"> <div class="span3">
<label class="small">Style</label><select class="input-small" ng-model="dashboard.current.style" ng-options="f for f in ['dark','light']"></select> <label class="small">Style</label><select class="input-small" ng-model="dashboard.current.style" ng-options="f for f in ['dark','light']"></select>
</div> </div>
......
src/css/bootstrap.dark.min.css
This source diff could not be displayed because it is too large. You can view the blob instead.
src/index.html
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<title>Grafana</title> <title>Grafana</title>
<link rel="stylesheet" href="css/bootstrap.light.min.css" title="Light"> <link rel="stylesheet" href="css/bootstrap.dark.min.css" title="Light">
<link rel="stylesheet" href="css/timepicker.css"> <link rel="stylesheet" href="css/timepicker.css">
<link rel="stylesheet" href="css/animate.min.css"> <link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/normalize.min.css"> <link rel="stylesheet" href="css/normalize.min.css">
......
src/vendor/bootstrap/less/bootstrap.dark.less
...@@ -2,3 +2,4 @@ ...@@ -2,3 +2,4 @@
@import "bootswatch.dark.less"; @import "bootswatch.dark.less";
@import "overrides.less"; @import "overrides.less";
@import "variables.dark.less"; @import "variables.dark.less";
@import "grafana.less";
\ No newline at end of file
src/vendor/bootstrap/less/grafana.less 0 → 100644
.grafana-dashboard-hide-controls {
padding: 0;
.extra, .grafana-row {
display: none;
}
}
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