PDA

View Full Version : Ajax timmer mornitoring component



A&D
4 Dec 2010, 1:55 AM
Hi guys,
I'm newbie in Extjs. I'm learning it and I've just done an ajax monitoring component. I post it here, so everybody help me improve it.

Source code:

Ext.ux.monitor = Ext.extend(Ext.util.Observable, {
count: 0,
timmer: 1,
constructor: function(config){
//Component name
this.name = config.name;
//Component Id
this.id = config. id;
//Monitoring url
this.url = config.url;
//Monitoring interval
this.interval = (config.interval > 1000) ? config.interval : 1000; //Default 5seconds
//Request params
this.requestParams = config.requestParams;


this.addEvents({
"beforeRequest" : true,
"afterRequest": true,
"start" : true
});
this.listeners = config.listeners;
Ext.ux.monitor.superclass.constructor.call(this, config);

//Start the monitor immediate after instance object
if(config.start == true || config.start == 'true'){
this.start();
}

},

//Started sate
started: false,
stopped: true,

//start the monitor
start: function(){
if(this.started == false || this.started == 'false'){
//First time start
this.started = true;
this.stopped = false;
this.fireEvent('start');
}
this.process();
},

stop: function(){
if(this.started == true || this.started == 'true'){
//TODO Stop the timmer
this.timmer = -1;
//Set the start & stop state
this.stopped = true;
this.started = false;
}
},

//Request url
request: function(){
this.count += 1;
result = null;
this.fireEvent('beforeRequest');
Ext.Ajax.request({
url: this.url,
params: this.requestParams,

success: function(response, opts){
result = Ext.decode(response.responseText);
this.result = result;
},

failure: function(response, opts){
//TODO something here
}
});
this.fireEvent('afterRequest', this.result);
return result;
},

//Process here
process: function(){
//Set interval request
_self = this;

run = function(){
console.log(_self.timmer);
if(_self.timmer > 0)
{
_self.request();
setTimeout("run()", _self.interval);
}
}
run();
}

});

Usage:


mornitor = new Ext.ux.monitor({
name: 'test',
id: 'test-monitor',
url: 'your url here',
start: true, //If set this to false, you have to call object.start() to start monitor
interval: 3000,
listeners: {
'beforeRequest': {
fn: function () {
console.log('before request');
}
},
'afterRequest': {
fn: function() {
//Do something with this.result from ajax request

// Or you can stop mornitor if you don't need it any more :D this.stop();
}
}
}
});

Thanks for viewing.

sanjshah
4 Dec 2010, 1:25 PM
Thanks, I was just playing around with this but tried adding some



baseParams: { action: 'dosomething' },


but it seems that this is not sent

A&D
5 Dec 2010, 2:55 AM
Try
requestParams: {foo: 'bar'}
or you can change this
this.requestParams = config.requestParams;
to this
this.baseParams = config.baseParams;
and this
params: this.requestParams,
to this
params: this.baseParams, in the source code
Thanks for reviewing :">

sanjshah
5 Dec 2010, 2:21 PM
Thanks yes requestParams works great!