iTask 2.

0 Content Management Backend

DEVELOPER'S GUIDE Part 2 Tutorial

© codeArts Nepal Pvt. Ltd. 2008

 Table of contents

No. Particulars Page No.

1. Using the iTask 3 – 53
1.1. Getting Started 3–4
1.2. Table Convention: prefix, name and primary key(id) 4–5
convention to use it with iTask
1.3. Module Generation and access specifier: 5 – 13
1.4. Structure of files created by module generator and their 13 – 15
use
1.5. Handling menu and module display in default module 15 – 21
1.6. Adding, listing, editing, deleting data 22 - 44
1.7. Using sub modules for ease of work and display sub 44 – 48
modules in main module
1.8. Module with image upload and display. 48 - 53
1.9. Recommended Code read 53
2. WaiTr Testing
3. Conclusion 54
4. References 55

1
Abbreviations

No. Abbreviation Full Form

1. CMS Content Management System
2. CRUD Create Read Update Delete

2
1. Using the iTask CMS
1.1. Getting started:
Unzip the iTast2.0.zip file in you’re a folder to get the following folders, given in
the picture:

1.1.1. Copy the module_generator and project_folder also to your htdocs folder
1.1.2. Create a database from phpmyadmin named itask_db and dump the sql file
in the db folder inside admin folder to the database via php myadmin.
1.1.3. You can login to the system with username is admin and password is also
admin by going to http://localhost/project_folder/admin in your browser.
1.1.4. You can rename the project_folder to your project name but do consider
the paths in tbl_cms_menu for desired functioning of the menu links.
1.1.5. The configuration of the CMS is in the configuration.php file in the admin
folder. Its code is given below:

3
 1.1.6. You can change the database details and path as per your need but
remember to dump the database before trying to access the CMS.
1.1.7. You will know other thing to change as you progress further in this
document.

1.2. Table Naming Convention:

When naming your tables of your application/project it is advised to use a prefix
to ensure smooth operation even in a multi-application and same database
environment.
For using table names in iTask CMS usually tbl prefix is used so the table lets
say page will be tbl_page. For integration with iTask CMS it is mandatory to use
the primary id as table_name_id like for table page page_id will be the primary
key.
In case the content should be published to be visible from the front end add a
field "published" of type int(10) to handle this. For front end components and
components that need to be determined when it was created and edited append
two fields "register_date" and "modified_date" to the table both fields should be
of datetime type. Refer to 3.3 for more details about why you should add this to
the tables. A typical tbl_page structure is given below:

4
 *PS: Example of page module will be used for things below.

1.3. Module Generation and access specifier:

To generate your module copy the module_generator folder from the zip package
to your htdocs folder. Then follow the following steps to generate a module, here
we will generate a page module with above table structure.
1.3.1. In your browser go to http://localhost/module_generator to get the
following page:

5
1.3.2. Then in the form fill the details as below, explanation is given about the
details filled. Use zoom to see the picture better. (Tip: use two browsers one
with phpMyadmin with table view and other with form below.)

6
 1.3.3. After all the details are filled click generate module and then the following
page appears:

1.3.4. Check htdocs\module_generator\module_generator_iTask\generate_code

folder to get your mod_page folder as you named to module page in the
above form.
1.3.5. Copy/move the mod_page folder from
htdocs\module_generator\module_generator_iTask\generate_code to
\htdocs\project_folder\admin\modules as shown below.

7
 (Remember: project_folder is an imaginary name it will be the folder of the
project you are working on.)

1.3.6. If this is your first module there will be 5 folder, 4 core required folder and
now added mod_page as below:

8
 1.3.7. Then go to
http://localhost/module_generator/module_access_generator_iTask/ to
generate the access for the module/modules created.
1.3.8. Click on Step1.php as below:

1.3.9. Then type in your project folder name (project_folder is being used to
demonstrate only).

9
1.3.10. After you click next following page appears:

