Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
N
nexpie-grafana-theme
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Registry
Registry
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Kornkitt Poolsup
nexpie-grafana-theme
Commits
8b83f057
Commit
8b83f057
authored
Dec 15, 2013
by
Torkel Odegaard
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
added yaxis label
parent
b5e05ab7
Show whitespace changes
Inline
Side-by-side
Showing
8 changed files
with
156 additions
and
47 deletions
+156
-47
src/app/controllers/search.js
+1
-1
src/app/panels/graphite/axisEditor.html
+15
-0
src/app/panels/graphite/editor.html
+3
-4
src/app/panels/graphite/module.html
+2
-6
src/app/panels/graphite/module.js
+35
-5
src/app/services/keyboardManager.js
+76
-31
src/css/bootstrap.dark.min.css
+0
-0
src/vendor/bootstrap/less/grafana.less
+24
-0
No files found.
src/app/controllers/search.js
View file @
8b83f057
...
@@ -16,7 +16,7 @@ function (angular, _, config, $) {
...
@@ -16,7 +16,7 @@ function (angular, _, config, $) {
$scope
.
giveSearchFocus
=
0
;
$scope
.
giveSearchFocus
=
0
;
$scope
.
selectedIndex
=
null
;
$scope
.
selectedIndex
=
null
;
keyboardManager
.
bind
(
's'
,
function
()
{
keyboardManager
.
bind
(
's
hift+s
'
,
function
()
{
$element
.
find
(
'.dropdown'
).
addClass
(
'open'
);
$element
.
find
(
'.dropdown'
).
addClass
(
'open'
);
$scope
.
giveSearchFocus
+=
1
;
$scope
.
giveSearchFocus
+=
1
;
});
});
...
...
src/app/panels/graphite/axisEditor.html
0 → 100644
View file @
8b83f057
<div
class=
"editor-row"
>
<div
class=
"editor-row"
>
<div
class=
"editor-option"
>
<label
class=
"small"
>
Left y-axis label
</label>
<input
ng-change=
"get_data()"
ng-model-onblur
placeholder=
""
type=
"text"
class=
"input-large"
ng-model=
"panel.leftYAxisLabel"
>
</div>
<div
class=
"editor-option"
>
<label
class=
"small"
>
Right y-axis label
</label>
<input
ng-change=
"get_data()"
ng-model-onblur
placeholder=
""
type=
"text"
class=
"input-large"
ng-model=
"panel.rightYAxisLabel"
>
</div>
</div>
</div>
\ No newline at end of file
src/app/panels/graphite/editor.html
View file @
8b83f057
<div
class=
"editor-row"
>
<div
class=
"editor-row"
>
<h5>
Graphite Targets
</h5>
<div
ng-repeat=
"target in panel.targets"
>
<div
ng-repeat=
"target in panel.targets"
>
<div
class=
"row-fluid"
>
<div
class=
"row-fluid"
>
<div
class=
"span12"
>
<div
class=
"span12"
>
<input
type=
"text"
ng-model=
"target.target"
class=
"input-large"
style=
"width:95%"
ng-model-onblur
ng-change=
"get_data()"
/>
<input
type=
"text"
ng-model=
"target.target"
class=
"input-large"
style=
"width:95%"
ng-model-onblur
ng-change=
"get_data()"
bs-typeahead=
"typeAheadSource"
ata-min-length=
0
/>
<i
ng-click=
"panel.targets = _.without(panel.targets, target)"
class=
"pointer icon-remove"
style=
"position: relative; top: -5px; left: 5px;"
></i>
<i
ng-click=
"panel.targets = _.without(panel.targets, target)"
class=
"pointer icon-remove"
style=
"position: relative; top: -5px; left: 5px;"
></i>
</div>
</div>
</div>
</div>
</div>
</div>
<
button
ng-click=
"add_target(panel.target)"
class=
"btn btn-success"
ng-show=
"editor.index == 1"
>
Add target
</button
>
<
a
ng-click=
"add_target(panel.target)"
ng-show=
"editor.index == 1"
>
Add target
</a
>
</div>
</div>
\ No newline at end of file
src/app/panels/graphite/module.html
View file @
8b83f057
...
@@ -100,7 +100,8 @@
...
@@ -100,7 +100,8 @@
</form>
</form>
<center><img
ng-show=
'panel.loading && _.isUndefined(data)'
src=
"img/load_big.gif"
></center>
<center><img
ng-show=
'panel.loading && _.isUndefined(data)'
src=
"img/load_big.gif"
></center>
<div
histogram-chart
class=
"pointer histogram-chart"
params=
"{{panel}}"
></div>
<div
histogram-chart
class=
"pointer histogram-chart"
params=
"{{panel}}"
>
</div>
<span
ng-show=
"panel.legend"
ng-repeat=
'series in legend'
class=
"histogram-legend"
>
<span
ng-show=
"panel.legend"
ng-repeat=
'series in legend'
class=
"histogram-legend"
>
<i
class=
'icon-circle'
ng-style=
"{color: series.color}"
></i>
<i
class=
'icon-circle'
ng-style=
"{color: series.color}"
></i>
...
@@ -118,11 +119,6 @@
...
@@ -118,11 +119,6 @@
<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-show=
"editorTabs[editor.index] == 'Panel'"
>
<div
ng-include
src=
"edit_path(panel.type)"
></div>
</div>
<div
ng-repeat=
"tab in panelMeta.editorTabs"
ng-show=
"editorTabs[editor.index] == tab.title"
>
<div
ng-repeat=
"tab in panelMeta.editorTabs"
ng-show=
"editorTabs[editor.index] == tab.title"
>
<div
ng-include
src=
"tab.src"
></div>
<div
ng-include
src=
"tab.src"
></div>
</div>
</div>
...
...
src/app/panels/graphite/module.js
View file @
8b83f057
...
@@ -48,14 +48,20 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
...
@@ -48,14 +48,20 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
],
],
editorTabs
:
[
editorTabs
:
[
{
{
title
:
'Targets'
,
src
:
'app/panels/graphite/editor.html'
},
{
title
:
'Axis labels'
,
src
:
'app/panels/graphite/axisEditor.html'
},
{
title
:
'Style'
,
title
:
'Style'
,
src
:
'app/panels/graphite/styleEditor.html'
src
:
'app/panels/graphite/styleEditor.html'
}
}
],
],
status
:
"Stable"
,
status
:
"Work in progress"
,
description
:
"A bucketed time series chart of the current query or queries. Uses the "
+
description
:
" Graphite graphing panel"
"Elasticsearch date_histogram facet. If using time stamped indices this panel will query"
+
" them sequentially to attempt to apply the lighest possible load to your Elasticsearch cluster"
};
};
// Set and populate defaults
// Set and populate defaults
...
@@ -223,6 +229,10 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
...
@@ -223,6 +229,10 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
}
}
};
};
$scope
.
typeAheadSource
=
function
(
str
)
{
return
[
"test"
,
"asd"
,
"testing2"
+
str
];
};
$scope
.
remove_panel_from_row
=
function
(
row
,
panel
)
{
$scope
.
remove_panel_from_row
=
function
(
row
,
panel
)
{
if
(
$scope
.
inEditMode
)
{
if
(
$scope
.
inEditMode
)
{
$rootScope
.
$emit
(
'fullEditMode'
,
false
);
$rootScope
.
$emit
(
'fullEditMode'
,
false
);
...
@@ -409,12 +419,21 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
...
@@ -409,12 +419,21 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
$scope
.
$emit
(
'render'
);
$scope
.
$emit
(
'render'
);
};
};
$scope
.
setEditorTabs
=
function
(
panelMeta
)
{
$scope
.
editorTabs
=
[
'General'
];
if
(
!
_
.
isUndefined
(
panelMeta
.
editorTabs
))
{
$scope
.
editorTabs
=
_
.
union
(
$scope
.
editorTabs
,
_
.
pluck
(
panelMeta
.
editorTabs
,
'title'
));
}
return
$scope
.
editorTabs
;
};
});
});
module
.
directive
(
'histogramChart'
,
function
(
dashboard
,
filterSrv
)
{
module
.
directive
(
'histogramChart'
,
function
(
dashboard
,
filterSrv
)
{
return
{
return
{
restrict
:
'A'
,
restrict
:
'A'
,
template
:
'<div></div>'
,
template
:
'<div>
</div>'
,
link
:
function
(
scope
,
elem
)
{
link
:
function
(
scope
,
elem
)
{
var
data
,
plot
;
var
data
,
plot
;
...
@@ -560,6 +579,17 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
...
@@ -560,6 +579,17 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv, RQ) {
plot
=
$
.
plot
(
elem
,
data
,
options
);
plot
=
$
.
plot
(
elem
,
data
,
options
);
if
(
scope
.
panel
.
leftYAxisLabel
)
{
elem
.
css
(
'margin-left'
,
'10px'
);
var
yaxisLabel
=
$
(
"<div class='axisLabel yaxisLabel'></div>"
)
.
text
(
scope
.
panel
.
leftYAxisLabel
)
.
appendTo
(
elem
);
yaxisLabel
.
css
(
"margin-top"
,
yaxisLabel
.
width
()
/
2
-
20
);
}
else
if
(
elem
.
css
(
'margin-left'
))
{
elem
.
css
(
'margin-left'
,
''
);
}
}
catch
(
e
)
{
}
catch
(
e
)
{
console
.
log
(
e
);
console
.
log
(
e
);
// Nothing to do here
// Nothing to do here
...
...
src/app/services/keyboardManager.js
View file @
8b83f057
define
([
define
([
'angular'
,
'angular'
'underscore'
,
'jquery'
],
],
function
(
angular
,
_
,
$
)
{
function
(
angular
)
{
'use strict'
;
'use strict'
;
var
module
=
angular
.
module
(
'kibana.services'
);
var
module
=
angular
.
module
(
'kibana.services'
);
...
@@ -21,7 +19,7 @@ function (angular, _, $) {
...
@@ -21,7 +19,7 @@ function (angular, _, $) {
'keyCode'
:
false
'keyCode'
:
false
};
};
// Store all keyboard combination shortcuts
// Store all keyboard combination shortcuts
keyboardManagerService
.
keyboardEvent
=
{}
keyboardManagerService
.
keyboardEvent
=
{}
;
// Add a new keyboard combination shortcut
// Add a new keyboard combination shortcut
keyboardManagerService
.
bind
=
function
(
label
,
callback
,
opt
)
{
keyboardManagerService
.
bind
=
function
(
label
,
callback
,
opt
)
{
var
fct
,
elt
,
code
,
k
;
var
fct
,
elt
,
code
,
k
;
...
@@ -29,7 +27,10 @@ function (angular, _, $) {
...
@@ -29,7 +27,10 @@ function (angular, _, $) {
opt
=
angular
.
extend
({},
defaultOpt
,
opt
);
opt
=
angular
.
extend
({},
defaultOpt
,
opt
);
label
=
label
.
toLowerCase
();
label
=
label
.
toLowerCase
();
elt
=
opt
.
target
;
elt
=
opt
.
target
;
if
(
typeof
opt
.
target
==
'string'
)
elt
=
document
.
getElementById
(
opt
.
target
);
if
(
typeof
opt
.
target
===
'string'
)
{
elt
=
document
.
getElementById
(
opt
.
target
);
}
fct
=
function
(
e
)
{
fct
=
function
(
e
)
{
e
=
e
||
$window
.
event
;
e
=
e
||
$window
.
event
;
...
@@ -37,19 +38,37 @@ function (angular, _, $) {
...
@@ -37,19 +38,37 @@ function (angular, _, $) {
// Disable event handler when focus input and textarea
// Disable event handler when focus input and textarea
if
(
opt
[
'inputDisabled'
])
{
if
(
opt
[
'inputDisabled'
])
{
var
elt
;
var
elt
;
if
(
e
.
target
)
elt
=
e
.
target
;
if
(
e
.
target
)
{
else
if
(
e
.
srcElement
)
elt
=
e
.
srcElement
;
elt
=
e
.
target
;
if
(
elt
.
nodeType
==
3
)
elt
=
elt
.
parentNode
;
}
if
(
elt
.
tagName
==
'INPUT'
||
elt
.
tagName
==
'TEXTAREA'
)
return
;
else
if
(
e
.
srcElement
)
{
elt
=
e
.
srcElement
;
}
if
(
elt
.
nodeType
===
3
)
{
elt
=
elt
.
parentNode
;
}
if
(
elt
.
tagName
===
'INPUT'
||
elt
.
tagName
===
'TEXTAREA'
)
{
return
;
}
}
}
// Find out which key is pressed
// Find out which key is pressed
if
(
e
.
keyCode
)
code
=
e
.
keyCode
;
if
(
e
.
keyCode
)
{
else
if
(
e
.
which
)
code
=
e
.
which
;
code
=
e
.
keyCode
;
}
else
if
(
e
.
which
)
{
code
=
e
.
which
;
}
var
character
=
String
.
fromCharCode
(
code
).
toLowerCase
();
var
character
=
String
.
fromCharCode
(
code
).
toLowerCase
();
if
(
code
==
188
)
character
=
","
;
// If the user presses , when the type is onkeydown
if
(
code
===
188
)
{
if
(
code
==
190
)
character
=
"."
;
// If the user presses , when the type is onkeydown
character
=
","
;
// If the user presses , when the type is onkeydown
}
if
(
code
===
190
)
{
character
=
"."
;
// If the user presses , when the type is onkeydown
}
var
keys
=
label
.
split
(
"+"
);
var
keys
=
label
.
split
(
"+"
);
// Key Pressed - counts the number of valid keypresses - if it is same as the number of keys, the shortcut function is invoked
// Key Pressed - counts the number of valid keypresses - if it is same as the number of keys, the shortcut function is invoked
...
@@ -166,25 +185,33 @@ function (angular, _, $) {
...
@@ -166,25 +185,33 @@ function (angular, _, $) {
}
}
if (k.length > 1) { // If it is a special key
if (k.length > 1) { // If it is a special key
if(special_keys[k] == code) kp++;
if(special_keys[k] === code) {
kp++;
}
} else if (opt['keyCode']) { // If a specific key is set into the config
} else if (opt['keyCode']) { // If a specific key is set into the config
if (opt['keyCode'] == code) kp++;
if (opt['keyCode'] === code) {
kp++;
}
} else { // The special keys did not match
} else { // The special keys did not match
if(character == k) kp++;
if(character === k) {
kp++;
}
else {
else {
if(shift_nums[character] && e.shiftKey) { // Stupid Shift key bug created by using lowercase
if(shift_nums[character] && e.shiftKey) { // Stupid Shift key bug created by using lowercase
character = shift_nums[character];
character = shift_nums[character];
if(character == k) kp++;
if(character === k) {
kp++;
}
}
}
}
}
}
}
}
}
if(kp == keys.length &&
if(kp ==
=
keys.length &&
modifiers.ctrl.pressed == modifiers.ctrl.wanted &&
modifiers.ctrl.pressed ==
=
modifiers.ctrl.wanted &&
modifiers.shift.pressed == modifiers.shift.wanted &&
modifiers.shift.pressed ==
=
modifiers.shift.wanted &&
modifiers.alt.pressed == modifiers.alt.wanted &&
modifiers.alt.pressed ==
=
modifiers.alt.wanted &&
modifiers.meta.pressed == modifiers.meta.wanted) {
modifiers.meta.pressed ==
=
modifiers.meta.wanted) {
$timeout(function() {
$timeout(function() {
callback(e);
callback(e);
}, 1);
}, 1);
...
@@ -211,22 +238,40 @@ function (angular, _, $) {
...
@@ -211,22 +238,40 @@ function (angular, _, $) {
'event': opt['type']
'event': opt['type']
};
};
//Attach the function with the event
//Attach the function with the event
if(elt.addEventListener) elt.addEventListener(opt['type'], fct, false);
if(elt.addEventListener) {
else if(elt.attachEvent) elt.attachEvent('on' + opt['type'], fct);
elt.addEventListener(opt['type'], fct, false);
else elt['on' + opt['type']] = fct;
}
else if(elt.attachEvent) {
elt.attachEvent('on' + opt['type'], fct);
}
else {
elt['on' + opt['type']] = fct;
}
};
};
// Remove the shortcut - just specify the shortcut and I will remove the binding
// Remove the shortcut - just specify the shortcut and I will remove the binding
keyboardManagerService.unbind = function (label) {
keyboardManagerService.unbind = function (label) {
label = label.toLowerCase();
label = label.toLowerCase();
var binding = keyboardManagerService.keyboardEvent[label];
var binding = keyboardManagerService.keyboardEvent[label];
delete(keyboardManagerService.keyboardEvent[label])
delete(keyboardManagerService.keyboardEvent[label]);
if(!binding) return;
if(!binding) {
return;
}
var type = binding['event'],
var type = binding['event'],
elt = binding['target'],
elt = binding['target'],
callback = binding['callback'];
callback = binding['callback'];
if(elt.detachEvent) elt.detachEvent('on' + type, callback);
else if(elt.removeEventListener) elt.removeEventListener(type, callback, false);
if(elt.detachEvent) {
else elt['on'+type] = false;
elt.detachEvent('on' + type, callback);
}
else if(elt.removeEventListener) {
elt.removeEventListener(type, callback, false);
}
else {
elt['on'+type] = false;
}
};
};
//
//
return keyboardManagerService;
return keyboardManagerService;
...
...
src/css/bootstrap.dark.min.css
View file @
8b83f057
This source diff could not be displayed because it is too large. You can
view the blob
instead.
src/vendor/bootstrap/less/grafana.less
View file @
8b83f057
...
@@ -41,3 +41,26 @@
...
@@ -41,3 +41,26 @@
color: @blue;
color: @blue;
}
}
}
}
.yaxisLabel {
top: 50%;
left: -20px;
transform: rotate(-90deg);
-o-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform-origin: 0 0;
-o-transform-origin: 0 0;
-ms-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
}
.axisLabel {
color: @textColor;
font-size: @fontSizeSmall;
position: absolute;
text-align: center;
font-size: 12px;
}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment