reptile7's JavaScript blog: More Quotes and Greetings

Monday, September 01, 2014

More Quotes and Greetings
Blog Entry #333

In today's post we'll go through the last two New Array Text Pages scripts:
(4) RandomQuotes.html, which displays a random quote whenever its document loads;
(5) TODGreeting.html, which displays a Good morning or Good afternoon or Good evening greeting depending on the hour of the day.

The RandomQuotes.html script is the shortest and most straightforward New Array Text Pages script and can be deconstructed quickly. The TODGreeting.html script is wildly more complex than it needs to be vis-à-vis the simple effect it creates and consequently we're not going to spend a lot of time on it, either.

You can see demos for these scripts respectively at the RandomQuotes.html and TODGreeting.html pages of Jenson's javascript/ directory.

Quoting at random

The RandomQuotes.html script arrays 15 quote strings via a quote Object object

quote[0] = "Back Up My Hard Drive? How do I Put it in Reverse?";

quote[1] = "What we have here is a failure to assimilate.<br>[Cool Hand Locutus]";

...

quote[14] = "A polar bear is a rectangular bear after a coordinate transform.";

quote.length = 15;

that is an instance of the

function buildArray( ) { var a = arguments; for (i = 0; i < a.length; i++) this[i] = a[i]; this.length = a.length; }

template we worked with in the New Array Text Pages CookieQuotes.html and QuoteOfTheDay.html scripts. Subsequently the script gets a random quote quote and writes it to the page with:

document.write(quote[Math.floor(Math.random( ) * quote.length)]);

And that's all she wrote for the Java Goodies RandomQuotes.html script. I myself would recast quote as a bona fide Array object and write the quote quote to the innerHTML of an empty div.

var quote = [ ...Quote strings... ];

...

window.onload = function ( ) { document.getElementById("quoteDiv").innerHTML = quote[Math.floor(Math.random( ) * quote.length)]; }

...

<div id="quoteDiv"></div>

The Source Code section of the javascript/RandomQuotes.html page provides a slightly more complicated script in which quote's toString( ) method is overridden with a randomArrayElement( ) function.

function randomArrayElement( ) {
	return this[Math.floor(Math.random( ) * this.length)]; }

quote.toString = randomArrayElement;

document.write(quote);

That's what time of day it is

The Source Code section of the javascript/TODGreeting.html page provides a script that exactly matches the Java Goodies TODGreeting.html JavaScript.

The TODGreeting.html script first creates the data structure below:

greetingList[0] = {start: 0, end: 11, greet: "morning"} greetingList[1] = {start: 12, end: 17, greet: "afternoon"} greetingList[2] = {start: 18, end: 23, greet: "evening"} greetingList.length = 3;

The greetingList object is an instance of a greetingArray object type.

var greetingList = new greetingArray(0, 11, "morning", 12, 17, "afternoon", 18, 23, "evening");

Each greetingList[i] property is an object that
(a) is an instance of a greeting object type and
(b) has three properties: start, end, and greet.

function greeting(start, end, greet) {
	...
	if (start <= end) {
		this.start = start;
		this.end = end; }
	...
	this.greet = greet; }

function greetingArray( ) {
	var a = arguments;
	...
	for (ti = ai = 0; ai < a.length; ti ++, ai += 3)
		this[ti] = new greeting(a[ai], a[ai + 1], a[ai + 2]);
	this.length = a.length / 3; }

The script overrides the toString( ) method of each greetingList[i] object with a greetingToString( ) function that returns the object's greet value.

function greetingToString( ) { return this.greet; }

greeting.prototype.toString = greetingToString;

Next, a document.write( ) command calls a TODgreeting( ) function that
(a) gets the current new Date( ).getHours( ) hour,
(b) maps the hour to the greetingList[i] object whose start/end goalposts bound the hour and then
(c) returns the object, which in the context of the write( ) operation is converted to its greet value by the greetingToString( ) function.
The greet return is appended to a "Good " string and the resulting greeting is written to the page.

function TODgreeting( ) {
	var today = new Date( );
	var hr = today.getHours( );
	for (i = 0; i < greetingList.length; i++) {
		if (hr >= greetingList[i].start && hr <= greetingList[i].end) {
			return greetingList[i]; } } ... }

document.write("Good " + TODgreeting( ));

The TODgreeting( )/greetingToString( ) return can also be planted in a normal run of text.

You can also include the greeting in the body of the document this <script type="text/javascript">document.write(TODgreeting( ));</script>.

Just don't spend all <script type="text/javascript">document.write(TODgreeting( ));</script> here.

Jenson is welcome to his convoluted code. I for my part would replace the greeting( )/greetingToString( )/greetingArray( )/TODgreeting( ) functionality with:

var greet;

var today = new Date( );

var hr = today.getHours( );

if (0 <= hr && hr <= 11) greet = "morning";

if (12 <= hr && hr <= 17) greet = "afternoon"; 

if (18 <= hr && hr <= 23) greet = "evening";

window.onload = function ( ) {
	document.getElementById("greetingDiv").textContent = "Good " + greet; }

...

<div id="greetingDiv"></div>

What a spoilsport I am, huh? As for the inline greet thing, you can
(i) put the text in a separate <div id="greetingDiv2"></div> container,
(ii) replace the microscripts with empty <span></span>s,
(iii) get the spans via a document.getElementById("greetingDiv2").getElementsByTagName("span"); command, and
(iv) load greet into the spans
per the Embed it section of the previous post.

That'll do it for our New Array Text Pages odyssey. There's one more "ETU" script I'd like to cover, however, that being the javascript/ directory's Roman Numeral Script, which we'll put under the microscope in the following entry.
- posted by A. Peak @ 4:18 PM

Comments: Post a Comment

<< Home

Actually, reptile7's JavaScript blog is powered by Café La Llave. ;-)

About Me