Sep 21, 2011 3:49 PM
Adding Custom Properties to Device Overview
-
Like (0)
I am attempting to add a circuit id field to my Zenoss 3.2 installation. I was able to create a Custom Property by selecting Infrastructure -> Devices, highlighting Device Classes (the root of the tree), Details, Custom Schema and then adding a string type of cCircuitID. I then populated this field through the Custom Properties option on the left side of the device detail screen for each of my devices.
My first goal is to display the cCircuitID in a more visible place on the main device overview page above the Rack Slot field. I spent hours looking through the forums, developer docs and zport/manage/zenmodel pages trying to find out where to customize the device overview page. From another discussion, Overriding a page template in Zenoss 3.x, it appears that interface design has been mostly removed from Zope and into JS pages. specifically to the Products/ZenUI3/browser/resources/js/zenoss/DeviceOverviewPanel.js file.
My questions are:
This is the code for Rack Slot
items: [{
fieldLabel: _t('Rack then Slot'),
name: 'rackSlot',
xtype: 'textfield'
},{
xtype: 'clicktoeditnolink',
listeners: {
labelclick: function(p){
editCollector(this.getValues(), this.contextUid);
},
scope: this
Thank you very much in advance for any guidance on this topic.
Apologies for resurrecting an old thread - but did you find a solution to this?
Thanks,
I never did, sorry. We have since moved on to a different product.
Hello,
I may have a solution. I give you the code to change (i.e. removinf 2 field and adding a new one with my own values) the first (from left) panel, where uptime is.
Depending from your Zenoss version, you have to restart the some daemons to see the UI changes.
If you need to change other panels, you must find the ID and declare it, as I did for DEVICE_OVERVIEW_ID = ....
I hope this will help.
Steps:
- Add a file in the js directory (in my example: browser/resources/js/devicedetails.js). The code is below.
- use it in browser/configure.zcml adding the following code:
<viewlet
name="js-mydet"
paths="/++resource++<your resourceDirectory name>/js/devicedetails.js"
weight="9"
for="..MyDevice.MyDevice"
manager="Products.ZenUI3.browser.interfaces.IJavaScriptSrcManager"
class="Products.ZenUI3.browser.javascript.JavaScriptSrcBundleViewlet"
permission="zope2.Public"
/>
==== js file ====
Ext.onReady(function() {
DEVICE_OVERVIEW_ID = 'deviceoverviewpanel_summary';
// first from left panel part: overview: my changes
var modifyDeviceOverview = function(overview) {
overview = Ext.getCmp(DEVICE_OVERVIEW_ID);
overview.removeField('locking');
overview.removeField('memory');
overview.addField({
name:'mytotalMemory',
fieldLabel: _t('TotalMemory'),
setRawValue: function(mytotalMemory) {
var v = 'None';
if (mytotalMemory) {
v = Zenoss.render.memory(mytotalMemory)
}
Zenoss.DisplayField.superclass.setRawValue.call(this, v);
}
});
};
Ext.ComponentMgr.onAvailable(DEVICE_OVERVIEW_ID, modifyDeviceOverview)
});
Follow Us On Twitter »
|
Latest from the Zenoss Blog » | Community | Products | Services Resources | Customers Partners | About Us | ||
Copyright © 2005-2011 Zenoss, Inc.
|
||||||||