Discourse Blocks - data visualizations in posts

plugin
1

If you’d like to display interactive data visualizations in your Discourse’s posts, do I have the plugin for you. :dosequis:

###Introducing…
#[:chart_with_upwards_trend: discourse-blocks :chart_with_downwards_trend:] (https://graphme.io/t/how-does-life-expectancy-correlate-with-a-countrys-gdp-per-capita/204/3) :point_left: Live demo

To install, add this, as normal, to app.yml:

- git clone https://github.com/jgujgu/discourse-blocks.git

:exclamation: But also please add these under env by the other variables in app.yml. You can generate them if you have a Github account:

GITHUB_CLIENT_ID: "a_github_client_id"
GITHUB_SECRET_KEY: "a_longer_github_secret_key"

Visit Github for a full list of screenshots:
https://github.com/jgujgu/discourse-blocks

I am currently running 1.8+, but it worked just fine on ~1.6 as well.

What does this plugin really do? (since you didn’t click the live demo :yuno:)

If a poster inserts a link to a Github Gist with an index.html file, this plugin will render it and any code + files that run alongside it. Essentially, anything that bl.ocks made famous and blockbuilder makes convenient to create will render through this plugin. The bulk of examples are data visualizations, but a block need not be.

If you have a question or feedback, feel free to post it here or here.

1407×788 3.13 MB

Alongside this plugin, I would also like to invite you to join graphme, answers that show not tell
:chart_with_upwards_trend::chart_with_upwards_trend::chart_with_upwards_trend:|:chart_with_upwards_trend::chart_with_upwards_trend::chart_with_upwards_trend:|:page_facing_up::chart_with_upwards_trend::chart_with_upwards_trend:|:chart_with_upwards_trend::chart_with_upwards_trend::chart_with_upwards_trend:|:chart_with_upwards_trend::page_facing_up::page_facing_up:|:page_facing_up::chart_with_downwards_trend::chart_with_downwards_trend:|:chart_with_downwards_trend::chart_with_downwards_trend::chart_with_downwards_trend:
:chart_with_upwards_trend::page_facing_up::chart_with_upwards_trend:|:chart_with_upwards_trend::page_facing_up::page_facing_up:|:chart_with_upwards_trend::page_facing_up::chart_with_upwards_trend:|:chart_with_upwards_trend::page_facing_up::chart_with_upwards_trend:|:chart_with_upwards_trend::page_facing_up::page_facing_up:|:chart_with_downwards_trend::page_facing_up::page_facing_up:|:chart_with_downwards_trend::page_facing_up::page_facing_up:
:chart_with_upwards_trend::chart_with_upwards_trend::chart_with_upwards_trend:|:chart_with_upwards_trend::page_facing_up::page_facing_up:|:page_facing_up::chart_with_upwards_trend::chart_with_upwards_trend:|:chart_with_upwards_trend::chart_with_upwards_trend::chart_with_upwards_trend:|:chart_with_upwards_trend::chart_with_upwards_trend::chart_with_upwards_trend:|:page_facing_up::chart_with_downwards_trend::chart_with_downwards_trend:|:chart_with_downwards_trend::chart_with_downwards_trend::chart_with_downwards_trend:
:page_facing_up::page_facing_up::chart_with_upwards_trend:|:page_facing_up::page_facing_up::page_facing_up:|:page_facing_up::page_facing_up::page_facing_up:|:chart_with_upwards_trend::page_facing_up::page_facing_up:|:chart_with_upwards_trend::page_facing_up::chart_with_upwards_trend:|:chart_with_downwards_trend::page_facing_up::page_facing_up:|:chart_with_downwards_trend::page_facing_up::page_facing_up:
:chart_with_upwards_trend::chart_with_upwards_trend::chart_with_upwards_trend:|:page_facing_up::page_facing_up::page_facing_up:|:page_facing_up::page_facing_up::page_facing_up:|:chart_with_upwards_trend::page_facing_up::page_facing_up:|:chart_with_upwards_trend::page_facing_up::chart_with_upwards_trend:|:page_facing_up::chart_with_downwards_trend::chart_with_downwards_trend:|:chart_with_downwards_trend::chart_with_downwards_trend::chart_with_downwards_trend:

This is (ahem will be) a Q&A site that welcomes interactive graphs, diagrams, and infographics as answers. If you have a potentially graphical question needling you in the back, please do ask it there. I’m sure it is interesting if it’s doing that.

15 Likes
2

That is awesome, well done and thank you for contributing a great plugin.

2 Likes
3

Wondering why not simply implement a onebox here?

4 Likes
4

I’ll look into doing this at some point. With my current implementation, I was so focused on correctly packaging up the iframe (and nudging the user to do so) that I didn’t think about using Github’s oEmbed API.

5

I’ve just spotted this and it looks excellent.

Are there enough safeguards in place to allow regular members to use this feature? Allowing arbitrary code to run on my site is a pretty scary concept :grimacing:

6

From what I know, the different options in iframe sandboxing can safely prevent a user from accessing information on your site.

Whitelisting both allow-scripts and allow-same-origin is probably the most dangerous thing to do, as it allows running javascript and access to the parent page. However, I have allowed only allow-scripts in my iframes.


1 Like