Do less work when resizing

[Ted Han]

In the integration branch, scaleNote is called every time the window resize handler fires, regardless of whether the note needs to be rescaled/restyled.

Can this be made smarter, so that notes are not scaled unless the boundary conditions for how each note is displayed has been passed?

[aramology]

There are three states for the widthViewable for a note: smallest (1), where the width of the viewable is shorter than the width of the target; middle (2), where the width of the viewable is shorter than the sum of the widths of the left cover and the target; largest (3), where the width of the viewable is larger then that.

First shiftLeft was taken out from scaleNote, so that shifting the left cover & image happens separately from scaling the image. Note that states 2 (middle) and 3 (largest) only differ in the position of the left cover & image.

For each note, the widthViewable_state records which state it's in. When the width of the viewable changes (or rather when the width of window changes), widthViewable_state is used to tell which state it's coming from and is updated according to the new width of the viewable.

These are the rules for applying shiftLeft and scaleNote:

1,2,3->1 : changing from any state (1,2,3) to the smallest state (1), scaleNote & shiftLeft

1->2,3 : changing from the smallest state (1) to NOT the smallest state (2,3), scaleNote
1,3->2 : changing from NOT the middle state (1,3) to the middle state (2), shiftLeft
1,2->3 : changing from NOT the largest state (1,2) to the largest state (3), shiftLeft