<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta name="author" content="Alan Palmer, and Revised by DragonMother.com for the new millenium">
<meta name="description" content="A collection of examples of JavaScript and DHTML - Moon Phases">
<meta name="keywords" content="JavaScript, javascript, jscript, JScript, DHTML, dhtml, dynamic HTML, script, scripts, Netscape, Microsoft, moon phases">
<title>revised Moon Phases</title>
<!-- This script is featured at JavaScript Planet at
http://www.intricate.com/javascript/ Check out
JavaScript Planet for more scripts, links, etc.
Please leave this comment intact. -->
<script language="JavaScript" type="text/javascript">
<!--
function getMoonAge(year, month, day)
{
d = Math.floor(year/20)
r = year-(d*20) //r is the remainder of (year/20)
while (r>9)
{
r = r-19
}
r = r*11
while (r>29)
{
r = r-30
}
if (month<3)
{
month = month+2
}
r = r+month+day
if (year<100)
{
r = r-4
}
else
{
r = r-8.3
}
while(r>29)
{
r = r-30
}
while(r<0)
{
r = r+30
}
return r
}
function getMoonPhase(moonAge)
{
if (moonAge<2) return "new"
if (moonAge<5) return "waxing cresent"
if (moonAge<11) return "first quarter"
if (moonAge<13) return "waxing gibbous"
if (moonAge<16) return "full"
if (moonAge<20) return "waning gibbous"
if (moonAge<24) return "last quarter"
if (moonAge<29) return "waning cresent"
if (moonAge<30) return "new"
}
function getMoonPhaseImg(moonAge)
{
if (moonAge<2) return "moonnew"
if (moonAge<5) return "waxingcresent"
if (moonAge<11) return "firstquarter"
if (moonAge<13) return "waxinggibbous"
if (moonAge<16) return "moonfull"
if (moonAge<20) return "waninggibbous"
if (moonAge<24) return "lastquarter"
if (moonAge<29) return "waningcresent"
if (moonAge<30) return "moonnew"
}
monthNames = new Array(13)
monthNames[1] = "Jan"
monthNames[2] = "Feb"
monthNames[3] = "March"
monthNames[4] = "April"
monthNames[5] = "May"
monthNames[6] = "June"
monthNames[7] = "July"
monthNames[8] = "Aug"
monthNames[9] = "Sept"
monthNames[10] = "Oct"
monthNames[11] = "Nov"
monthNames[12] = "Dec"
dayNames = new Array(8)
dayNames[1] = "Sun"
dayNames[2] = "Mon"
dayNames[3] = "Tues"
dayNames[4] = "Weds"
dayNames[5] = "Thurs"
dayNames[6] = "Fri"
dayNames[7] = "Sat"
function getLongDate(dateObj)
{
theDay = dayNames[dateObj.getDay()+1]
theMonth = monthNames[dateObj.getMonth()+1]
theDate = dateObj.getDate()
theYear = dateObj.getFullYear()
return ""+theDay+", "+theMonth+" "+theDate+", "+theYear
}
function getNextFull(moonAge)
{
currMilSecs = (new Date()).getTime()
daysToGo = 15 - moonAge
while(daysToGo<2)
{
daysToGo = daysToGo+29
}
milSecsToGo = daysToGo*24*60*60*1000
nextMoonTime = currMilSecs+milSecsToGo
nextMoonDate = new Date(nextMoonTime)
return nextMoonDate
}
function getNextNew(moonAge)
{
currMilSecs = (new Date()).getTime()
daysToGo = 29 - moonAge
while(daysToGo<2)
{
daysToGo = daysToGo+29
}
milSecsToGo = daysToGo*24*60*60*1000
nextMoonTime = currMilSecs+milSecsToGo
nextMoonDate = new Date(nextMoonTime)
return nextMoonDate
}
//-->
</script>
</head>
<body bgcolor="#fffffff" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
<script language="JavaScript" type="text/javascript">
<!--
theDate = new Date()
theYear = theDate.getYear()
theMonth = theDate.getMonth()+1
theDay = theDate.getDate()
theMoonAge = getMoonAge(theYear, theMonth, theDay)
theMoonPhase = getMoonPhase(theMoonAge)
document.write(" The moon is "+theMoonPhase+"<br>")
theMoonPhase = getMoonPhaseImg(theMoonAge)
document.write("<img src='"+ escape(theMoonPhase)+".gif' align='left' hspace='20'>")
document.write("<p>Today's date is: "+getLongDate(theDate)+"</p>")
document.write("<p>Next <strong>new</strong> moon: ")
document.write(""+getLongDate( getNextNew(theMoonAge) )+"</p>")
document.write("<p>Next <strong>full</strong> moon: ")
document.write(""+getLongDate(getNextFull(theMoonA ge))+"</p>")
document.write('<br clear=all>')
//-->
</script>
<hr><div align="center"><font size="-1"><script language="JavaScript" type="text/javascript">
<!-- // new options introduced by Bernhard Friedrich; should work in all browsers
// additional code to display date in Month Day, Year format by Robert Crooks
var lutext;
var lutime;
var ludm;
var ludd;
var ludy;
function sstr(a,b){ //extract substrings
ret=lutime.substring(a,b);
if (ret=="Jan" || ret=="01") ret="1";
if (ret=="Feb" || ret=="02") ret="2";
if (ret=="Mar" || ret=="03" || ret=="Mrz") ret="3";
if (ret=="Apr" || ret=="04") ret="4";
if (ret=="May" || ret=="05" || ret=="Mai") ret="5";
if (ret=="Jun" || ret=="06") ret="6";
if (ret=="Jul" || ret=="07") ret="7";
if (ret=="Aug" || ret=="08") ret="8";
if (ret=="Sep" || ret=="09") ret="9";
if (ret=="Oct" || ret=="Okt") ret="10";
if (ret=="Nov") ret="11";
if (ret=="Dec" || ret=="Dez") ret="12";
return ret;
}
lutime = unescape(document.lastModified);
if (lutime.length == 17) { // Netscape 3 and higher, Internet Explorer 4
ludm = sstr(0,2);
ludd = sstr(3,5);
ludy = sstr(6,8);
}
if (lutime.length == 19) { // Netscape 3 and higher, Internet Explorer 4 and higher, 4-digit year
ludm = sstr(0,2);
ludd = sstr(3,5);
ludy = sstr(6,10);
}
if (lutime.length == 25 || lutime.length == 24) { // Netscape 2
ludm = sstr(4,7);
ludd = sstr(8,10);
ludy = sstr(20,24);
}
if (lutime.length == 29) { // Opera 3
ludm = sstr(8,11);
ludd = sstr(5,7);
ludy = sstr(12,16);
}
if (lutime.length == 23) { // Internet Explorer 3
ludm = sstr(3,6);
ludd = sstr(7,9);
ludy = sstr(19,23);
}
lutext = "";
monthName = new Array(12)
monthName[1] = 'January'
monthName[2] = 'February'
monthName[3] = 'March'
monthName[4] = 'April'
monthName[5] = 'May'
monthName[6] = 'June'
monthName[7] = 'July'
monthName[8] = 'August'
monthName[9] = 'September'
monthName[10] = 'October'
monthName[11] = 'November'
monthName[12] = 'December'
yearNow = null
if (ludy.length==2) {
if (ludy >= 90) {
yearNow = 19
}
else {
yearNow = 20
}
}
else yearNow=""
lutext += ludd+" "+ monthName[ludm] +" "+ yearNow + ludy +" ";
// -->
</script></font>
</body>
</html>
If you want them, you can get the images at http:
www.dragonmother.com/moonphases/
but they are messy I think...
