w6d4 - Javascript, jQuery and blackjack

I woke up at 4 or 5 this morning and lay in the dark thinking of stabby rainbow triangles, as one does.  And, as often happens, a solution to my drawing problems came to me.

The problem lay in drawing n triangles arranged such that each triangle had the same base (width) but an arbitrary height corresponding to temperature.  The triangles should touch only at the base corners.  In looking at the <canvas> documentation, my initial impression was that rotate or transform would rotate or move a shape (it's the shapes that move in MS Paint or other simple drawing programs I've used.)  Trying to rotate the images last night met with miserable failure.

My o'dark-hundred realization was that it's the canvas that moving, not the image.  The other realization was that if I defined a new "center" for the canvas (using context.translate), then started drawing my triangle a suitable distance "above" the center, then rotate the canvas by a suitable portion of a circle, the triangles would all be tangent at the corners...by magic!  Or math.

(image from draw.io)

The "base" is the base width of the triangles (which I can specify).  The circle represents the center of the canvas as defined by me.  The arrow represents the "offset" distance - the distance "above" the center where the triangle should be drawn.  It's found using the tangent of angle A, where the opposite side is length base/2.  

My next realization is that I could draw a stellate polygon of n sides by setting A = 180/n and the offset as base/(2*tan(A)).  The context rotation between each triangle would be 360/n...or rather 2*PI/n since javascript loves radians.

My code right now is a god-awful spaghetti mess, so I'm not going to put it up yet.  I really need to improve on writing long programs in neat packets.  I got pretty good with python, but javascript has knocked me back into my reflexive write-everything-in-one-big-blob mode.

For now, I'll just say that I thoroughly enjoyed this once I figured out what I was doing.   It feels so good to stretch my math muscles again, however small the stretch may be.

I still would like to make the output more interactive, so the stars rotate when clicked, and display an image of the day's weather.  I know how I'd like to do it (just redraw the stars starting at one place further along the array).

The other project for the day was expanding a javascript version of blackjack that one of the instructors had started.  The base version had a rudimentary game engine, and the cards and deck defined (with images).  There was a game clock that monitored the state and redrew cards and printed text as needed.  

Reading expert code may be my greatest joy here, other than my own occasional breakthroughs.  It's so interesting to see how people break a problem into pieces and make them work.

The really fun part was unravelling what was going on since there was no documentation provided.  I'm happy to say that by the end of the day (about 4 hours), I'd managed to implement a scoring system, and add hit and stand capability.  I can see the way to finish the project.  

I have so much to learn still.  I'm definitely at the "OMFG" stage of learning, or the "desert of despair" from the Viking Code School blog. I'm at the point where I'd felt like I kind of knew what was going on with python...and now I'm realizing just how deep the well is, with sql, django, javascript, ajax, server management...it's dispiriting. It's not that I don't want to learn all that (I love learning, after all).  It's more that there's just so much before I can do anything useful.

Unless you count n-sided rainbow stellate polygons as useful, of course. :)