CS383: Lab 5 -- writing Javascript in HTML pages

In this lab you will write some simple javascript functions in a single web page (written in your class personal web site). The functions will each be started by clicking a button. When each function completes, the function will put its result into one or more html elements on the page. The goal for this lab is for you to get used to writing Javascript and more comfortable with using Javascript to dynamically update the page in which the Javascript resides. So, feel free to expand or adapt the suggestions here.

The functions

Write the following functions.

Show the count of the number of times that any button on this page has been hit.
Compute the Nth fibonacci number. N should be 3 plus the number of button clicks.
The area of a regular pentagon whose sides have length N+2 (again, N is the number of button clicks).
Start a countdown timer where the timer counts down from N+2 by an interval given by 10000/(N+2). The idea is that the countdown will always take 10 seconds, just the number shown will change and the interval between number will change. The timer should change the contents of the button that triggers the timer.

Suggestions

Just put formless buttons on the page. Ie buttons that are not in forms. For instance

<button id="ss" type="submit" onclick="function1();">Function 1</button>

As shown above, specify the onclick action to be the name of one of your functions.
Create empty "div"s into which you will put the result of your functions. For instance
```
        <div id="f1result"></div>
                
```
Rather than putting everything in divs, maybe use h1, h2, h3 and h4, so span or p or .... elements?

Reminder. You can put Javascript functions and code directly between script tags. For instance this will work

            <script>
            function ff() { return 6*3; }
            </script>

You can also put javascript into a separate file that is specified in the script tag.

            <script src="./myjavascript.js"></script>

Debugging javascript is really annoying; but there is some help. Within your browser of choice you should definitely open the "javascript console". For instance, in firefox this can be found from the "tools" menu; select "browser tools" then "web developer tools". When javascript goes bad you can get stack traces (or at least the top item in the stack). You can also send logging statements to the javascript console by using the console.log() function.

What to hand in

Send email to gtowell@brynmawr.edu with a link to the page you created for this lab.