<%@ page import="dbnp.studycapturing.EventGroup" %>
<%@ page import="dbnp.studycapturing.Subject" %>
/*
* Creates timeline bands for displaying different timelines
*
* @returns array with BandInfo objects, as described on http://simile-widgets.org/wiki/Timeline_GettingStarted
*/
function createTimelineBands( timelineNr ) {
var bandInfos = [];
var eventSources = [];
var overviewEventSource = new Timeline.DefaultEventSource();
// The way the timeline should look. See http://www.linuxjournal.com/article/9301
var theme = Timeline.ClassicTheme.create();
var emptyEtherPainter = new Timeline.EmptyEtherPainter( { theme: theme } )
// Now create the bands for all studies, and add them to one timeline
// Multiple timelines on one page do not seem to work
// The date that the timeline should start on
var dateStr = "";
firstDate = new Date ( dateStr );
//------------- Eventgroup overview ---------------
// Add an empty band to show the dates
bandInfos[${bandNr}] =
Timeline.createBandInfo({
width: 40,
intervalUnit: Timeline.DateTime.DAY,
intervalPixels: 40,
showEventText: false,
date: firstDate,
timeZone: +1,
layout: 'original',
theme: theme
});
// Make sure the date is printed using the relative time
bandInfos[${bandNr}].etherPainter = new Timeline.RelativeDateEtherPainter( { theme: theme, startDate: firstDate, unit: Timeline.DateTime.DAY } );
bandInfos[${bandNr}].labeller = new Timeline.RelativeDateLabeller( "en", 0, firstDate );
bandTitleInfo[ timelineNr ][ ${bandNr} ] = {
title: "${study.title}",
subjects: "",
className: "studytitle"
};
<%
def sortedEventGroups = study.eventGroups.sort( { a, b ->
return a.name <=> b.name;
} as Comparator );
def orphans = study.getOrphanEvents();
if( orphans?.size() > 0 ) {
sortedEventGroups.add( new EventGroup(
id: -1,
name: 'No group',
events: orphans,
subjects: []
));
}
%>
//------------- Eventgroup ${bandNr} ---------------
// Create an eventsource for all events
eventSources[${bandNr}] = new Timeline.DefaultEventSource();
// Load events for this eventsource (using jquery)
var event_url = '${createLink(controller:'study', action:'events', id:( eventGroup.id ? eventGroup.id : -1 ), params: [ startDate: study.startDate.getTime(), study: study.id ])}';
$.getJSON(event_url, $.callback( _loadJSONEvents, [0, ${bandNr}, eventSources[${bandNr}], overviewEventSource, event_url] ) );
// Create a new timeline band
bandInfos[${bandNr}] =
Timeline.createBandInfo({
eventSource: eventSources[${bandNr}],
width: 30,
intervalUnit: Timeline.DateTime.DAY,
intervalPixels: 40,
date: firstDate,
timeZone: +1,
syncWith: 1,
layout: 'original',
theme: theme
});
// Make sure the date isn't printed by using the empty ether painter
bandInfos[${bandNr}].etherPainter = emptyEtherPainter;
// Add a title to the bandinfo
<%
ArrayList sortedGroupSubjects = eventGroup.subjects.sort( { a, b -> a.name <=> b.name } as Comparator );
// We can only show appr. 30 characters per line and as many lines as there are events
def charsPerLine = 30;
def numEvents = eventGroup.events?.size();
Integer maxChars = new Integer( numEvents * charsPerLine );
showSubjects = Subject.trimSubjectNames( sortedGroupSubjects, maxChars );
%>
bandTitleInfo[ timelineNr ][ ${bandNr} ] = {
title: "${eventGroup.name}",
className: "no_group",
subjects: "${showSubjects}"
};
// Synchronize all bands
bandInfos[${i + datesBandNr +1}].syncWith = ${datesBandNr};
return bandInfos;
}