Assignment 3

You will be modifying a javascript program. Javascript is a powerful computer language which works with browser software to add buttons, menus, etc.

Getting started:

1. Right-click on the link hello_java.html and choose "Save Link As..." Save the link to your desktop.
2. This will create a file called "hello_java" on your desktop. You can open this in a text editor (such as Notepad or Notepad++ for Windows or Textedit or BBEdit for Mac).
3. To open the file in a text editor, do not just double-click on "hello_java". Either right click on the icon and choose your text editor, or open the text editor and open hello_java from there.

• Play with the webpage before editing it.
• Read through the webpage code before you edit it.
• Quickly view the website code within the browser by right-clicking on the webpage and selecting "View page source" (or keyboard shortcut Ctrl-U).
• Pay attention to the comments within the website code.
• Firefox and Internet Explorer are the recommended browsers (Chrome and Safari sometimes have problems displaying the webpage).
• Notepad++ for Windows and BBEdit for Mac are better alternatives to Notepad and Textedit. (See Assignment 2 for download links.)

• Add your name and UCSC login so we know who you are.
  • Replace "My name is:" with your full name. (50 points)
  • Replace "My username is:" with your UCSC username. (50 points)
• There is a button that reads "Click me!" Change this text from "Click me!" to any other text. (50 points)
• When clicked, the button will create a pop-up window reading "Good job!". Replace this text with a different message. (50 points)
• Add the current date, which should update to reflect whatever day it is when viewed. (100 points)
  • The script that accomplishes this is already in the file, but as a comment.
  • Read the comments carefully. They will explain what to do.
• Modify the file so that it is possible to say two more things (other than hello and hate), such as "I like [person's name]" and "I love [person's name]". To accomplish this, you will need to make the appropriate changes in two places:
  • Add two new options to the pull-down menu (100 points, 50 points each). Currently, there are the options Hate and Hello. Add two more, such as Love and Like.
  • Add two new cases to the function my_function (100 points, 50 points each). This means that when the user selects Love or Like, the appropriate response will be displayed when the user clicks the "Greet" button.
• The pulldown menu only shows one item at a time. Make it so two items are displayed at a time. Note: This only shows up properly in Internet Explorer and Firefox. (100 points)
• The left edge of the textbox (next to NAME) should be lined up with the left edge of the menu below it. Add spaces to push the textbox to the right. (100 points)
  • Look in the source code. A couple spaces have already been added.
  • The spacing need not be perfect, just closer.
• There is a hyperlink that goes to the class webpage. It has several problems, which you will fix. The hyperlink says "Place your mouse on and off of this".
  • Change the background color action:
    • When the mouse first hovers over the text, the background will turn yellow. Make it turn pink (or another non-yellow color) instead. (100 points)
    • After the mouse moves off the text, the background remains the same color. Alter this so that moving the mouse off the text changes the background to blue (or another color). (100 points) The command for turning the background blue works the same way as the code that changes it to yellow (or pink), except it is "onMouseOut" instead of "onMouseOver".
  • Change the text and the URL for the hyperlink:
    • Replace "Place your mouse on and off of this" with new text, indicating that the person is going to a different web page. (50 points)
    • Replace the URL with the URL of your choice. (50 points)
• SUBMIT your "hello_java.html" file to Canvas.

• Extra credit: Change the font of the page to Courier. (100 points)