Skip to content

N
nexpie-grafana-theme
Commit 822a689b by Torkel Ödegaard
Options

datasource(cloudwatch): began on polishing cloudwatch datasource, #684, #2445

parent ffbf70af
Showing with 259 additions and 251 deletions
public/app/plugins/datasource/cloudwatch/datasource.js
...@@ -5,6 +5,7 @@ define([ ...@@ -5,6 +5,7 @@ define([
'kbn', 'kbn',
'moment', 'moment',
'./queryCtrl', './queryCtrl',
'./directives',
'aws-sdk', 'aws-sdk',
], ],
function (angular, _, kbn) { function (angular, _, kbn) {
......
public/app/plugins/datasource/cloudwatch/directives.js 0 → 100644
define([
'angular',
],
function (angular) {
'use strict';
var module = angular.module('grafana.directives');
module.directive('metricQueryEditorCloudwatch', function() {
return {controller: 'CloudWatchQueryCtrl', templateUrl: 'app/plugins/datasource/cloudwatch/partials/query.editor.html'};
});
});
public/app/plugins/datasource/cloudwatch/partials/config.html
...@@ -2,11 +2,11 @@ ...@@ -2,11 +2,11 @@
<div class="tight-form"> <div class="tight-form">
<ul class="tight-form-list"> <ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px"> <li class="tight-form-item" style="width: 160px">
Default Region Default Region
</li> </li>
<li> <li>
<input type="text" class="tight-form-input input-large" ng-model='current.jsonData.defaultRegion' placeholder="" required></input> <input type="text" class="tight-form-input input-xlarge" ng-model='current.jsonData.defaultRegion' placeholder="" required></input>
</li> </li>
</ul> </ul>
<ul class="tight-form-list"> <ul class="tight-form-list">
...@@ -14,33 +14,37 @@ ...@@ -14,33 +14,37 @@
Access <tip>Direct = url is used directly from browser, Proxy = Grafana backend will proxy the request</label> Access <tip>Direct = url is used directly from browser, Proxy = Grafana backend will proxy the request</label>
</li> </li>
<li> <li>
<select class="input-medium tight-form-input" ng-model="current.jsonData.access" ng-options="f for f in ['direct', 'proxy']" ng-init="current.jsonData.access = current.jsonData.access || 'direct'"></select> <select class="input-small tight-form-input" ng-model="current.jsonData.access" ng-options="f for f in ['direct', 'proxy']" ng-init="current.jsonData.access = current.jsonData.access || 'direct'"></select>
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="tight-form" ng-show="current.jsonData.access === 'direct'"> <div class="tight-form" ng-show="current.jsonData.access === 'direct'">
<ul class="tight-form-list"> <ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px"> <li class="tight-form-item" style="width: 160px">
Access Key Id Access Key Id
</li> </li>
<li> <li>
<input type="text" class="tight-form-input input-large" ng-model='current.jsonData.accessKeyId' placeholder="" ng-required="current.jsonData.access === 'direct'"></input> <input type="text" class="tight-form-input input-xlarge" ng-model='current.jsonData.accessKeyId' placeholder="" ng-required="current.jsonData.access === 'direct'"></input>
</li> </li>
<li class="tight-form-item"> </ul>
Secret Access Key <div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 160px">
Secret Access Key
</li> </li>
<li> <li>
<input type="password" class="tight-form-input input-large" ng-model='current.jsonData.secretAccessKey' placeholder="" ng-required="current.jsonData.access === 'direct'"></input> <input type="password" class="tight-form-input input-xlarge" ng-model='current.jsonData.secretAccessKey' placeholder="" ng-required="current.jsonData.access === 'direct'"></input>
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="tight-form last"> <div class="tight-form last">
<ul class="tight-form-list"> <ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px"> <li class="tight-form-item" style="width: 160px">
Custom Metrics Attributes Custom Metric Attributes
</li> </li>
<li> <li>
<input type="text" class="tight-form-input input-xlarge" ng-model='current.jsonData.customMetricsAttributes[0]' ng-init="current.jsonData.customMetricsAttributes = current.jsonData.customMetricsAttributes || []" placeholder="JSON url" bs-tooltip="'Set JSON url of the result, \'aws cloudwatch list-metrics --output json\''"></input> <input type="text" class="tight-form-input input-xlarge" ng-model='current.jsonData.customMetricsAttributes[0]' ng-init="current.jsonData.customMetricsAttributes = current.jsonData.customMetricsAttributes || []" placeholder="JSON url" bs-tooltip="'Set JSON url of the result, \'aws cloudwatch list-metrics --output json\''"></input>
......
public/app/plugins/datasource/cloudwatch/partials/query.editor.html
<div class="editor-row" style="margin-top: 10px;"> <div class="tight-form">
<ul class="tight-form-list pull-right">
<div ng-repeat="target in panel.targets" <li class="tight-form-item">
style="margin-bottom: 10px;" <div class="dropdown">
ng-class="{'tight-form-disabled': target.hide}" <a class="pointer dropdown-toggle"
ng-controller="CloudWatchQueryCtrl" data-toggle="dropdown"
ng-init="init()"> tabindex="1">
<i class="fa fa-bars"></i>
<div class="tight-form"> </a>
<ul class="tight-form-list pull-right"> <ul class="dropdown-menu pull-right" role="menu">
<li class="tight-form-item"> <li role="menuitem">
<div class="dropdown"> <a tabindex="1"
<a class="pointer dropdown-toggle" ng-click="duplicate()">
data-toggle="dropdown" Duplicate
tabindex="1"> </a>
<i class="fa fa-bars"></i> </li>
</a> <li role="menuitem">
<ul class="dropdown-menu pull-right" role="menu"> <a tabindex="1"
<li role="menuitem"> ng-click="moveMetricQuery($index, $index-1)">
<a tabindex="1" Move up
ng-click="duplicate()"> </a>
Duplicate </li>
</a> <li role="menuitem">
</li> <a tabindex="1"
<li role="menuitem"> ng-click="moveMetricQuery($index, $index+1)">
<a tabindex="1" Move down
ng-click="moveMetricQuery($index, $index-1)"> </a>
Move up </li>
</a> </ul>
</li> </div>
<li role="menuitem"> </li>
<a tabindex="1" <li class="tight-form-item last">
ng-click="moveMetricQuery($index, $index+1)"> <a class="pointer" tabindex="1" ng-click="removeDataQuery(target)">
Move down <i class="fa fa-remove"></i>
</a> </a>
</li> </li>
</ul> </ul>
</div>
</li> <ul class="tight-form-list">
<li class="tight-form-item last"> <li>
<a class="pointer" tabindex="1" ng-click="removeDataQuery(target)"> <a class="tight-form-item"
<i class="fa fa-remove"></i> ng-click="target.hide = !target.hide; get_data();"
</a> role="menuitem">
</li> <i class="fa fa-eye"></i>
</ul> </a>
</li>
<ul class="tight-form-list"> </ul>
<li>
<a class="tight-form-item" <ul class="tight-form-list" role="menu">
ng-click="target.hide = !target.hide; get_data();" <li class="tight-form-item" style="width: 100px">
role="menuitem"> Namespace
<i class="fa fa-eye"></i> </li>
</a> <li>
</li> <input type="text"
</ul> class="input-medium tight-form-input"
ng-model="target.namespace"
<ul class="tight-form-list" role="menu"> spellcheck='false'
<li class="tight-form-item" style="width: 100px"> bs-typeahead="suggestNamespace"
Namespace placeholder="namespace"
</li> data-min-length=0 data-items=100
<li> ng-model-onblur
<input type="text" ng-change="refreshMetricData()"
class="input-medium tight-form-input" >
ng-model="target.namespace" </li>
spellcheck='false' <li class="tight-form-item">
bs-typeahead="suggestNamespace" Metric
placeholder="namespace" </li>
data-min-length=0 data-items=100 <li>
ng-model-onblur <input type="text"
ng-change="refreshMetricData()" class="input-medium tight-form-input"
> ng-model="target.metricName"
</li> spellcheck='false'
<li class="tight-form-item"> bs-typeahead="suggestMetrics"
Metric placeholder="metric name"
</li> data-min-length=0 data-items=100
<li> ng-model-onblur
<input type="text" ng-change="refreshMetricData()"
class="input-medium tight-form-input" >
ng-model="target.metricName" </li>
spellcheck='false' </ul>
bs-typeahead="suggestMetrics"
placeholder="metric name" <div class="clearfix"></div>
data-min-length=0 data-items=100
ng-model-onblur
ng-change="refreshMetricData()"
>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item" style="width: 100px">
Dimensions
</li>
<li ng-repeat="(key, value) in target.escapedDimensions track by $index" class="tight-form-item">
{{key}}&nbsp;=&nbsp;{{value}}
<a ng-click="removeDimension(key)">
<i class="fa fa-remove"></i>
</a>
</li>
<li class="tight-form-item" ng-hide="addDimensionMode">
<a ng-click="addDimension()">
<i class="fa fa-plus"></i>
</a>
</li>
<li ng-show="addDimensionMode">
<input type="text"
class="input-small tight-form-input"
spellcheck='false'
bs-typeahead="suggestDimensionKeys"
data-min-length=0 data-items=100
ng-model="target.currentDimensionKey"
placeholder="key">
<input type="text"
class="input-small tight-form-input"
spellcheck='false'
bs-typeahead="suggestDimensionValues"
data-min-length=0 data-items=100
ng-model="target.currentDimensionValue"
placeholder="value">
<a ng-click="addDimension()">
add dimension
</a>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item" style="width: 100px">
Statistics
</li>
<li class="tight-form-item">
<editor-checkbox text="Min" model="target.statistics.Minimum" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item">
<editor-checkbox text="Max" model="target.statistics.Maximum" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item">
<editor-checkbox text="Avg" model="target.statistics.Average" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item">
<editor-checkbox text="Sum" model="target.statistics.Sum" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item last">
<editor-checkbox text="SampleCount" model="target.statistics.SampleCount" change="statisticsOptionChanged()"></editor-checkbox>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item" style="width: 100px">
Period
</li>
<li>
<input type="text"
class="input-mini tight-form-input"
ng-model="target.period"
data-placement="right"
spellcheck='false'
placeholder="period"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="refreshMetricData()"
/>
<a bs-tooltip="target.errors.period"
style="color: rgb(229, 189, 28)"
ng-show="target.errors.period">
<i class="fa fa-warning"></i>
</a>
</li>
<li class="tight-form-item">
Region
</li>
<li>
<input type="text"
class="input-medium tight-form-input"
ng-model="target.region"
spellcheck='false'
bs-typeahead="suggestRegion"
placeholder="region"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="refreshMetricData()"
>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item">
Legend Format
</li>
<li>
<input type="text"
class="input-xxlarge tight-form-input"
ng-model="target.legendFormat"
spellcheck='false'
placeholder="legend format"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="refreshMetricData()"
>
<tip>Syntax: {{Region}} {{Namespace}} {{MetricName}} {{Statistics}} {{Dimensions[N].Name}} {{Dimensions[N].Value}}</tip>
</li>
</ul>
<div class="clearfix"></div>
</div>
</div>
</div> </div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item" style="width: 100px">
Dimensions
</li>
<li ng-repeat="(key, value) in target.escapedDimensions track by $index" class="tight-form-item">
{{key}}&nbsp;=&nbsp;{{value}}
<a ng-click="removeDimension(key)">
<i class="fa fa-remove"></i>
</a>
</li>
<li class="tight-form-item" ng-hide="addDimensionMode">
<a ng-click="addDimension()">
<i class="fa fa-plus"></i>
</a>
</li>
<li ng-show="addDimensionMode">
<input type="text"
class="input-small tight-form-input"
spellcheck='false'
bs-typeahead="suggestDimensionKeys"
data-min-length=0 data-items=100
ng-model="target.currentDimensionKey"
placeholder="key">
<input type="text"
class="input-small tight-form-input"
spellcheck='false'
bs-typeahead="suggestDimensionValues"
data-min-length=0 data-items=100
ng-model="target.currentDimensionValue"
placeholder="value">
<a ng-click="addDimension()">
add dimension
</a>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item" style="width: 100px">
Statistics
</li>
<li class="tight-form-item">
<editor-checkbox text="Min" model="target.statistics.Minimum" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item">
<editor-checkbox text="Max" model="target.statistics.Maximum" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item">
<editor-checkbox text="Avg" model="target.statistics.Average" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item">
<editor-checkbox text="Sum" model="target.statistics.Sum" change="statisticsOptionChanged()"></editor-checkbox>
</li>
<li class="tight-form-item last">
<editor-checkbox text="SampleCount" model="target.statistics.SampleCount" change="statisticsOptionChanged()"></editor-checkbox>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item" style="width: 100px">
Period
</li>
<li>
<input type="text"
class="input-mini tight-form-input"
ng-model="target.period"
data-placement="right"
spellcheck='false'
placeholder="period"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="refreshMetricData()"
/>
<a bs-tooltip="target.errors.period"
style="color: rgb(229, 189, 28)"
ng-show="target.errors.period">
<i class="fa fa-warning"></i>
</a>
</li>
<li class="tight-form-item">
Region
</li>
<li>
<input type="text"
class="input-medium tight-form-input"
ng-model="target.region"
spellcheck='false'
bs-typeahead="suggestRegion"
placeholder="region"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="refreshMetricData()"
>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item">
Legend Format
</li>
<li>
<input type="text"
class="input-xxlarge tight-form-input"
ng-model="target.legendFormat"
spellcheck='false'
placeholder="legend format"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="refreshMetricData()"
>
<tip>Syntax: {{Region}} {{Namespace}} {{MetricName}} {{Statistics}} {{Dimensions[N].Name}} {{Dimensions[N].Value}}</tip>
</li>
</ul>
<div class="clearfix"></div>
</div>
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