Very nice diagram, looks like a fun project!
I believe, you want to understand how the program preview is rendered so you can adapt it to logging. If that is the case, understanding the PHP will be difficult due to the data generation used. To simplify it here is what the data structure should look like:
Line 402 in main.php:
echo "{'start': ".$start.",'end': ".$end.",'className':'".$class."','content':'P".$pid."','group':'".$data["stations"][$sid]."'},";For each object you append a list to an array. The list contains start and end time, content, a group name (station) and optionally a classname.
Line 762 in js/main.js shows how the data is retrieved from the server and rendered.
Github allows making changes and pushing them upstream. It is very easy, all you do is fork my code, push changes to your repository. Once you have a working feature make a pull request and I will approve the merge.
Right now, I show many data points on a graph. Using the preview method you can group them by type (instead of station), maybe?
Personally, I use Sublime on OSX to edit any scripts. For Windows, I believe I used to use Scite.