A simulated mini-application running via Express

(In the previous version of this ticket, I had proposed the idea of a mini-app that actually used the student's code by interacting with the compile server. I now think this would place too much demand on the server, when many students are using it at once, and will probably want to 'play' the finished thing multiple times. The following is, I think, a more realistic idea.)

Once a project has been finished, in several cases (e.g. Life, Wordle Solver) the student is presented with code for a small procedural program which, when combined with the functions they have written and run in their own IDE, will allow them to use the finished program.

I now think that in addition to this, the project should offer a simulated version of the finished 'app' that runs entirely within the client. This simulation would not actually use the student's code: it will be a self contained TypeScript program with its own implementation of the functions. (This fact will not be hidden; it will be explained that to run their own code - which is recommended - they need to run it with the given mini-app code in an IDE). The local simulated App will be available only after they have written and successfully tested the required functions.

The advantages of the simulated App are:

1) It gives the student a more immediate reward from completing the Task. 2) It could be done at several stages within the project (same App, or different App, per stage), though I think that should be done cautiously - the idea is still to save the main reward for completing the project. However, a counter example is Wordle, where the first 7 tasks only get you to MarkAttempt, but this could be used in a simulation of the Wordle App before going on to write the automated WordleSolver. 3) It could be used by students who don't have access to the IDE (e.g. at home rather than at school)

I had originally thought that the App should run within the the Task View, using the Expression pane for input, and the Result pane for output. I now think, however, that it should run as a separate page. Clicking Run App (when available) will open this App view in a separate tab (and featuring a Back to Task button which will always be active i.e. will also stop the program if it is running). I think the Run App should appear in the header bar of the Test pane - because you should only be allowed to run it when tests have passed.

This pattern would also then be compatible with the idea of running the program in the ARMlite App (as distinct from using the ARMlite Service, transparently, while writing the code in the Task View). However, the difference would be that for an ARMlite task, it would be the user's own code that eventually ran in the ARMlite App. Therefore we need to be able to configure what the RunApp button does e.g. just goes to an a URL, or calls a specific TypeScript method (e.g. for ARMlite this generates a url call passing in the code as a query string).

In the first instance we need:

An example/template for the App code
How to get the App code from the server. (Can it just be in place of the existing HiddenCode - I suspect not - or does it need the option for a specific App file to be obtained from the Task).
How and where to provide a Run App button (when appropriate) in the Express task view.

MetalUp / Express

A simulated mini-application running via Express #156