Telerik’s ASP.NET Media Player is a lightweight Ajax-enabled control that will enrich your web sites and applications with extensive media capabilities. Well, HTML5 and YouTube might not be all-encompassing in terms of media formats representation, but it’s not bad at all for a start and there is more coming for the next release. However, our future plans are….right, for the future, and not of topical significance at the moment, so let’s focus on the present and what exactly we have at hand with this new member of Telerik’s ASP.NET AJAX control suite.
RadMediaPlayer actually constitutes a media multiplayer that is built with a view to integrating many media players into one single extensive architecture. Those players can be built on top of any third-party API or specification and then plugged into the RadMediaPlayer control. And that’s exactly what we did with the HTML5 and YouTube application interfaces so that RadMediaPlayer could make its debut featuring both HTML5 and YouTube capabilities. To cut a long story short, if you need an ajax-enabled control that plays both HTML5 media and YouTube videos and at the same time sports Telerik controls’ unsurpassable visual appearance and ease of use – RadMediaPlayer should be the one for you.
Enough has been said and written on the HTML5 media formats and how browsers comply with those or rather fail to support so we won’t concern ourselves with this problematic area. Suffice it to say that RadMediaPlayer supports both HTML5 video and audio. What is more significant is how to configure the control so that it be ready to play your HMTL5 files. And here is how:
By analogy to the HTML5 video and audio tags RadMediaPlayer has a Source property that specifies the path to the media record. The control has no difficulty determining on its own the mime type of the file based on its extension but in some cases that’s not so obvious and you will have to set it explicitly. This is done through the MimeType property. In addition, you can configure the path to an HD version of the media through the HDSource property. If your media is in a format that’s not supported by all browsers, don’t despair – RadMediaPlayer features a Sources collection and again, here we follow suite the HTML video and audio tags API. Each instance in the Sources collection allows you to specify:
The are other configuration settings in RadMediaPlayer that allow you to set start time, volume, autoplay, title and poster (start image) for the media file as well as various tooltips, full-screen and muted mode – all controlled by properties with self-explanatory signature.
Configuration, however, is not of much use if you don’t have the proper UI to control the various features of the media being played. Hence, RadMediaPlayer exposes a handy toolbar to navigate through the media file, play or pause it, change its volume, switch to full screen or load the HD version of the media if available. The toolbar hides itself automatically after 3 seconds if no mouse movement occurs over the media and shows itself otherwise. It can be docked or floating. There is also the nice title bar that contains the name of the media record and a social share button displaying Telerik’s social share bar to quickly deliver a link to the media file on Facebook, Twitter, Google+ etc.
Last but not least comes the YouTube feature of RadMediaPlayer’s. To put the control in YouTube playing mode all you need is set the video url to the Source property. RadMediaPlayer will parse it, correctly determine its type, load the YouTube API and render a full-fledged chromeless YouTube player equipped with a tool and title bar adorned in Telerik’s appealing skins.
And that’s about it – now, it’s time to look back to the future: playlists, Vimeo support and other cool enhancements are coming. If you would like to see any other features added to the control, you can request them in the Public Feedback portal.
Tsvetoslav Kovachev is a developer.
Subscribe to be the first to get our expert-written articles and tutorials for developers!