New exercise: Interactive telling time

[stephjang]

Trello bug: "Telling time, interactive" in "Queued up"
Feedback much appreciated!

CHANGED

telling_time_interactive.html

• "Set the clock to 3:45". User moves clock hands accordingly.
• Hints might need some editing from a more experienced hint-writer.

time.js

• Copied and extended analogClock() from graphie-helpers.js to a more customizable addAnalogClock() function (modeled after addMovablePoint()) inside time.js
• NOTE: the functions coordToDegrees() and degreesToCoord() may belong in other packages. Any ideas where?
• NOTE: roundToNearest() belongs in math.js. See below.

interactive.js

• Added a snapPoints option to movablePoint.constraints.fixedDistance to allow snapping around a circle (fixedDistance restricts the point's motion to a circle). snapPoints is the number of points that can be snapped to around the circle.
• NOTE: to implement this functionality, there is a bit of redundancy with functions in angles.js and time.js, but this might be unavoidable since interactive.js may be used without the others.

angle.js

• Added toDegrees() function

NO CHANGE CURRENTLY, BUT SHOULD CHANGE

telling_time.html & telling_time_0.5.html

• NOTE: should be updated using new time.js package (if accepted)

math.js

• NOTE: I tried to add roundToNearest() (currently in time.js) to math.js but for some reason I couldn't get it to work. Something about how math.js is compiled? Is it a special file compared to the others?

graphie-helpers.js

• NOTE: if time.js is accepted and telling_time.html & telling_time_0.5.html are updated, we should remove the analogClock() function from here.

[stephjang]

Oh dang, I just saw that someone else attempted this already: #6362. But it seems they didn't finish...

[stephjang]

Whoops, I didn't mean to commit the changes to unit_circle.html or to graphie-helpers.js...

[mwahl]

Nice exercise @stchangg!! Great addition to the time setting series. Will be mentioning a few minor suggestions - will take a deeper look in the next few days.

[mwahl]

Time should never === 1:00 [default time shown on clock] - data-ensure should make sure this won't happen

[stephjang]

Just made this change... not entirely sure that this is the right way to use data-ensure, but after checking the other exercises, it seems OK to me.

[Christi]

what if you had the clock randomly set to a time and make sure it doesn't match what the user is supposed to set it to? The idea of eliminating one time from the set seems wrong. Or you could make having the time match the answer a gimme

[beneater]

Within a graphie div like this, you shouldn't have to prefix stuff with KhanUtil

[stephjang]

Oh, did not realize. Removed them. Question: does this also apply to the "validator-function" div, or do I need to use KhanUtil there?

[beneater]

Nope. You shouldn't need it in validator-function either. Generally if you need to reference KhanUtil it anywhere in the html file, something is probably wrong.

[stephjang]

I modified the hints and felt that the plural() function from word-problems.js could make them a bit smoother. However, will this affect load time/performance, since this exercise includes so many modules now? The full list is: math math-format graphie interactive angles time word-problems

[stephjang]

I'm pretty sure I made all of the latest requested changes. Let me know if there's anything left!

[stephjang]

@beneater I refactored the other time exercises and removed the old time code from graphie-helpers. :)

[beneater]

This should probably be if ( this.hour !== undefined && this.minute !== undefined ) {, so this doesn't happen.

[stephjang]

Whoops, fixed this.

[beneater]

hrm.. i just noticed it's drawing the hands at 12:00 in the interactive exercise now, so maybe these are defined but some other kind of falsey value? Haven't looked through to see exactly what's going on (you can probably figure it out faster than me), but something about this check isn't working right in the interactive version.

[stephjang]

Oh sorry, I made the change too hastily. This probably should be checking for false, not undefined, since I set default values for those params to false when instantiating the analogClock object. Just pushed the fix.

[beneater]

Awesome! This is a really great exercise!
Looking forward to seeing many more :)

As I mentioned before, it might be another week or so before it goes live since Matt's out of town :(

[mwahl]

Thanks @stchangg for rocking this - very slick. Will let you know when we push live later this week/weekend!