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 a downloadable archive for self-hosting the widget #45

Open toolness opened 8 years ago

toolness commented 8 years ago

As @indefinit mentions in https://github.com/toolness/p5.js-widget/issues/39#issuecomment-210801267, it would be nice to support users who want to self-host the widget, as there's nothing in the widget that should explicitly require an internet connection.

We might also want to make it possible to add a data attribute to the widget's <script> tag that allows the embedder to specify a self-hosted version of p5 to use, too, since we currently retrieve that over CDN. This would allow for offline use-cases. Filed as #48.

Aside: In his original question, @indefinit asked if it was possible to combine all the dependencies into one lib js file. Unfortunately, it's difficult to do this, as different JS needs to be loaded in different contexts--one for the widget on the embedding page, another for the widget in the iframe, and another for running the sketch in the preview pane. It's also not clear that combining everything into a single file would be efficient, since it'd prevent lazy loading.

toolness commented 8 years ago

Er, @indefinit, what happens if you download the following archive, add it as a subdirectory to your own website, and load the widget from there?

https://github.com/toolness/p5.js-widget/archive/gh-pages.zip

Based on the way the widget is constructed, I think that should actually work, but I'm not sure...

indefinit commented 8 years ago

This seems to work, however, it breaks if I try to load both the widget and p5.dom library at the same time. Error seems to be that create* is not defined because the "this" context is getting lost in p5 global mode.

toolness commented 8 years ago

Oh, weird... Where is p5.dom being used? Is it being used by the actual sketches in the widget, or is the embedder--i.e. the page that has the <script type="text/p5"> tags--using p5 and p5.dom?

If it's the former, the widget doesn't actually support this use-case yet--it's filed as #53. If it's the latter, then I'm surprised that doesn't work...

indefinit commented 8 years ago

hmm, It seems to be the latter case. I'll have to wait until after the semester ends to post a few examples for debugging. Thanks for your help though!

swirly commented 7 years ago

+1 to this one. I teach p5js in a school, and our internet connection is ... well... I really need local hosting :)