Hi Randy,
I’m looking for a recommendation on migrating applications to eTemplate2
under TRUNK. I realize this may be premature however, I am anxious to start
the lengthy migration process for my applications.
1. Would you recommend developers start using TRUNK now or should we wait?
Why wait?
2. Is it possible to use TRUNK using Traditional eTemplate (like CSP can
eTemplate2 be turned off in the framework) as we migrate our applications to
eTemplate2? Currently EGW Framework appears to be running strictly in
eTemplate2, where legacy applications are grey and non-functional.
Old eTemplate is still available, CSP (Content Security Policy) is
switched off automatically, as it relies on inline javascript.
3. Is there a new eTemplate2 Application, Database Too etc… developers
should be using, what is in TRUNK is only partially functional.
New mail app still has some areas, which are not working. Same is true
for not yet fully ported applications like projectmanager or tracker.
And there’s no editor for eTemplate2. You have to use a text or better a
xml editor.
4. Are there any quick references vs. trial and error with respect to
migrating applications from eTemplate to eTemplate2?
Basicly you only need to change etemplate with etemplate_new class.
If you code uses own client-side javascript code, I recommend to port it
to the approach we are using. Create an myapp/js/app.js file:
app.classes.myapp = AppJS.extend(
{
appname: ‘myapp’,
/**
* Constructor
*
* @memberOf app.myapp
*/
init: function()
{
// call parent
this._super.apply(this, arguments);
// your code ...
},
/**
* Destructor
*/
destroy: function()
{
// your code ...
// call parent
this._super.apply(this, arguments);
},
/**
* This function is called when the etemplate2 object is loaded
* and ready. If you must store a reference to the et2 object,
* make sure to clean it up in destroy().
*
* @param {etemplate2} _et2
* @param {string} _name name of template loaded
*/
et2_ready: function(_et2, _name)
{
// call parent
this._super.apply(this, arguments);
switch(_name)
{
case 'myapp.index':
// your code ...
EGroupware now has a client-side api, which resides in
phpgwapi/js/jsapi/egw_*.js files. You should study them, as many tasks
needing a custom ajax handler on server-side can now be done by calling it:
- translate an english phrase:
egw(window,‘myapp’).lang('Some english phrase to translate)
- include a javascript file and call a callback after file included
egw(window,‘myapp’).includeJS(_jsFiles, _callback, _context)
- make an ajax request to server with optional callback
egw(window,‘myapp’).json(“myapp.myapp_ui.ajax_handler”, data [,
callback, context]).sendRequest()
- add ajax request to queue send periodically to server and callback
with result
egw(window,‘myapp’).jsonq(“myapp.myapp_ui.ajax_handler”, data,
callback, context)
- output a mesage (success, error, warning) in current window
egw(window,‘myapp’).message(‘Entry saved.’, ‘success’)
- refresh opener and output a message
egw(window,‘myapp’).refresh(‘Entry deleted’, ‘myapp’, 123);
- open a given entry of an application
egw(window,‘myapp’).open(123, ‘infolog’, ‘edit’)
egw(window,‘myapp’).open(null, ‘addressbook’, ‘add’)
- open a relative link (optional in a popup window)
egw(window,‘myapp’).open_link(_link, ‘_blank’[, ‘640x480’]);
- get a user preference
egw(window,‘myapp’).preference(‘timeformat’,‘common’)
- set a user preference
egw(window,‘myapp’).set_preference(‘myapp’, ‘somename’, value)
- get full name (or other account_* data) of current user
egw(window,‘myapp’).user(‘account_fullname’)
There is not a single egw object. It consists of several modules, which
can by window or application dependent. Therefore I allways used
egw(window,‘myapp’) in above examples. In above app.js object you can
allways user this.egw (= egw(window,this.appname)).
Biggest difference between eTemplate and eTemplate2 is that all
rendering is now done on client-side. Server just sends data and
template-url (xet-file) to client to render.
Therefore client-side javascript code has now lots of methods to
manipulate rendered content on client-side.
A change handler eg for a selectbox which enables an input for a custom
value would look like this in above app.js file:
x_changed: function(event,widget)
{
var val = widget.get_value();
var custom_val = this.et2.getWidgetById('custom_val');
switch (val)
{
case 'custom':
custom_val.set_readonly(true);
break;
default:
custom_val.set_readonly(false);
custom_val.set_value(val);
break;
}
}
Activated by onchange in your xet file:
I hope that helps a bit understanding the concept and port your apps to
eTemplate2.
Ralf
Ralf Becker
Director Software Development
Stylite AG
Morschheimer Strasse 15 | Tel. +49 6352 70629 0
D-67292 Kirchheimbolanden | Fax. +49 6352 70629 30
Email: rb@stylite.de
www.stylite.de | www.egroupware.org
Managing Directors: Andre Keller | Ralf Becker | Gudrun Mueller
Chairman of the supervisory board: Prof. Dr. Birger Leon Kropshofer
VAT DE214280951 | Registered HRB 31158 Kaiserslautern Germany