Preserving similarity -- prototype mock-up 

This is a prototype mock-up of a requested exercise described on https://trello.com/card/2-preserving-similarity/4d87e664967a0775082939ab/350 -- This version asks if a given transformation to a triangle will produce a result geometrically similar to the original triangle. It provides an interactive diagram meant to help illustrate how the transformation alters the triangle. The user adjusts a slider which drives an animated portrayal of the transformation. This, I hope, helps teach the student whether the two triangles (before and after) are similar.

This version is just meant to illustrate the approach I proposed. I present it just to stimulate conversation on whether this is a good approach to pursue for a more polished "preserving similarity" exercise. This version is incomplete and full of problems (listed in a comment in the file and below):


* based on https://trello.com/card/2-preserving-similarity/4d87e664967a0775082939ab/350
* very much "not production quality"
* for now, triangles only
* for now, only two cases/transforms (of others mentioned on the Trello card):
  * multiply all side lengths by constant (preserves similarity)
  * add constant to all side lengths (removes similarity (expect special cases))
* uses an interactive slider to incrementally apply one of those transformations to help visualize whether or not it preserves similarity
* there should probably be a label on the slider, and perhaps labels indicating the lengths of each side and the angle of each vertex.
* many of the triangles based on independent random points are too small or too skinny. I wonder if it would work better to generate three side lengths and construct the triangles from that.
* note: adding a constant to the side lengths of an equilateral triangle DOES preserve similarity, and for nearly equilateral triangles the visual effect is subtle
* only the dot/knob of the slider is mouse-sensitive, maybe the whole "track" should be.
* parts of this ("mini 2d library", the slider) probably duplicate Khan library code...
* This should be a multiple problem exercise structure (instead of using CASE below) but I found myself having to dispatch, inside javascript code, on which "problems type" is currently selected. Is there a way to do that? Or do I need to move the javascript code into a separate .js file and call it from each of the multiple problem types?