https://discord.umbraco.com logo
Join Discord
Powered by
Uploading audio files and MediaPicker3
# help-with-umbraco
j
Hi! I'm trying to upload multiple audio files but am struggling with what editor to use. I'd assumed I would use 
MediaPicker3
, with allowed type being the built-in 
umbracoMediaAudio
. However, 
MediaPicker3
is, as [per docs](https://docs.umbraco.com/umbraco-cms/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/media-picker-3), returning 
MediaWithCrops
- this implies that 
MediaPicker3
is intended for images specifically, not other types of media (not audio or video). Could someone please give me direction as to: 1. What would be the most appropriate editor to use for an author to upload/select audio files? 2. What the Razor would look like to get an 
umbracoMediaAudio
property from whatever is returned in 1. I also tried casting the 
MediaWithCrops
to type 
UmbracoMediaAudio
but that returned 
null
. Any direction would be greatly appreciated! Various code snippets included, can provide more details if required. Cheers! Rich Umbraco 13.4.1 https://cdn.discordapp.com/attachments/1271200299041816606/1271200299394269265/image.png?ex=66b67909&is=66b52789&hm=99214c089e934f27021b06940cfee9839594e1e77235aa614878c18052b6a4c3& https://cdn.discordapp.com/attachments/1271200299041816606/1271200299868098652/image.png?ex=66b67909&is=66b52789&hm=1a551ab120dd4099c2271dfda8bd02acece02610d63555ce7ee5b8ffe0c63c0e& https://cdn.discordapp.com/attachments/1271200299041816606/1271200300149248030/image.png?ex=66b67909&is=66b52789&hm=a2f765742f26248bcfad76c8f72049d89fabacf357cc9df8e2fb2a15168e5c22&
r
Wouldn’t it still not work if you don’t try to use the crops properties? However I’d use media picker v2 since it only stores the media references
j
"Wouldn’t it still not work if you don’t try to use the crops properties?" What do you mean? To my knowledge I'm not trying to use the crops properties. "However I’d use media picker v2 since it only stores the media references" I genuinely have no idea how I would use MediaPicker2 - from the docs I can only find [MediaPicker](https://docs.umbraco.com/umbraco-cms/v/13.latest-lts/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/media-picker) and [MediaPicker3](https://docs.umbraco.com/umbraco-cms/v/13.latest-lts/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/media-picker-3?fallback=true). Could you let me know how I would use media picker v2 please?
r
I meant that it still might work if you don’t try to access any of the “image” specific properties from your code, but granted I don’t think the developer and user experience would be great. Pretty sure MediaPicker is v2, but unfortunately that’s also been deprecated. I suggest opening a discussion on the CMS repo about it still being usable when you don’t reference images.
For your casting question, without looking at the source IIRC there’s a media/content property you should be able to cast to whatever type the model builder model is
j
"Image specific properties" Which image-specific properties am I using in the above? I'm genuinely confused by this. My understanding is that I'm trying to call 
.UmbracoFile
on the output of the MediaPicker, which is a property of 
UmbracoMediaAudio
, none of which is, to my knowledge, image specific. I'll happily raise a discussion, I just wanted to check here first - thanks for your input so far
r
I’m not saying you’re accessing any image specific properties, and I’m sorry if it came of the way. What I meant is if you don’t, you still should be able to use MediaPickerV3., but without looking at the source I expect it to have a content/media property you can cast to your specific type 😅
j
Ah sure, that makes sense, thanks - yeah, I'm missing the "content/media property you can cast to your specific type". I'll keep searching. Thanks for your direction, really is appreciated, I'm just wanting to be very sure of what I'm doing and why it might not be working!!
r
No worries, I appreciate your follow up questions. I sometimes forget that not everyone having all the history of Umbraco and knowing why things are the way they are 😅.
n
@jacksorjacksor (Richard Jackson) I think Media Picker 2 is consider an obsolete picker, however the MediaWithCrops object has a .Content property on it. This will return an IPublishedContent (ie. the underlying media item), you should then able to cast that to the UmbracoMediaAudio strongly typed instance. Something like (assuming using strongly typed models): 
var audio = MyContent.MediaPickerProperty?.Content is UmbracoMediaAudio umbracoMediaAudio ? umbracoMediaAudio : null;
j
Ah great, thanks @Nik ! Will check out and report back
Yep that's worked as a starting point, thank you!
Copy code
var audioItems = Model.MultipleMediaPicker;
[...]
@foreach (var audioItem in audioItems)
{
    var audioItemContent = audioItem.Content as UmbracoMediaAudio;
    if(audioItemContent is null){ continue; }

    <h1>Audio: @audioItemContent.UmbracoFile</h1>

    <audio controls>
        <source src="@audioItemContent.UmbracoFile" type="audio/mpeg">
        Your browser does not support the audio tag.
    </audio>
}
(Will definitely be writing up a blog article about this when I've explored more!)
k
Time spent trying to click that play button: Embarrassingly much
r
Oh good, not just me! Thread lurkers unite :p
j
Hahahaha I'm so sorry!!!
47 Views
PreviousNext
Powered by