Basically since we initially added github pages support, we’ve been able to extend what you can actually ‘do’ because running it in your own project / website means we can also let you run, well, any code you want. But docs on that are a little confusing so I started a lil repo sample you can use if you want to do so with your own project.
A reminder on this; the custom js will only run on that github pages site, and won’t be testable or usable in makecode itself – in the editor, or share page, or anywhere else – ever. Running js lets you do, well, most anything, so we can only let you run arbitrary code in places you control.
I’ll probably update this more this weekend / in future as needs come up, but I tried to keep it fairly simple for now: here’s the sample page that has support for 3 interactions currently:
arcade-github-pages-messages
-
Changing the simulator color / theme based off where you are standing (forever loop & portion starting here https://github.com/jwunderl/arcade-github-pages-messages/blob/3e104167a92f2b7207e1a52155c650c907cfd2c1/assets/js/custom.js#L63)
-
Making the duck say whatever the user types in the input at the bottom (on parent frame message handler and handler starting here https://github.com/jwunderl/arcade-github-pages-messages/blob/3e104167a92f2b7207e1a52155c650c907cfd2c1/assets/js/custom.js#L128)
-
opening our stream if the player talks to the computer (button handler and https://github.com/jwunderl/arcade-github-pages-messages/blob/3e104167a92f2b7207e1a52155c650c907cfd2c1/assets/js/custom.js#L66)
I put the custom blocks that handle this in the messageposting.ts file in the project itself for now; maybe we can make an extension for it, or just clean up this repo slightly and have that be it, not hard i suppose) but they’re simple wrappers around the existing code.
besides the custom.js that i linked above, only other change you’ll want to make is adding in this line arcade-github-pages-messages/pxt.json at master · jwunderl/arcade-github-pages-messages to ensure we don’t accidentally zero out custom.js. binary.js gets created when you push a new version automatically, and you can just commit directly to custom.js (I didn’t both to create a ts compile step or anything, since that gets rid of the ‘just edit in browser directly’ slightly, but it’s also easily doable).
(if there’s particular things you want me to help point in right direction for happy to do so / just look at this as like a beta sample for the moment as i did it in background~)