1.3.11. All the modules in the back end will be listed and their use will be given
as "Use by System" and "Published" to use it. Make sure all modules are
"Published" and auth and default modules are checked for "Use by System".
Then click generate SQL to get following page:

1.3.12. Then copy all the code in the text area and go to your database like below:

10
 1.3.13. Then paste it and click go.

1.3.14. You will be informed of the query execution success as below.

11
1.3.15. Then login into your iTask admin at http://localhost/project_folder/admin/
like below:

1.3.16. Then click on "User Manager", to get a page similar to below:

1.3.17. Notice that the URL is

http://localhost/project_folder/admin/index.php?mod=user , edit the URL to
http://localhost/project_folder/admin/index.php?mod=page to test if your
module works, if it does you will get the following page:

12
 1.3.18. Ok you are done with adding module now other things will follow.

1.4. Structure of files created by module generator and their use:

On successful completion of the module generation your module folder you
copied/moved form "generate_code" folder to your respective modules folder has
following files:

1.4.1. Description of the 12 files created: (module_name is your module's name

here it is page as we are taking page module as the example module) all are
.php files.
1.4.1.1. class.module_name: is the main controller of all the things like
listing, deleting, editing that executes the processes. Other functions to
add related records should be coded here.

13
1.4.1.2. module_name: lists the database objects which has two database
objects database and database2, these are usable when you do coding
for related tables like if there is a menu for each page then link should
be maintained. Other things included in this file are the possible
operation that can be run by default it has 5 operations add, edit, delete,
enable and disable. Add, edit and delete operation from here and
created needed files. Like if you want to add a new operation detail it
can be done from here and a file module_name.operation_name in our
case page_detail.html.php should be created. It is the back end side of
the page works in conjunction with module_name.html file.
1.4.1.3.module_name.add: Performs the insertion process of the data
submitted from module_name.add.html.php which contains the form to
add data. Message about record being added can be edited form here. In
case of related tables and adding multiple records like menu link record
for the page should be added from here.
1.4.1.4.module_name.add.html: The file has form and html elements to
input the data. It has text field validation of Spry other validation
should be added by self if needed like checkbox validation. Refer to
Spry section here for more details visit the URLs under Spry. In case
you have to add select boxes and other elements in place of text fields it
should be coded by yourself in this file.
1.4.1.5.module_name.delete: has code that calls the delete function in the
module_name.class file which deletes one or multiple records. In case
you need to delete related records or multiple records then it should be
called here and coded in the module_name.class file.
1.4.1.6.module_name.disable: has the code to disable one or multiple
records, it changes the published to 0 calling the update function of the
module_name.class file.
1.4.1.7.module_name.edit: Similar to module_name.add it gets the data from
the module_name.edit.html which has the form and formats it to be
updated in the database. It calls the update function in the
module_name.class file.
1.4.1.8.module_name.edit.html: has the form to edit the record it has the
values stored in the database. In case of using select it should be coded
specifically for the value to be selected. It has form so needs some
tweaking for validating other form elements except text filed.
1.4.1.9.module_name.enable: has the code to enable the record/records by
setting the value of published field to 1 calling the update function in
the module_name.class file. It works as reverse of the
module_name.disable file.
1.4.1.10. module_name.html : has the database objects by default database
and database2 with actions/operations to be performed. Working in
conjunction with module_name file (3.4.1.2) it also has four operations
by default add, edit, delete and list. If new database object is added say
database3 then it should be added in this file and module_name file
same for added operation like detail.

14
 1.4.1.11. module_name.list.html: controls the listing of the fields of the
database table. The column types can be label for simple text, bool for
Boolean value like published or unpublished. Link for link to edit it or
view detail and image to display image.
1.4.1.12. module_name.toolbar.html: has code to show the buttons in the
toolbar, in list mode there are 6 buttons as below:

In case of Add and Edit operation 3 buttons are displayed as below:

The buttons to be displayed as per operation can be controlled from this

file.

1.5. Handling menu and module display in default module

