Skip to content

N
nexpie-grafana-theme
Commit 7cbd88f3 by Torkel Ödegaard
Options

target editor is starting to work better, now switch between text edit mode and easy gui version

parent bb6068ac
Showing with 46 additions and 28 deletions
src/app/controllers/graphiteTarget.js
...@@ -13,22 +13,32 @@ function (angular, _, config, graphiteFunctions, Parser) { ...@@ -13,22 +13,32 @@ function (angular, _, config, graphiteFunctions, Parser) {
module.controller('GraphiteTargetCtrl', function($scope, $http) { module.controller('GraphiteTargetCtrl', function($scope, $http) {
$scope.init = function() { $scope.init = function() {
$scope.funcDefs = graphiteFunctions;
parseTarget();
console.log('init:');
};
function parseTarget() {
$scope.functions = []; $scope.functions = [];
$scope.segments = []; $scope.segments = [];
$scope.funcDefs = graphiteFunctions;
$scope.showTextEditor = false; $scope.showTextEditor = false;
delete $scope.parserError;
var parser = new Parser($scope.target.target); var parser = new Parser($scope.target.target);
var astNode = parser.getAst(); var astNode = parser.getAst();
console.log('GraphiteTargetCtrl:init -> target', $scope.target.target); if (parser.error) {
console.log('GraphiteTargetCtrl:init -> ast', astNode); $scope.parserError = parser.error.text + " at position: " + parser.error.pos;
$scope.showTextEditor = true;
return;
}
parseTargetExpression(astNode); parseTargeRecursive(astNode);
checkOtherSegments($scope.segments.length); checkOtherSegments($scope.segments.length);
}; }
function parseTargetExpression(astNode, func, index) { function parseTargeRecursive(astNode, func, index) {
if (astNode === null) { if (astNode === null) {
return null; return null;
} }
...@@ -36,10 +46,10 @@ function (angular, _, config, graphiteFunctions, Parser) { ...@@ -36,10 +46,10 @@ function (angular, _, config, graphiteFunctions, Parser) {
if (astNode.type === 'function') { if (astNode.type === 'function') {
var innerFunc = {}; var innerFunc = {};
innerFunc.def = _.findWhere($scope.funcDefs, { name: astNode.name }); innerFunc.def = _.findWhere($scope.funcDefs, { name: astNode.name });
innerFunc.params = innerFunc.def.defaultParams; innerFunc.params = innerFunc.def.defaultParams.slice(0);
_.each(astNode.params, function(param, index) { _.each(astNode.params, function(param, index) {
parseTargetExpression(param, innerFunc, index); parseTargeRecursive(param, innerFunc, index);
}); });
innerFunc.text = getFuncText(innerFunc.def, innerFunc.params); innerFunc.text = getFuncText(innerFunc.def, innerFunc.params);
...@@ -168,10 +178,18 @@ function (angular, _, config, graphiteFunctions, Parser) { ...@@ -168,10 +178,18 @@ function (angular, _, config, graphiteFunctions, Parser) {
$scope.targetChanged(); $scope.targetChanged();
}; };
$scope.targetTextChanged = function() {
parseTarget();
$scope.$parent.get_data();
};
$scope.targetChanged = function() { $scope.targetChanged = function() {
if ($scope.parserError) {
return;
}
var target = getSegmentPathUpTo($scope.segments.length); var target = getSegmentPathUpTo($scope.segments.length);
target = _.reduce($scope.functions, wrapFunction, target); target = _.reduce($scope.functions, wrapFunction, target);
console.log('target: ', target);
$scope.target.target = target; $scope.target.target = target;
$scope.$parent.get_data(); $scope.$parent.get_data();
}; };
...@@ -189,7 +207,7 @@ function (angular, _, config, graphiteFunctions, Parser) { ...@@ -189,7 +207,7 @@ function (angular, _, config, graphiteFunctions, Parser) {
$scope.addFunction = function(funcDef) { $scope.addFunction = function(funcDef) {
$scope.functions.push({ $scope.functions.push({
def: funcDef, def: funcDef,
params: funcDef.defaultParams, params: funcDef.defaultParams.slice(0),
text: getFuncText(funcDef, funcDef.defaultParams) text: getFuncText(funcDef, funcDef.defaultParams)
}); });
$scope.targetChanged(); $scope.targetChanged();
......
src/app/directives/kibanaPanel.js
...@@ -34,11 +34,6 @@ function (angular) { ...@@ -34,11 +34,6 @@ function (angular) {
'<span class="row-text">{{panel.type}}</span>'+ '<span class="row-text">{{panel.type}}</span>'+
'</span>' + '</span>' +
'<span class="row-button extra" ng-show="panel.editable != false">' +
'<span bs-modal="\'app/partials/paneleditor.html\'" class="pointer" ng-click="openConfigureModal($event)" >'+
'<i class="icon-cog pointer" bs-tooltip="\'Configure\'"></i></span>'+
'</span>' +
'<span ng-repeat="task in panelMeta.modals" class="row-button extra" ng-show="task.show">' + '<span ng-repeat="task in panelMeta.modals" class="row-button extra" ng-show="task.show">' +
'<span bs-modal="task.partial" class="pointer"><i ' + '<span bs-modal="task.partial" class="pointer"><i ' +
'bs-tooltip="task.description" ng-class="task.icon" class="pointer"></i></span>'+ 'bs-tooltip="task.description" ng-class="task.icon" class="pointer"></i></span>'+
......
src/app/panels/graphite/editor.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="grafana-target-inner"> <div class="grafana-target-inner">
<ul class="grafana-target-controls"> <ul class="grafana-target-controls">
<li> <li>
<a class="pointer" tabindex="1" ng-click="showTextEditor = true"> <a class="pointer" tabindex="1" ng-click="showTextEditor = !showTextEditor">
<i class="icon-pencil"></i> <i class="icon-pencil"></i>
</a> </a>
</li> </li>
...@@ -22,19 +22,23 @@ ...@@ -22,19 +22,23 @@
</ul> </ul>
<ul class="grafana-target-controls-left"> <ul class="grafana-target-controls-left">
<li> <li ng-hide="parserError">
<a class="grafana-target-segment" ng-click="hideit()" role="menuitem"> <a class="grafana-target-segment" ng-click="hideit()" role="menuitem">
<i class="icon-eye-open"></i> <i class="icon-eye-open"></i>
</a> </a>
</li> </li>
<li ng-show="parserError">
<a class="grafana-target-segment" bs-tooltip="parserError" style="color: rgb(229, 189, 28)" ng-click="hideit()" role="menuitem">
<i class="icon-warning-sign"></i>
</a>
</li>
</ul> </ul>
<input type="text" <input type="text"
class="grafana-target-text-input" class="grafana-target-text-input"
ng-model="target.target" ng-model="target.target"
focus-me="showTextEditor" focus-me="showTextEditor"
ng-blur="showTextEditor = false" ng-model-onblur ng-change="targetTextChanged()"
ng-model-onblur ng-change="targetChanged()"
ng-show="showTextEditor" /> ng-show="showTextEditor" />
<ul class="grafana-segment-list" role="menu" ng-hide="showTextEditor"> <ul class="grafana-segment-list" role="menu" ng-hide="showTextEditor">
......
src/app/panels/graphite/module.html
...@@ -105,7 +105,7 @@ ...@@ -105,7 +105,7 @@
<div ng-show="editorTabs[editor.index] == 'General'"> <div ng-show="editorTabs[editor.index] == 'General'">
<div ng-include src="'app/partials/panelgeneral.html'"></div> <div ng-include src="'app/partials/panelgeneral.html'"></div>
</div> </div>
<div ng-repeat="tab in panelMeta.editorTabs" ng-show="editorTabs[editor.index] == tab.title"> <div ng-repeat="tab in panelMeta.fullEditorTabs" ng-show="editorTabs[editor.index] == tab.title">
<div ng-include src="tab.src"></div> <div ng-include src="tab.src"></div>
</div> </div>
</div> </div>
......
src/app/panels/graphite/module.js
...@@ -46,7 +46,9 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) { ...@@ -46,7 +46,9 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
show: $scope.panel.spyable show: $scope.panel.spyable
} }
], ],
editorTabs : [ editorTabs: [],
fullEditorTabs : [
{ {
title:'Targets', title:'Targets',
src:'app/panels/graphite/editor.html' src:'app/panels/graphite/editor.html'
...@@ -433,10 +435,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) { ...@@ -433,10 +435,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
}; };
$scope.setEditorTabs = function(panelMeta) { $scope.setEditorTabs = function(panelMeta) {
$scope.editorTabs = ['General']; $scope.editorTabs = _.union(['General'],_.pluck(panelMeta.fullEditorTabs,'title'));
if(!_.isUndefined(panelMeta.editorTabs)) {
$scope.editorTabs = _.union($scope.editorTabs,_.pluck(panelMeta.editorTabs,'title'));
}
return $scope.editorTabs; return $scope.editorTabs;
}; };
......
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/vendor/bootstrap/less/grafana.less
...@@ -182,12 +182,14 @@ ...@@ -182,12 +182,14 @@
} }
input[type=text].grafana-target-text-input { input[type=text].grafana-target-text-input {
padding: 2px 6px; padding: 5px 7px;
margin: 2px; border: 1px solid #050505;
margin: 0px;
background: transparent; background: transparent;
width: 80%; width: 80%;
float: left; float: left;
border: none; color: #c8c8c8;
border-radius: 0;
} }
.grafana-target .dropdown { .grafana-target .dropdown {
......
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