extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2024-11-25 09:23:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

Make some fixes

Hadi Nategh 2018-03-28 16:54:29 +02:00
parent e4ce919060
commit 4c2f0031f5
1 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
How-to-port-an-app-to-et2.md

@ -7,7 +7,7 @@ As a show case scenario, we would like to port an app like Timesheet from epl 11
### Step 1: Use new etemplate class ### Step 1: Use new etemplate class
With all new api changes, first we need to add Etemplate namespace to the begining of our class. With all new api changes, first we need to add Etemplate namespace to the begining of our class.
``` ```php
use EGroupware\Api\Etemplate; use EGroupware\Api\Etemplate;
``` ```
@ -15,13 +15,13 @@ use EGroupware\Api\Etemplate;
Then we should look for lines where we have old etemplate definitions and replace them with new Etemplate class definition. Then we should look for lines where we have old etemplate definitions and replace them with new Etemplate class definition.
**Original Code:** **Original Code:**
``` ```php
function edit($content = null,$view = false) function edit($content = null,$view = false)
{ {
$etpl = new etemplate ('timesheet.edit'); $etpl = new etemplate ('timesheet.edit');
``` ```
**New Code:** **New Code:**
``` ```php
function edit($content = null,$view = false) function edit($content = null,$view = false)
{ {
$etpl = new Etemplate ('timesheet.edit'); $etpl = new Etemplate ('timesheet.edit');
@ -32,7 +32,7 @@ We need to add new version dependency in our app dependency. For instance, add v
timesheet/setup/setup.inc.php timesheet/setup/setup.inc.php
**Original Code:** **Original Code:**
``` ```php
/* Dependencies for this app to work */ /* Dependencies for this app to work */
$setup_info[TIMESHEET_APP]['depends'][] = array( $setup_info[TIMESHEET_APP]['depends'][] = array(
'appname' => 'phpgwapi', 'appname' => 'phpgwapi',
@ -44,7 +44,7 @@ $setup_info[TIMESHEET_APP]['depends'][] = array(
); );
``` ```
**New Code:** **New Code:**
``` ```php
$setup_info[TIMESHEET_APP]['depends'][] = array( $setup_info[TIMESHEET_APP]['depends'][] = array(
'appname' => 'api', 'appname' => 'api',
'versions' => Array('17.1') 'versions' => Array('17.1')
@ -56,7 +56,7 @@ $setup_info[TIMESHEET_APP]['depends'][] = array(
In order to actually get advantage of et2 technology and writing our own application javascript specific codes by using lots of powerful client-side APIs, its a good practice to define a app.js under AppFolder?/js folder. In this case we would create an app.js file under timesheet\js\app.js. In order to actually get advantage of et2 technology and writing our own application javascript specific codes by using lots of powerful client-side APIs, its a good practice to define a app.js under AppFolder?/js folder. In this case we would create an app.js file under timesheet\js\app.js.
``` ```javascript
app.classes.timesheet = AppJS.extend( app.classes.timesheet = AppJS.extend(
{ {
appname: 'timesheet', appname: 'timesheet',
@ -108,10 +108,13 @@ app.classes.timesheet = AppJS.extend(
``` ```
**Note: this is just a good practice example to show how to define an app.js for timesheet app. Options for defining new object and functions inside that app.js object is endless.** **Note: this is just a good practice example to show how to define an app.js for timesheet app. Options for defining new object and functions inside that app.js object is endless.**
Inline Scripts and Content Security Policy (CSP): et2 uses CSP which is very restricted about inline scripts, therefore in order to take advantage of CSP we should make our code compatible with it by not using inline scripts and instead trying to implement them in our app.js. For instance in our timesheet scenario we do have couple of inline javascript statements which we need to port them, like: > **Inline Scripts and Content Security Policy (CSP):** *et2 uses CSP which is very restricted about inline scripts, therefore in order to take advantage of CSP we should make our code compatible with it by not using inline scripts and instead trying to implement them in our app.js.*
For instance in our timesheet scenario we do have couple of inline javascript statements which we need to port them, like:
**Original Code** **Original Code**
``` ```php
function index($content = null,$msg='') function index($content = null,$msg='')
{ {
... ...
@ -129,7 +132,7 @@ function index($content = null,$msg='')
``` ```
**New Code** **New Code**
``` ```php
function index($content = null,$msg='') function index($content = null,$msg='')
{ {
... ...
@ -146,7 +149,7 @@ function index($content = null,$msg='')
``` ```
And we need to implement our filter_change method in app.js file, like: And we need to implement our filter_change method in app.js file, like:
``` ```javascript
filter_change: function() filter_change: function()
{ {
var filter = this.et2.getWidgetById('filter'); var filter = this.et2.getWidgetById('filter');