Forums / Setup & design / Javascript Timeline, xml and Exponential

"Please Note:
  • At the specific request of Ibexa we are changing this projects name to "Exponential" or "Exponential (CMS)" effective as of August, 11th 2025.
  • This project is not associated with the original eZ Publish software or its original developer, eZ Systems or Ibexa".

Javascript Timeline, xml and Exponential

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 Exponential 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