Work in progress — This wiki is an active migration / mirror of Homestar Runner Wiki and is not finished yet. Account registration and public editing are turned off until the migration is further along. For status updates, see the migration thread on the forums.

Help:UTC clock: Difference between revisions

From HR Wiki Twice
Jump to navigationJump to search
imported>HRWikiMirrorBot
Reimported from hrwiki.org Wayback HTML→wikitext (full reconvert)
imported>HRWikiMirrorBot
Reimported from hrwiki.org Wayback HTML→wikitext (full reconvert)
 
Line 1: Line 1:
<!-- Wayback HTML body (hrwiki.org); RawHtml -->
<!-- Mirrored from Homestar Runner Wiki (hrwiki.org) via Wayback Machine -->
<html>
The following JavaScript and CSS code will add a UTC clock to every wiki page. This can be useful for comparing comment timestamps to the current time. The code was originally taken from [[Wikipedia:WikiProject User scripts/Scripts/Time]], but it has been modified slightly for use on our modified version of the MonoBook skin.
<p>The following JavaScript and CSS code will add a UTC clock to every wiki page. This can be useful for comparing comment timestamps to the current time. The code was originally taken from <a class="extiw" href="/index.php?title=Wikipedia:WikiProject_User_scripts/Scripts/Time" title="wikipedia:Wikipedia:WikiProject User scripts/Scripts/Time">Wikipedia:WikiProject User scripts/Scripts/Time</a>, but it has been modified slightly for use on our modified version of the MonoBook skin.
 
</p><p>Note that this clock tells time relative to your computer's local time. It doesn't get its time from the wiki server. If the time or the time zone is set incorrectly on your computer, the adjustment for UTC may be calculated incorrectly.
Note that this clock tells time relative to your computer's local time. It doesn't get its time from the wiki server. If the time or the time zone is set incorrectly on your computer, the adjustment for UTC may be calculated incorrectly.
</p>
 
== Just below the personal menu ==
 
[[File:UTC-clock-script-below-bar.png]]
 
''Example 1''
 
Use this version of the script to place the time just below your personal menu to the far right of the page action tabs.
 
=== Javascript ===
 
Put this in [/wiki/Special:MyPage/monobook.js your monobook.js file].


<a id="Just_below_the_personal_menu" name="Just_below_the_personal_menu"></a><h2> <span class="mw-headline"> Just below the personal menu </span></h2>
<div class="thumb tright"><div class="thumbinner" style="width:307px;"><a class="image" href="/index.php?title=File:UTC-clock-script-below-bar.png" title="Example 1"><img alt="" border="0" class="thumbimage" height="48" src="https://web.archive.org/web/20211001000000im_/http://www.hrwiki.org/w/images/8/84/UTC-clock-script-below-bar.png" width="305"/></a> <div class="thumbcaption"><div class="magnify"><a class="internal" href="/index.php?title=File:UTC-clock-script-below-bar.png" title="Enlarge"><img alt="" height="11" src="https://web.archive.org/web/20211001000000im_/http://www.hrwiki.org/w/skins/common/images/magnify-clip.png" width="15"/></a></div>Example 1</div></div></div>
<p>Use this version of the script to place the time just below your personal menu to the far right of the page action tabs.
</p>
<a id="Javascript" name="Javascript"></a><h3> <span class="mw-headline"> Javascript </span></h3>
<p>Put this in <a href="/index.php?title=Special:MyPage/monobook.js" title="Special:MyPage/monobook.js">your monobook.js file</a>.
</p>
<pre>// Add UTC time just below the "personal menu" list at the top of the page.
<pre>// Add UTC time just below the "personal menu" list at the top of the page.
// Created by <a class="extiw" href="/index.php?title=User:Mathwiz2020" title="wikipedia:User:Mathwiz2020">Wikipedia:User:Mathwiz2020</a>, modified by <a href="/index.php?title=User:JoeyDay" title="User:JoeyDay">User:JoeyDay</a>
// Created by Wikipedia:User:Mathwiz2020, modified by User:JoeyDay
//
//
function getTime() {
function getTime() {
   var time = new Date();
   var time = new Date();
   var hours = time.getUTCHours();
   var hours = time.getUTCHours();
   if (hours &lt; 10) { hours = "0" + hours; }
   if (hours < 10) { hours = "0" + hours; }
   var minutes = time.getUTCMinutes();
   var minutes = time.getUTCMinutes();
   if (minutes &lt; 10) { minutes = "0" + minutes; }
   if (minutes < 10) { minutes = "0" + minutes; }
   var currentTime = hours + ":" + minutes
   var currentTime = hours + ":" + minutes
   document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 5, currentTime);
   document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 5, currentTime);
