Sickkkk

🎉

The little embedded ReSheets are a nice touch! And you did well with the design in the landing sheet! It does show nice versatility.

Since embedding works here, does it mean embedding into websites outside of ReSheet.dev is closer? 😀

Thanks Declan ❤ Embedding didn't get easier, but it should be easy to create a library out of ReSheet. Maybe I'll tackle that in the next days, I'll keep you updated

It uses the Spatial Computing angle again, as it's a handy launchpad.

It has lots of pictures! I know people like pictures.

It's also written in a hopefully more accessible dialogue format.

I keep thinking I want a makerspace in VR, like lathes and things that work on polygon meshes and craft "tangible" VR objects, and a group of you work together to customize your space and hang out. I guess your article is about AR but virtual tools would still work.

Sounds like a great vision. My article at heart is about neither AR /or/ VR, really! Have you seen Resonite?

Nice! I love how you can follow how the code is working with the results of the calculations in the code itself and the visualisations. I wonder what's custom built for this example and what works for any use-case.

Also, is this new environment somewhere available to try out?

Thanks Daniel!

I use Observable Framework, and its reactive JS. It doesn't have many mechanisms to encapsulate its own reactive code but I can consolidate common bits like the layout, editor, devtools in a TEMPLATE.md file that I include in other ("custom") OF md files: in this case raycasting.md

To show the workings like that we need to know values to use for every input, so there is a stateful 'cursor' object that custom code must set; also a stateful array of visible formulae that it can set if it wants to. The cursor object is handy anyways because custom code uses it to to make its visualizations/etc anyways.

raycasting.md custom code is dense on code for the visualizations: basically everything on the right hand side, and that includes signal handlers on the visualizations which use setters for the cursor object to set inputs, visible formulas to select formulas, and button controls to set a key stream input to the cursor; also those options at the bottom right.

That code includes approx 1k lines of visualization code (Vega-Lite for the scene visual at top, much denser Vega for different layers of the visualization below it)

If the app (lets call the RHS an "app") wants to control the cursor (=> the workings) and navigate the formulas then it needs to tie the handling of that into signal/event listeners.

That can be in a 'far less' elaborate way, for instance in this example: calculang-editables.netlify.app/savings (an earlier one where you can't see the workings on top of code, but they are calcd underneath)

This has another feature that highlight the numbers (in the grid) used to calc a number also (just brush over them).

And this is a bit more standard and I can facilitate a good co-operation in the views with less custom code.

In the example in the video though - there's some code to manage the cursor and formulae we are navigating (but I think we need to expect it)

There was a mash of experimentation in the codebase that gives it a poor structure and fragments work around calculang, so haven't released it yet but I'll think about it in the week