Add very basic embed block

[ellatrix]

This is a WIP. Needs UI to change the url, use the correct attribute and oEmbed.

[ellatrix]

Any ideas on how we should do oEmbed (fetching the src for the url attribute)?

[youknowriad]

From what I've understood on the discussions here #315 (comment) We can not store iframe in the post content. I think this block should be considered the first "dynamic" block.

By this I mean, its save method should return an empty string and all its attributes stored in the comment. And it should be processed on the server (close to how shortcodes work).

[ellatrix]

Yeah, I know, but I was referring to the fetching of the iframe.

[youknowriad]

@iseulde If we do the rendering server side, we could rely on the oEmbed spec, we won't be blocked by the CORS issue.

[ellatrix]

Right, the rendering is already done server side with the admin-amax.php (same in current editor), but the content will come at a delay.

[jasmussen]

Right, the rendering is already done server side with the admin-amax.php (same in current editor), but the content will come at a delay.

Can we show a block outline with a spinner, kind of like when you paste a link into the status box on Facebook?

[ellatrix]

@joen Yeah, that sounds good, we do this in core as well. We could show the block in a loading state with the block icon or something. I think the API for registering blocks will need an update to allow this behaviour though (based on attributes, get more attributes async).

[ellatrix]

Should we add this basic version in the meantime?

[jasmussen]

Should we add this basic version in the meantime?

Oh absolutely! 👍

[jasmussen]

Looks good! We'll need to tweak and tune the default size, but I expect we'll revisit this at a later time. Seems god to me!

[ellatrix]

Yeah we could look at that together with alignment. One tricky thing is to get the dimensions right.

[jasmussen]

One tricky thing is to get the dimensions right.

I doubt we'll be able to. What does the editor do currently?

Probably we will want to decide some defaults here, and then let the user override them. A good bet would be to make them 16:9, as we want them responsive also. Then in an advanced inspector we could let a user manually input width/height.

Responsive could be done using this trick.

[ellatrix]

What does the editor do currently?

We add a maxwidth query to the request for the provider, so in the case of YouTube, we'd get a width and heigh attribute back on the iframe. In the current editor maxwidth is the width the theme set for the content. As long as we have both, we know the ratio though, so we could set the size if it needs to be different for aligning. Not sure how to have a variable ratio in CSS though.

[ellatrix]

It's even harder when the provider gives us a script... In that case we load the script in an iframe to isolate it. I think it will be hard to align that...

[jasmussen]

It's even harder when the provider gives us a script... In that case we load the script in an iframe to isolate it. I think it will be hard to align that...

If we can apply a CSS style to the iframe directly, we just need to decide the aspect ratio and we can can responsively style it. But we'll cross this bridge when we get there.