Planets of the Solar System

This week the focus of my miniproject has been out of this world! You can find it here or by clicking on the picture below.

I was heavily inspired by a Codecademy project which aims to introduce beginners to programming by giving them a template to style with CSS. In that exercise I got Earth to orbit the sun and generally make things look pretty.

For my miniproject I took it seven steps further by adding the rest of the planets of our solar system. Their relative size and distance from each other are based on the actual sizes and separations. Further, the relative time they take to orbit the sun is correct (where 10 seconds corresponds to a single year on Earth).

This week I was mostly trying to see if I could get the input buttons and dynamic resizing to work. When you click the minus button it subtracts one planet from the system and the size of the other planets (and their orbits) are recalculated to keep the screen looking full. Similarly, when you click the plus button, it adds a planet back into the system and shrinks the sizes and orbits down to make room.

I don't think this miniproject looks as suave as the last one -- the interface components are blocky and the whole thing feels angular (despite the roundness of the planets). I'm happy that I got the animation and the resizing to work, though that still feels like a bit of a hack -- you'll see what I mean if you look at the JavaScript!

In other news, I've moved the hosting to GitHub after learning how GitHub Pages work on a remarkable Udacity project. It was relatively easy to set up and I think it looks ever so slightly more mature than a Codebit. 

Probably. 

(Maybe.)