Forum:New Wiki Layout: Difference between revisions
m
Add
m (Add) |
m (Add) |
||
| Line 168: | Line 168: | ||
{{EO|time=19:51, 11 August 2009 (UTC)|hooded=I had given an embed code for a Days Coutndown....but apparently we don't use these?}} | {{EO|time=19:51, 11 August 2009 (UTC)|hooded=I had given an embed code for a Days Coutndown....but apparently we don't use these?}} | ||
{{ILHI|22:29, 11 August 2009 (UTC)|Countdowns require complicated CSS. And anything too complicated hurts my head.}} | {{ILHI|22:29, 11 August 2009 (UTC)|Countdowns require complicated CSS. And anything too complicated hurts my head.}} | ||
{{ILHI|23:11, 11 August 2009 (UTC)|Alright. Add this to [[MediaWiki:Common.js]]:}} | |||
<pre> | |||
// ****************************************************** // | |||
// ************** JS countdown by Splarka ************** // | |||
// ****************************************************** // | |||
function updatetimer(i) { | |||
var now = new Date(); | |||
var then = timers[i].eventdate; | |||
var diff = count=Math.floor((then.getTime()-now.getTime())/1000); | |||
// catch bad date strings | |||
if(isNaN(diff)) { | |||
timers[i].firstChild.nodeValue = '** ' + timers[i].eventdate + ' **' ; | |||
return; | |||
} | |||
// determine plus/minus | |||
if(diff<0) { | |||
diff = -diff; | |||
var tpm = 'T plus '; | |||
} else { | |||
var tpm = 'T minus '; | |||
} | |||
// calcuate the diff | |||
var left = (diff%60) + ' seconds'; | |||
diff=Math.floor(diff/60); | |||
if(diff > 0) left = (diff%60) + ' minutes ' + left; | |||
diff=Math.floor(diff/60); | |||
if(diff > 0) left = (diff%24) + ' hours ' + left; | |||
diff=Math.floor(diff/24); | |||
if(diff > 0) left = diff + ' days ' + left | |||
timers[i].firstChild.nodeValue = tpm + left; | |||
// a setInterval() is more efficient, but calling setTimeout() | |||
// makes errors break the script rather than infinitely recurse | |||
timeouts[i] = setTimeout('updatetimer(' + i + ')',1000); | |||
} | |||
function checktimers() { | |||
//hide 'nocountdown' and show 'countdown' | |||
var nocountdowns = getElementsByClassName(document, 'span', 'nocountdown'); | |||
for(var i in nocountdowns) nocountdowns[i].style.display = 'none' | |||
var countdowns = getElementsByClassName(document, 'span', 'countdown'); | |||
for(var i in countdowns) countdowns[i].style.display = 'inline' | |||
//set up global objects timers and timeouts. | |||
timers = getElementsByClassName(document, 'span', 'countdowndate'); //global | |||
timeouts = new Array(); // generic holder for the timeouts, global | |||
if(timers.length == 0) return; | |||
for(var i in timers) { | |||
timers[i].eventdate = new Date(timers[i].firstChild.nodeValue); | |||
updatetimer(i); //start it up | |||
} | |||
} | |||
addOnloadHook(checktimers); | |||
// ****************************************************** // | |||
</pre> | |||
{{ILHI|23:11, 11 August 2009 (UTC)|And then add this to a page:}} | |||
<pre><span class="countdown" style="display:none;"> | |||
[text] <span class="countdowndate">[month] [day] [year] [time] [timezone]</span> [text] | |||
</span> | |||
<span class="nocountdown">[This is what shows up if JS isn't enabled or is broekd for whatever reason</span> | |||
</pre> | |||
{{ILHI|23:11, 11 August 2009 (UTC)|So, as an example:}} | |||
<pre><span class="countdown" style="display:none;">Only <span class="countdowndate">October 29 2009 00:00:00 GMT</span> until ILHI's birthday! | |||
</span> | |||
<span class="nocountdown">ILHI's birthday is on the 29th of October!</span> | |||
</pre> | |||
{{User:ILHI/Talk|23:11, 11 August 2009 (UTC)|2=Now, this will show up like this: | |||
<table border="1" width="100%"><tr><th><span class="countdown" style="display:none;">Only <span class="countdowndate">October 29 2009 00:00:00 GMT</span> until ILHI's birthday! | |||
</span> | |||
<span class="nocountdown">ILHI's birthday is on the 29th of October!</span></th></tr></table> | |||
Because the JS isn't on the wiki yet, it just shows the "nocountdown" message.}} | |||