1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
| // vim: ts=4:sw=4:nu:fdc=4:nospell
/*global Ext, AnExtension */
/**
* @class AnExtension
* @extends Ext.Panel
*
* AnExtension description
*
* @author Ing. Jozef Sakáloš
* @copyright (c) 2010, by Ing. Jozef Sakáloš
* @date <ul>
* <li>11. March 2010</li>
* </ul>
* @version 1.0
* @revision $Id$
*
* @license AnExtension.js is released under the
* <a target="_blank" href="http://www.gnu.org/licenses/gpl.html">GNU GPL 3.0</a>
* license. It’s free for use in GPL and GPL compatible open source software,
* but if you want to use the component in a commercial software (closed source),
* you have to get a commercial license.
*/
// create namespace
Ext.ns('AnExtension');
/**
* Creates new AnExtension
* @constructor
* @param {Object} config A config object
*/
AnExtension = Ext.extend(Ext.Panel, {
// default config (it can be changed while instantiating)
border:false
// {{{
// uncomment constructor if you need it, e.g. if you need listeners
// ,constructor:function(config) {
// // parent constructor call pre-processing - configure listeners here
// config = config || {};
// config.listeners = config.listeners || {};
// Ext.applyIf(config.listeners, {
// // add listeners config here
// });
//
// // call parent constructor
// AnExtension.superclass.constructor.call(this, config);
//
// // parent constructor call post-processing
//
// } // eo function constructor
// }}}
// {{{
,initComponent:function() {
// hard coded config (it cannot be changed while instantiating)
// {{{
var config = {
}; // eo config object
// apply config
Ext.apply(this, Ext.apply(this.initialConfig, config));
// }}}
// call parent
AnExtension.superclass.initComponent.apply(this, arguments);
// parent call post-processing, e.g. install event handlers
} // eo function initComponent
// }}}
// {{{
,afterRender:function() {
// parent call pre-processing
// call parent
AnExtension.superclass.afterRender.apply(this, arguments);
// parent call post-processing, e.g. install event handlers on rendered components
} // eo function afterRender
// }}}
// any other added/overriden methods
}); // eo extend
// register xtype
Ext.reg('anextension', AnExtension);
// eof |
4 Responses to “JavaScript Extension File Pattern”
This is excellent excellent stuff — should be put in the official ExtJs learning page.
By Sey on Apr 3, 2008
Thank you.
I think it comes very handy, when starting new file, not to think what should be in the header or how parent call should look like but concentrate on the main code itself.
By jsakalos on Apr 3, 2008
I know this is a rather old post, but I was wondering about the \’arguments\’ argument in lines 68 and 80 (the calls to the super class methods). I assume this was supposed to be arguments passed in when the object is instantiated? Where exactly is the variable \’arguments\’ set? Or was this just intended as a place holder?
By Robert Kuropkat on Jul 6, 2010
@Robert Kuropkat:
arguments is a local scope variable available in all functions in Java script see: https://developer.mozilla.org/En/Core_JavaScript_1.5_Reference/Functions_and_function_scope/arguments
By GIBson3 on Jul 14, 2010