Discourse has the ability to whitelist embedded iframes from select hosts.
We could use this to enable embedding web-hosted Processing / p5.js sketches from community-trusted platforms such as the p5.js web editor, or openprocessing.org , et cetera.
An embed from editor.p5js.org :
<iframe src="https://editor.p5js.org/jeremydouglass/sketches/C8iRfwjx-"
width="100%" height="510" allowfullscreen frameborder="0"
marginwidth="0" marginheight="0"></iframe>
An embed from openprocessing.org
<iframe src="https://www.openprocessing.org/sketch/852054/embed/"
width="100%" height="510" allowfullscreen frameborder="0"
marginwidth="0" marginheight="0"></iframe>
A potential downside is that it might discourage people from posting their code into the forum – and code posted from web editor sketches has a bad habit of quickly mutating after a question is asked. But it would certainly make the Gallery more compelling…
We would need a list of what platforms to whitelist.
6 Likes
solub
March 28, 2020, 1:48am
2
That is neat !
Do you think adding trinket.io to the list would be possible ? (for python mode users)
2 Likes
Absolutely. Can you post an embed of a test sketch here? It doesn’t matter if it doesn’t render (yet).
Also, sketchpad.cc / studio.processingtogether.com :
…we may have a breaking problem with sketchpad / processingtogether – the certificate for https is expired, and https is required for an embed.
2 Likes
<iframe
src="https://trinket.io/embed/python/62fab051ed?runOption=run&start=result"
width="100%" height="510" allowfullscreen
frameborder="0" marginwidth="0" marginheight="0" >
</iframe>
4 Likes
solub
March 28, 2020, 2:21am
7
Great ! I can’t post right now but will do tomorrow for sure.
edit : I see gotoloop went ahead, thank you !
1 Like
Can you add Glitch.com as well, please?
<iframe
src="https://glitch.com/embed/#!/embed/matter-js-bouncing-colorful-balls
?path=sketches/global.mjs&previewSize=0&sidebarCollapsed=false"
width="100%" height="640" frameborder="0" marginwidth="0" marginheight="0" >
</iframe>
3 Likes
Testing GitHub.io :
<iframe
src="https://gosubroutine.github.io/Ball-in-the-Chamber/"
width="100%" height="640" frameborder="0" marginwidth="0" marginheight="0" >
</iframe>
2 Likes
Hmm. Whitelisting iframes on GitHub.io is basically “any software by anyone.” I’m less confident about the implications of that than with a short list of sketch platforms. Thoughts?
@GoToLoop
@GoToLoop any thoughts on the github.io question above?
I guess you’re right. GitHub is more for big apps than simple sketches.
Besides, the runnable link doesn’t match its source code link.
However, any JS hosting site is capable to have all kinds of nasty stuff.
2 Likes
I would love to put an embed. I just found out that this is possible. @jeremydouglass please help!
1 Like
@codeguppy – Hmm. I just tried to enable this.
Discourse forums won’t allow the embed
tag, so the share cut-paste from codeguppy doesn’t work:
<embed src="http://www.codeguppy.com/code.html?jSm8qvlb18R4Eu64jmE0" style="width:1024px; height:670px;">
But codeguppy doesn’t allow iframes, so this doesn’t load:
<iframe src="http://www.codeguppy.com/code.html?jSm8qvlb18R4Eu64jmE0" width:"100%" height:"510"></iframe>
It looks like the ones we can support (shown above) all allow iframe. I’m open to workarounds – sorry it wasn’t as easy as I thought!
Hi @jeremydouglass
Thanks! I debugged the issue! Seems to work now.
To embed codeguppy we need to specify https:// and appropriate size
<iframe src="https://www.codeguppy.com/code.html?jSm8qvlb18R4Eu64jmE0" width=1024 height=670></iframe>
Thanks!
2 Likes
Great, @codeguppy , thank you!
I’d like to feature-request adding that to the Share popup as a third option. Is there a github repo I should submit that to?
Good idea @jeremydouglass … as of now the main editor is not on github at https://github.com/CodeGuppyPrograms/
I’ll will take your feedback though about the share popup and see what can be done.
1 Like