Clicker

Example

Basic Features

Step 1: From the Cloud9 dashboard: Create a new workspace
Fill in the following text boxes on the form:
→ Workspace name: clicker Copy
→ Clone from Git or Mercurial URL: https://github.com/studentmrcode/clicker.git Copy
Click Create workspace button
Open index.html and click Run

Step 2: Replace the default image with your own image.

Step 3: Make separate variables for the image, paragraphs, and buttons.

Step 4: Update the points paragraph when the image is clicked to show one point.

Step 5: Update the points paragraph each time the image is clicked to show more points.
Hint: Watch the incrementing variable video. The video shows an illustration. Figure out how it relates to your code.

Step 6: Update the points per click paragraph each time the add point per click button is clicked. Change the number of points received when the image is clicked.
Hint: Make a variable for points per click.

Step 7: Require the user to have at least 10 points to add points per click. Deduct 10 points.
Hint: Watch the if statement video. The video shows an illustration. Figure out how it relates to your code.

Step 8: After adding points per click, double the cost of adding points per click. Update the button to show the new cost.
Hint: Make a variable for the cost of adding points per click.
Hint: Use the * symbol to multiply.

Step 9: Add an auto clicker each time the add auto click button is clicked.
Hint: Watch the timing events video. The video shows an example. Do NOT copy it exactly.

Debugging help

Last topic Next topic