1 files changed, 43 insertions, 0 deletions
diff --git a/javascript/videojs/src/js/control-bar/text-track-controls/subs-caps-menu-item.js b/javascript/videojs/src/js/control-bar/text-track-controls/subs-caps-menu-item.js
new file mode 100644
index 0000000..7bcbe30
--- /dev/null
+++ b/javascript/videojs/src/js/control-bar/text-track-controls/subs-caps-menu-item.js
@@ -0,0 +1,43 @@
+/**
+ * @file subs-caps-menu-item.js
+ */
+import TextTrackMenuItem from './text-track-menu-item.js';
+import Component from '../../component.js';
+import {createEl} from '../../utils/dom.js';
+
+/**
+ * SubsCapsMenuItem has an [cc] icon to distinguish captions from subtitles
+ * in the SubsCapsMenu.
+ *
+ * @extends TextTrackMenuItem
+ */
+class SubsCapsMenuItem extends TextTrackMenuItem {
+
+  createEl(type, props, attrs) {
+    const el = super.createEl(type, props, attrs);
+    const parentSpan = el.querySelector('.vjs-menu-item-text');
+
+    if (this.options_.track.kind === 'captions') {
+      if (this.player_.options_.experimentalSvgIcons) {
+        this.setIcon('captions', el);
+      } else {
+        parentSpan.appendChild(createEl('span', {
+          className: 'vjs-icon-placeholder'
+        }, {
+          'aria-hidden': true
+        }));
+      }
+      parentSpan.appendChild(createEl('span', {
+        className: 'vjs-control-text',
+        // space added as the text will visually flow with the
+        // label
+        textContent: ` ${this.localize('Captions')}`
+      }));
+    }
+
+    return el;
+  }
+}
+
+Component.registerComponent('SubsCapsMenuItem', SubsCapsMenuItem);
+export default SubsCapsMenuItem;