Best writers. Best papers. Let professionals take care of your academic papers

Order a similar paper and get 15% discount on your first order with us
Use the following coupon "FIRST15"
ORDER NOW

project 4 and 5 1

/in /by

project 4

this is what my game looks like! The stuff below needs to be added to what I already have.

In this project, you will create the functions that cause the game to start! If you recall, the ENTIRE game is started by clicking the “start” button. Upon the “start” button being clicked, a few things begin to occur, such as the timer decrements by 1.


We will start at the beginning with this project. You will make a “main” function (and others) that will trigger all of the above listed tasks. This function will not be complete until the next project so do not worry if it seems wrong. Let us get started!

  1. Copy ALL of the contents in the public_html/csci2447/project3 folder into the public_html/csci2447/project4 folder. This ensures that you will not overwrite your work for the previous project. You will do this for each project from here on out. If you do not do this, there is no way for me to grade your previous project.
  2. (5 pts) Create a new function (outside the jQuery ready() function). Name it whatever you like (eg. beginGame(), start(), etc). This function will trigger all of the separate game components.
  3. (5 pts) Remove the alert() in the “start” button click event listener. Instead call your newly created “start” function when the “start” button is clicked.
  4. (5 pts) Create a function (outside the jQuery ready function) which decrements the user’s remaining seconds when called and updates the HTML in div#timer. Hint: You should create a global variable to track the seconds remaining.
  5. (5 pts) For testing purposes, call your timer decrement function in your “start” function. Also, move the line of code that shows the#timer from the ready() function to the “start” function.
  6. (10 pts) Create another function call addMole() (outside of the jQuery ready() function). Recall the line of jQuery you wrote in Project 3 that dynamically adds the mole to div#gamespace? Cut this line and paste it into this new function. When called, this function should add the image to the page.
  7. (3 pts) Call the addMole() function in your “start” function (for testing purposes only, temporary). When you click the “start” button, the mole image should appear on the page.
  8. (2 pts) Leave the two alert()s for the random numbers alone (for testing purposes only, temporary). Move them to your “start” function instead of the jQuery ready() function.
  9. (5 pts) Call your score increment function in your “start” function for testing purposes instead of document ready. This will most certainly be removed in the next project. You wrote this function in Project 3.
  10. (10 pts) Using jQuery, change the color of the gamespace, and body of the page. This will occur once the start button is clicked.
  11. When you are finished, ensure that all changed files have been posted to the project4 folder. Do not overwrite the previous project!

As a recap for this part, when you click the “start” button, it should call your “start” function and that should trigger the following:

  • A mole should appear
  • The score should increment by 1
  • The seconds remaining should decrement by 1
  • The values from your two random number functions should alert().
  • Color of the gamespace, and body will change when the start button is clicked.

project 5

  1. Copy ALL of the contents in the public_html/csci2447/project4 folder into the public_html/csci2447/project5 folder. This ensures that you will not overwrite your work for the previous project. You will do this for each project from here on out. If you do not do this, there is no way for me to grade your previous project.
  2. (5 pts) Remove the temporary calls to your random number functions (two in total) in the ready() function. Disable the call to your score increment function in the “start” function. Incrementing the score should only occur when a user clicks a mole now. Disable any other code which was for testing purposes so it does not ruin the game.
  3. (15 pts) Now it is time to make your timer count down! There are plenty of articles on the web that shows you how to make a function repeat. This citWebDev article discussing how to make functions repeat is a good starting point. Use this information to make your timer function repeat every one second after the user clicks the “start” button. In the next project, you will make the timer stop at 0.
  4. (15 pts) Next, we need to make the image of the mole clickable! Recall that you can use .click(), but this will not work for images added after page load. Use .on() to make ALL MOLES clickable! When the mole is clicked, call your score incrementing function. This code should go in your ready() function.
  5. (15 pts) To make this game more….game-like…we need to display more than one mole! Make addMole() repeat on an timed interval (say two seconds…we will randomize this later). Now, multiple moles should appear and be clickable. Modify your existing addMole()function. Hint: repeating is similar to the timer counting down. Note: Depending on how you added your code, you will not see the images being added repeatedly because our current code overwrites the #gamespace HTML each time; replacing the image which was there. If you utilized the append method, you will see the images appear next to each other, and will not stop. This is ok to happen.
 
"Looking for a Similar Assignment? Order now and Get 10% Discount! Use Code "Newclient"