[icinga-checkins] icinga.org: icinga-web/master: * Added image include methods
git at icinga.org
git at icinga.org
Wed Sep 1 16:22:05 CEST 2010
Module: icinga-web
Branch: master
Commit: 50ddfb77ac7e2620e60ccf4fa373190fbe14080d
URL: https://git.icinga.org/?p=icinga-web.git;a=commit;h=50ddfb77ac7e2620e60ccf4fa373190fbe14080d
Author: Marius Hein <marius.hein at netways.de>
Date: Wed Sep 1 16:21:45 2010 +0200
* Added image include methods
* Some more images to include
---
.../Cronks/data/xml/grid/icinga-host-template.xml | 63 +++++++++++++
app/modules/Cronks/lib/js/grid/ColumnRenderer.js | 6 ++
.../System/ViewProc/js/IcingaColumnRenderer.js | 92 +++++++++++++++-----
pub/images/icons/chart_bar.png | Bin 0 -> 541 bytes
pub/images/icons/image.png | Bin 0 -> 516 bytes
5 files changed, 138 insertions(+), 23 deletions(-)
diff --git a/app/modules/Cronks/data/xml/grid/icinga-host-template.xml b/app/modules/Cronks/data/xml/grid/icinga-host-template.xml
index cb5b61d..8fb783f 100644
--- a/app/modules/Cronks/data/xml/grid/icinga-host-template.xml
+++ b/app/modules/Cronks/data/xml/grid/icinga-host-template.xml
@@ -475,6 +475,69 @@
</order>
</field>
END EXAMPLE -->
+
+ <!-- Example to include images on the fly
+ <field name="image_hover">
+ <datasource>
+ <parameter name="field">HOST_NAME</parameter>
+ </datasource>
+
+ <display>
+ <parameter name="visible">true</parameter>
+ <parameter name="label"></parameter>
+
+ <parameter name="width">22</parameter>
+
+
+ <parameter name="Ext.grid.Column">
+ <parameter name="menuDisabled">true</parameter>
+ <parameter name="fixed">true</parameter>
+ </parameter>
+
+ <parameter name="jsFunc">
+ <parameter>
+ <parameter name="namespace">Cronk.grid.ColumnRenderer</parameter>
+ <parameter name="function">columnImage</parameter>
+
+ renderer/gridevent[cellclick|celldblclick|...]
+ <parameter name="type">renderer</parameter>
+
+ <parameter name="arguments">
+ <parameter name="image">images/icons/image.png</parameter>
+ <parameter name="css">x-icinga-grid-link</parameter>
+ <parameter name="attr">
+ <parameter name="qtip">Go to Event DB</parameter>
+ </parameter>
+ </parameter>
+ </parameter>
+
+ <parameter>
+ <parameter name="namespace">Cronk.grid.IcingaColumnRenderer</parameter>
+ <parameter name="function">imagePopup</parameter>
+
+ renderer/gridevent[cellclick|celldblclick|...]
+ <parameter name="type">cellclick</parameter>
+
+ <parameter name="arguments">
+ <parameter name="title">Image for {host_name}</parameter>
+ <parameter name="url"><![CDATA[http://localhost/pnp4nagios/image?host={host_name}&srv=_HOST_&view=0]]></parameter>
+ <parameter name="width">200</parameter>
+ <parameter name="height">200</parameter>
+ </parameter>
+ </parameter>
+ </parameter>
+ </display>
+
+ <filter>
+ <parameter name="enabled">false</parameter>
+ </filter>
+
+ <order>
+ <parameter name="enabled">false</parameter>
+ </order>
+ </field>
+ END EXAMPLE -->
+
<field name="host_info">
<datasource>
<parameter name="field">HOST_NAME</parameter>
diff --git a/app/modules/Cronks/lib/js/grid/ColumnRenderer.js b/app/modules/Cronks/lib/js/grid/ColumnRenderer.js
index 53ee637..7342532 100755
--- a/app/modules/Cronks/lib/js/grid/ColumnRenderer.js
+++ b/app/modules/Cronks/lib/js/grid/ColumnRenderer.js
@@ -13,6 +13,12 @@ Cronk.grid.ColumnRendererUtil = function() {
Ext.applyIf(meta, o);
return meta;
+ },
+
+ applyXTemplate : function(grid, index, string) {
+ var data = grid.getStore().getAt(index).data;
+ var tpl = new Ext.XTemplate(string);
+ return tpl.apply(data);
}
}
diff --git a/app/modules/Cronks/templates/System/ViewProc/js/IcingaColumnRenderer.js b/app/modules/Cronks/templates/System/ViewProc/js/IcingaColumnRenderer.js
index a4dcf10..aae4a5b 100755
--- a/app/modules/Cronks/templates/System/ViewProc/js/IcingaColumnRenderer.js
+++ b/app/modules/Cronks/templates/System/ViewProc/js/IcingaColumnRenderer.js
@@ -75,12 +75,12 @@ Cronk.grid.IcingaColumnRenderer = {
return function(grid, rowIndex, colIndex, e) {
+ var url = Cronk.grid.ColumnRendererUtil.applyXTemplate(grid, rowIndex, cfg.url);
+
var fieldName = grid.getColumnModel().getDataIndex(colIndex);
if (fieldName == cfg.field) {
- var data = grid.getStore().getAt(rowIndex).data;
- var tpl = new Ext.XTemplate(cfg.url);
- var url = tpl.apply(data);
+ var url = Cronk.grid.ColumnRendererUtil.applyXTemplate(grid, rowIndex, cfg.url)
var windowName = fieldName;
if (Ext.isEmpty(cfg.newWindow) || cfg.newWindow == false) {
@@ -92,32 +92,78 @@ Cronk.grid.IcingaColumnRenderer = {
}
},
+ imagePopup : function(cfg) {
+ if (!'url' in cfg) {
+ throw('url XTemplate configuration needed! (parameter name="url")');
+ }
+ return function(grid, rowIndex, colIndex, e) {
+ var url = Cronk.grid.ColumnRendererUtil.applyXTemplate(grid, rowIndex, cfg.url);
+ var title = Cronk.grid.ColumnRendererUtil.applyXTemplate(grid, rowIndex, cfg.title);
+
+ var fieldName = grid.getColumnModel().getDataIndex(colIndex);
+ if (fieldName == cfg.field) {
+
+ var dhelper_spec = {
+ tag: 'img',
+ src: url
+ };
+
+ var qtip_spec = {
+ target: e.getTarget(),
+ bodyCfg: dhelper_spec,
+ title: title,
+ anchor: 'left'
+ };
+
+ Ext.iterate(['width', 'height'], function(item, index, allItems) {
+ if (!Ext.isEmpty(cfg[item])) {
+ qtip_spec[item] = cfg[item]
+ }
+ });
+
+ var toolTip = new Ext.ToolTip(qtip_spec);
+
+ toolTip.render(Ext.getBody());
+
+ toolTip.on('hide', function(tt) {
+ tt.destroy();
+ });
+
+ toolTip.show();
+ }
+ }
+ },
+
iFrameCronk: function(cfg) {
if (!'url' in cfg) {
throw('url XTemplate configuration needed! (parameter name="url")');
}
return function(grid, rowIndex, colIndex, e) {
- var data = grid.getStore().getAt(rowIndex).data;
- var urlTpl = new Ext.XTemplate(cfg.url);
- var url = urlTpl.apply(data);
- var titleTpl = new Ext.XTemplate(cfg.title);
- var title = titleTpl.apply(data);
- var tabPanel = Ext.getCmp("cronk-tabs");
- AppKit.log(url);
- var cmp = tabPanel.add({
- 'xtype': 'cronk',
- 'title': title,
- 'crname': 'genericIFrame',
- 'params': {
- url: url
- },
- 'closable':true
- });
- tabPanel.doLayout();
-
- if (!Ext.isEmpty(cfg.activateOnClick) && cfg.activateOnClick) {
- tabPanel.setActiveTab(cmp);
+
+ var url = Cronk.grid.ColumnRendererUtil.applyXTemplate(grid, rowIndex, cfg.url);
+ var title = Cronk.grid.ColumnRendererUtil.applyXTemplate(grid, rowIndex, cfg.title);
+
+ var fieldName = grid.getColumnModel().getDataIndex(colIndex);
+ if (fieldName == cfg.field) {
+
+ var tabPanel = Ext.getCmp("cronk-tabs");
+ AppKit.log(url);
+ var cmp = tabPanel.add({
+ 'xtype': 'cronk',
+ 'title': title,
+ 'crname': 'genericIFrame',
+ 'params': {
+ url: url
+ },
+ 'closable':true
+ });
+ tabPanel.doLayout();
+
+ if (!Ext.isEmpty(cfg.activateOnClick) && cfg.activateOnClick) {
+ tabPanel.setActiveTab(cmp);
+ }
+
}
}
diff --git a/pub/images/icons/chart_bar.png b/pub/images/icons/chart_bar.png
new file mode 100755
index 0000000..9051fbc
Binary files /dev/null and b/pub/images/icons/chart_bar.png differ
diff --git a/pub/images/icons/image.png b/pub/images/icons/image.png
new file mode 100755
index 0000000..fc3c393
Binary files /dev/null and b/pub/images/icons/image.png differ
More information about the icinga-checkins
mailing list