Edit this page

Get Current Time in MediaPlayer

Environment

Product Progress Kendo UI MediaPlayer
Progress Kendo UI version Created with version 2017.3.1026

Description

How can I get the current time which is reached when playing a media file?

Solution

  1. Get a reference of the .k-mediaplayer-currenttime span element, which shows the current time, and extract the text from it.
  2. Split the text and push in an array.
  3. Iterate over the array and convert the time in seconds.
<div id="mediaplayer" style="height:360px"></div>

<button id="getTimeButton">Get current time</button>


<script type="text/javascript">
    $(document).ready(function () {

        $("#mediaplayer").kendoMediaPlayer({
            autoPlay: true,
            media: {
                title: "Take a Tour of the Telerik Platform",
                source: "https://www.youtube.com/watch?v=rLtTuFbuf1c"
            }
        });

        $("#getTimeButton").on("click", function (e) {
            var player = $("#mediaplayer").getKendoMediaPlayer();
            var timeHTML = $(".k-mediaplayer-currenttime").text();
            var timeParts = timeHTML.split(":").reverse();

            var seconds = 0;

            for (var i = 0; i < timeParts.length; i++) {
                seconds = seconds + (parseInt(timeParts[i]) * Math.pow(60, i));
            }

            alert("Current time is at " + seconds + " seconds.");

        });
    });

</script>
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy