Timeline CustomEventClickHandler

If you want to use your own handler instead of showing the bubble when clicking on an event, use the following Javascript code after loading the .js files:

Timeline.OriginalEventPainter.prototype._showBubble = function(x, y, evt) { alert (evt.getDescription ); }

In this example just an alert is generated when you click on an event, instead of the usual bubble being shown.

If you would like to have a page load when the user clicks on an event, instead of a bubble, use the following code after loading your timeline:

Timeline.OriginalEventPainter.prototype._showBubble = function(x, y, evt) { document.location.href=evt.getLink; }

Beware that both of these calls can limit functionality. When a user clicks inside of the containing div (which is displaying as a block, so it may extend outside of the title), the action will execute. Since the same area can be used for navigating through the Timeline, there may be a inadvertent calls to the showBubble function.

Comment by litobyte...@gmail.com, Jul 11, 2009
This works only with the Original Event Painter, I tried. But when I tried the same with the Compact Event Painter an error was rised by firebug and the instruction was not executed.

The code follows:

Timeline.CompactEventPainter.prototype._showBubble = function(x, y, evt) { document.location.href=evt.getLink; } error: evt.getLink is not a function

Here is my patch for timeline-bundle.js from line 785 to line 806:
basically you replace the four methods

onClickInstantEvent, onClickMultiplePreciseInstantEvent onClickDurationEvent showBubble

In the CompactEventPainter??.prototype

Timeline.CompactEventPainter.prototype._onClickMultiplePreciseInstantEvent=function(E,A,B){var F=SimileAjax.DOM.getPageCoordinates(E); this._showBubble(F.left+Math.ceil(E.offsetWidth/2),F.top+Math.ceil(E.offsetHeight/2),B); var D=[]; for(var C=0; C<B.length; C++){D.push(B[C].getID); }this._fireOnSelect(D); A.cancelBubble=true; SimileAjax.DOM.cancelEvent(A); return false; }; Timeline.CompactEventPainter.prototype._onClickInstantEvent=function(C,A,B){var D=SimileAjax.DOM.getPageCoordinates(C); this._showBubble(D.left+Math.ceil(C.offsetWidth/2),D.top+Math.ceil(C.offsetHeight/2),B); this._fireOnSelect(B.getID); A.cancelBubble=true; SimileAjax.DOM.cancelEvent(A); return false; }; Timeline.CompactEventPainter.prototype._onClickDurationEvent=function(F,B,C){if("pageX" in B){var A=B.pageX; var E=B.pageY; }else{var D=SimileAjax.DOM.getPageCoordinates(F); var A=B.offsetX+D.left; var E=B.offsetY+D.top; }this._showBubble(A,E,C); this._fireOnSelect(C.getID); B.cancelBubble=true; SimileAjax.DOM.cancelEvent(B); return false; }; Timeline.CompactEventPainter.prototype.showBubble=function(A){var B=this._eventIdToElmt[A.getID]; if(B){var C=SimileAjax.DOM.getPageCoordinates(B); this._showBubble(C.left+B.offsetWidth/2,C.top+B.offsetHeight/2,A); }};

It doesn't break the defeault Bubble behaviour, but it allows finally to extend the method showBubble for CompactEventPainter.

The difference was just the square brackets around the B and A where this letters are the events passed. I removed them and written as they were in other Painters.

That's it. Bug gone.

Can somebody take this on ? I'm too lazy to checkout the file :-P