| CSC 110 Assignment Old McDonald, the Reprise (Extra Credit) |
|---|
For the extra credit assignment, you can implement as much or as little of this functionality as you like. The more you implement, the more points you will receive.
Take your implementation of Old McDonald
(assignment 4). Update this HTML page with a simple form to collect an
animal name and the sound that the animal makes.
Following the form, in HTML, create a horizontal rule and a division <div> </div>. Give the division an id.
Update the JavaScript function you wrote for the title so that it puts the text "Old McDonald" into the division as a level 1 heading, rather than prints it into the document using document.write. Use the getElementById method of the document object, and the innerHTML property of (D)HTML tags to accomplish this.
In the initial implementation of Old McDonald in assignment 4, the implementation did not follow the norms of the doggerel, where the animal sounds are repeated from the previous verses, so that each subsequent verse is longer than its predecessor.
Use a JavaScript Array object to keep track of the sounds for each of the animals already included in the song. So, when the button is clicked, check to make sure that the user has added both an animal and its sound in the form. If both an animal and its sound are provided, add the animal sound to the array. Print the first two lines of the verse using the animal provided by the user. After printing the first two lines, use the array to "cycle" through all the animal sounds. (Hint: You may find it helpful to create a separate function that just generates one set of the pair of lines that include each animal sound.) End the verse with the line "Old McDonald had a farm, E-I-E-I-O."
For the sake of clarity, make each verse a single paragraph.
Here is a sample of the output, with just the title and the first verse. This looks identical to what assignment 3 would have generated.
Old McDonald
Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a duck, E-I-E-I-O.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.
Here is a sample of the output, after adding a second verse:
Old McDonald
Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a duck, E-I-E-I-O.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a cow, E-I-E-I-O.
With a moo, moo here. And a moo, moo there.
Here a moo, there a moo, everywhere a moo, moo.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.
Here is a sample of the output, after adding the third verse:
Old McDonald
Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a duck, E-I-E-I-O.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a cow, E-I-E-I-O.
With a moo, moo here. And a moo, moo there.
Here a moo, there a moo, everywhere a moo, moo.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a chicken, E-I-E-I-O.
With a cluck, cluck here. And a cluck, cluck there.
Here a cluck, there a cluck, everywhere a cluck, cluck.
With a moo, moo here. And a moo, moo there.
Here a moo, there a moo, everywhere a moo, moo.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.
Test your HTML page. This is the basic assignment.
Update the function / method that adds the verse. Now each verse should be a list item in an ordered list. Here's what the output would look like after adding three verses.
Old McDonald
Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a duck, E-I-E-I-O.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a cow, E-I-E-I-O.
With a moo, moo here. And a moo, moo there.
Here a moo, there a moo, everywhere a moo, moo.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.Old McDonald had a farm, E-I-E-I-O.
And on that farm he had a chicken, E-I-E-I-O.
With a cluck, cluck here. And a cluck, cluck there.
Here a cluck, there a cluck, everywhere a cluck, cluck.
With a moo, moo here. And a moo, moo there.
Here a moo, there a moo, everywhere a moo, moo.
With a quack, quack here. And a quack, quack there.
Here a quack, there a quack, everywhere a quack, quack.
Old McDonald had a farm, E-I-E-I-O.
Notice that the verses, taken as a unit, form a single ordered list. You may find it helpful to give the ordered list tag an id attribute and value.
Update the function that the button onclick calls. This click handler should check to make sure that both the animal and sound values are unique. So, in the case of a duplicate value, rather than adding a verse to the song, an error should be reported to the user. A window.alert would work well for this.
Assignments will be submitted using e-mail.
This assignment name and designation:
Old McDonald, extra-credit