Bouncing balls

Bouncing balls is a simple app where users can add balls and see them bouncing around until they stabilize in a still position.

App is hosted here

Used technologies

Used third party library p5.js

• it is used only for drawing of the balls on the screen
• used methods:
  • setup() invoked on startup to initialize the app
  • createCanvas() creates the canvas on which the balls are drawn
  • background() sets the background color of the canvas and to prepare the blank canvas for each new draw iteration
  • fill() sets the color used to fill shapes
  • elipse() draws circles on the canvas

Tests

• Jasmine is used to as testing framework
• There are unit test for the ball addition, movement, collision and gravity force

Potential improvements

• can be rewritten using Typescript, using latest JS, so modern features can be used as modules and types to improve the code quality
• module bundler can be used (Webpack) instead of adding the scripts manually
• global vars should be encapsulated and used only for the main state of the app
• more unit tests can be added
• dynamically resizable canvas to take up whole screen on different devices