Melody Search js could be cleaned up

[dchiller]

In the course of completing #1130, some opportunities to clarify and simply the Javascript for the melody search tool were identified. In the interest of quickly fixing the bugs identified in #1128, these changes were not immediately implemented. I'm opening this issue to track these opportunities:

• the drawArea div was given the bootstrap class "text-truncate" but there may be a better way to have the staff of the melody search not wrap to a second line in narrow windows
• the trackClick and trackMouse functions have almost identical series of if-else statements that could be combined to reduce the possibility of discrepancies and to simplify the code
• Currently, it seems like the browser downloads the image for the "notehead" anew each time the mouse changes positions on the staff. This doesn't seem to be causing performance problems (the images are small), but there also may be a quick way to download all the images and show them when necessary

[jacobdgm]

Currently, it seems like the browser downloads the image for the "notehead" anew each time the mouse changes positions on the staff. This doesn't seem to be causing performance problems (the images are small), but there also may be a quick way to download all the images and show them when necessary

My initial instinct would be to use text/volpiano rather than images. Guessing that this was how it was set up in OldCantus, but is there any reason why we can't/shouldn't do it with text?

[jacobdgm]

Aside: it's interesting to inspect elements on https://cantus.uwaterloo.ca/melody - you come across things like https://cantus.uwaterloo.ca/sites/default/files/noty/searchmelody.js. You get functions like Zobrazit, and properties like CiselnaHodnota ("ciselna note head"?). I gather these must be descriptive variable names in Czech!

[annamorphism]

"numerical value", I think, though why the value would be a pitch/letter I am not sure...