Clicking either the dark area around the iframe or the x at the top right corner closes the lightbox. The same way it works for default image lightboxes.
Settings
There’s only one setting. You add the domains that you want to have this functionality on there.
Correct, this component will not mess with any whitelisting settings at all.
In order for any iframe to show up in the cooked content of a post - expandable or not - it has to be on the list of allowed_iframes setting like you pointed out.
@Johani is this component still functional? If so, any thoughts on why I am not getting the pop-out diagonal-arrows in the upper-right, but rather a blank/dead box?
Here is what I’ve tried:
Updated themes/components.
Made sure src links were white-listed in the component and the Discourse settings.
Tried a few different links, including Google Maps.
Tried several scenarios with the Media Overlay on/off + Lightbox alone on/off.
thank you very much for conceiving and maintaining this theme component.
After installing it on https://community.hiveeyes.org/ the other day, some users recently started to complain that the overall appearance of the head of the page looked different for them. They finally found out the reason was that they blocked cloudflare altogether, so all requests to https://cdnjs.cloudflare.com/ajax/libs/featherlight/1.7.13/featherlight.min.js would fail.
So, we are humbly asking if there would be a way for you to provide this component in a self-contained variant?
I’m not aware of any existing components that do that, so you’d have to create one or commission that work in the marketplace category.
This theme component checks iFrame tags in a post and compares their src attribute to a list of eligible sources provided by the admin in the component settings. If the source domain matches, it adds the lightbox button. Showing the lightbox is handled by featherlight.js. Featherlight listens to clicks on elements with the data-featherlight attribute. If one of those is clicked, it opens the lightbox with the contents of that iFrame.
You can do the same with <a> tags in a different component with a little bit of wrangling. If the link href matches a domain listed in the component settings, lightbox it in an iframe. Otherwise, leave it as a regular link. You don’t want all links to open in a lightboxed iframe.
Most of the required work is already handled by this component so you can just hard-fork it and start from there. There’s no plans to add that feature to this component because it’s only meant to handle iFrame tags in posts.
Is this component still working? It used to work for me in the past but stopped working for some reason.
Seems like last update was 3 years ago: hnb-ku/discourse-iframe-lightboxes (github.com) So reasonable to assume something broke?
Both TCs use the same API to decorate a post, so the order in which you install them would be necessary. Also, the iframe source is set dynamically once the PDF has been downloaded and may not be available immediately in this IFrame Lighboxes TC.
The changes I made are basically:
Search for iframe elements in the next run loop, so iframe is guaranteed to be available
Wait for the iframe to load so you can retrieve the source URL
Whatever domains you specify here also need to be whitelisted in the
