remaining-time-display.js 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. 'use strict';
  2. exports.__esModule = true;
  3. var _component = require('../../component.js');
  4. var _component2 = _interopRequireDefault(_component);
  5. var _dom = require('../../utils/dom.js');
  6. var Dom = _interopRequireWildcard(_dom);
  7. var _formatTime = require('../../utils/format-time.js');
  8. var _formatTime2 = _interopRequireDefault(_formatTime);
  9. function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj['default'] = obj; return newObj; } }
  10. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  11. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  12. function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
  13. function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /**
  14. * @file remaining-time-display.js
  15. */
  16. /**
  17. * Displays the time left in the video
  18. *
  19. * @extends Component
  20. */
  21. var RemainingTimeDisplay = function (_Component) {
  22. _inherits(RemainingTimeDisplay, _Component);
  23. /**
  24. * Creates an instance of this class.
  25. *
  26. * @param {Player} player
  27. * The `Player` that this class should be attached to.
  28. *
  29. * @param {Object} [options]
  30. * The key/value store of player options.
  31. */
  32. function RemainingTimeDisplay(player, options) {
  33. _classCallCheck(this, RemainingTimeDisplay);
  34. var _this = _possibleConstructorReturn(this, _Component.call(this, player, options));
  35. _this.on(player, 'timeupdate', _this.updateContent);
  36. _this.on(player, 'durationchange', _this.updateContent);
  37. return _this;
  38. }
  39. /**
  40. * Create the `Component`'s DOM element
  41. *
  42. * @return {Element}
  43. * The element that was created.
  44. */
  45. RemainingTimeDisplay.prototype.createEl = function createEl() {
  46. var el = _Component.prototype.createEl.call(this, 'div', {
  47. className: 'vjs-remaining-time vjs-time-control vjs-control'
  48. });
  49. this.contentEl_ = Dom.createEl('div', {
  50. className: 'vjs-remaining-time-display',
  51. // label the remaining time for screen reader users
  52. innerHTML: '<span class="vjs-control-text">' + this.localize('Remaining Time') + '</span> -0:00'
  53. }, {
  54. // tell screen readers not to automatically read the time as it changes
  55. 'aria-live': 'off'
  56. });
  57. el.appendChild(this.contentEl_);
  58. return el;
  59. };
  60. /**
  61. * Update remaining time display.
  62. *
  63. * @param {EventTarget~Event} [event]
  64. * The `timeupdate` or `durationchange` event that caused this to run.
  65. *
  66. * @listens Player#timeupdate
  67. * @listens Player#durationchange
  68. */
  69. RemainingTimeDisplay.prototype.updateContent = function updateContent(event) {
  70. if (this.player_.duration()) {
  71. var localizedText = this.localize('Remaining Time');
  72. var formattedTime = (0, _formatTime2['default'])(this.player_.remainingTime());
  73. if (formattedTime !== this.formattedTime_) {
  74. this.formattedTime_ = formattedTime;
  75. this.contentEl_.innerHTML = '<span class="vjs-control-text">' + localizedText + '</span> -' + formattedTime;
  76. }
  77. }
  78. // Allows for smooth scrubbing, when player can't keep up.
  79. // var time = (this.player_.scrubbing()) ? this.player_.getCache().currentTime : this.player_.currentTime();
  80. // this.contentEl_.innerHTML = vjs.formatTime(time, this.player_.duration());
  81. };
  82. return RemainingTimeDisplay;
  83. }(_component2['default']);
  84. _component2['default'].registerComponent('RemainingTimeDisplay', RemainingTimeDisplay);
  85. exports['default'] = RemainingTimeDisplay;