Line 37: Line 41:
else if (window.attachEvent) window.attachEvent ('onload', makeTime);
else if (window.attachEvent) window.attachEvent ('onload', makeTime);
</pre>
</pre>
<a id="Clock_with_Seconds_counter" name="Clock_with_Seconds_counter"></a><h4> <span class="mw-headline"> Clock with Seconds counter </span></h4>
 
<p>For the clock with the seconds counter, use this instead:
==== Clock with Seconds counter ====
</p>
 
For the clock with the seconds counter, use this instead:
 
<pre>
<pre>
function getTime() {
function getTime() {
   var time = new Date();
   var time = new Date();
   var hours = time.getUTCHours();
   var hours = time.getUTCHours();
   if (hours &lt; 10) { hours = "0" + hours; }
   if (hours < 10) { hours = "0" + hours; }
   var minutes = time.getUTCMinutes();
   var minutes = time.getUTCMinutes();
   if (minutes &lt; 10) { minutes = "0" + minutes; }
   if (minutes < 10) { minutes = "0" + minutes; }
   var seconds = time.getUTCSeconds();
   var seconds = time.getUTCSeconds();
   if (seconds &lt; 10) { seconds = "0" + seconds; }
   if (seconds < 10) { seconds = "0" + seconds; }
   var currentTime = hours + ":" + minutes + ":" + seconds;
   var currentTime = hours + ":" + minutes + ":" + seconds;
   document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 8, currentTime);
   document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 8, currentTime);
Line 64: Line 70:
if (window.addEventListener) window.addEventListener ('load', makeTime, false);
if (window.addEventListener) window.addEventListener ('load', makeTime, false);
else if (window.attachEvent) window.attachEvent ('onload', makeTime);</pre>
else if (window.attachEvent) window.attachEvent ('onload', makeTime);</pre>
<a id="CSS" name="CSS"></a><h3> <span class="mw-headline"> CSS </span></h3>
 
<p>Put this in <a href="/index.php?title=Special:MyPage/monobook.css" title="Special:MyPage/monobook.css">your monobook.css page</a>.
=== CSS ===
</p>
 
Put this in [/wiki/Special:MyPage/monobook.css your monobook.css page].
 
<pre>#pt-time span {
<pre>#pt-time span {
   color: #666;
   color: #666;
Line 76: Line 84:
}
}
</pre>
</pre>
<a id="On_the_personal_menu" name="On_the_personal_menu"></a><h2> <span class="mw-headline"> On the personal menu </span></h2>
 
<div class="thumb tright"><div class="thumbinner" style="width:307px;"><a class="image" href="/index.php?title=File:UTC-clock-script-on-bar.png" title="Example 2"><img alt="" border="0" class="thumbimage" height="48" src="https://web.archive.org/web/20211001000000im_/http://www.hrwiki.org/w/images/6/6d/UTC-clock-script-on-bar.png" width="305"/></a> <div class="thumbcaption"><div class="magnify"><a class="internal" href="/index.php?title=File:UTC-clock-script-on-bar.png" title="Enlarge"><img alt="" height="11" src="https://web.archive.org/web/20211001000000im_/http://www.hrwiki.org/w/skins/common/images/magnify-clip.png" width="15"/></a></div>Example 2</div></div></div>
== On the personal menu ==
<p>Use this version of the script to place the time on your personal menu. By default, the clock will appear to the right of your "log out" link. You can customize it by changing the value of the gsTimeInsertBefore variable. For example, to place the clock to the left of your username, set gsTimeInsertBefore to 'pt-userpage'.
 
