Forums / Setup & design / Javascript Timeline, xml and eZ publish

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

eZ debug

Timing: Jan 20 2025 05:57:58
Script start
Timing: Jan 20 2025 05:57:58
Module start 'content'
Timing: Jan 20 2025 05:57:59
Module end 'content'
Timing: Jan 20 2025 05:57:59
Script end

Main resources:

Total runtime1.1914 sec
Peak memory usage4,096.0000 KB
Database Queries203

Timing points:

CheckpointStart (sec)Duration (sec)Memory at start (KB)Memory used (KB)
Script start 0.00000.0055 589.0703180.8281
Module start 'content' 0.00551.0566 769.8984592.8281
Module end 'content' 1.06210.1292 1,362.7266341.3828
Script end 1.1913  1,704.1094 

Time accumulators:

 Accumulator Duration (sec) Duration (%) Count Average (sec)
Ini load
Load cache0.00410.3452210.0002
Check MTime0.00150.1249210.0001
Mysql Total
Database connection0.00080.066710.0008
Mysqli_queries1.108093.00292030.0055
Looping result0.00180.15432010.0000
Template Total1.158597.220.5792
Template load0.00210.172320.0010
Template processing1.156497.064620.5782
Template load and register function0.00020.019310.0002
states
state_id_array0.00110.092310.0011
state_identifier_array0.00080.071220.0004
Override
Cache load0.00180.1483450.0000
Sytem overhead
Fetch class attribute can translate value0.00160.130930.0005
Fetch class attribute name0.00100.081170.0001
XML
Image XML parsing0.00270.229130.0009
class_abstraction
Instantiating content class attribute0.00000.001490.0000
General
dbfile0.01070.8986280.0004
String conversion0.00000.000430.0000
Note: percentages do not add up to 100% because some accumulators overlap

CSS/JS files loaded with "ezjscPacker" during request:

CacheTypePacklevelSourceFiles
CSS0extension/community/design/community/stylesheets/ext/jquery.autocomplete.css
extension/community_design/design/suncana/stylesheets/scrollbars.css
extension/community_design/design/suncana/stylesheets/tabs.css
extension/community_design/design/suncana/stylesheets/roadmap.css
extension/community_design/design/suncana/stylesheets/content.css
extension/community_design/design/suncana/stylesheets/star-rating.css
extension/community_design/design/suncana/stylesheets/syntax_and_custom_tags.css
extension/community_design/design/suncana/stylesheets/buttons.css
extension/community_design/design/suncana/stylesheets/tweetbox.css
extension/community_design/design/suncana/stylesheets/jquery.fancybox-1.3.4.css
extension/bcsmoothgallery/design/standard/stylesheets/magnific-popup.css
extension/sevenx/design/simple/stylesheets/star_rating.css
extension/sevenx/design/simple/stylesheets/libs/fontawesome/css/all.min.css
extension/sevenx/design/simple/stylesheets/main.v02.css
extension/sevenx/design/simple/stylesheets/main.v02.res.css
JS0extension/ezjscore/design/standard/lib/yui/3.17.2/build/yui/yui-min.js
extension/ezjscore/design/standard/javascript/jquery-3.7.0.min.js
extension/community_design/design/suncana/javascript/jquery.ui.core.min.js
extension/community_design/design/suncana/javascript/jquery.ui.widget.min.js
extension/community_design/design/suncana/javascript/jquery.easing.1.3.js
extension/community_design/design/suncana/javascript/jquery.ui.tabs.js
extension/community_design/design/suncana/javascript/jquery.hoverIntent.min.js
extension/community_design/design/suncana/javascript/jquery.popmenu.js
extension/community_design/design/suncana/javascript/jScrollPane.js
extension/community_design/design/suncana/javascript/jquery.mousewheel.js
extension/community_design/design/suncana/javascript/jquery.cycle.all.js
extension/sevenx/design/simple/javascript/jquery.scrollTo.js
extension/community_design/design/suncana/javascript/jquery.cookie.js
extension/community_design/design/suncana/javascript/ezstarrating_jquery.js
extension/community_design/design/suncana/javascript/jquery.initboxes.js
extension/community_design/design/suncana/javascript/app.js
extension/community_design/design/suncana/javascript/twitterwidget.js
extension/community_design/design/suncana/javascript/community.js
extension/community_design/design/suncana/javascript/roadmap.js
extension/community_design/design/suncana/javascript/ez.js
extension/community_design/design/suncana/javascript/ezshareevents.js
extension/sevenx/design/simple/javascript/main.js

Templates used to render the page:

UsageRequested templateTemplateTemplate loadedEditOverride
1node/view/full.tplfull/forum_topic.tplextension/sevenx/design/simple/override/templates/full/forum_topic.tplEdit templateOverride template
6content/datatype/view/ezxmltext.tpl<No override>extension/community_design/design/suncana/templates/content/datatype/view/ezxmltext.tplEdit templateOverride template
13content/datatype/view/ezxmltags/paragraph.tpl<No override>extension/ezwebin/design/ezwebin/templates/content/datatype/view/ezxmltags/paragraph.tplEdit templateOverride template
3content/datatype/view/ezxmltags/literal.tpl<No override>extension/community/design/standard/templates/content/datatype/view/ezxmltags/literal.tplEdit templateOverride template
3content/datatype/view/ezimage.tpl<No override>extension/sevenx/design/simple/templates/content/datatype/view/ezimage.tplEdit templateOverride template
7content/datatype/view/ezxmltags/line.tpl<No override>design/standard/templates/content/datatype/view/ezxmltags/line.tplEdit templateOverride template
1pagelayout.tpl<No override>extension/sevenx/design/simple/templates/pagelayout.tplEdit templateOverride template
 Number of times templates used: 34
 Number of unique templates used: 7

Time used to render debug report: 0.0001 secs