The next step would be to download the source for jsGantt from jsGantt.com if you wish, but I have also included a full copy of our source code for your reference here and I recommend that you use it. We have made just a few style tweaks that you might find useful, such as being able to hide the data format selector in print preview mode, and we have added the ability to suppress blank windows and to avoid opening unassigned tasks. The choice is ultimately yours.
As our copy of jsGantt is integrated with Feng Office, we opted to place the code for it in /fengoffice/application/views/lab, because the name of the tab it lives on right now is "Labs" (we're in beta). I am including all the files in a zip attachment, called feng_gantt_xx.x.zip, which you will be able to see below if you are logged in to the forum. There are only five files, including the SQL statements needed to set up the database. If you want to include the Gantt chart on its own tab as we did, the instructions are included later in this thread (on page 5) and you can jump there by clicking
here.
Once you decide where to put your files, you will need to open the index.php file and type in your settings for your MySQL database host, database name, user name and password. Search for the string GIMMEGANTT to jump right to that section of the file. You have two options - either you can put your settings right into the index.php file, or you can refer to an include file one level above called "chartglobal.php". Instructions are in the index.php file. If you didn't use the default table prefix "og_" when you installed Feng Office, now would be the time to search and replace "og_" here in the index.php file with the prefix you actually used.
OK, that should be it for file editing. Now let's set up the database to work correctly - you have to create some views, tables, procedures and functions. It sounds like a lot, but there is a SQL program to do it all for you.
The views will select the workspaces, the milestones, the tasks and subtasks, then union them all together into one view - your web page only has to deal with that one view, the others are "behind the scenes workhorses". Everything will be alphabetized and sorted correctly by alphabetical, then start/end date order as appropriate.
If you are upgrading from an earlier version of feng_gantt, you may wish to drop all the related objects first, as they may be orphaned by 10.0. There are several objects we no longer use. All feng_gantt objects start with "my_", so if you do not have any other applications co-mingled with Feng Office, you may be able to safely drop all objects beginning with "my_" - as always, take a backup and use caution if you are not familiar with MySQL.
In your favorite MySQL manager, execute the SQL statements in the file feng_gantt_xx.x.sql (which was included with your html/php files, and which has the version number in place of the xx.x). That will create the necessary views and functions, all of which are prefixed with "my_" to keep them separate from your "og_" objects. The SQL statements assume that your database name is "fengoffice_dev", but if it is not, you should do a global search and replace of "fengoffice_dev" with your actual database name.
These functions and views do NOT write anything to your database, they only read from it, so you don't have to worry about them messing up your Feng Office installation. In fact, if you preferred to install them into their own separate database you could do that as well, as long as you remember to reference your actual Feng Office database in the SQL statements.
Once those views are created and working, your web page should be able to execute. Bring up the index.php file in your browser of choice (Firefox and IE have been tested - FF is much faster for some reason and does better layout), choose the options you want on your form, and then click 'Submit' to view your Gantt chart.
You will have to option to view the chart in a printer-friendly window (without the form showing) and you can also create a new second (or third) window so you can compare more than one Gantt chart side by side.
NOTE: AS UPDATES AND IMPROVEMENTS ARE MADE, THE FILE BELOW WILL ALWAYS BE UPDATED TO REFLECT THE LATEST VERSION SO YOU DO NOT HAVE TO READ THE ENTIRE THREAD. USE AT YOUR OWN RISK - I ASSUME NO RESPONSIBILITY FOR YOUR HARDWARE, SOFTWARE OR DATA.