Showing your module as a link in the menu may be vital for the user to use it
effectively. So it should be listed in the menu for ease of use. Continuing with the
page module example, let's assume there should be a Menu item called "Front
End" and have a link "Page Management" in it. For it let's analyze the table
structure and the initial instance of the table tbl_cms_menu.

Above is the schema of the table tbl_cms_menu.

15
Initially there are 15 records to show the menu as below:

1.5.1. Showing your custom menu link and sub link in it: Now we will insert
some records in the database to show "Front End" menu link first then show
"Page management" under it. Steps to do this are given below:
1.5.1.1.Go to your phpmyadmin and to your tbl_cms_menu table then click
insert as indicated below:

16
 1.5.1.2. And input the data as follows:

If there was a module for this link it could have been put in the URL
field.
1.5.1.3.Then add the record.
1.5.1.4.Login to the admin panel and see the menu it should be like below:

1.5.1.5.Now we will add "Page Management" below it/inside it.

1.5.1.6.For it check the PHPmyadmin, browse records in tbl_cms_menu to
find the cms_menu_id of just added "Front End" record as below:

In my case it has id 814 note it.

1.5.1.7.Again browser through the tbl_module to know the id of the page
module as we are going to add the link of that module, it is shown
below:

17
 In my case it has id 4,note it down as well.
1.5.1.8.Now insert a new record to the table tbl_cms menu as below:

Similar to above addition but notice to parent is 814 of the "Front End"
link.
1.5.1.9.After the insert check the menu to get something like below:

1.5.2. Displaying the module in the main default module list display, to do this
go to /htdocs/project_folder/admin/modules/mod_default and spot the
default.list.html file and edit it.

18
 I'm using notepad++. Use your favorite IDE.
1.5.3. You will see some code like below:

19
1.5.4. Paste the code below after the div close of mod=default&act=config
<div style="float: left;">
<div class="icon"> <a href="?mod=page"> <img
src="<?=$caConfig_live_site?>/theme/images/header/icon-48-article.png"
alt="Page Management System" align="top" border="0"> <span>Page
Management System </span> </a>
</div>
</div>
1.5.5. You must get the page to look something like below:

1.5.6. Save the file and see your CMS after logging in it should be changed to
something like below:

20
 1.5.7. If your module is for configuration or for other purpose and you feel the
icon does not represent what the module does then you can change the icon.
The options are:

1.5.8. The icons are at htdocs/project_folder/admin/theme/images/header. See an

example where I changed icon-48-article.png to icon-48-frontpage to the
"Page Management System" icon display.

Resulted to:

1.5.9. For further demonstration I'll change the icon back to icon-48-article.png.

21
1.6. Adding, listing, editing, deleting data:
Now you have generated your module, added its link to the menu and even added
it to the main page display. Now let's add some data and see how things are done.
1.6.1. Modifying toolbar
You might need to edit the toolbar to adjust things like the module name
display and the buttons displayed in the tool bar as per the operation. Refer
here to see what this file shows.
1.6.1.1. Change module name display in listing page.
1.6.1.1.1. If you have noticed your "page manager" has a small p like
below:

1.6.1.1.2. Now lets change it to "Page Manager" so go to your modules

folder an your mod_page folder to find page.toolbar.html.php file
and open it. to get code as below:

1.6.1.1.3. Change it to something like below:

1.6.1.1.4. Save the file, which will result to:

1.6.1.1.5. You can name the module wish but maintaining consistency
with module_name Manager is preferred and advised.

1.6.1.2.Changing buttons to display as per the operation:

1.6.1.2.1. Typical button display as per the code below:

22
 1.6.1.2.2. As per the above code add and edit operations have 3 buttons
"Save", "Cancel" and "Help" you can remove help if its not
needed by delete that line's code.
1.6.1.2.3. Let's remove "Publish" and "Unpublish" from the toolbar of the
page module just to check. To do this remove the two lines of <td
to get a code something like below:

1.6.1.2.4. Save file and see the listing page of the module which will
have a toolbar like below:

1.6.1.2.5. I'll change it back as there should be enable and disable option
for the page as it also has the published field in the database table.

1.6.2. Adding data

Adding data it self is not a big deal, if you have named the database fields
right then data addition and other operations will not be any hard task.
Things you should consider here is taking input from other form elements
like radio button or select box. Validating input and uploading photos etc.
1.6.2.1.Simple data add example:
1.6.2.1.1. Click on the new button on the toolbar to get a form as below:

23
 1.6.2.1.2. In case of error you will get an error like below:

1.6.2.1.3. So thing to consider here, in the form page your can see the
right side is blank, you can add form elements there as well, we
will deal about it in next segment.
1.6.2.1.4. Click "Save" button and you will get following notification if
you have not error in data validation and get redirected to the
listing page as below.

1.6.2.1.5. The data was successfully added, check database table via
PHPmyAdmin to confirm☺.

1.6.2.2.Edit form appearance and behavior

In the form page you might have noticed that the right part is blank and
there are only text field, text area and check box no select or radio
buttons. So let's make the URL a select box and just add a form on the
right side of the menu item for the page a dummy on functional form.

24
 1.6.2.2.1. To make the URL field a select box which is a text field now
go to the page.add.html.php file in your mod_page directory. It
will have code like below:

1.6.2.2.2. Edit the <input to <select and make the code like below:
<tr>
<td class="key">Page URL:</td>
<td class=""><span id="url">
<select name="url" class="inputbox" id="url" value="<?=$url?>"
/>
<option value="home">Home</option>
<option value="aboutus">About Us</option>
<option value="download">Download</option>
</select>
</span>
</td>
</tr>
Which is:

25
1.6.2.2.3. Remember to comment the javascript to validate the URL as
compulsory. Done below:

1.6.2.2.4. Save file and try to add a new page, you will get a form like
below:

1.6.2.2.5. Notice the Page URL field is a select box, also consider that
the right part col40 div area is blank.
1.6.2.2.6. Just fill in some data and click save, let it be the about us page
in the url. After adding page you will get a page something like
below:

26
 1.6.2.2.7. Now lets add a dummy form with menu related items to the
right area of the form. To do this go to the page.add.html.php file
in your mod_page directory. Add the code below just above
<input name="mod" type="hidden" id="mod" value="page">.
<div class="col40">
<fieldset class="adminform">
<table class="admintable" cellspacing="1">
<tr>
<td class="key">Menu Title:</td>
<td class=""><span id="menu_title"><input
name="menu_title" type="text" class="inputbox" id="mneu_title"
size="40" maxlength="255" value="<?=$menu_title?>" title="Give the
menu title" /><span class="textfieldRequiredMsg">Menu title is
required.</span> </span></td>
</tr>
<tr>
<td class="key">Menu Link:</td>
<td class=""><span id="menu_link"><input
name="menu_link" type="text" class="inputbox" id="mneu_link"
size="40" maxlength="255" value="<?=$menu_link?>" title="Give the
menu link" /><span class="textfieldRequiredMsg">Menu link is
required.</span> </span></td>
</tr>
</table>
</fieldset>
</div>

Which is:

1.6.2.2.8. The result of this will be something like:

27
1.6.2.2.9. Notice the other table in the right side but it will not add
anything as nothing has been coded for it in the class file and the
page.add.php file.
1.6.2.2.10. Lets see how the data gets added, the data form the for is
thrown to page.add.php file which can be divided into two parts
part 1 prepares data like below:

1.6.2.2.11. Part 2 send the data in an array to class.page.php file to add to

database table/tables:

28
 1.6.2.2.12. The $database->insert($arr) function call, calls the insert
function in class.page.php as given below:

29
1.6.2.2.13. So this is what happens. If you had to add a page with a menu
link with a table called tbl_menu which had menu_id, page_id,
menu_title and menu_url.
1.6.2.2.14. Then in page.add.html.php you must first code the form as
above then in the page.add.php get the data of the menu title and
menu body like below:

