Audio Block: Add Align, URL, and Edit Abilities

[timmyc]

This is a follow-up task for #2299. Currently the audio block is missing some functionality that really limits its' usability.

To bring the Audio block up to a better place, I think we should consider adding in the following items:

• Block align controls.
• Add the ability to edit the Audio file that is in-use. Currently once you set an audio file, there is no way to modify it - so adding in a "pencil" icon to edit would be nice.
• Add in a URL field to link to external audio files. Much like the URL field in the embed block, this field needs to have some validation to ensure it is at least a valid URL - this is why the field was removed from the original PR

[notnownikki]

#2487 adds alignment and an edit button that pops up the media library. I wanted to check what flow we expect when there's a URL field there too. On adding a block, we would have a url field, and a media upload button, on clicking edit would we go back to the screen even if the user used the media upload button to select an audio file?

[karmatosed]

@notnownikki the flow seems to work well for me with what we have so far.

On adding a block, we would have a url field, and a media upload button, on clicking edit would we go back to the screen even if the user used the media upload button to select an audio file?

I think that's right. That's what images do and I think having the same behaviour makes sense.

[notnownikki]

@karmatosed happy to implement it like that, but images don't work that way at present, the edit button pops up the media selection UI straight away, without going to an intermediate UI. I think the flow is slightly different here, because you can just supply a URL to point to an audio file without uploading it, so I was really wondering if edit should go to the media selection UI if that's where you selected an image from, or the UI with the URL input if that's what you used. But a consistent flow seems good to me too 😄

[karmatosed]

@notnownikki wow I somehow assumed it was that way and totally had made it that in my mind. I think having it consistent makes sense. I'll ask though, if this is something comes up in tests and feedback as needs changing, how hard would that be? Because if it's fairly easy to change I would suggest consistency first and then see in feedback from tests.

[timmyc]

Having the URL field in the block/top level I think is a better experience. Inserting via URL in the media widgets is accomplished inside the media modal. TBH I'm not really certain how often an audio file will be added via an URL instead of using the media library, or more typically I think an embed would be used ( thinking soundcloud or a video ).

[notnownikki]

Because Friday is rushing towards us, would we be ok with merging #2487 with the features it has, and opening a new PR to add a URL entry field, just in case we don't agree on the UX in time for release? The current controls work and I think it's worth getting in for 0.10.0, even if we don't get the manual URL entry done in time.

[karmatosed]

I would +1 to merge. We also have Monday as a release date this time, so we have more time. I am keen though on getting something in and working on it.

[timmyc]

Just 👍 on 2487, huge improvement!

[notnownikki]

Merged!

I'll start on the URL entry now, would welcome all of your feedback once it's working 😄

[notnownikki]

Fixed by #2521