javascriptmediaelement.js

Is it possible for my player to play 30 first seconds of my audio/video file?


Is it possible to make audio player to play a file only 30 first seconds of the file?

Here is just a sample of my player with source of the music (later I'll change so it will be pulled from the database).

<div class="col-md-4 player">
  <div class="audio-player">
    <audio id="audio-player"  controls="controls">
      <source src="media/Blue Browne.ogg" type="audio/ogg"></source>
      <source src="media/Blue Browne.mp3" type="audio/mpeg"></source>
      <source src="media/Georgia.ogg" type="audio/ogg"></source>
      <source src="media/Georgia.mp3" type="audio/mpeg"></source>
    </audio>
  </div>
  <!---->
  <script type="text/javascript">
    $(function(){
      $('#audio-player').mediaelementplayer({
        alwaysShowControls: true,
        features: ['playpause','progress','volume'],
        audioVolume: 'horizontal',
        iPadUseNativeControls: true,
        iPhoneUseNativeControls: true,
        AndroidUseNativeControls: true
      });
    });
  </script>
</div>

Solution

  • I'm not 100% sure if these event names are correct but this underlying code should work.

    var playTimeout;    
    
    $("#audio-player").on("play", function(e) {
        playTimeout = setTimeout(function() {
            $("audio-player").pause();
            $("audio-player").setCurrentTime(0); // Restarts video
        }, 30000); // 30 seconds in ms
    });
    
    
    $("#audio-player").on("pause", function(e) {
        clearTimeout(playTimeout);
    });