Piers Rudgard-Redsell

I have been experimenting with Javascript – a programming language that is executed in the user’s browser, rather than on the server as with PHP. This enables codes to be run with in the page, without having to reload a new page, and respond quickly to the user’s input (e.g. mouse and keyboard movement). I created a Christmas countdown and a New Year countdown, which automatically update themselves for the next year.
Here is the Javascript to make a countdown clock for Christmas

//change the text below to reflect your own,
var before="Christmas!";
var current="Merry Christmas!";
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");

function countdown(yr,m,d){
theyear=yr;
themonth=m;
theday=d;
var today=new Date();

var todayyear=today.getYear();
if (todayyear < 1000)
	todayyear+=1900;

var todaym=today.getUTCMonth(); //increase accuracy by using Universal (UTC) time
var todayd=today.getUTCDate();
var todayh=today.getUTCHours();
var todaymin=today.getUTCMinutes();
var todaysec=today.getUTCSeconds();
var todaystring=montharray[todaym]+" "+todayd+", "+todayyear+" "+todayh+":"+todaymin+":"+todaysec;
futurestring=montharray[m-1]+" "+d+", "+yr;
dd=Date.parse(futurestring)-Date.parse(todaystring);
dday=Math.floor(dd/(60*60*1000*24)*1); //set time into correct format
dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1);
dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1);
dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1);

if(todayd==25&&todaym==11){ // checks if today is Christmas day
document.getElementById("time").innerHTML=current;
return;
}

else {
//use this following line if you don't want the parts of the countdown to appear in separate div tags
//document.getElementById("time").innerHTML=dday+"d " + dhour+"h "+ " " + dmin + "m " + dsec + "s ";
document.getElementById("days").innerHTML=dday+"d ";
document.getElementById("hours").innerHTML=dhour+"h ";
document.getElementById("minutes").innerHTML=dmin + "m ";
document.getElementById("seconds").innerHTML=dsec + "s ";

setTimeout("countdown(theyear,themonth,theday)",1000); //update every second
}

}

//enter the count down date using the format year/month/day
var next = new Date();
var theday=next.getUTCDate();
var themonth=next.getUTCMonth();
nexty=next.getUTCFullYear();
if (theday>=26&&theday<=31&&themonth==11) //if it is after Xmas, and before new year, make it count down to next year
//remove this if statement if the countdown is for new year
	{
		nexty++;
	}
countdown(nexty,12,25); //set the year, month and day you are counting down to

Here is the HTML to make the countdown appear – style it as you wish

<div id="time">
	<div id="days" class="block"></div>
	<div id="hours" class="block"></div>
	<div id="minutes" class="block"></div>
	<div id="seconds" class="block"></div>
</div>