Formatting dates on event bubbles

I haven't figured out how to reformat the time & date. However, in timeline/api/bundle.css you can add a visibility property to the .timeline-event-bubble-time class.

Change from ...

.timeline-event-bubble-time {
    color: #aaa;
}

to ...

.timeline-event-bubble-time {
     visibility: hidden;
}

Solution (slightly modified post from http://groups.google.com/group/simile-widgets/browse_thread/thread/1d1af...):

Works in D6 (with Timeline 1.2 i think)

1. open modules/timeline/api/bundle.js

2. MAKE A COPY of bundle.js and save it somewhere in case you modify something and need an original to revert back to.

3. search for, or look around line 4247 for the following text/code (may be different for you if you have a different version): fillTime:function

4. replace the code here:

if(this._instant){
if(this.isImprecise()){
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._start)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._end)));
}else{
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._start)));
}
}else{
if(this.isImprecise()){
elmt.appendChild(elmt.ownerDocument.createTextNode(
labeller.labelPrecise(this._start)+" ~ "+labeller.labelPrecise(this._latestStart)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(
labeller.labelPrecise(this._earliestEnd)+" ~ "+labeller.labelPrecise(this._end)));
}else{
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._start)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._end)));

with this code:

/* new code! adds some variables and removes TimeStamp from Timeline pop-up bubble. see old code below */
var startLabPrec=labeller.labelPrecise(this._start);
var endLabPrec=labeller.labelPrecise(this._end);
var fStart = new Date(startLabPrec);
var fEnd = new Date(endLabPrec);
var fStartString =  (fStart.getMonth()+1) + "/" + fStart.getDate() + "/" + fStart.getFullYear();
var fEndString = (fEnd.getMonth()+1)+ "/" + fEnd.getDate()  + "/" + fEnd.getFullYear();

if(this._instant)
{
if(this.isImprecise())
{
elmt.appendChild(elmt.ownerDocument.createTextNode(fStartString+" - "+fEndString));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
}
else
{
elmt.appendChild(elmt.ownerDocument.createTextNode(fStartString));
}
}
else
{
if(this.isImprecise())
{
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._earliestStart)+" ~ "+labeller.labelPrecise(this._latestStart)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._earliestEnd)+" ~ "+labeller.labelPrecise(this._latestEnd)));
}
else{elmt.appendChild(elmt.ownerDocument.createTextNode(fStartString +" - "+fEndString));
elmt.appendChild(elmt.ownerDocument.createElement("br")); 
/* end new code, see old code below */

 
/* old code, see new code above */
/* all of this code is commented out (it's the original code in case you need to go back to normal view with Times showing)
if(this._instant){
if(this.isImprecise()){
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._start)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._end)));
}else{
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._start)));
}
}else{
if(this.isImprecise()){
elmt.appendChild(elmt.ownerDocument.createTextNode(
labeller.labelPrecise(this._start)+" ~ "+labeller.labelPrecise(this._latestStart)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(
labeller.labelPrecise(this._earliestEnd)+" ~ "+labeller.labelPrecise(this._end)));
}else{
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._start)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelPrecise(this._end)));
*/
/* old code, see new code above */

5. save bundle.js

6. refresh timeline, clear cache, etc. to see changes

The lines you should pay particular attention to if you want to try to hack this even more, are:

var fStartString =  (fStart.getMonth()+1) + "/" + fStart.getDate() + "/" + fStart.getFullYear();
var fEndString = (fEnd.getMonth()+1)+ "/" + fEnd.getDate()  + "/" + fEnd.getFullYear();

if you switch (fStart.getMonth()+1) with fStart.getDate(), that will reverse the display of the Month or Date being first (11/30/2008 vs 30/11/2008). you can change "/" to "." if youd rather see "11.30.2008" instead of "11/30/2008"

Make sure you preserve Start and End variables in those two lines... don't mix up the one line which is for start date and the other which is for end date, i would just change them both accordingly. my events only have one date and i still changed both just in case, because it's easy and will allow me to have an end date in the future if i want, without trying to remember how i did this in the first place.

also, my bundle.js has: fillTime:function(elmt,labeller){
if yours has different variables instead of "elmt" and "labeller" inside the parenthesis, then in the following code above youll need to replace all instances of elmt with whatever your first variable is (______, ) and labeller with whatever your second variable is ( ,______)

-Bill

I would hide the whole dates via CSS:

.timeline-event-bubble-time {
  display: none;
}

and then theme and configure the dates and their format via the cck date fields and views.