View Full Version : How to add listener to adobe native window

18 Feb 2011, 4:12 PM
I recently added Ext.air.Notify functionality to my application and it works great. The one thing that I feel that notifications are missing is a "close" button to hide the notification window immediately. I updated my xtpl template to include a tiny close button and it looks great, but I am having some issues getting an event listener attached to my close button.

Here is the code I use to create the notification window

// Display the notification
var notifyWindow = new Ext.air.Notify({
msg: o.msg || 'enter your message text here',
subject : o.subject || 'enter your subject text here',
tstamp : this.getDateString(new Date()),
hideDelay: o.hideDelay || 10000,
width: o.width || 400,
height: o.height || 85,
extAllCSS: 'app:/lib/ext/resources/css/ext-all.css',
icon : url + '/tbe/Ext/3x/resources/images/default/tbe64.png',
tbeCSS : url + '/tbe/tbe.css',
themeCSS: Ext.state.Manager.get('theme')

Here is the code for the template which includes the "closeButton" div

xtpl: new Ext.XTemplate(
'<link rel="stylesheet" href="{extAllCSS}" />',
'<link rel="stylesheet" href="{tbeCSS}" />',
'<link rel="stylesheet" href="{themeCSS}" />',
'<div id="notifyWindow">',
'<div class="x-box-blue">',
'<div class="{boxCls}-tl"><div class="{boxCls}-tr"><div class="{boxCls}-tc"></div></div></div>',
'<div class="{boxCls}-ml"><div class="{boxCls}-mr"><div class="{boxCls}-mc">',
'<div id="{msgId}">',
'<div style="float: left; margin-right: 5px; width: 64px;"><img src="{icon}"></div>',
'<div id="closeButton"></div>',
'<span class="msg">',
'<span class="tstamp">{tstamp}</span>',
'<div style="clear:both;"></div>',
'<div class="{boxCls}-bl"><div class="{boxCls}-br"><div class="{boxCls}-bc"></div></div></div>',

I want to be able to attach a click listener to the closeButton div but I am having some issues getting at the element I want to attach the click listener to.

Any help would be greatly appreciated.