Javascript Timeline, xml and eZ publish

Author Message

Softriva .com

Friday 22 June 2007 9:43:44 am

Dears

I am planing to use an AJAXy gadget called timeline from (http://simile.mit.edu/timeline/ ). This gadget requires reading an xml file to generate the timeline.

How can I make ez publish generate an xml file for the timeline to read.

see the bold line below shows how the Javascript reads the xml file

<b>Timeline.loadXML("/design/ar/javascript/ks-ksa.xml", function(xml, url) { eventSource.loadXML(xml, url); });</b>

 var tl;
function onLoad() {
		var eventSource = new Timeline.DefaultEventSource(0);
		
		var theme = Timeline.ClassicTheme.create();
		theme.event.bubble.width = 320;
		theme.event.bubble.height = 220;
		var d = Timeline.DateTime.parseGregorianDateTime("2000")
		var bandInfos = [
				Timeline.createBandInfo({
						width:          "100%", 
						intervalUnit:   Timeline.DateTime.YEAR, 
						intervalPixels: 200,
						eventSource:    eventSource,
						date:           d,
						theme:          theme
				})
		];
		
tl = Timeline.create(document.getElementById("kstl"), bandInfos, Timeline.HORIZONTAL);
Timeline.loadXML("/design/ar/javascript/ks-ksa.xml", function(xml, url) { eventSource.loadXML(xml, url); });
}
var resizeTimerID = null;
function onResize() {
		if (resizeTimerID == null) {
				resizeTimerID = window.setTimeout(function() {
						resizeTimerID = null;
						tl.layout();
				}, 500);
		}
}

 

André R.

Friday 22 June 2007 2:28:48 pm

Simplified example of your script (removed on resize)

 var tl, my_second_param = 'node_id:33456', tlXmlUrl = {'mymodul/myview/myfirst_param'|ezurl()} + '/' + my_second_param;

{literal}
function onLoad() {

                var eventSource = new Timeline.DefaultEventSource(0);
                var theme = Timeline.ClassicTheme.create();
                theme.event.bubble.width = 320;
                theme.event.bubble.height = 220;
                var d = Timeline.DateTime.parseGregorianDateTime("2000")
                var bandInfos = [
                                Timeline.createBandInfo({
                                                width:         "100%", 
                                                intervalUnit:  Timeline.DateTime.YEAR, 
                                                intervalPixels: 200,
                                                eventSource:   eventSource,
                                                date:          d,
                                                theme:         theme
                                                                  })
                                       ];
                tl = Timeline.create(document.getElementById("kstl"), bandInfos, Timeline.HORIZONTAL);
                Timeline.loadXML( tlXmlUrl, function(xml, url) {                 
                                eventSource.loadXML(xml, url);
                });
}
{/literal}

So create your own extension with a module and the views you need, for example 'timeline/xml', and output anything you need from php.

Unless the xml is static, in that case I would use ezdesign or ezroot operator on the uri, point it to the file and make sure that apache rewrite rules allow xml files.

eZ Online Editor 5: http://projects.ez.no/ezoe || eZJSCore (Ajax): http://projects.ez.no/ezjscore || eZ Publish EE http://ez.no/eZPublish/eZ-Publish-Enterprise-Subscription
@: http://twitter.com/andrerom

Softriva .com

Saturday 23 June 2007 2:17:49 am

Dear

This is the start. Can you give me more info on how to it. Any further information is appreciated.

[Edit]: No it is not static.

OOzy

André R.

Saturday 23 June 2007 2:44:07 pm

I have no intension's to solve the problem ( witch in practice means writing the whole extension ) for you..
But if you can specify what your struggling with, the forum is the right place :)

But I guess your asking how to generate xml from ez content?
If so there are many answears:
* use one of the xml output extensions
*write your own, where you fetch the content you need and generate xml off it

For the last one, some examples:
fetching examples: http://zev.ez.no/svn/extensions/ezjaxx/extension/ezjaxx/modules/jaxx/expand.php

    $node_array = eZContentObjectTreeNode::subTree(
        array( 'Depth' => 1,
               'Limit'            => $maxNodes,
               'Offset'           => 0,
               'SortBy'           => $sort_array,
               'DepthOperator'    => 'eq',
               'ClassFilterType'  => 'include',
               'ClassFilterArray' => $showClasses
               ), $nodeID );

ezxml example: http://zez.org/article/articleprint/76/
(but you can concat the xml manually as a string if you want)

eZ Online Editor 5: http://projects.ez.no/ezoe || eZJSCore (Ajax): http://projects.ez.no/ezjscore || eZ Publish EE http://ez.no/eZPublish/eZ-Publish-Enterprise-Subscription
@: http://twitter.com/andrerom

Softriva .com

Sunday 24 June 2007 7:44:56 am

André

Please excuse my ignorance. The thing that I am still not sure how to do is in a simple terms
" pass the xml data to the timeline javascrip code". Simply, I will fetch the data from ez then pass on to the timeline javascript. This what I am not sure how to do!!

André R.

Sunday 24 June 2007 1:16:44 pm

If you are talking about client side:
This depends on witch ajax/javascript library you use, but from what I understood from you code, timeline does this for you.
Timeline.loadXML("/design/ar/javascript/ks-ksa.xml",....

Serve side:
You need to fetch whatever data that goes into your timeline and create the xml timeline needs out of that fetched content.

eZ Online Editor 5: http://projects.ez.no/ezoe || eZJSCore (Ajax): http://projects.ez.no/ezjscore || eZ Publish EE http://ez.no/eZPublish/eZ-Publish-Enterprise-Subscription
@: http://twitter.com/andrerom

Powered by eZ Publish™ CMS Open Source Web Content Management. Copyright © 1999-2014 eZ Systems AS (except where otherwise noted). All rights reserved.

eZ debug

Timing: Jan 20 2025 06:42:45
Script start
Timing: Jan 20 2025 06:42:45
Module start 'layout'
Timing: Jan 20 2025 06:42:45
Module start 'content'
Timing: Jan 20 2025 06:42:45
Module end 'content'
Timing: Jan 20 2025 06:42:46
Script end

Main resources:

Total runtime0.0180 sec
Peak memory usage2,048.0000 KB
Database Queries3

Timing points:

CheckpointStart (sec)Duration (sec)Memory at start (KB)Memory used (KB)
Script start 0.00000.0059 589.2734152.6406
Module start 'layout' 0.00590.0038 741.914139.4766
Module start 'content' 0.00970.0059 781.390697.4609
Module end 'content' 0.01560.0024 878.851642.3047
Script end 0.0180  921.1563 

Time accumulators:

 Accumulator Duration (sec) Duration (%) Count Average (sec)
Ini load
Load cache0.002915.8372140.0002
Check MTime0.00137.2552140.0001
Mysql Total
Database connection0.00084.272510.0008
Mysqli_queries0.003217.631830.0011
Looping result0.00000.117610.0000
Template Total0.002011.110.0020
Template load0.00105.654810.0010
Template processing0.00105.453910.0010
Override
Cache load0.00063.513910.0006
General
dbfile0.00031.420680.0000
String conversion0.00000.059540.0000
Note: percentages do not add up to 100% because some accumulators overlap

Templates used to render the page:

UsageRequested templateTemplateTemplate loadedEditOverride
1print_pagelayout.tpl<No override>extension/community/design/community/templates/print_pagelayout.tplEdit templateOverride template
 Number of times templates used: 1
 Number of unique templates used: 1

Time used to render debug report: 0.0001 secs