There's a couple of ways to approach this.
The contents of the popup are created in the fillInfoBubble method of
Timeline.DefaultEventSource.Event.
It calls the fillTime method, which checks if the event is an instant event or
not, and if it is a precise or imprecise event.
The timestamp shown in the popup is created by calling the labelPrecise method
of the labeller in use by the band.
The easiest way to get what you want is to override the labelPrecise method:
In timeline_2.3.1 webapp/api/scripts/labellers.js:
Timeline.GregorianDateLabeller.prototype.labelPrecise = function(date) {
return SimileAjax.DateTime.removeTimeZoneOffset(
date,
this._timeZone //+ (new Date().getTimezoneOffset() / 60)
).toUTCString();
};
.toUTCString() produces the full date/time: Mon, 29 Aug 2011 17:40:39 GMT
You want to use something other than .toUTCString()
For example, you could use .toLocaleDateString() which would give: "08/29/2011"
Timeline.GregorianDateLabeller.prototype.labelPrecise = function(date) {
return SimileAjax.DateTime.removeTimeZoneOffset(
date,
this._timeZone //+ (new Date().getTimezoneOffset() / 60)
).toLocaleDateString();
};
Or you can use any other date format you like:
Timeline.GregorianDateLabeller.prototype.labelPrecise = function(date) {
var newDate = SimileAjax.DateTime.removeTimeZoneOffset(
date,
this._timeZone)
var dateLabel = MyCustomDateFormat(newDate);
return dateLabel;
};
I'd recommend Steven Levithan's date.format.js script for most date formats:
http://stevenlevithan.com/assets/misc/date.format.js
However, this option is really overriding the intent of labelPrecise() and
turning it into labelApproximate()
I'd leave labelPrecise() alone, make a new method:
Timeline.GregorianDateLabeller.prototype.labelCustomFormat =
function(date,format) {
var format = format || "mm/dd/yy"; // <- default date format is none given
return SimileAjax.DateTime.removeTimeZoneOffset(
date,
this._timeZone //+ (new Date().getTimezoneOffset() / 60)
).format(format); // <- be sure to use date.format.js
};
And change the fillTime method to use this instead:
Timeline.DefaultEventSource.Event.prototype.fillTime = function(elmt, labeller)
{
if (this._instant) {
if (this.isImprecise()) {
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelCustomFormat(this._start)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelCustomFormat(this._end)));
} else {
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelCustomFormat(this._start)));
}
} else {
if (this.isImprecise()) {
elmt.appendChild(elmt.ownerDocument.createTextNode(
labeller.labelCustomFormat(this._start) + " ~ " +
labeller.labelCustomFormat(this._latestStart)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(
labeller.labelCustomFormat(this._earliestEnd) + " ~ " +
labeller.labelCustomFormat(this._end)));
} else {
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelCustomFormat(this._start)));
elmt.appendChild(elmt.ownerDocument.createElement("br"));
elmt.appendChild(elmt.ownerDocument.createTextNode(labeller.labelCustomFormat(this._end)));
}
}
}
A good place for custom date formats would be in your theme object.
myTheme.event.bubble.dateFormat = "dddd, mmmm d, yyyy";
Then you can use this when you need dates in a special format:
labeller.labelCustomFormat(this._start,myTheme.event.bubble.dateFormat);
Again, I'd recommend against changing the source code of Timeline itself,
either in the sources file or the bundle.
Instead, load timeline normally, then load your customized overrides. Will save
future headaches when it comes time to update your code.
--Mike
On Aug 27, 2011, at 2:01 PM, John Charles wrote:
> I want to display events on my timeline with only basic information. I
> do not need the exact time of the event, only the date. Is there a way
> to remove the time from the popup but keep the date in tact?
>
> You can see the live timeline here:
> http://www.dalefarmeviction.com/dale-farm-timeline/
>
> It is a work in progress!
--
You received this message because you are subscribed to the Google Groups
"SIMILE Widgets" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/simile-widgets?hl=en.
