Show the current time of the video, instead of the remaining time on videojs

easy way is change default ControlBar.prototype.options

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

change to

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

final display time control

<style type="text/css">
    .video-js .vjs-time-control{display:block;}
</style>

result: https://i.stack.imgur.com/7Vvxm.png

For other people that search for a solution...

All timers exist on the player but by default the current-time, time-divider and the duration info are hidden with display: none;.

So the only thing we have to do is hide the remaining-time and show the time-control which includes the current-time, time-divider and the duration.

The solution in CSS code that should work with your player:

.video-js .vjs-time-control {
    display: block;
}
.video-js .vjs-remaining-time {
    display: none;
}

The documentation does not explain this, or to be precise it fails to explain it when it explains how to customize your player with CSS.

---

Fast html code snippet:

<style type="text/css">
    .video-js .vjs-time-control{display:block;}
    .video-js .vjs-remaining-time{display: none;}
</style>