</p>
[[File:UTC-clock-script-on-bar.png]]
<a id="Javascript_2" name="Javascript_2"></a><h3> <span class="mw-headline"> Javascript </span></h3>
 
<p>Put this in <a href="/index.php?title=Special:MyPage/monobook.js" title="Special:MyPage/monobook.js">your monobook.js file</a>.
''Example 2''
</p>
 
Use this version of the script to place the time on your personal menu. By default, the clock will appear to the right of your "log out" link. You can customize it by changing the value of the gsTimeInsertBefore variable. For example, to place the clock to the left of your username, set gsTimeInsertBefore to 'pt-userpage'.
 
=== Javascript ===
 
Put this in [/wiki/Special:MyPage/monobook.js your monobook.js file].
 
<pre>// Add time to the "personal menu" at the top of the page.
<pre>// Add time to the "personal menu" at the top of the page.
// Created by <a class="extiw" href="/index.php?title=User:Mathwiz2020" title="wikipedia:User:Mathwiz2020">Wikipedia:User:Mathwiz2020</a>, modified by <a href="/index.php?title=User:JoeyDay" title="User:JoeyDay">User:JoeyDay</a>
// Created by Wikipedia:User:Mathwiz2020, modified by User:JoeyDay
//
//
// Indicate where you would like the time to appear:
// Indicate where you would like the time to appear:
Line 90: Line 104:
//  pt-watchlist, pt-mycontris, pt-logout
//  pt-watchlist, pt-mycontris, pt-logout
//
//
gsTimeInsertBefore = <i>; // leave blank to append after "logout"</i>
gsTimeInsertBefore = ; // leave blank to append after "logout"
//
//
function getTime() {
function getTime() {
   var time = new Date();
   var time = new Date();
   var hours = time.getUTCHours();
   var hours = time.getUTCHours();
   if (hours &lt; 10) { hours = "0" + hours; }
   if (hours < 10) { hours = "0" + hours; }
   var minutes = time.getUTCMinutes();
   var minutes = time.getUTCMinutes();
   if (minutes &lt; 10) { minutes = "0" + minutes; }
   if (minutes < 10) { minutes = "0" + minutes; }
   var currentTime = hours + ":" + minutes
   var currentTime = hours + ":" + minutes
   document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 5, currentTime);
   document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 5, currentTime);
Line 120: Line 134:
else if (window.attachEvent) window.attachEvent ('onload', makeTime);
else if (window.attachEvent) window.attachEvent ('onload', makeTime);
</pre>
</pre>
<a id="CSS_2" name="CSS_2"></a><h3> <span class="mw-headline"> CSS </span></h3>
 
<p>Put this in <a href="/index.php?title=Special:MyPage/monobook.css" title="Special:MyPage/monobook.css">your monobook.css file</a>.
=== CSS ===
</p>
 
Put this in [/wiki/Special:MyPage/monobook.css your monobook.css file].
 
<pre>#pt-time span {
<pre>#pt-time span {
   color: #666;
   color: #666;
Line 129: Line 145:
}
}
</pre>
</pre>
 
[[Category:Help]]
 
 
<div class="visualClear"></div>
</html>



Latest revision as of 04:58, 5 August 2026

The following JavaScript and CSS code will add a UTC clock to every wiki page. This can be useful for comparing comment timestamps to the current time. The code was originally taken from Wikipedia:WikiProject User scripts/Scripts/Time, but it has been modified slightly for use on our modified version of the MonoBook skin.

Note that this clock tells time relative to your computer's local time. It doesn't get its time from the wiki server. If the time or the time zone is set incorrectly on your computer, the adjustment for UTC may be calculated incorrectly.

Just below the personal menu

Example 1

Use this version of the script to place the time just below your personal menu to the far right of the page action tabs.

Javascript

Put this in [/wiki/Special:MyPage/monobook.js your monobook.js file].

