Go Back

Lesson 4 || simulated ball objects
    Getting Started
  1. make a new repl html, css, js project
  2. copy the lesson 4 index.html, script.js, and style.css code into the repl
  3. hit the spacebar. what happens?
  4. hit ctrl-f and search for "var balls" and read the comments about it
  5. ctrl-f search "function initBall()" and read the comments
  6. inside the initBall function, change black to red, what happens?
  7. now change it to inputColor with no "" marks what happens?
    Instantiating Custom Ball Objects
  1. ctrl-f for "function control"
  2. inside the control function, change pink to orange. what happens?
  3. go back to the initBall function definition, and add inputRadius as an input
  4. in the initBall function definition, change "radius : 10" to "radius : inputRadius"
  5. hit the spacebar, if balls arent popping up anymore, it means something is broken (fix it!)
  6. make the spacebar initialize a blue ball of radius 15
  7. make the w key initialize a red ball of radius 7
  8. make the e key initialize a yellow ball of radius 12
  9. bonus : make the r key destroy balls (hint - there is a helpful function in the code)
    Wrapping up
  1. publish the lesson as a website on github pages (see lesson 2 instructions)