1. 1 : /**
  2. 2 :  * @file subs-caps-menu-item.js
  3. 3 :  */
  4. 4 : import TextTrackMenuItem from './text-track-menu-item.js';
  5. 5 : import Component from '../../component.js';
  6. 6 : import {createEl} from '../../utils/dom.js';
  7. 7 : 
  8. 8 : /**
  9. 9 :  * SubsCapsMenuItem has an [cc] icon to distinguish captions from subtitles
  10. 10 :  * in the SubsCapsMenu.
  11. 11 :  *
  12. 12 :  * @extends TextTrackMenuItem
  13. 13 :  */
  14. 14 : class SubsCapsMenuItem extends TextTrackMenuItem {
  15. 15 : 
  16. 16 :   createEl(type, props, attrs) {
  17. 17 :     const el = super.createEl(type, props, attrs);
  18. 18 :     const parentSpan = el.querySelector('.vjs-menu-item-text');
  19. 19 : 
  20. 20 :     if (this.options_.track.kind === 'captions') {
  21. 21 :       parentSpan.appendChild(createEl('span', {
  22. 22 :         className: 'vjs-icon-placeholder'
  23. 23 :       }, {
  24. 24 :         'aria-hidden': true
  25. 25 :       }));
  26. 26 :       parentSpan.appendChild(createEl('span', {
  27. 27 :         className: 'vjs-control-text',
  28. 28 :         // space added as the text will visually flow with the
  29. 29 :         // label
  30. 30 :         textContent: ` ${this.localize('Captions')}`
  31. 31 :       }));
  32. 32 :     }
  33. 33 : 
  34. 34 :     return el;
  35. 35 :   }
  36. 36 : }
  37. 37 : 
  38. 38 : Component.registerComponent('SubsCapsMenuItem', SubsCapsMenuItem);
  39. 39 : export default SubsCapsMenuItem;