30
 1.6.2.2.15. Changes in the class.page.php file should also be made, you
should code the InsertMenu function with related table as
variable, see below:

1.6.2.2.16. You are done adding the menu but there is no table called
tbl_menu. You have to code these things in update and delete as

31
 well to synchronize the functions. If a tbl_menu is created with
above mentioned fields the code should work.
1.6.2.2.17. Single table addition are no big deal but related table addition
should be done like this, it's up to you to try it now. Test things.
(Tip: multiple inserts can be handled by multiple functions as per need;
always check the phpMyAdmin to test if your code is doing what it is
meant to do.)

1.6.3. Listing/Displaying data:

For the displaying as you have already seen that the data display from one table is
automated so we will try to see how to join tables and get data from joining table.
For further examples we will use the same page module but we will display which
page has what menu url in the display and things.

1.6.3.1.Adding and listing related data

1.6.3.1.1. So from the above diagram it is assumed that every page has a
menu link. Now we will edit the add form to display something
like below:

32
 1.6.3.1.2. The code to get this from in page.add.html.php and
page.add.php is in the iTask_Sample_Modules folder inside
mod_page folder or try it yourself to get something like this.
1.6.3.1.3. Let's add a download page and see its listing in the listing page
with page title, page url, menu title and published.
1.6.3.1.4. After the page is added something like this is displayed:

1.6.3.1.5. Now go to the class.page.php and find the code snippet that
displays the list above, function name is listAll.
1.6.3.1.6. Edit the code to:
function listAll() {
$query = " SELECT
$this->pms.page_id,
$this->pms.title,
$this->pms.url,
$this->pms.published,
$this->pms.register_date,
$this->pms.modified_date,
$this->tblmenu.menu_title
FROM
$this->pms,
$this->tblmenu
WHERE
$this->pms.page_id=$this-
>tblmenu.page_id";
$this->Query ($query);
}

33
 Check the code in the iTask_Sample_Modules folder.
1.6.3.1.7. Add the menu items for already created page so that they also
display as the code has been edited to show two joined tables.
Therefore, after you add the menu links for home and about us
page and add other pages you should get a list like below:

1.6.3.1.8. Use your coder brain it's not as easy as it looks read the code in
the sample module folder.
1.6.3.1.9. Order of column to be displayed depends on how it is selected
in listAll( ) function and how it is placed in the page.list.html.php
file. Try to achieve the display below yourself, there is menu title
after pageURL.

1.6.3.2.Linking data display to edit or detail view.

Lets say you want to add a link to the page title which loads the page
edit page you rather that checking the page and clicking the edit button.
You can do it following the steps below:
1.6.3.2.1. Open page.list.html.php file and find the following line:
"url" =>array("header"=>"PageURL", "type"=>"label", "align"=>"center",
"wrap"=>"nowrap", "text_length"=>"-1", "case"=>"normal"),
1.6.3.2.2. Edit it to:
"url" =>array("header"=>"PageURL", "type"=>"link",
"align"=>"center", "wrap"=>"nowrap", "text_length"=>"-1",
"case"=>"normal", "field_key" => "page_id", "field_data"=>"url",
"href" => "index.php?mod=$module&act=edit&id={0}"),
1.6.3.2.3. In above line the bold text is the added text.
1.6.3.2.4. Now refresh your listing page it should be something like
below:

34
 1.6.3.2.5. Click in one of the pageURL links to get a form like below:

1.6.3.2.6. If you change and edit the text it will be updated but as there is
not menu editing fields menu options will remain as it is.

1.6.4. Editing data

Editing the data/records of a single table can be easily done with no code
tweaking but in case of related data some coding is required. Lets get started:
1.6.4.1. Edit the form page and enable related data editing
To do this, follow the steps below:
1.6.4.1.1. Let's first edit the form and make it look like the form we
edited to add the page and menu together.
1.6.4.1.2. Copy the col40 div and its contents and from
page.add.html.php and paste it to page.edit.html.php just above
the following line: (use the sample mod_page if its easy for you)
<input name="mod" type="hidden" id="mod" value="page">

1.6.4.1.3. The code will be something like below:

35
1.6.4.1.4. Now edit a record from the list, check it and click edit or just
click the pageUrl link to get the following form:

36
 1.6.4.1.5. Now check the page.edit.html.php file's top part
<?php // no direct access
defined( '_VALID_ACCESS' ) or die( 'Restricted access' );
?>
<?php
if(isset($_SESSION['page'])) {
$page_id = $_SESSION['page']['page_id'];
$title = $_SESSION['page']['title'];
$url = $_SESSION['page']['url'];
$meta_keyword = $_SESSION['page']['meta_keyword'];
$meta_description = $_SESSION['page']['meta_description'];
$body = $_SESSION['page']['body'];
$published = $_SESSION['page']['published'];

}
else {
$page_id = $io->getVar('id','get',TRUE);
if( !$page_id ) {
print "<script> alert('Please select an item first.');
window.history.go(-1);</script>
";
exit();
}

$database2->getDetail($page_id);
if( $database2->RecordCount <= 0 ) {
print "<script> alert('No Such Data Defined'); window.history.go(-
1);</script>
";
exit();
}
$title = $database2->Fields('title');
$url = $database2->Fields('url');

37
$meta_keyword = $database2->Fields('meta_keyword');
$meta_description = $database2->Fields('meta_description');
$body = $database2->Fields('body');
$published = $database2->Fields('published');

}
unset ($_SESSION['page']);
?>
1.6.4.1.6. So the problem is Session does not have the values of the
menu, notice that $database2->getDetail($page_id); is called so
this function should be altered in class.page.php file to get the
values of the tbl_menu as well.
1.6.4.1.7. Got the class.page.php file and locate getDetail function like
below:

1.6.4.1.8. Edit the Select sql to:

$this->Query ("SELECT
$this->pms.page_id,
$this->pms.title,
$this->pms.url,
$this->pms.meta_keyword,
$this->pms.meta_description,
$this->pms.body,
$this->pms.published,
$this->tblmenu.menu_title,
$this->tblmenu.menu_url,
$this->tblmenu.menu_order,
$this->tblmenu.published as published_menu
FROM
$this->pms,
$this->tblmenu
WHERE
$this->pms.page_id = '$page_id' AND
$this->pms.page_id=$this->tblmenu.page_id");

1.6.4.1.9. Now goto the page.edit.html.php page and add the new menu
table related variables to the code. First add session related
variables as below:

38
 1.6.4.1.10. Then add variables to get form the database:

1.6.4.1.11. Now check if the fields have the value variable of the col40 div
menu elements in case of select use the following code:

1.6.4.1.12. If everything is ok you will get form like below on refresh.

39
1.6.4.1.13. Now you have successfully got the related values to the form,
front end part is done with. For the back end interaction with the
database we will have to edit the page.edit.php file that gets the
values on submission as in page.add.php.
1.6.4.1.14. Got o page.edit.php and add the following code as below:

1.6.4.1.15. Now prepare the array for updating as below:

40
 1.6.4.1.16. After that call the functions to update the page and menu with
same sub query variable subQ as both have the same page_id, like
below:

1.6.4.1.17. The function update() is already present in class.page.php but

updateMenu() function, both functions take two arguments first is
the array to update and second is the sub query. updateMenu has
to be coded as below:

1.6.4.1.18. Now save the files, refresh your edit form page and test your
update it must be functional. Mine is working see below,
downloads is changed to downloads2 in both page title and menu
title: (See the code in mod_page in iTask_Sample_Modules folder
if you have problem)

41
1.6.5. Deleting data
Deleting record/records of single table is easy as its already coded by the
generator. In case of deleting record/records from multiple tables
following steps should be followed:

1.6.5.1.Deleting records from multiple tables

1.6.5.1.1. Continuing with above example, if page is deleted its related
menu item must also be deleted so when a page it deleted we
should code a function to delete the related menu item from
tbl_menu.
1.6.5.1.2. For doing this open the page.delete.php page in your mod_page
folder, you will see code like below:

1.6.5.1.3. So as there is possibility of multiple delete above code has

been generated.
1.6.5.1.4. Add a function $database->deleteMenu($page_id) like below
to delete the menu record from tbl_menu related to the page to be
delete.

1.6.5.1.5. Now save the file and code the DeleteMenu( ) function in
class.page.php as below:

42
 1.6.5.1.6. Now when you delete the page its associated menu item will
also be deleted, try it see phpMyAdmin to verify its functionality
like below:
1.6.5.1.7. Before new release delete tbl_menu had

1.6.5.1.8. Delete Process success

1.6.5.1.9. After Delete tbl_menu has

Similarly the page called new release has also been deleted, see below:

43
 1.6.5.1.10. Check your operation from phpMyAdmin to verify it properly.

1.7. Using sub modules for ease of work and display sub modules in main
module
Let's picture a scenario first, we are trying to get a main module that only
displays sub modules in side it all the work is done by the sub modules. So, in
this case lets take an example of "Page Elements" module as main module and
"Block" module as its sub module.
tbl_block has the schema as shown in 3.6.3, click here to go there and have a
look at the schema. Follow the following steps to make your module and sub
module structure clear:
1.7.1. Sub modules holder main module and sub module addition
1.7.1.1. Create a main modules directory in you modules folder like say
mod_room that holds sub modules like chair and table.
1.7.1.2. To make your main module that holds your sub module functional
copy the mod_page_elements module's files only from the
iTask_Sample_modules folder not sub folders to your directory
supposed room in your modules directory.
1.7.1.3.After you copy, rename the files in your room folder as below:

44
 1.7.1.4.Now open all the files and replace page_elemets by your new main
module's name here room is taken as example, so it will be like below:
1.7.1.4.1. class.room.php code

1.7.1.4.2. room.list.html.php code

The above code displays

45
1.7.1.4.3. So if you browse to
http://localhost/project_folder/admin/index.php?mod=page_elements
{replace page_elements in the above URL with your module name} you
should get a page similar to above display.
1.7.1.4.4. Now generate a module called block following the steps given
at 3. 3 here and schema given in section 3.6.3 and lets make it a
sub module of your room main module.
1.7.1.4.5. After you generate your module mod_block in generate code
folder rename the folder to block.
1.7.1.4.6. Copy the folder to
/htdocs/project_folder/admin/modules/your_main_module_name , your
main module name is supposed room for this exercise.
1.7.1.4.7. Then open the block.add.html.php and edit the code as follows
Original line: <input name="mod" type="hidden" id="mod"
value="page_elements,block">
Edit it to: <input name="mod" type="hidden" id="mod"
value="room,block"> - as room is supposed to be your main module's
name.
1.7.1.4.8. Then open block.edit.html.php and edit a line of code as
follows:
Original line: <input name="mod" type="hidden" id="mod"
value="page_elements,block">
Edit it to: <input name="mod" type="hidden" id="mod"
value="room,block"> - room is supposed to be your main module.
1.7.1.4.9. Now open the block.php file and edit the code to as below:

46
 1.7.1.4.10. It is done to make add and edit function properly.
1.7.1.4.11. Now you are done editing it, after that go to the main module
room in this example and open room.list.html.php file

1.7.1.4.12. Now access the module from

http://localhost/project_folder/admin/index.php?mod=room
{Replace room with your module name}

47
 1.7.1.4.13. Check the working of your block module it must be functional,
if you have problems check the block module code in the
iTask_Sample_modules folder.

1.7.1.4.14. You can list your new main module in the menu and the default
module list by following steps in 3.5.1 and 3.5.2.
1.7.1.4.15. Try to get this and do edit the menu as well.

1.8. Module with image upload and display.

We have successfully added, updated and deleted data with use of module and
even sub module inside a module. Now let's add a module called Product which
will even handle photos related to the product.

48
 1.8.1. Handling image and file upload with module.
1.8.1.1. For this example we will use a simple product table with just 4 fields
as below:

Product tables are not necessarily this simple but for the example we are
using a very simple product table to demonstrate the upload of image and
things.
1.8.1.2. Lets populate our mod_product as below:

1.8.1.3. Now copy the module form generate_code to you modules folder.
1.8.1.4.Then generate the access to the module using access generator.
1.8.1.5.After it add the menu link and or the icon on the main display page
like below:

49
1.8.1.6.The go to the product manager and add "New" icon from the toolbar to
got the following page, but don’t add a product it will cause error:

1.8.1.7.The image file will be by default uploaded to

/htdocs/project_folder/images/module_name/ folder which is
/htdocs/project_folder/images/product/ so create the folder first, then
create a sub folder in it called thumb for thumbnails which will be
/htdocs/project_folder/images/product/thumb before adding a product
or you will get an error.
1.8.1.8.To be saved from error edit the product.add..php and comment the two
lines of code as below:

It is done as there are not register_date and modified_date fields in the

product table.
1.8.1.9.Let's add a silver ring for example with picture, and click "save".

50
 1.8.1.10. In case everything goes ok product will be added like below:

1.8.1.11. Now to display the product picture correctly first verify that it has
been uploaded and the thumbnail has been generated correctly by
browsing at /htdocs/project_folder/images/product as below:

Verify thumbnail generation as well:

1.8.1.12. Now open up the product.edit.html.php to edit the path to display

picture on edit.
1.8.1.13. Find the <img tag and edit to
<img src="<?php echo($caConfig_live_site_image."/product/".$database2-
>Fields("product_picture")); ?>" /> as shown below:

51
1.8.1.14. Then edit a product to get something like below:

1.8.1.15. If you click save when editing there will be an error debug it by
commenting a line in product.edit.php as below as there is no modified
date field in tbl_procuct:

1.8.1.16. Something to notice:

1.8.1.16.1. File name is based on the time and micro time the file is been
uploaded so each time you replace a image new file name will be

52
 given and updated in the database. The filename is returned from
GenerateUniqueFilename( ) function in the class.caFileObj.php
file found in lib folder.
1.8.1.16.2. Image dimension 400*400 px is controlled by following code:
if($fileImageName != false){
list($width, $height, $type, $attr) =
getimagesize($caConfig_documentroot_image."/product/".$fileImageNam
e);
if($width > 400 || $height > 400) {
$fileImageName = "Empty";
$msg .= "Image file has to be less than 400
by 400 Resolution";

} else {
$arr = array ("image" => $fileImageName) ;
$database->Update ($arr,"WHERE
product_id='$product_id'");
}
The above code can be found in product.add.php and product.edit.php.

1.8.1.16.3. Edit and explore yourself to dig in more.

1.9. Recommended Code read

1.9.1. All 12 files in a newly created module that supports file upload as well or
see product module.
1.9.2. Lib folder files: Four files below, it will give you a better idea how
database queries are handled centrally and file operations are carried out.

53
2. Conclusion
This developer guide is a surface guide on using the iTask Content Management
System (CMS), the possibilities are endless and as it has a modular design many
things can be efficiently incorporated in this highly flexible system. The extent of its
can be known when you explore yourself, indulge in some code reading and try. Hit
and trial may also bring out new avenues so start it now.
This guide has be developed to give the kick start only now you are able to do
something develop yourself to a better coder and a better solution provider using
iTask CMS 2.0.

54
References
http://en.wikipedia.org/wiki/Datagrid
http://en.wikipedia.org/wiki/Create%2C_read%2C_update_and_delete
http://en.wikipedia.org/wiki/Spry_framework
http://en.wikipedia.org/wiki/TinyMCE
Thttp://en.wikipedia.org/wiki/Content_management_system

55