Add ST/ND/RD/TH to DAY in DATE

[Gordo]

I acquired this from joh6nn a year ago and now need one small addtion. This code produces the next meeting date based on one's local PC date. For the days, I need ST, ND, RD, TH added. For example, instead of "August 29", I need it to kick out "August 29th". Possible!?

                  <table border="0" cellpadding="2" cellspacing="0" width="100%" bgcolor="#EFEFEF">
<!-- BEGIN NEXT BOOSTER CLUB AND NEXT GAME NOTICES -->
                    <tr>
                      <td width="13" valign="top"><img border="0" src="images/dot_red_anim_13x13.gif" width="13" height="13"></td>
                      <td valign="top"><span class="bold"><span class="red">Next Booster Club Meeting:</span></span><br>
<!-- SCRIPT below automatically updates the date of the next meeting based on the PC's date -->
<script>
var Schedule = new Array(12);
for ( var i = 0; i < 12; i++ ) {
    Schedule[i ] = new Array();
    }
var Games = new Array(12);
for ( var i = 0; i < 12; i++ ) {
    Games[i ] = new Array();
    }
var weekdays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];

// Set the days you want
// Because the array starts with 0, 0=January, 1=February, and so on.  So, the month [7] below is one number behind the actual month number
// Schedule[month-1][day] = ["first message" , "second message"];
// Schedule[7][20] = ["7:00PM" , "THIS IS THE TOPIC TEXT"];  --- see original script in another file...shows where "topic" line is added, etc.
Schedule[7][19] = ["7:00pm" , ""]; // AUGUST
Schedule[7][26] = ["7:00pm" , ""];
Games[7][29] = ["7:30pm", "Leander (@ Leander)"]; // Season Opener
Schedule[8][2] = ["7:00pm" , ""]; // SEPTEMBER
Schedule[8][9] = ["7:00pm" , ""];
Games[8][12] = ["7:30pm" , "Westwood (@ Burger Center)"];
Schedule[8][16] = ["7:00pm" , ""];
Games[8][19] = ["7:30pm" , "McNeil (@ Round Rock)"];
Schedule[8][23] = ["7:00pm" , ""];
Games[8][26] = ["7:30pm" , "Hays (@ Burger Center)"];
Schedule[8][30] = ["7:00pm" , ""];
Games[9][3] = ["7:30pm" , "S F Austin (@ House Park)"]; // OCTOBER
Schedule[9][7] = ["7:00pm" , ""];
Games[9][9] = ["7:00pm" , "Westlake (@ Burger Center)"];
Schedule[9][14] = ["7:00pm" , ""];
Games[9][17] = ["7:30pm" , "Seguin (@ Seguin)"];
Schedule[9][21] = ["7:00pm" , ""];
Games[9][23] = ["7:00pm" , "Akins (@ Burger Center)"];
Schedule[9][28] = ["7:00pm" , ""];
Games[9][30] = ["7:00pm" , "San Marcos (@ Burger Center)"];
Schedule[10][4] = ["7:00pm" , ""]; // NOVEMBER
Games[10][7] = ["7:30pm" , "Crockett (@ Burger Center)"];
Schedule[10][11] = ["7:00pm" , ""];
// ADD MORE MEETINGS AND-OR PLAYOFF EVENTS HERE .... WHAT YOU SEE IS FROM 2002 RIGHT NOW
// Games[10][16] = ["1:00pm" , "Judson (@ Hays Stadium)"];
// Schedule[10][18] = ["7:00pm" , ""];
// Schedule[10][25] = ["7:00pm" , ""];

function dateWriter() {
    var today, then, start;
    today = new Date();
    if ( Schedule[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 
    return ("Today at " + Schedule[today.getMonth()][today.getDate()][0] + '.'); 
    }
    else {
        for (var m = today.getMonth(); m < 12; m++) {
            start = ( m == today.getMonth() ) ? today.getDate() : 1;
            for (var d = start; d < 31; d++) {
                if (Schedule[m][d]) {
                    then = new Date(today.getFullYear(), m, d);
                    return (weekdays[then.getDay()] + ", " + months[m] + " " + d + " @ " + Schedule[m][d][0]);
                    }
                }
            }
        }
    }

function dateWriter2() {
    var today, then, start;
    today = new Date();
    if ( Games[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 
    return ("Today at " + Games[today.getMonth()][today.getDate()][0] + ' vs ' + Games[today.getMonth()][today.getDate()][1]+'.');
    }
    else {
        for (var m = today.getMonth(); m < 12; m++) {
            start = ( m == today.getMonth() ) ? today.getDate() : 1;
            for (var d = start; d < 31; d++) {
                if (Games[m][d]) {
                    then = new Date(today.getFullYear(), m, d);
                    return (weekdays[then.getDay()] + ", " + months[m] + " " + d + " @ " + Games[m][d][0] + "<br>" + " vs " + Games[m][d][1]);
                    }
                }
            }
        }
    }

document.writeln("<span class='bold'>" + dateWriter() + " in the cafeteria.</span><br>All football parents are highly encouraged to attend!");
document.writeln("<br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");
document.writeln("<tr><td width='13' valign='top'><img border='0' src='images/dot_red_anim_13x13.gif' width='13' height='13'></td><td valign='top'><span class='bold'><span class='red'>Next Game (<a href='schedule_v.htm'><span class='bold'>details</span></a>):</span></span></span><br><span class='bold'>" + dateWriter2() + "</span><br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");
// document.writeln(dateWriter2());
</script>
                      </td>
                    </tr>
                  </table>

[Graeme Hackston]

I hope someone else has something less clunky. I couldn't even think of a good name for the function

function num_abbrev_str(num) {
var len = num.length, last_char = num.charAt(len - 1), abbrev
if (len == 2 && num.charAt(0) == '1') {
abbrev = 'th'
} else {
if (last_char == '1') {
abbrev = 'st'
} else if (last_char == '2') {
abbrev = 'nd'
} else if (last_char == '3') {
abbrev = 'rd'
} else {
abbrev = 'th'
}
}
return num + abbrev
}

alert(num_abbrev_str('22'))

[Gordo]

Graeme Hackston, thanks for the code. I couldn't tell you clunky from non...I just need results.

Anyway, I played around with it a little -- trying to get it to work -- but have been unsuccessful so far.

Can you or someone else please explain how I'm supposed to include this in my JS?

Better yet, can you just show me? I'll learn from it, I promise.

[Graeme Hackston]

Well it's clunky, anything with a bunch of else if and repeat statements is IMHO clunky.

I'd still like to see someone (maybe John) give you something better. For the time being this will work. If you want to capitalize them you can do that right in the function.

                  <table border="0" cellpadding="2" cellspacing="0" width="100%" bgcolor="#EFEFEF">
<!-- BEGIN NEXT BOOSTER CLUB AND NEXT GAME NOTICES -->
                    <tr>
                      <td width="13" valign="top"><img border="0" src="images/dot_red_anim_13x13.gif" width="13" height="13"></td>
                      <td valign="top"><span class="bold"><span class="red">Next Booster Club Meeting:</span></span><br>
<!-- SCRIPT below automatically updates the date of the next meeting based on the PC's date -->
<script>
var Schedule = new Array(12);
for ( var i = 0; i < 12; i++ ) {
    Schedule[i ] = new Array();
    }
var Games = new Array(12);
for ( var i = 0; i < 12; i++ ) {
    Games[i ] = new Array();
    }
var weekdays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];

// Set the days you want
// Because the array starts with 0, 0=January, 1=February, and so on.  So, the month [7] below is one number behind the actual month number
// Schedule[month-1][day] = ["first message" , "second message"];
// Schedule[7][20] = ["7:00PM" , "THIS IS THE TOPIC TEXT"];  --- see original script in another file...shows where "topic" line is added, etc.
Schedule[7][19] = ["7:00pm" , ""]; // AUGUST
Schedule[7][26] = ["7:00pm" , ""];
Games[7][29] = ["7:30pm", "Leander (@ Leander)"]; // Season Opener
Schedule[8][2] = ["7:00pm" , ""]; // SEPTEMBER
Schedule[8][9] = ["7:00pm" , ""];
Games[8][12] = ["7:30pm" , "Westwood (@ Burger Center)"];
Schedule[8][16] = ["7:00pm" , ""];
Games[8][19] = ["7:30pm" , "McNeil (@ Round Rock)"];
Schedule[8][23] = ["7:00pm" , ""];
Games[8][26] = ["7:30pm" , "Hays (@ Burger Center)"];
Schedule[8][30] = ["7:00pm" , ""];
Games[9][3] = ["7:30pm" , "S F Austin (@ House Park)"]; // OCTOBER
Schedule[9][7] = ["7:00pm" , ""];
Games[9][9] = ["7:00pm" , "Westlake (@ Burger Center)"];
Schedule[9][14] = ["7:00pm" , ""];
Games[9][17] = ["7:30pm" , "Seguin (@ Seguin)"];
Schedule[9][21] = ["7:00pm" , ""];
Games[9][23] = ["7:00pm" , "Akins (@ Burger Center)"];
Schedule[9][28] = ["7:00pm" , ""];
Games[9][30] = ["7:00pm" , "San Marcos (@ Burger Center)"];
Schedule[10][4] = ["7:00pm" , ""]; // NOVEMBER
Games[10][7] = ["7:30pm" , "Crockett (@ Burger Center)"];
Schedule[10][11] = ["7:00pm" , ""];
// ADD MORE MEETINGS AND-OR PLAYOFF EVENTS HERE .... WHAT YOU SEE IS FROM 2002 RIGHT NOW
// Games[10][16] = ["1:00pm" , "Judson (@ Hays Stadium)"];
// Schedule[10][18] = ["7:00pm" , ""];
// Schedule[10][25] = ["7:00pm" , ""];

function dateWriter() {
    var today, then, start;
    today = new Date();
    if ( Schedule[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 
    return ("Today at " + Schedule[today.getMonth()][today.getDate()][0] + '.'); 
    }
    else {
        for (var m = today.getMonth(); m < 12; m++) {
            start = ( m == today.getMonth() ) ? today.getDate() : 1;
            for (var d = start; d < 31; d++) {
                if (Schedule[m][d]) {
                    then = new Date(today.getFullYear(), m, d);
                    return (weekdays[then.getDay()] + ", " + months[m] + " " + num_abbrev_str(d.toString()) + " @ " + Schedule[m][d][0]);
                    }
                }
            }
        }
    }

function dateWriter2() {
    var today, then, start;
    today = new Date();
    if ( Games[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 
    return ("Today at " + Games[today.getMonth()][today.getDate()][0] + ' vs ' + Games[today.getMonth()][today.getDate()][1]+'.');
    }
    else {
        for (var m = today.getMonth(); m < 12; m++) {
            start = ( m == today.getMonth() ) ? today.getDate() : 1;
            for (var d = start; d < 31; d++) {
                if (Games[m][d]) {
                    then = new Date(today.getFullYear(), m, d);
                    return (weekdays[then.getDay()] + ", " + months[m] + " " + num_abbrev_str(d.toString()) + " @ " + Games[m][d][0] + "<br>" + " vs " + Games[m][d][1]);
                    }
                }
            }
        }
    }

function num_abbrev_str(num) {
var len = num.length, last_char = num.charAt(len - 1), abbrev
if (len == 2 && num.charAt(0) == '1') {
abbrev = 'th'
} else {
if (last_char == '1') {
abbrev = 'st'
} else if (last_char == '2') {
abbrev = 'nd'
} else if (last_char == '3') {
abbrev = 'rd'
} else {
abbrev = 'th'
}
}
return num + abbrev
}

document.writeln("<span class='bold'>" + dateWriter() + " in the cafeteria.</span><br>All football parents are highly encouraged to attend!");
document.writeln("<br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");
document.writeln("<tr><td width='13' valign='top'><img border='0' src='images/dot_red_anim_13x13.gif' width='13' height='13'></td><td valign='top'><span class='bold'><span class='red'>Next Game (<a href='schedule_v.htm'><span class='bold'>details</span></a>):</span></span></span><br><span class='bold'>" + dateWriter2() + "</span><br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");
// document.writeln(dateWriter2());
</script>
                      </td>
                    </tr>
                  </table>

[Graeme Hackston]

By the way Gordo, I suspect you were having problems using it because the variable d is a number. The function requires a string. When you're having problems like this the easiest way I've found to see what's going on is to use typeof.

try this

num = '22'
alert(typeof num)

num = 22
alert(typeof num)

[Graeme Hackston]

Or, you can use typeof right in the function but this is adding yet another condition for the function to check.

If you use it like this you can remove .toString() from the function calls in Johns script.

function num_abbrev_str(num) {
if (typeof num == 'number') {
num = num.toString()
}
var len = num.length, last_char = num.charAt(len - 1), abbrev
if (len == 2 && num.charAt(0) == '1') {
abbrev = 'th'
} else {
if (last_char == '1') {
abbrev = 'st'
} else if (last_char == '2') {
abbrev = 'nd'
} else if (last_char == '3') {
abbrev = 'rd'
} else {
abbrev = 'th'
}
}
return num + abbrev
}

alert(num_abbrev_str('22'))

alert(num_abbrev_str(22))

[Gordo]

Awesome...it works!

[whammy]

Hmm, I don't think there's a non-clunky way of doing this. Here's a VBScript version that I use:

Function DateExt(ByVal intDay)
	If IsNumeric(intDay) Then
		If CInt(intDay) <> intDay Then Exit Function
		If (intDay < 11) OR (intDay > 13) Then
			Select Case Right(intDay,1)
				Case 1
					DateExt = intDay & "st"
				Case 2
					DateExt = intDay & "nd"
				Case 3
					DateExt = intDay & "rd"
				Case Else
					DateExt = intDay & "th"
			End Select
		Else
			DateExt = intDay & "th"
		End If
	End If
End Function

[cheesebag]

This is definately clunky (kludgy?) but, fwiw, it might be useful to someone.

<html>
<head>
<title>Order in the Court!</title>
</head>
<body>
<pre>
<script type="text/javascript" language="javascript">

String.prototype.ordinalize = function() {
       var sNum, aNum = this.match(/^[^\d]*(\d+)[\w\W]*$/);
       if (aNum == null || aNum.length < 1) return this;
       else sNum = aNum[1];
       sNum += ['','st','nd','rd','th','th','th','th','th','th'][/^\d*1\d$/.test(sNum) ? 4 : Number(sNum.charAt(sNum.length - 1))];
       return this.replace(/\d+/, sNum);
}

var y, x = 'December 12, 1998.';
document.writeln(x.ordinalize());
x = 'On May 2, I began salivating...';
document.writeln(x.ordinalize());
x = 'The next game is on August 29.';
document.writeln(x.ordinalize());
x = 'I was 5 in line at the time.';
y = 'That was on the 3 of July.';
document.writeln(x.ordinalize() + ' ' + y.ordinalize());
x = 'Bite me.';
document.writeln(x.ordinalize());

</script>
</pre>
</body>
</html>

[Graeme Hackston]

This almost looks like a good candidate for a coding challenge

title: De-clunk This Function

So far, cheesebag is leading the pack

[jsWalter]

function num_abbrev_str(num) {
var len = num.length, last_char = num.charAt(len - 1), abbrev
if (len == 2 && num.charAt(0) == '1') {
abbrev = 'th'
} else {
if (last_char == '1') {
abbrev = 'st'
} else if (last_char == '2') {
abbrev = 'nd'
} else if (last_char == '3') {
abbrev = 'rd'
} else {
abbrev = 'th'
}
}
return num + abbrev
}

This will not work with 11, 12, and 13...

need to add...
(make this the first check)

 
if  ( (num == '11') || (num == '12') || (num == '13') ) {
abbrev = 'th'
} else if...

jsWalter

[brothercake]

How about this; still a little kludgy, but it works

function getNumberSuffix(dNum)
{
	daySuffix = 'th';
	if(dNum != 11 && dNum != 12 && dNum != 13) 
	{
		if(dNum > 9) { dNum = dNum % 10; }
		if (dNum == 1) { daySuffix = 'st'; }
		if (dNum == 2) { daySuffix = 'nd'; }
		if (dNum == 3) { daySuffix = 'rd'; }
	}
	return daySuffix;
}

So you just call it like getNumberSuffix(14)

[Choopernickel]

I'm not sure why one so similar to mine was judged clunky... here we go.

Number.prototype.ordinal = function () {
    var suffix = 'th',
    	aNum = this;
    while (aNum > 100) {
    	aNum -= 100;
    }
    if (aNum < 10 || aNum > 13) {
        switch (aNum % 10) {
            case 1:
                suffix = 'st';
                break;
            case 1: 
                suffix = 'nd';
                break;
            case 3: 
                suffix = 'rd';
                break;
        }
    }
    return new String(this + suffix);
}
three = 3;
twelve = 12;
twentyone = 21;
fortyfive = 45;
sixten = 610;
alert(three.ordinal() + 
    '\n' + twelve.ordinal() + 
    '\n' + twentyone.ordinal() + 
    '\n' + fortyfive.ordinal() + 
    '\n' + sixten.ordinal());

Don't forget that what doesn't work for 11 also doesn't work for 211.

[liorean]

Originally posted by Choopernickel

            case 1: 
                suffix = 'nd';
                break;

Just a small error - that should be "case 2:".

[liorean]

Hmm, sounds like an interesting challenge - I'll throw together my own version:

Number.prototype.ordinal=function(){
    var
        nModTen = this % 10;
    return (this + ['th','st','nd','rd'][nModTen > 3 ?
        0 :
        ( this % 100 - nModTen != 10) * nModTen]);
}