Binding Viewer

After building a structured tree viewer for the parsing language demo, I decided to extend it a bit to demonstrate binding structure in an interactive way.

In the first image my cursor (which you can't see) is hovering over the first x. Highlighted in pink you can see where x is defined, in orange is a binding which shadows the outer x, and in blue is a use of the variable. The green background shows the scope of the variable. Notice the hole where it's being shadowed.

In the second image I've selected the second x, highlighted in pink for a definition site. In yellow we can see that the outer x is shadowed by this variable, and in blue is the one use of this new x. Notice how the scope of this x perfectly fills the gap in the shadowed x's scope.

Third, I've selected f, which is a free variable, so its scope is (implicitly) global.

In the last two images I've selected the two use-sites of the two different xes. We can see both the use-site in blue and the definition in pink.

Finally, a demo for you to try.

Conclusion

There is a dedicated page with more info about abstract syntax in LVCA.

This tool is one example of a major theme in LVCA: building tools which are broadly applicable. Using this notation, which is meant to represent the abstract syntax for any language, this tool could in theory be used for any language.

The next major projects I have planned are additional tools for pretty-printing and for typechecking.