freetar icon indicating copy to clipboard operation
freetar copied to clipboard

"Show chords" chords are not transposed

Open dann-merlin opened this issue 1 year ago • 3 comments

When you transpose a chords, the way how you play the chords are not also transposed in the "Show chords" thingy. I would consider this a bug. What do you think?

dann-merlin avatar Jul 05 '24 21:07 dann-merlin

Pull requests are welcome :)

kmille avatar Jul 06 '24 07:07 kmille

Hm, looked into it a bit. The transposed chords should obviously not just be shifted a bit. It should show the transposed chord, the way one would play it.

This is not easily doable with only JS. The way UG does it, is by sending a new request to the server and that way fetching the chord info for the transposed chords. This also means that the logic that is in ug.py:get_chord() right now, is implemented in javascript in UG. I think the easiest way to do this with freetar's architecture would be to redirect to the same page, but with a ?transpose= parameter. Then the backend would fetch the transposed chords and serve the page with transposed chords. I'm not sure how easy it would be to scroll back to the same spot on the reload, but I think that should be possible, however that would still mean a page reload, which is kind of disruptive.

The alternative would be to have a get_chord endpoint on the backend, which serves either the raw json data of a chord for the client to parse, or it serves the html itself for the client to replace it.

I kind of prefer the "Client reads json from get_chord endpoint and changes the chordVisual html accordingly" method, but please tell me what you think, as this seems to require more than just small changes.

dann-merlin avatar Jul 06 '24 11:07 dann-merlin

@dann-merlin I don't know what kmille would think about adding another javascript dependency, but htmx should be able to do this easily. We'd set a space for the chord diagrams (already there), then make an ajax call to the backend without reloading the whole page and swap the contents. htmx is about 5200 lines of code, 50kb minified. It's a great match for a project like this where javascript/interaction is minimal but can be sprinkled around. It can handle some of the existing javascript functionality too.

xpufx avatar Nov 27 '24 11:11 xpufx