Timezoneconverter
This is the documentation for the tool TimeZoneConverter. Due to the 2020 global health crisis, more Wikimedia events happen online. Since the Wikimedia community is global, this means that people participate from different time zones. To make it easier for the participants, this tool allows displaying times and dates in the time zone of the user. Further, it also converts UTC time into the local time of the user, thus improving the convenience of working within this multilingual community.
Installation
editTo see dates in your time zone add this to your common.js:
mw.loader.load("https://meta.wikimedia.org/w/index.php?title=User:Michael Schönitzer (WMDE)/timezoneconverter.js&action=raw&bcache=1&maxage=86400&ctype=text/javascript");
Usage on a page
editIf you want to use timezoneconverter at you wikipage, you have two options. You can also mix them – for example use the templates and only fall back to the manual form if needed.
With Templates (easier)
edit- Add the following to activate timezoneconverter:
{{timezoneconverter}}
- Add your events with one of the following ways:
{{TZC event|2020|06|01|15|48}}
{{TZC event|year=2020|month=06|day=01|hour=15|minute=48}}
- Optional add an option
format
:
timeonly
to get only the time without datedateonly
to get only the date without timedaytime
to get the day of the week and time – needs additional parameterweekday
dtime
to get the abbreviated day of the week and time – needs additional parameterweekday
houronly
to get only the hour
Manual (more flexible)
edit- Add the following elements:
- <div id="tzc-timezoneconverter"> <div id="tzc-disabled"> Text to display if Tool is off </div> <div id="tzc-enabled" style="display:none;"> Text for when the tool is used <span class="tzc-timezonename"></span> (UTC<span class="tzc-timezoneoffset"></span>) <span class="tzc-locale"></span> </div> </div>
- Can be of any HTML-type (<div>, <span>, <p>…)
- This will enable the script on the given site
- The text in the element
tzc-disabled
will be shown to people that don't use the tool, tzc-timezonename
will be filled with the name of the time zonetzc-timezoneoffset
will be filled with the offset compared to UTCtzc-locale
will be filled with the name of the locale
- Add your events like the following
<time datetime="2020-06-01T14:48:00.000+00:00">2020-06-01 14:48</time>
- The
datetime
contains the date that will be used. - The
datetime
has to be in extended ISO 8601 format as above! Other formats will work in some browsers but be incorrect on others! - The content of the element (div) is the text shown to people who don't use the tool – it is ignored by the tool and can therefore be of any form.
- Optional: Add class
tzc-timeonly
to get only the time without date - Optional: Add class
tzc-dateonly
to get only the date without time - Optional: Add class
tzc-daytime
to get the day of the week and time - Optional: Add class
tzc-dtime
to get the abbreviated day of the week and time - Optional: Add class
tzc-houronly
to get only the hour
- Alternatively you can add events like this:
<div class="tzc-event" data-datetime="2020-06-01T14:48:00.000+00:00">2020-06-01 14:48</div>
- Can be of any HTML-type (<div>, <span>, <p>…)
- The class
tzc-event
tells the tool that this is a time that should be converted. - Use
data-datetime
instead ofdatetime
. - Every thing else works as in 2.
- Alternatively you can add events with the template Event.
Example
editCode | Displayed | Option |
---|---|---|
{{TZC event|2020|06|01|15|48}} | - | |
{{TZC event|year=2020|month=06|day=01|hour=15|minute=48}} | - | |
<time datetime="2020-06-01T14:48:00.000+00:00">2020-06-01 14:48</time> | - | |
<div class="tzc-event" data-datetime="2020-06-01T14:48:00.000+00:00">2020-06-01 14:48</div> | 2020-06-01 14:48
|
- |
{{TZC event|2020|06|01|15|48|format=dateonly}} | dateonly | |
{{TZC event|2020|06|01|15|48|format=timeonly}} | timeonly | |
{{TZC event|2020|06|01|15|48|format=daytime|weekday=Monday}} | daytime | |
{{TZC event|2020|06|01|15|48|format=dtime|weekday=Mo}} | dtime | |
{{TZC event|2020|06|01|15|48|format=houronly}} | houronly | |
{{TZC event|2020|06|01|15|48|showtimezone=name}} | (UTC) | - |
<span class="tzc-timezonename">UTC</span> | UTC | - |
About
editThis tool was proposed by User:Lea Lacroix (WMDE) and initially written by Michael Schönitzer (WMDE). Feedback and improvements are welcome.
This tool consists of:
- {{timezoneconverter}} – template to easily activate the tool on a wiki page.
- This template is translatable. Help translating it to more languages to make the experience smoother for people of other languages.
- {{TZC event}} – template to easily add times at any places on a page
- The Javascript tool itself