Refactor url hash to json

[daniel-wer]

Refactor the url hash/fragment to alternatively use json format instead of a comma-delimited custom format. I added quite a few tests to make sure that both the csv format as well as the comment links (which also temporarily change the url hash) continue to work. Keep the csv format as the default.

• Certain characters in the fragment string need to be escaped (see https://stackoverflow.com/questions/2849756/list-of-valid-characters-for-the-fragment-identifier-in-an-url). For now, I've used the built-in encodeURIComponent to do that. However, the function encodes quite a few characters which don't need to be encoded, resulting in a rather unreadable url hash. We could write a custom {en,de}coding wrapper which doesn't encode :, . and , to make the hash more readable. On the other hand, we don't really want users to modify the url hash anyways, I'd say. What do you think?

URL of deployed dev instance (used for testing):

• https://___.webknossos.xyz

Steps to test:

• Open a url with a hash in the csv format and check that it opens correctly and the url state is correctly applied. E.g. append #10,20,30,0,1.3,2 (x,y,z,mode,zoomStep,activeNode)
  • Modify values in the url hash json format
    • Check that the state is applied after pressing Enter
• Open a url with a hash in the json format and check that it opens correctly and the url state is correctly applied. E.g. append #%7B"position"%3A%5B445%2C358%2C501%5D%2C"mode"%3A"orthogonal"%2C"zoomStep"%3A2%2C"activeNode"%3A2%7D
  • Modify values in the url hash json format
    • Check that an error is thrown if the json format is invalid
• Check that the url hash works in flight mode or when there is no active node
• Create comments with links, for example jump to node with id #2 and jump to position #(1,2,3). Then click on the links and check that the links work as expected.

Issues:

• fixes Refactor URL parameter scheme #4596

---

• Updated (unreleased) changelog
• Updated (unreleased) migration guide if applicable
• Updated documentation if applicable
• Adapted wk-connect if datastore API changes
• Needs datastore update after deployment
• Ready for review

[philippotto]

Really great stuff! Great that you also added extensive tests 👍

From our discussion today, there are some remaining todos (namely, sticking to the legacy URL by default), but other than that everything looks pretty good 👍 From my POV you could add the mapping-support to this PR or open a new one for that. Your call 🎲

[philippotto]

From our verbal discussion: The legacy variant (maybe we should call it CSV since we'll stick to it) should be still supported and also used here for updating the URL (probably the component would need to support both ways for building the hash; the new variant would be used by the share modal).

[philippotto]

We could write a custom {en,de}coding wrapper which doesn't encode :, . and , to make the hash more readable.

I think, this would be great, but that could be a follow-up once we are annoyed enough by it (building the new variant backwards compatible should not be a problem in my opinion).

[daniel-wer]

I think, this would be great, but that could be a follow-up once we are annoyed enough by it (building the new variant backwards compatible should not be a problem in my opinion).

I did it in this PR :)

I'll tackle the mapping and agglomerate loading in a separate PR. This one should be ready for review.

[philippotto]

Code looks great and it also works well for me :)