gww>Chieftain Alex at 22:19, 11 September 2026

2026-09-11T22:19:39Z

New page

<noinclude>{{TOCright}}
== Description ==
This widget displays the remaining for the current event, or time until the next event. This widget should be used via the wrapper template {{tl|Event countdown widget}} to track usage.

The widget/wrapper template can however only be used in combination with {{tl|Event countdown}}, as the widget itself does not produce an output, it only modifies the output of the other template.

== Usage ==
=== Parameters ===
This widget has no parameters.

=== Data attributes used ===
; data-name
: Optional. Displayed text for what starts (default: <tt>The event</tt>)
; data-displayutc
: The time (UTC) to begin displaying the event timer.
; data-startutc
: The event start time (UTC).
; data-endutc
: The event end time (UTC).
; data-interval
: The number of minutes between the beginning of each event (default: <tt>180</tt>)
; data-duration
: Optional. The duration of each repetitions in minutes (default: <tt>30</tt>)

== Example wikicode ==
<pre>
{{Event countdown
| [[#Schedule|Wintersday finale]] in Lion's Arch
| displayutc = Jul 1 {{CURRENTYEAR}} 00:00
| startutc = Jul 1 {{CURRENTYEAR}} 08:01
| endutc = Jul 2 {{CURRENTYEAR}} 08:01
| interval = 180
| duration = 15
| margin-top = -3.65em
| border-bottom = 1px solid #AAA
}}
{{Event countdown
| Wintersday finale in Kamadan
| displayutc = Jul 1 {{CURRENTYEAR}} 00:00
| startutc = Jul 1 {{CURRENTYEAR}} 08:16
| endutc = Jul 2 {{CURRENTYEAR}} 08:16
| interval = 180
| duration = 15
| margin-top = -1.95em
| border-bottom = 1px solid #AAA
}}
{{Event countdown widget}}
</pre>

[[Category:Widgets]]
</noinclude><includeonly><script>
/* Guild Wars Wiki: Event timer */
// Main function
function eventCountdown() {
// Repeat this for every countdown timer
$.each( $('.event-countdown'), function(i,v){

// Input parameters and defaults
var display_utc = new Date(v.attributes['data-displayutc'].value) || new Date('01 Jul 2018 00:00 UTC'); // display timer from this time onwards
var start_utc = new Date(v.attributes['data-startutc'].value) || new Date('01 Jul 2018 08:01 UTC'); // start time of first event
var end_utc = new Date(v.attributes['data-endutc'].value) || new Date('02 Jul 2018 08:16 UTC'); // end time of last event
var duration_min = Number(v.attributes['data-duration'].value) || 30; // duration of event, in minutes
var interval_min = Number(v.attributes['data-interval'].value) || 180; // time between the beginning of each event, in minutes
var name = v.attributes['data-name'].value || 'The event';

// Calculated parameters (part 1)
var now_utc = new Date();

var now_ms = now_utc.valueOf();
var display_ms = display_utc.valueOf();
var start_ms = start_utc.valueOf();
var end_ms = end_utc.valueOf();

// Check if timer should be showing -- if not, quit
if (now_ms < display_ms || now_ms > end_ms) {
$(v).addClass('hide');
return;
}

// Calculated parameters (part 2)
var duration_ms = duration_min * 60 * 1000;
var interval_ms = interval_min * 60 * 1000;

var cycle = (now_ms - start_ms) / interval_ms; // has lots of decimals

var cycle_event_start_ms = start_ms + ( interval_ms * Math.floor(cycle) );
var cycle_event_end_ms = cycle_event_start_ms + duration_ms;
var cycle_end_ms = cycle_event_start_ms + interval_ms;

// Calculated parameters for display (part 3)
var now_min = now_ms / (1000 * 60);
var cycle_event_end_min = cycle_event_end_ms / (1000 * 60);
var cycle_end_min = cycle_end_ms / (1000 * 60);

// Calculate if the current event has finished
if (now_min > cycle_event_end_min) {
// If an event has ended, display the time until the next event, in minutes
var text = name + ' starts in ' + timeText(cycle_end_min - now_min) + '.';
} else {
// If an event is ongoing, display the time remaining, in minutes
var text = name + ' has started. ' + timeText(cycle_event_end_min - now_min) + ' until the current event ends.';
}
$(v).text(text);
});
}

// Helper function to format time text from numerical minutes into words
function timeText(minutes) {
minutes = Math.floor(minutes);

// Calculated parameters
var m = minutes % 60;
var h = Math.floor(minutes/60);
var text = '';

// Check if less than a minute to go
if ( minutes < 1) {
text = 'less than a minute';
return text;
} else if (m > 0 && h > 0) {
text = h + ' hour' + (h > 1 ? 's' : '') + ' and ' + m + ' minute' + (m > 1 ? 's' : '');
} else if (m == 0 && h > 0) {
text = h + ' hour' + (h > 1 ? 's' : '');
} else if (m > 0 && h == 0) {
text = m + ' minute' + (m > 1 ? 's' : '');
}
return text;
}

// DEFER LOADING SCRIPT UNTIL JQUERY IS READY. WAIT 40MS BETWEEN ATTEMPTS.
function defer(method) {
if (window.jQuery) {
method();
} else {
setTimeout(function() { defer(method) }, 40);
}
}

// INITIALISATION
defer(function () {
// Run once immediately
eventCountdown();
// Then run again every 60 seconds
setInterval(eventCountdown, 60*1000);
});
</script></includeonly>

Widget:Event countdown - Revision history

gww>Chieftain Alex at 22:19, 11 September 2026