Videojs duration displaying as 0 for entire video

Question

I'm using videojs. For some reason the duration of videos is displaying as 0, even when fully loaded.
At line 2487 of the video.js file I've made sure this section...

ControlBar.prototype.options_ = {
  children: ['playToggle', 'volumeMenuButton', 'currentTimeDisplay', 'timeDivider', 'durationDisplay', 'progressControl', 'liveDisplay', 'remainingTimeDisplay', 'customControlSpacer', 'playbackRateMenuButton', 'chaptersButton', 'descriptionsButton', 'subtitlesButton', 'captionsButton', 'audioTrackButton', 'fullscreenToggle']
};

...includes the 'durationDisplay' property, so does anyone know why the duration is displaying as 0?

The videos are mp4 and are loaded inside an AngularJS directive:

app.directive('engVideo',['$timeout', '$http', function($timeout, $http) {
    return {
        restrict: 'A',
        priority: 100,
        replace: true,
        templateUrl: 'components/video.html',
        link: function(scope, element, attrs) {
        ....
            function VideoJSPlayerInit(window, videojs) {
                var player = videojs(scope.component.video.id, {
                    html5: {
                        nativeTextTracks: false
                    }
                });    
                player.pause();

            }

From a suggestion in the comments, I've also tried listening for the 'loadedmetadata' event, when the videojs element is created, like this:

function VideoJSPlayerInit(window, videojs) {
                var player = videojs(scope.component.video.id, {
                    html5: {
                        nativeTextTracks: false
                    }
                }, function() {
                        this.on('loadedmetadata', function(){
                            console.log("video metadata loaded");
                        });
                    }
                );

But nothing gets output to console - so I'm guessing there's no metadata loaded(?) I have also changed it to listen for the 'loadeddata' event and that DOES gets consoled.

Could this be a video encoding issue? I've been looking for how to export from Premiere with the duration metadata included, but as far as I can tell, it's there.

Any clues, much appreciated.

if you can post some code and information that which type of video and how have you implemented it with video Js. — Abdul Rauf, Jun 12 '18 at 13:48
can you try by applying the loadedmetadata(http://docs.videojs.com/docs/api/player.html#Eventsloadedmetadata) event to see that it is returning you duration or current time. http://docs.videojs.com/docs/api/player.html#MethodscurrentTime — Abdul Rauf, Jun 12 '18 at 14:43
@AbdulRauf - I'll update my question with what I've tried now... — moosefetcher, Jun 13 '18 at 08:55

score 0 · Answer 1 · answered Jun 13 '18 at 12:59

OK, I've finally figured it out: It was not to do with metadata; The version of video.js we're using for some reason was hardcoding the duration value as '0:00'. If it's useful to anyone else, here's what I added (to the video.js file from line 5241) to get the duration to display correctly:

DurationDisplay.prototype.createEl = function createEl() {
    var el = _Component.prototype.createEl.call(this, 'div', {
      className: 'vjs-duration vjs-time-control vjs-control'
    });
    // following three lines are new...
    var intSeconds = parseInt(this.player_.duration());
    var intMinutes = parseInt(intSeconds / 60);
    intSeconds = intSeconds - (60 * intMinutes);
    this.contentEl_ = Dom.createEl('div', {
      className: 'vjs-duration-display',
      // label the duration time for screen reader users
      //innerHTML: '<span class="vjs-control-text">' + this.localize('Duration Time') + '</span> 0:00' // - old line
      innerHTML: '<span class="vjs-control-text">' + this.localize('Duration Time') + '</span>' + intMinutes + ':' + intSeconds
    }, {
      // tell screen readers not to automatically read the time as it changes
      'aria-live': 'off'
    });

    el.appendChild(this.contentEl_);
    return el;
  };

Videojs duration displaying as 0 for entire video

1 Answers1