toolness / p5.js-widget

A reusable widget for embedding editable p5 sketches in web pages.
https://toolness.github.io/p5.js-widget/
GNU Lesser General Public License v2.1
161 stars 44 forks source link

Add an "export to HTML" feature #8

Open toolness opened 8 years ago

toolness commented 8 years ago

This really depends on how useful it'd be for educators and others who use the widget, but it wouldn't be too hard to add an "Export to HTML" button that presented the user with a "standalone" HTML page that embedded their sketch, which they could copy to their clipboard. This code could then be pasted into a variety of tools like jsbin, codepen, jsfiddle, or thimble and published from there.

I also tend to like this kind of feature because it helps demystify the tool, and it provides an affordance allowing learners to graduate from the tool's safe scaffolding into something that's more akin to "real" web development.

For an example, visit my TinyTurtle Lab with Firefox and right-click on the code and select "Export to HTML". It can also be seen on mmm.minica.de if you click on "MOAR" and then choose "Export to HTML".