Source: ui/rewind_button.js

  1. /*! @license
  2. * Shaka Player
  3. * Copyright 2016 Google LLC
  4. * SPDX-License-Identifier: Apache-2.0
  5. */
  6. goog.provide('shaka.ui.RewindButton');
  7. goog.require('shaka.ui.Controls');
  8. goog.require('shaka.ui.Element');
  9. goog.require('shaka.ui.Enums');
  10. goog.require('shaka.ui.Locales');
  11. goog.require('shaka.ui.Localization');
  12. goog.require('shaka.util.Dom');
  13. /**
  14. * @extends {shaka.ui.Element}
  15. * @final
  16. * @export
  17. */
  18. shaka.ui.RewindButton = class extends shaka.ui.Element {
  19. /**
  20. * @param {!HTMLElement} parent
  21. * @param {!shaka.ui.Controls} controls
  22. */
  23. constructor(parent, controls) {
  24. super(parent, controls);
  25. /** @private {!HTMLButtonElement} */
  26. this.button_ = shaka.util.Dom.createButton();
  27. this.button_.classList.add('material-icons-round');
  28. this.button_.classList.add('shaka-rewind-button');
  29. this.button_.classList.add('shaka-tooltip-status');
  30. this.button_.setAttribute('shaka-status',
  31. this.localization.resolve(shaka.ui.Locales.Ids.OFF));
  32. this.button_.textContent =
  33. shaka.ui.Enums.MaterialDesignIcons.REWIND;
  34. this.parent.appendChild(this.button_);
  35. this.updateAriaLabel_();
  36. /** @private {!Array.<number>} */
  37. this.rewindRates_ = this.controls.getConfig().rewindRates;
  38. this.eventManager.listen(
  39. this.localization, shaka.ui.Localization.LOCALE_UPDATED, () => {
  40. this.updateAriaLabel_();
  41. });
  42. this.eventManager.listen(
  43. this.localization, shaka.ui.Localization.LOCALE_CHANGED, () => {
  44. this.updateAriaLabel_();
  45. });
  46. this.eventManager.listen(this.button_, 'click', () => {
  47. this.rewind_();
  48. });
  49. }
  50. /**
  51. * @private
  52. */
  53. updateAriaLabel_() {
  54. this.button_.ariaLabel =
  55. this.localization.resolve(shaka.ui.Locales.Ids.REWIND);
  56. }
  57. /**
  58. * Cycles trick play rate between the selected rewind rates.
  59. * @private
  60. */
  61. rewind_() {
  62. if (!this.video.duration) {
  63. return;
  64. }
  65. const trickPlayRate = this.player.getPlaybackRate();
  66. const newRateIndex = this.rewindRates_.indexOf(trickPlayRate) + 1;
  67. // When the button is clicked, the next rate in this.rewindRates_ is
  68. // selected. If no more rates are available, the first one is set.
  69. const newRate = (newRateIndex != this.rewindRates_.length) ?
  70. this.rewindRates_[newRateIndex] : this.rewindRates_[0];
  71. this.player.trickPlay(newRate);
  72. this.button_.setAttribute('shaka-status', newRate + 'x');
  73. }
  74. };
  75. /**
  76. * @implements {shaka.extern.IUIElement.Factory}
  77. * @final
  78. */
  79. shaka.ui.RewindButton.Factory = class {
  80. /** @override */
  81. create(rootElement, controls) {
  82. return new shaka.ui.RewindButton(rootElement, controls);
  83. }
  84. };
  85. shaka.ui.Controls.registerElement(
  86. 'rewind', new shaka.ui.RewindButton.Factory());