[icinga-checkins] icinga.org: icinga-web/cmaser/fixes: * Added image include methods

git at icinga.org git at icinga.org
Fri Sep 3 12:10:01 CEST 2010


Module: icinga-web
Branch: cmaser/fixes
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