feat: allow embedded ReadAlong in <read-along> element

[dhdaines]

Small caveat, you must use the <text> element to enclose it even though this is optional for standalone ReadAlong files.

This was surprisingly easy, the only quirk is that it gets parsed as HTML rather than XML, so the nodeName property is uppercase for everything inside it.

[joanise]

Nice and simple, and I like the resulting format, and I'm impressed at how easy it was to support.

We will have to document somewhere that the <read-along> element can take an href attribute pointing to a .readalong file or or <text> child.

Am I right in assuming that <text> can be at any depth, through that querySelector call? That seems like too much freedom to me, I'd restrict it to having a child <text> element rather than arbitrarily searching. I don't know if I'm being overly picky, though, My two opposing questions: a) is there a use case for allowing it deeper? and b) is there any risk in allowing it deeper?

If there's no risk, then it doesn't matter and we can keep it this way, but in the documentation I would only mention the child node syntax unless and until there was a use case.

[dhdaines]

We will have to document somewhere that the <read-along> element can take an href attribute pointing to a .readalong file or or <text> child.

Yes, I guess this should go in the web component documentation?

Am I right in assuming that <text> can be at any depth, through that querySelector call? That seems like too much freedom to me, I'd restrict it to having a child <text> element rather than arbitrarily searching.

Yes, this makes sense, I've updated it to just do that!

[dhdaines]

I've also updated the Studio-Web application to embed the ReadAlong in the downloaded stand-alone HTML, to facilitate manual editing.

It's still encoded as base64 for the actual component in the Angular application, because just inserting it into the component is one of these seemly obvious things (like, I just want to add things to a DOM element!!!) that is impossibly difficult to figure out how to do in Angular. Maybe ChatGPT can do it for me.

[dhdaines]

Hi - I modified this slightly so that it merely accepts the embedded ReadAlong in the web component, since there is maybe limited value in having the alignments expanded out in the all-in-one HTML download.

I also bumped the minor version number of the web component as this is a significant new feature that other code may want to depend on.