Upgrade to ExtJS 3.0.0 - Released 07/06/2009
[extjs.git] / docs / source / App2.html
1 <html>\r
2 <head>\r
3   <title>The source code</title>\r
4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
6 </head>\r
7 <body  onload="prettyPrint();">\r
8     <pre class="prettyprint lang-js"><div id="method-App.user.FormPanel-App"></div>/**
9  * Ext.App
10  * @extends Ext.util.Observable
11  * @author Chris Scott
12  */
13 Ext.App = function(config) {
14
15     // set up StateProvider
16     this.initStateProvider();
17
18     // array of views
19     this.views = [];
20
21     Ext.apply(this, config);
22     if (!this.api.actions) { this.api.actions = {}; }
23
24     // init when onReady fires.
25     Ext.onReady(this.onReady, this);
26
27     Ext.App.superclass.constructor.apply(this, arguments);
28 }
29 Ext.extend(Ext.App, Ext.util.Observable, {
30
31     <div id="prop-App.user.FormPanel-STATUS_EXCEPTION"></div>/***
32      * response status codes.
33      */
34     STATUS_EXCEPTION :          'exception',
35     STATUS_VALIDATION_ERROR :   "validation",
36     STATUS_ERROR:               "error",
37     STATUS_NOTICE:              "notice",
38     STATUS_OK:                  "ok",
39     STATUS_HELP:                "help",
40
41     <div id="cfg-App.user.FormPanel-api"></div>/**
42      * @cfg {Object} api
43      * remoting api.  should be defined in your own config js.
44      */
45     api: {
46         url: null,
47         type: null,
48         actions: {}
49     },
50
51     // private, ref to message-box Element.
52     msgCt : null,
53
54     // @protected, onReady, executes when Ext.onReady fires.
55     onReady : function() {
56         // create the msgBox container.  used for App.setAlert
57         this.msgCt = Ext.DomHelper.insertFirst(document.body, {id:'msg-div'}, true);
58         this.msgCt.setStyle('position', 'absolute');
59         this.msgCt.setStyle('z-index', 9999);
60         this.msgCt.setWidth(300);
61     },
62
63     initStateProvider : function() {
64         /*
65          * set days to be however long you think cookies should last
66          */
67         var days = '';        // expires when browser closes
68         if(days){
69             var date = new Date();
70             date.setTime(date.getTime()+(days*24*60*60*1000));
71             var exptime = "; expires="+date.toGMTString();
72         } else {
73             var exptime = null;
74         }
75
76         // register provider with state manager.
77         Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
78             path: '/',
79             expires: exptime,
80             domain: null,
81             secure: false
82         }));
83     },
84
85     <div id="method-App.user.FormPanel-registerView"></div>/**
86      * registerView
87      * register an application view component.
88      * @param {Object} view
89      */
90     registerView : function(view) {
91         this.views.push(view);
92     },
93
94     <div id="method-App.user.FormPanel-getViews"></div>/**
95      * getViews
96      * return list of registered views
97      */
98     getViews : function() {
99         return this.views;
100     },
101
102     <div id="method-App.user.FormPanel-registerActions"></div>/**
103      * registerActions
104      * registers new actions for API
105      * @param {Object} actions
106      */
107     registerActions : function(actions) {
108         Ext.apply(this.api.actions, actions);
109     },
110
111     <div id="method-App.user.FormPanel-getAPI"></div>/**
112      * getAPI
113      * return Ext Remoting api
114      */
115     getAPI : function() {
116         return this.api;
117     },
118
119     <div id="method-App.user.FormPanel-setAlert"></div>/***
120      * setAlert
121      * show the message box.  Aliased to addMessage
122      * @param {String} msg
123      * @param {Bool} status
124      */
125     setAlert : function(status, msg) {
126         this.addMessage(status, msg);
127     },
128
129     <div id="method-App.user.FormPanel-addMessage"></div>/***
130      * adds a message to queue.
131      * @param {String} msg
132      * @param {Bool} status
133      */
134     addMessage : function(status, msg) {
135         var delay = 3;    // <-- default delay of msg box is 1 second.
136         if (status == false) {
137             delay = 5;    // <-- when status is error, msg box delay is 3 seconds.
138         }
139         // add some smarts to msg's duration (div by 13.3 between 3 & 9 seconds)
140         delay = msg.length / 13.3;
141         if (delay < 3) {
142             delay = 3;
143         }
144         else if (delay > 9) {
145             delay = 9;
146         }
147
148         this.msgCt.alignTo(document, 't-t');
149         Ext.DomHelper.append(this.msgCt, {html:this.buildMessageBox(status, String.format.apply(String, Array.prototype.slice.call(arguments, 1)))}, true).slideIn('t').pause(delay).ghost("t", {remove:true});
150     },
151
152     <div id="method-App.user.FormPanel-buildMessageBox"></div>/***
153      * buildMessageBox
154      */
155     buildMessageBox : function(title, msg) {
156         switch (title) {
157             case true:
158                 title = this.STATUS_OK;
159                 break;
160             case false:
161                 title = this.STATUS_ERROR;
162                 break;
163         }
164         return [
165             '<div class="app-msg">',
166             '<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>',
167             '<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc"><h3 class="x-icon-text icon-status-' + title + '">', title, '</h3>', msg, '</div></div></div>',
168             '<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>',
169             '</div>'
170         ].join('');
171     },
172
173     <div id="method-App.user.FormPanel-decodeStatusIcon"></div>/**
174      * decodeStatusIcon
175      * @param {Object} status
176      */
177     decodeStatusIcon : function(status) {
178         iconCls = '';
179         switch (status) {
180             case true:
181             case this.STATUS_OK:
182                 iconCls = this.ICON_OK;
183                 break;
184             case this.STATUS_NOTICE:
185                 iconCls = this.ICON_NOTICE;
186                 break;
187             case false:
188             case this.STATUS_ERROR:
189                 iconCls = this.ICON_ERROR;
190                 break;
191             case this.STATUS_HELP:
192                 iconCls = this.ICON_HELP;
193                 break;
194         }
195         return iconCls;
196     },
197
198     <div id="method-App.user.FormPanel-setViewState"></div>/***
199      * setViewState, alias for Ext.state.Manager.set
200      * @param {Object} key
201      * @param {Object} value
202      */
203     setViewState : function(key, value) {
204         Ext.state.Manager.set(key, value);
205     },
206
207     <div id="method-App.user.FormPanel-getViewState"></div>/***
208      * getViewState, aliaz for Ext.state.Manager.get
209      * @param {Object} cmd
210      */
211     getViewState : function(key) {
212         return Ext.state.Manager.get(key);
213     },
214
215     <div id="method-App.user.FormPanel-t"></div>/**
216      * t
217      * translation function.  needs to be implemented.  simply echos supplied word back currently.
218      * @param {String} to translate
219      * @return {String} translated.
220      */
221     t : function(words) {
222         return words;
223     },
224
225     handleResponse : function(res) {
226         if (res.type == this.STATUS_EXCEPTION) {
227             return this.handleException(res);
228         }
229         if (res.message.length > 0) {
230             this.setAlert(res.status, res.message);
231         }
232     },
233
234     handleException : function(res) {
235         Ext.MessageBox.alert(res.type.toUpperCase(), res.message);
236     }
237 });</pre>    \r
238 </body>\r
239 </html>