Courses‎ > ‎Software Development 2‎ > ‎Dyrland-Weaver‎ > ‎Work‎ > ‎

Work 8: Why won't anyone listen to me?

posted Mar 8, 2017, 7:49 AM by JonAlf Dyrland-Weaver   [ updated Mar 10, 2017, 10:12 AM ]
  • Create an html/js program with the following features
    • An svg container
    • 2 buttons, one labeled clear, the other labeled move
  • Enable the following event listeners for the svg area
    • Clicking on a blank section of the sag area should create a circle at that position
    • Clicking on a circle once should change its color, no new circles should be added to the svg container
    • Clicking on a circle a second time should remove the circle and add a new one to the svg container at a random location
      • Don't put this all in a single event listener
  • When the "move" button is clicked, the circles should start to move around the svg container, bouncing off the walls
    • The other event listeners should still function as described above.
    • NEW: When circles reach the middle of the svg container, a new circle should be added half the size of the original, going in the opposite direction of the original, and the original circle should decrease its size by half.
    • When circles have a radius < 1, they should be removed from the page.
submit this in the workshop under svg-interactive