On the client
How does it work?
input id="question" data-bind-question
button data-on-click="@get('/teacher')"
All signals on the page are sent to the backend when a request is made.
HTML fragments are merged with Idiomorph
On the server
The server can respond with 0 to n events
return ServerSentEventGenerator.stream(async (stream) => {
stream.removeFragments('#answer');
stream.mergeFragments('<section id="answer">The teacher is answering</section>',
{ "mergeMode": "after", selector: "#fom" }
);
await delay(500);
stream.mergeFragments('<section id="answer">The teacher is answering.</section>');
await delay(500);
...
body.signals.question == 4 ?
stream.mergeFragments('<section id="answer">Your answer is correct :)</section>') :
stream.mergeFragments('<section id="answer">Your answer is wrong :(</section>') :
stream.close();
}