Kendo Core Media Player

[David]

I am working on a media displaying application for use in-house.  The media player, as offered by Telerik, is an obvious choice.  While my initial attempts appear to be bearing fruit, I have run up against one item I cannot seem to crack.

The "toolbar" controls seem to never want to "hide".  That is when a video is displayed the controls appear to briefly overlay the videos lower portion allowing the user to adjust things.  While this is logical, they never seem to hide.

I have attempted to use the API to get a handle of the toolbar.  That works.  When I call the .hide() feature, nothing happens.

Ideally my goals are to hide both the controls and title bars.   Neither appear to be responding.

Am I missing something obvious?  While visually it is working, I am attempting to fine tune the user experience.

Here is a synopsis of the view displaying the media

@model ImageToolKit.Models.TitleModel

@{
    var urlValue = string.Format("{0}?id={1}", Url.Action("GetImageFromDb", "Home"), Model.Id);
}

    @(Html.Kendo().MediaPlayer()
        .Name("mediaPlayer")
        .AutoPlay(true)
        .Media(m => m
            .Title(Model.Title)
            .Source(@urlValue)
         )
         .Events(e => e.End("OnMediaPlayerEndOfMovieEvent"))
        .HtmlAttributes(new { style = "height:720px" })
    )

 

[David]

OH, two other details of merit.  The model is rendered as part of a partial view.  I suspect the problem might be due to the fact some of the videos are short in duration.  I suspect whatever default "show" time elapses after the video ends thus the hide action never occurs.

If I had a "perfect" scenario I would hide both title and controls initially and only show them by user request or possibly a hover event.  As I cannot get them to hide, I cannot pursue that option.

 

[Tsvetomir]

Hi, David,

Indeed, the toolbar would be hidden automatically after a certain period of time. It is a matter of a few seconds and this could be confirmed in the following demo:

https://demos.telerik.com/aspnet-core/mediaplayer

Regarding the hiding of the toolbar, the toolbar() method returns the instance of the Toolbar widget that is internally used. To hide it, you should access its underlying HMTL wrapper elements as follows:

var mediaPlayer = $("#mediaplayer").data("kendoMediaPlayer");
mediaPlayer.toolbar().wrapper.hide();

Respectively, it can be shown with the show() method.

 

Kind regards,
Tsvetomir
Progress Telerik