# Exercises

Work through these in order.

## 1. Click counter

Create an `index.html` file with two buttons and a place to show the count.

* When the first button is clicked, show 0. The next time show 1, then 2, etc.
* Clicking the second button should use the same counter and update the same display.

## 2. Delay clicker

Create a button with the text "Log in 3 seconds" and an area where you can show a message.

* When the button is clicked, wait 3 seconds and then show the text: "This text was delayed by 3 seconds".

## 3. Page onload

Create a callback function (as a variable) that shows "DOM fully loaded and parsed".

This callback should run when the DOM is fully loaded. Search for how to run code when the DOM is ready (e.g. "DOM ready" or "page load event").

## 4. Mouse position

Create a handler that shows the x,y coordinates of the mouse (e.g. update a paragraph or a fixed div as the user moves the mouse).

## 5. Mouse position online tool

Imagine an online tool where businesses see where their users' mouse is most of the time, to check if their design works well.

Write JS that, after 30 seconds, computes the average x and y position of the user's mouse and displays it.

> \[!TIP] Before starting, make a plan for how you will implement this (e.g. with your mentor).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://program.hackyourfuture.dk/course-content/frontend/advanced-javascript/week2/exercises.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.