// Add UTC time just below the "personal menu" list at the top of the page.
// Created by Wikipedia:User:Mathwiz2020, modified by User:JoeyDay
//
function getTime() {
  var time = new Date();
  var hours = time.getUTCHours();
  if (hours < 10) { hours = "0" + hours; }
  var minutes = time.getUTCMinutes();
  if (minutes < 10) { minutes = "0" + minutes; }
  var currentTime = hours + ":" + minutes
  document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 5, currentTime);
  doTime = window.setTimeout("getTime()", 1000);
}
function makeTime() {
  var div = document.createElement( 'div' );
  div.id = 'pt-time';
  var mySpan = document.createElement( 'span' );
  mySpan.appendChild( document.createTextNode( '00:00 UTC' ) );
  div.appendChild( mySpan );
  document.getElementById( 'globalWrapper' ).parentNode.appendChild( div );
  doTime = window.setTimeout("getTime()", 1000);
}
if (window.addEventListener) window.addEventListener ('load', makeTime, false);
else if (window.attachEvent) window.attachEvent ('onload', makeTime);

Clock with Seconds counter

For the clock with the seconds counter, use this instead:

function getTime() {
  var time = new Date();
  var hours = time.getUTCHours();
  if (hours < 10) { hours = "0" + hours; }
  var minutes = time.getUTCMinutes();
  if (minutes < 10) { minutes = "0" + minutes; }
  var seconds = time.getUTCSeconds();
  if (seconds < 10) { seconds = "0" + seconds; }
  var currentTime = hours + ":" + minutes + ":" + seconds;
  document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 8, currentTime);
  doTime = window.setTimeout("getTime()", 1000);
}
function makeTime() {
  var div = document.createElement( 'div' );
  div.id = 'pt-time';
  var mySpan = document.createElement( 'span' );
  mySpan.appendChild( document.createTextNode( '00:00:00 UTC' ) );
  div.appendChild( mySpan );
  document.getElementById( 'globalWrapper' ).parentNode.appendChild( div );
  doTime = window.setTimeout("getTime()", 1000);
}
if (window.addEventListener) window.addEventListener ('load', makeTime, false);
else if (window.attachEvent) window.attachEvent ('onload', makeTime);

CSS

Put this in [/wiki/Special:MyPage/monobook.css your monobook.css page].

#pt-time span {
   color: #666;
   font-size: 11px;
   text-transform: lowercase;
   position: absolute;
   top: 1.9em;
   right: 2.2em;
}

On the personal menu

Example 2

Use this version of the script to place the time on your personal menu. By default, the clock will appear to the right of your "log out" link. You can customize it by changing the value of the gsTimeInsertBefore variable. For example, to place the clock to the left of your username, set gsTimeInsertBefore to 'pt-userpage'.

Javascript

Put this in [/wiki/Special:MyPage/monobook.js your monobook.js file].

// Add time to the "personal menu" at the top of the page.
// Created by Wikipedia:User:Mathwiz2020, modified by User:JoeyDay
//
// Indicate where you would like the time to appear:
//   pt-userpage, pt-mytalk, pt-preferences,
//   pt-watchlist, pt-mycontris, pt-logout
//
gsTimeInsertBefore = ; // leave blank to append after "logout"
//
function getTime() {
  var time = new Date();
  var hours = time.getUTCHours();
  if (hours < 10) { hours = "0" + hours; }
  var minutes = time.getUTCMinutes();
  if (minutes < 10) { minutes = "0" + minutes; }
  var currentTime = hours + ":" + minutes
  document.getElementById('pt-time').childNodes[0].childNodes[0].replaceData(0, 5, currentTime);
  doTime = window.setTimeout("getTime()", 1000);
}
function makeTime() {
  var li = document.createElement('li');
  li.id = 'pt-time';
  var mySpan = document.createElement('span');
  mySpan.appendChild( document.createTextNode( '00:00 UTC' ) );
  li.appendChild(mySpan);
  if (gsTimeInsertBefore) {
    var before = document.getElementById(gsTimeInsertBefore);
    before.appendChild( li, before );
  }
  else {
    document.getElementById('pt-logout').parentNode.appendChild(li);
  }
  doTime = window.setTimeout("getTime()", 1000);
}
if (window.addEventListener) window.addEventListener ('load', makeTime, false);
else if (window.attachEvent) window.attachEvent ('onload', makeTime);

CSS

Put this in [/wiki/Special:MyPage/monobook.css your monobook.css file].

#pt-time span {
   color: #666;
   font-size: 11px;
   text-transform: lowercase;
}