I progressed putting this code:
var tl;
var eventSource = new Timeline.DefaultEventSource(0);
var eventSource2 = new Timeline.DefaultEventSource(0);
function onLoad() {
var theme1 = Timeline.ClassicTheme.create();
theme1.autoWidth = true;
theme1.mouseWheel = "default";
theme1.firstDayOfWeek=1;
var bandInfos = [
Timeline.createBandInfo({
overview: true,
width: "10%",
intervalUnit: Timeline.DateTime.MONTH,
eventSource: eventSource2,
theme: theme1,
intervalPixels: 100,
timezone: 1
}),Timeline.createBandInfo({
width: "10%",
intervalUnit: Timeline.DateTime.DAY,
//overview: true,
eventSource: eventSource,
theme: theme1,
intervalPixels: 150,
timezone: 1
})
];
bandInfos[0].syncWith = 1;
bandInfos[0].highlight = true;
tl = Timeline.create(document.getElementById("tl"),
bandInfos);
tl.getBand(1).setCenterVisibleDate(Timeline.DateTime.parseGregorianDateTime(new
Date()));
tl.loadJSON("test.php", function(json, url) {
eventSource2.loadJSON(json, url);
tl.finishedEventLoading();
//
tl.getBand(0).setCenterVisibleDate(Timeline.DateTime.parseGregorianDateTime(new
Date()));
});
var da = tl.getBand(1).getCenterVisibleDate();
var date = new Date(da);
var day = date.getDate();
var month = date.getMonth();
var year = date.getFullYear();
tl.loadJSON("test.php?d="+day+"&m="+month+"&y="+year,
function(json, url) {
eventSource.loadJSON(json, url);
tl.finishedEventLoading();
tl.getBand(1).setCenterVisibleDate(Timeline.DateTime.parseGregorianDateTime(new
Date()));
});
var func2 = function(){
window.clearTimeout(initTimer);
var topBand = tl.getBand(1);
topBand.addOnScrollListener( loadData );
}
var initTimer=window.setTimeout(func2,3000);
}
function loadData(){
var band = tl.getBand(1);
if (band._timer !== false) {
window.clearTimeout(band._timer);
band._timer = false;
}
var func = function() {
band.removeOnScrollListener(loadData);
window.clearTimeout(band._timer);
band._timer = false;
var eventSource = band.getEventSource();
eventSource.clear();
var da = band.getCenterVisibleDate();
//alert(da);
var date = new Date(da);
var day = date.getDate();
var month = date.getMonth();
var year = date.getFullYear();
tl.loadJSON("test.php?d="+day+"&m="+month
+"&y="+year, function(json, url) {
eventSource.loadJSON(json, url);
tl.finishedEventLoading();
});
tl.layout();
band.addOnScrollListener(loadData);
};
band._timer = window.setTimeout(func,3000);
}
var resizeTimerID = null;
function onResize() {
if (resizeTimerID == null) {
resizeTimerID = window.setTimeout(function() {
resizeTimerID = null;
tl.layout();
}, 500);
}
}
The problem is i must set a timeout large enough to be sure the data
is loaded (and can be long (4s) when passing through reverse proxy/
firewall) otherwise it start calling the test.php page infinitely.
Also with this solution, when scrolling i wait the settled second
before start to showing data.
--
You received this message because you are subscribed to the Google Groups
"SIMILE Widgets" group.
To post to this group, send email to simile-widgets@googlegroups.com.
To unsubscribe from this group, send email to
simile-widgets+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/simile-widgets?hl=en.
