Source: lib/text/vtt_text_parser.js

  1. /*! @license
  2.  * Shaka Player
  3.  * Copyright 2016 Google LLC
  4.  * SPDX-License-Identifier: Apache-2.0
  5.  */
  7. goog.provide('shaka.text.VttTextParser');
  9. goog.require('goog.asserts');
  10. goog.require('shaka.log');
  11. goog.require('shaka.media.ManifestParser');
  12. goog.require('shaka.text.Cue');
  13. goog.require('shaka.text.CueRegion');
  14. goog.require('shaka.text.TextEngine');
  15. goog.require('shaka.util.Error');
  16. goog.require('shaka.util.StringUtils');
  17. goog.require('shaka.util.TextParser');
  18. goog.require('shaka.util.XmlUtils');
  21. /**
  22.  * @implements {shaka.extern.TextParser}
  23.  * @export
  24.  */
  25. shaka.text.VttTextParser = class {
  26.   /** Constructs a VTT parser. */
  27.   constructor() {
  28.     /** @private {boolean} */
  29.     this.sequenceMode_ = false;
  31.     /** @private {string} */
  32.     this.manifestType_ = shaka.media.ManifestParser.UNKNOWN;
  33.   }
  35.   /**
  36.    * @override
  37.    * @export
  38.    */
  39.   parseInit(data) {
  40.     goog.asserts.assert(false, 'VTT does not have init segments');
  41.   }
  43.   /**
  44.    * @override
  45.    * @export
  46.    */
  47.   setSequenceMode(sequenceMode) {
  48.     this.sequenceMode_ = sequenceMode;
  49.   }
  51.   /**
  52.    * @override
  53.    * @export
  54.    */
  55.   setManifestType(manifestType) {
  56.     this.manifestType_ = manifestType;
  57.   }
  59.   /**
  60.    * @override
  61.    * @export
  62.    */
  63.   parseMedia(data, time) {
  64.     const VttTextParser = shaka.text.VttTextParser;
  65.     // Get the input as a string.  Normalize newlines to \n.
  66.     let str = shaka.util.StringUtils.fromUTF8(data);
  67.     str = str.replace(/\r\n|\r(?=[^\n]|$)/gm, '\n');
  68.     const blocks = str.split(/\n{2,}/m);
  70.     if (!/^WEBVTT($|[ \t\n])/m.test(blocks[0])) {
  71.       throw new shaka.util.Error(
  72.           shaka.util.Error.Severity.CRITICAL,
  73.           shaka.util.Error.Category.TEXT,
  74.           shaka.util.Error.Code.INVALID_TEXT_HEADER);
  75.     }
  77.     // Depending on "segmentRelativeVttTiming" configuration,
  78.     // "vttOffset" will correspond to either "periodStart" (default)
  79.     // or "segmentStart", for segmented VTT where timings are relative
  80.     // to the beginning of each segment.
  81.     // NOTE: "periodStart" is the timestamp offset applied via TextEngine.
  82.     // It is no longer closely tied to periods, but the name stuck around.
  83.     // NOTE: This offset and the flag choosing its meaning have no effect on
  84.     // HLS content, which should use X-TIMESTAMP-MAP and periodStart instead.
  85.     let offset = time.vttOffset;
  87.     // Only use 'X-TIMESTAMP-MAP' with HLS.  This overrides offset above.
  88.     if (blocks[0].includes('X-TIMESTAMP-MAP') &&
  89.         this.manifestType_ == shaka.media.ManifestParser.HLS) {
  90.       if (this.sequenceMode_) {
  91.         // Compute a different, rollover-based offset for sequence mode.
  92.         offset = this.computeHlsSequenceModeOffset_(blocks[0], time);
  93.       } else {
  94.         // Calculate the offset from the segment startTime.
  95.         offset = time.segmentStart;
  96.       }
  97.     }
  99.     // Parse VTT regions.
  100.     /* !Array.<!shaka.text.CueRegion> */
  101.     const regions = [];
  102.     for (const line of blocks[0].split('\n')) {
  103.       if (/^Region:/.test(line)) {
  104.         const region = VttTextParser.parseRegion_(line);
  105.         regions.push(region);
  106.       }
  107.     }
  109.     /** @type {!Map.<string, shaka.text.Cue>} */
  110.     const styles = new Map();
  111.     VttTextParser.addDefaultTextColor_(styles);
  113.     // Parse cues.
  114.     const ret = [];
  115.     for (const block of blocks.slice(1)) {
  116.       const lines = block.split('\n');
  117.       VttTextParser.parseStyle_(lines, styles);
  118.       const cue = VttTextParser.parseCue_(lines, offset, regions, styles);
  119.       if (cue) {
  120.         ret.push(cue);
  121.       }
  122.     }
  124.     return ret;
  125.   }
  127.   /**
  128.    * @param {string} headerBlock Contains X-TIMESTAMP-MAP.
  129.    * @param {shaka.extern.TextParser.TimeContext} time
  130.    * @return {number}
  131.    * @private
  132.    */
  133.   computeHlsSequenceModeOffset_(headerBlock, time) {
  134.     // https://bit.ly/2K92l7y
  135.     // The 'X-TIMESTAMP-MAP' header is used in HLS to align text with
  136.     // the rest of the media.
  137.     // The header format is 'X-TIMESTAMP-MAP=MPEGTS:n,LOCAL:m'
  138.     // (the attributes can go in any order)
  139.     // where n is MPEG-2 time and m is cue time it maps to.
  140.     // For example 'X-TIMESTAMP-MAP=LOCAL:00:00:00.000,MPEGTS:900000'
  141.     // means an offset of 10 seconds
  142.     // 900000/MPEG_TIMESCALE - cue time.
  143.     const cueTimeMatch = headerBlock.match(
  144.         /LOCAL:((?:(\d{1,}):)?(\d{2}):(\d{2})\.(\d{3}))/m);
  145.     const mpegTimeMatch = headerBlock.match(/MPEGTS:(\d+)/m);
  147.     if (!cueTimeMatch || !mpegTimeMatch) {
  148.       throw new shaka.util.Error(
  149.           shaka.util.Error.Severity.CRITICAL,
  150.           shaka.util.Error.Category.TEXT,
  151.           shaka.util.Error.Code.INVALID_TEXT_HEADER);
  152.     }
  154.     const parser = new shaka.util.TextParser(cueTimeMatch[1]);
  155.     const cueTime = shaka.text.VttTextParser.parseTime_(parser);
  156.     if (cueTime == null) {
  157.       throw new shaka.util.Error(
  158.           shaka.util.Error.Severity.CRITICAL,
  159.           shaka.util.Error.Category.TEXT,
  160.           shaka.util.Error.Code.INVALID_TEXT_HEADER);
  161.     }
  163.     const mpegTime = Number(mpegTimeMatch[1]);
  164.     const mpegTimescale = shaka.text.VttTextParser.MPEG_TIMESCALE_;
  166.     return time.periodStart + mpegTime / mpegTimescale - cueTime;
  167.   }
  169.   /**
  170.    * Add default color
  171.    *
  172.    * @param {!Map.<string, shaka.text.Cue>} styles
  173.    * @private
  174.    */
  175.   static addDefaultTextColor_(styles) {
  176.     const textColor = shaka.text.Cue.defaultTextColor;
  177.     for (const [key, value] of Object.entries(textColor)) {
  178.       const cue = new shaka.text.Cue(0, 0, '');
  179.       cue.color = value;
  180.       styles.set('.' + key, cue);
  181.     }
  183.     const bgColor = shaka.text.Cue.defaultTextBackgroundColor;
  184.     for (const [key, value] of Object.entries(bgColor)) {
  185.       const cue = new shaka.text.Cue(0, 0, '');
  186.       cue.backgroundColor = value;
  187.       styles.set('.' + key, cue);
  188.     }
  189.   }
  191.   /**
  192.    * Parses a string into a Region object.
  193.    *
  194.    * @param {string} text
  195.    * @return {!shaka.text.CueRegion}
  196.    * @private
  197.    */
  198.   static parseRegion_(text) {
  199.     const VttTextParser = shaka.text.VttTextParser;
  200.     const parser = new shaka.util.TextParser(text);
  201.     // The region string looks like this:
  202.     // Region: id=fred width=50% lines=3 regionanchor=0%,100%
  203.     //         viewportanchor=10%,90% scroll=up
  204.     const region = new shaka.text.CueRegion();
  206.     // Skip 'Region:'
  207.     parser.readWord();
  208.     parser.skipWhitespace();
  210.     let word = parser.readWord();
  211.     while (word) {
  212.       if (!VttTextParser.parseRegionSetting_(region, word)) {
  213.         shaka.log.warning(
  214.             'VTT parser encountered an invalid VTTRegion setting: ', word,
  215.             ' The setting will be ignored.');
  216.       }
  217.       parser.skipWhitespace();
  218.       word = parser.readWord();
  219.     }
  221.     return region;
  222.   }
  224.   /**
  225.    * Parses a style block into a Cue object.
  226.    *
  227.    * @param {!Array.<string>} text
  228.    * @param {!Map.<string, shaka.text.Cue>} styles
  229.    * @private
  230.    */
  231.   static parseStyle_(text, styles) {
  232.     // Skip empty blocks.
  233.     if (text.length == 1 && !text[0]) {
  234.       return;
  235.     }
  237.     // Skip comment blocks.
  238.     if (/^NOTE($|[ \t])/.test(text[0])) {
  239.       return;
  240.     }
  242.     // Only style block are allowed.
  243.     if (text[0] != 'STYLE') {
  244.       return;
  245.     }
  247.     /** @type {!Array.<!Array.<string>>} */
  248.     const styleBlocks = [];
  249.     let lastBlockIndex = -1;
  250.     for (let i = 1; i < text.length; i++) {
  251.       if (text[i].includes('::cue')) {
  252.         styleBlocks.push([]);
  253.         lastBlockIndex = styleBlocks.length - 1;
  254.       }
  255.       if (lastBlockIndex == -1) {
  256.         continue;
  257.       }
  258.       styleBlocks[lastBlockIndex].push(text[i]);
  259.       if (text[i].includes('}')) {
  260.         lastBlockIndex = -1;
  261.       }
  262.     }
  264.     for (const styleBlock of styleBlocks) {
  265.       let styleSelector = 'global';
  266.       // Look for what is within parentheses. For example:
  267.       // <code>:: cue (b) {</code>, what we are looking for is <code>b</code>
  268.       const selector = styleBlock[0].match(/\((.*)\)/);
  269.       if (selector) {
  270.         styleSelector = selector.pop();
  271.       }
  273.       // We start at 1 to avoid '::cue' and end earlier to avoid '}'
  274.       let propertyLines = styleBlock.slice(1, -1);
  275.       if (styleBlock[0].includes('}')) {
  276.         const payload = /\{(.*?)\}/.exec(styleBlock[0]);
  277.         if (payload) {
  278.           propertyLines = payload[1].split(';');
  279.         }
  280.       }
  282.       // Continue styles over multiple selectors if necessary.
  283.       // For example,
  284.       //   ::cue(b) { background: white; } ::cue(b) { color: blue; }
  285.       // should set both the background and foreground of bold tags.
  286.       let cue = styles.get(styleSelector);
  287.       if (!cue) {
  288.         cue = new shaka.text.Cue(0, 0, '');
  289.       }
  291.       let validStyle = false;
  292.       for (let i = 0; i < propertyLines.length; i++) {
  293.         // We look for CSS properties. As a general rule they are separated by
  294.         // <code>:</code>. Eg: <code>color: red;</code>
  295.         const lineParts = /^\s*([^:]+):\s*(.*)/.exec(propertyLines[i]);
  296.         if (lineParts) {
  297.           const name = lineParts[1].trim();
  298.           const value = lineParts[2].trim().replace(';', '');
  299.           switch (name) {
  300.             case 'background-color':
  301.             case 'background':
  302.               validStyle = true;
  303.               cue.backgroundColor = value;
  304.               break;
  305.             case 'color':
  306.               validStyle = true;
  307.               cue.color = value;
  308.               break;
  309.             case 'font-family':
  310.               validStyle = true;
  311.               cue.fontFamily = value;
  312.               break;
  313.             case 'font-size':
  314.               validStyle = true;
  315.               cue.fontSize = value;
  316.               break;
  317.             case 'font-weight':
  318.               if (parseInt(value, 10) >= 700 || value == 'bold') {
  319.                 validStyle = true;
  320.                 cue.fontWeight = shaka.text.Cue.fontWeight.BOLD;
  321.               }
  322.               break;
  323.             case 'font-style':
  324.               switch (value) {
  325.                 case 'normal':
  326.                   validStyle = true;
  327.                   cue.fontStyle = shaka.text.Cue.fontStyle.NORMAL;
  328.                   break;
  329.                 case 'italic':
  330.                   validStyle = true;
  331.                   cue.fontStyle = shaka.text.Cue.fontStyle.ITALIC;
  332.                   break;
  333.                 case 'oblique':
  334.                   validStyle = true;
  335.                   cue.fontStyle = shaka.text.Cue.fontStyle.OBLIQUE;
  336.                   break;
  337.               }
  338.               break;
  339.             case 'opacity':
  340.               validStyle = true;
  341.               cue.opacity = parseFloat(value);
  342.               break;
  343.             case 'text-combine-upright':
  344.               validStyle = true;
  345.               cue.textCombineUpright = value;
  346.               break;
  347.             case 'text-shadow':
  348.               validStyle = true;
  349.               cue.textShadow = value;
  350.               break;
  351.             case 'white-space':
  352.               validStyle = true;
  353.               cue.wrapLine = value != 'noWrap';
  354.               break;
  355.             default:
  356.               shaka.log.warning('VTT parser encountered an unsupported style: ',
  357.                   lineParts);
  358.               break;
  359.           }
  360.         }
  361.       }
  363.       if (validStyle) {
  364.         styles.set(styleSelector, cue);
  365.       }
  366.     }
  367.   }
  369.   /**
  370.    * Parses a text block into a Cue object.
  371.    *
  372.    * @param {!Array.<string>} text
  373.    * @param {number} timeOffset
  374.    * @param {!Array.<!shaka.text.CueRegion>} regions
  375.    * @param {!Map.<string, shaka.text.Cue>} styles
  376.    * @return {shaka.text.Cue}
  377.    * @private
  378.    */
  379.   static parseCue_(text, timeOffset, regions, styles) {
  380.     const VttTextParser = shaka.text.VttTextParser;
  382.     // Skip empty blocks.
  383.     if (text.length == 1 && !text[0]) {
  384.       return null;
  385.     }
  387.     // Skip comment blocks.
  388.     if (/^NOTE($|[ \t])/.test(text[0])) {
  389.       return null;
  390.     }
  392.     // Skip style and region blocks.
  393.     if (text[0] == 'STYLE' || text[0] == 'REGION') {
  394.       return null;
  395.     }
  397.     let id = null;
  398.     if (!text[0].includes('-->')) {
  399.       id = text[0];
  400.       text.splice(0, 1);
  401.     }
  403.     // Parse the times.
  404.     const parser = new shaka.util.TextParser(text[0]);
  405.     let start = VttTextParser.parseTime_(parser);
  406.     const expect = parser.readRegex(/[ \t]+-->[ \t]+/g);
  407.     let end = VttTextParser.parseTime_(parser);
  409.     if (start == null || expect == null || end == null) {
  410.       shaka.log.alwaysWarn(
  411.           'Failed to parse VTT time code. Cue skipped:', id, text);
  412.       return null;
  413.     }
  415.     start += timeOffset;
  416.     end += timeOffset;
  418.     // Get the payload.
  419.     const payload = text.slice(1).join('\n').trim();
  421.     let cue = null;
  422.     if (styles.has('global')) {
  423.       cue = styles.get('global').clone();
  424.       cue.startTime = start;
  425.       cue.endTime = end;
  426.       cue.payload = '';
  427.     } else {
  428.       cue = new shaka.text.Cue(start, end, '');
  429.     }
  431.     // Parse optional settings.
  432.     parser.skipWhitespace();
  433.     let word = parser.readWord();
  434.     while (word) {
  435.       if (!VttTextParser.parseCueSetting(cue, word, regions)) {
  436.         shaka.log.warning('VTT parser encountered an invalid VTT setting: ',
  437.             word,
  438.             ' The setting will be ignored.');
  439.       }
  440.       parser.skipWhitespace();
  441.       word = parser.readWord();
  442.     }
  444.     VttTextParser.parseCueStyles(payload, cue, styles);
  446.     if (id != null) {
  447.       cue.id = id;
  448.     }
  449.     return cue;
  450.   }
  452.   /**
  453.    * Parses a WebVTT styles from the given payload.
  454.    *
  455.    * @param {string} payload
  456.    * @param {!shaka.text.Cue} rootCue
  457.    * @param {!Map.<string, shaka.text.Cue>} styles
  458.    */
  459.   static parseCueStyles(payload, rootCue, styles) {
  460.     const VttTextParser = shaka.text.VttTextParser;
  461.     // Optimization for unstyled payloads.
  462.     if (!payload.includes('<')) {
  463.       rootCue.payload = VttTextParser.htmlUnescape_(payload);
  464.       return;
  465.     }
  466.     if (styles.size === 0) {
  467.       VttTextParser.addDefaultTextColor_(styles);
  468.     }
  469.     payload = VttTextParser.replaceColorPayload_(payload);
  470.     payload = VttTextParser.replaceKaraokeStylePayload_(payload);
  471.     payload = VttTextParser.replaceVoiceStylePayload_(payload);
  472.     const xmlPayload = '<span>' + payload + '</span>';
  473.     const element = shaka.util.XmlUtils.parseXmlString(xmlPayload, 'span');
  474.     if (element) {
  475.       const childNodes = element.childNodes;
  476.       if (childNodes.length == 1) {
  477.         const childNode = childNodes[0];
  478.         if (childNode.nodeType == Node.TEXT_NODE ||
  479.             childNode.nodeType == Node.CDATA_SECTION_NODE) {
  480.           rootCue.payload = VttTextParser.htmlUnescape_(payload);
  481.           return;
  482.         }
  483.       }
  484.       for (const childNode of childNodes) {
  485.         VttTextParser.generateCueFromElement_(childNode, rootCue, styles);
  486.       }
  487.     } else {
  488.       shaka.log.warning('The cue\'s markup could not be parsed: ', payload);
  489.       rootCue.payload = VttTextParser.htmlUnescape_(payload);
  490.     }
  491.   }
  493.   /**
  494.    * Converts voice style tag to be valid for xml parsing
  495.    * For example,
  496.    * input: <v Shaka>Test
  497.    * output: <v.voice-Shaka>Test</v.voice-Shaka>
  498.    *
  499.    * @param {string} payload
  500.    * @return {string} processed payload
  501.    * @private
  502.    */
  503.   static replaceVoiceStylePayload_(payload) {
  504.     const voiceTag = 'v';
  505.     const names = [];
  506.     let nameStart = -1;
  507.     let newPayload = '';
  508.     let hasVoiceEndTag = false;
  509.     for (let i = 0; i < payload.length; i++) {
  510.       // This condition is used to manage tags that have end tags.
  511.       if (payload[i] === '/') {
  512.         const end = payload.indexOf('>', i);
  513.         if (end === -1) {
  514.           return payload;
  515.         }
  516.         const tagEnd = payload.substring(i + 1, end);
  517.         if (!tagEnd || tagEnd != voiceTag) {
  518.           newPayload += payload[i];
  519.           continue;
  520.         }
  521.         hasVoiceEndTag = true;
  522.         let tagStart = null;
  523.         if (names.length) {
  524.           tagStart = names[names.length -1];
  525.         }
  526.         if (!tagStart) {
  527.           newPayload += payload[i];
  528.         } else if (tagStart === tagEnd) {
  529.           newPayload += '/' + tagEnd + '>';
  530.           i += tagEnd.length + 1;
  531.         } else {
  532.           if (!tagStart.startsWith(voiceTag)) {
  533.             newPayload += payload[i];
  534.             continue;
  535.           }
  536.           newPayload += '/' + tagStart + '>';
  537.           i += tagEnd.length + 1;
  538.         }
  539.       } else {
  540.         // Here we only want the tag name, not any other payload.
  541.         if (payload[i] === '<') {
  542.           nameStart = i + 1;
  543.           if (payload[nameStart] != voiceTag) {
  544.             nameStart = -1;
  545.           }
  546.         } else if (payload[i] === '>') {
  547.           if (nameStart > 0) {
  548.             names.push(payload.substr(nameStart, i - nameStart));
  549.             nameStart = -1;
  550.           }
  551.         }
  552.         newPayload += payload[i];
  553.       }
  554.     }
  555.     for (const name of names) {
  556.       const newName = name.replace(' ', '.voice-');
  557.       newPayload = newPayload.replace(`<${name}>`, `<${newName}>`);
  558.       newPayload = newPayload.replace(`</${name}>`, `</${newName}>`);
  559.       if (!hasVoiceEndTag) {
  560.         newPayload += `</${newName}>`;
  561.       }
  562.     }
  563.     return newPayload;
  564.   }
  566.   /**
  567.    * Converts karaoke style tag to be valid for xml parsing
  568.    * For example,
  569.    * input: Text <00:00:00.450> time <00:00:01.450> 1
  570.    * output: Text <div time="00:00:00.450"> time
  571.    *         <div time="00:00:01.450"> 1</div></div>
  572.    *
  573.    * @param {string} payload
  574.    * @return {string} processed payload
  575.    * @private
  576.    */
  577.   static replaceKaraokeStylePayload_(payload) {
  578.     const names = [];
  579.     let nameStart = -1;
  580.     for (let i = 0; i < payload.length; i++) {
  581.       if (payload[i] === '<') {
  582.         nameStart = i + 1;
  583.       } else if (payload[i] === '>') {
  584.         if (nameStart > 0) {
  585.           const name = payload.substr(nameStart, i - nameStart);
  586.           if (name.match(shaka.text.VttTextParser.timeFormat_)) {
  587.             names.push(name);
  588.           }
  589.           nameStart = -1;
  590.         }
  591.       }
  592.     }
  593.     let newPayload = payload;
  594.     for (const name of names) {
  595.       const replaceTag = '<' + name + '>';
  596.       const startTag = '<div time="' + name + '">';
  597.       const endTag = '</div>';
  598.       newPayload = newPayload.replace(replaceTag, startTag);
  599.       newPayload += endTag;
  600.     }
  601.     return newPayload;
  602.   }
  604.   /**
  605.    * Converts color end tag to be valid for xml parsing
  606.    * For example,
  607.    * input: <c.yellow.bg_blue>Yellow text on blue bg</c>
  608.    * output: <c.yellow.bg_blue>Yellow text on blue bg</c.yellow.bg_blue>
  609.    *
  610.    * Returns original payload if invalid tag is found.
  611.    * Invalid tag example: <c.yellow><b>Example</c></b>
  612.    *
  613.    * @param {string} payload
  614.    * @return {string} processed payload
  615.    * @private
  616.    */
  617.   static replaceColorPayload_(payload) {
  618.     const names = [];
  619.     let nameStart = -1;
  620.     let newPayload = '';
  621.     for (let i = 0; i < payload.length; i++) {
  622.       if (payload[i] === '/' && i > 0 && payload[i - 1] === '<') {
  623.         const end = payload.indexOf('>', i);
  624.         if (end <= i) {
  625.           return payload;
  626.         }
  627.         const tagEnd = payload.substring(i + 1, end);
  628.         if (!tagEnd || tagEnd !== 'c') {
  629.           newPayload += payload[i];
  630.           continue;
  631.         }
  632.         const tagStart = names.pop();
  633.         if (!tagStart) {
  634.           newPayload += payload[i];
  635.         } else if (tagStart === tagEnd) {
  636.           newPayload += '/' + tagEnd + '>';
  637.           i += tagEnd.length + 1;
  638.         } else {
  639.           if (!tagStart.startsWith('c.')) {
  640.             newPayload += payload[i];
  641.             continue;
  642.           }
  643.           i += tagEnd.length + 1;
  644.           newPayload += '/' + tagStart + '>';
  645.         }
  646.       } else {
  647.         if (payload[i] === '<') {
  648.           nameStart = i + 1;
  649.           if (payload[nameStart] != 'c') {
  650.             nameStart = -1;
  651.           }
  652.         } else if (payload[i] === '>') {
  653.           if (nameStart > 0) {
  654.             names.push(payload.substr(nameStart, i - nameStart));
  655.             nameStart = -1;
  656.           }
  657.         }
  658.         newPayload += payload[i];
  659.       }
  660.     }
  661.     return newPayload;
  662.   }
  664.   /**
  665.    * @param {string} value
  666.    * @param {string} defaultValue
  667.    * @private
  668.    */
  669.   static getOrDefault_(value, defaultValue) {
  670.     if (value && value.length > 0) {
  671.       return value;
  672.     }
  673.     return defaultValue;
  674.   }
  676.   /**
  677.    * Merges values created in parseStyle_
  678.    * @param {!shaka.text.Cue} cue
  679.    * @param {shaka.text.Cue} refCue
  680.    * @private
  681.    */
  682.   static mergeStyle_(cue, refCue) {
  683.     if (!refCue) {
  684.       return;
  685.     }
  687.     const VttTextParser = shaka.text.VttTextParser;
  688.     // Overwrites if new value string length > 0
  689.     cue.backgroundColor = VttTextParser.getOrDefault_(
  690.         refCue.backgroundColor, cue.backgroundColor);
  691.     cue.color = VttTextParser.getOrDefault_(
  692.         refCue.color, cue.color);
  693.     cue.fontFamily = VttTextParser.getOrDefault_(
  694.         refCue.fontFamily, cue.fontFamily);
  695.     cue.fontSize = VttTextParser.getOrDefault_(
  696.         refCue.fontSize, cue.fontSize);
  697.     cue.textShadow = VttTextParser.getOrDefault_(
  698.         refCue.textShadow, cue.textShadow);
  700.     // Overwrite with new values as unable to determine
  701.     // if new value is set or not
  702.     cue.fontWeight = refCue.fontWeight;
  703.     cue.fontStyle = refCue.fontStyle;
  704.     cue.opacity = refCue.opacity;
  705.     cue.rubyTag = refCue.rubyTag;
  706.     cue.textCombineUpright = refCue.textCombineUpright;
  707.     cue.wrapLine = refCue.wrapLine;
  708.   }
  710.   /**
  711.    * @param {!Node} element
  712.    * @param {!shaka.text.Cue} rootCue
  713.    * @param {!Map.<string, shaka.text.Cue>} styles
  714.    * @private
  715.    */
  716.   static generateCueFromElement_(element, rootCue, styles) {
  717.     const VttTextParser = shaka.text.VttTextParser;
  718.     const nestedCue = rootCue.clone();
  719.     // We don't want propagate some properties.
  720.     nestedCue.nestedCues = [];
  721.     nestedCue.payload = '';
  722.     nestedCue.rubyTag = '';
  723.     // We don't want propagate some position settings
  724.     nestedCue.line = null;
  725.     nestedCue.region = new shaka.text.CueRegion();
  726.     nestedCue.position = null;
  727.     nestedCue.size = 0;
  728.     if (element.nodeType === Node.ELEMENT_NODE && element.nodeName) {
  729.       const bold = shaka.text.Cue.fontWeight.BOLD;
  730.       const italic = shaka.text.Cue.fontStyle.ITALIC;
  731.       const underline = shaka.text.Cue.textDecoration.UNDERLINE;
  732.       const tags = element.nodeName.split(/(?=[ .])+/g);
  733.       for (const tag of tags) {
  734.         let styleTag = tag;
  735.         // White blanks at start indicate that the style is a voice
  736.         if (styleTag.startsWith('.voice-')) {
  737.           const voice = styleTag.split('-').pop();
  738.           styleTag = `v[voice="${voice}"]`;
  739.           // The specification allows to have quotes and not, so we check to
  740.           // see which one is being used.
  741.           if (!styles.has(styleTag)) {
  742.             styleTag = `v[voice=${voice}]`;
  743.           }
  744.         }
  745.         if (styles.has(styleTag)) {
  746.           VttTextParser.mergeStyle_(nestedCue, styles.get(styleTag));
  747.         }
  748.         switch (tag) {
  749.           case 'br': {
  750.             const lineBreakCue = shaka.text.Cue.lineBreak(
  751.                 nestedCue.startTime, nestedCue.endTime);
  752.             rootCue.nestedCues.push(lineBreakCue);
  753.             return;
  754.           }
  755.           case 'b':
  756.             nestedCue.fontWeight = bold;
  757.             break;
  758.           case 'i':
  759.             nestedCue.fontStyle = italic;
  760.             break;
  761.           case 'u':
  762.             nestedCue.textDecoration.push(underline);
  763.             break;
  764.           case 'font': {
  765.             const color =
  766.             /** @type {!Element} */(element).getAttribute('color');
  767.             if (color) {
  768.               nestedCue.color = color;
  769.             }
  770.             break;
  771.           }
  772.           case 'div': {
  773.             const time = /** @type {!Element} */(element).getAttribute('time');
  774.             if (!time) {
  775.               break;
  776.             }
  777.             const parser = new shaka.util.TextParser(time);
  778.             const cueTime = shaka.text.VttTextParser.parseTime_(parser);
  779.             if (cueTime) {
  780.               nestedCue.startTime = cueTime;
  781.             }
  782.             break;
  783.           }
  784.           case 'ruby':
  785.           case 'rp':
  786.           case 'rt':
  787.             nestedCue.rubyTag = tag;
  788.             break;
  789.           default:
  790.             break;
  791.         }
  792.       }
  793.     }
  795.     const isTextNode = (item) => shaka.util.XmlUtils.isText(item);
  796.     const childNodes = element.childNodes;
  797.     if (isTextNode(element) ||
  798.         (childNodes.length == 1 && isTextNode(childNodes[0]))) {
  799.       // Trailing line breaks may lost when convert cue to HTML tag
  800.       // Need to insert line break cue to preserve line breaks
  801.       const textArr = element.textContent.split('\n');
  802.       let isFirst = true;
  803.       for (const text of textArr) {
  804.         if (!isFirst) {
  805.           const lineBreakCue = shaka.text.Cue.lineBreak(
  806.               nestedCue.startTime, nestedCue.endTime);
  807.           rootCue.nestedCues.push(lineBreakCue);
  808.         }
  809.         if (text.length > 0) {
  810.           const textCue = nestedCue.clone();
  811.           textCue.payload = VttTextParser.htmlUnescape_(text);
  812.           rootCue.nestedCues.push(textCue);
  813.         }
  814.         isFirst = false;
  815.       }
  816.     } else {
  817.       rootCue.nestedCues.push(nestedCue);
  818.       for (const childNode of childNodes) {
  819.         VttTextParser.generateCueFromElement_(childNode, nestedCue, styles);
  820.       }
  821.     }
  822.   }
  824.   /**
  825.    * Parses a WebVTT setting from the given word.
  826.    *
  827.    * @param {!shaka.text.Cue} cue
  828.    * @param {string} word
  829.    * @param {!Array.<!shaka.text.CueRegion>} regions
  830.    * @return {boolean} True on success.
  831.    */
  832.   static parseCueSetting(cue, word, regions) {
  833.     const VttTextParser = shaka.text.VttTextParser;
  834.     let results = null;
  835.     if ((results = /^align:(start|middle|center|end|left|right)$/.exec(word))) {
  836.       VttTextParser.setTextAlign_(cue, results[1]);
  837.     } else if ((results = /^vertical:(lr|rl)$/.exec(word))) {
  838.       VttTextParser.setVerticalWritingMode_(cue, results[1]);
  839.     } else if ((results = /^size:([\d.]+)%$/.exec(word))) {
  840.       cue.size = Number(results[1]);
  841.     } else if ((results =
  842.         // eslint-disable-next-line max-len
  843.         /^position:([\d.]+)%(?:,(line-left|line-right|middle|center|start|end|auto))?$/
  844.             .exec(word))) {
  845.       cue.position = Number(results[1]);
  846.       if (results[2]) {
  847.         VttTextParser.setPositionAlign_(cue, results[2]);
  848.       }
  849.     } else if ((results = /^region:(.*)$/.exec(word))) {
  850.       const region = VttTextParser.getRegionById_(regions, results[1]);
  851.       if (region) {
  852.         cue.region = region;
  853.       }
  854.     } else {
  855.       return VttTextParser.parsedLineValueAndInterpretation_(cue, word);
  856.     }
  858.     return true;
  859.   }
  861.   /**
  862.    *
  863.    * @param {!Array.<!shaka.text.CueRegion>} regions
  864.    * @param {string} id
  865.    * @return {?shaka.text.CueRegion}
  866.    * @private
  867.    */
  868.   static getRegionById_(regions, id) {
  869.     const regionsWithId = regions.filter((region) => {
  870.       return region.id == id;
  871.     });
  872.     if (!regionsWithId.length) {
  873.       shaka.log.warning('VTT parser could not find a region with id: ',
  874.           id,
  875.           ' The region will be ignored.');
  876.       return null;
  877.     }
  878.     goog.asserts.assert(regionsWithId.length == 1,
  879.         'VTTRegion ids should be unique!');
  881.     return regionsWithId[0];
  882.   }
  884.   /**
  885.    * Parses a WebVTTRegion setting from the given word.
  886.    *
  887.    * @param {!shaka.text.CueRegion} region
  888.    * @param {string} word
  889.    * @return {boolean} True on success.
  890.    * @private
  891.    */
  892.   static parseRegionSetting_(region, word) {
  893.     let results = null;
  894.     if ((results = /^id=(.*)$/.exec(word))) {
  895.       region.id = results[1];
  896.     } else if ((results = /^width=(\d{1,2}|100)%$/.exec(word))) {
  897.       region.width = Number(results[1]);
  898.     } else if ((results = /^lines=(\d+)$/.exec(word))) {
  899.       region.height = Number(results[1]);
  900.       region.heightUnits = shaka.text.CueRegion.units.LINES;
  901.     } else if ((results = /^regionanchor=(\d{1,2}|100)%,(\d{1,2}|100)%$/
  902.         .exec(word))) {
  903.       region.regionAnchorX = Number(results[1]);
  904.       region.regionAnchorY = Number(results[2]);
  905.     } else if ((results = /^viewportanchor=(\d{1,2}|100)%,(\d{1,2}|100)%$/
  906.         .exec(word))) {
  907.       region.viewportAnchorX = Number(results[1]);
  908.       region.viewportAnchorY = Number(results[2]);
  909.     } else if ((results = /^scroll=up$/.exec(word))) {
  910.       region.scroll = shaka.text.CueRegion.scrollMode.UP;
  911.     } else {
  912.       return false;
  913.     }
  915.     return true;
  916.   }
  918.   /**
  919.    * @param {!shaka.text.Cue} cue
  920.    * @param {string} align
  921.    * @private
  922.    */
  923.   static setTextAlign_(cue, align) {
  924.     const Cue = shaka.text.Cue;
  925.     if (align == 'middle') {
  926.       cue.textAlign = Cue.textAlign.CENTER;
  927.     } else {
  928.       goog.asserts.assert(align.toUpperCase() in Cue.textAlign,
  929.           align.toUpperCase() +
  930.                           ' Should be in Cue.textAlign values!');
  932.       cue.textAlign = Cue.textAlign[align.toUpperCase()];
  933.     }
  934.   }
  936.   /**
  937.    * @param {!shaka.text.Cue} cue
  938.    * @param {string} align
  939.    * @private
  940.    */
  941.   static setPositionAlign_(cue, align) {
  942.     const Cue = shaka.text.Cue;
  943.     if (align == 'line-left' || align == 'start') {
  944.       cue.positionAlign = Cue.positionAlign.LEFT;
  945.     } else if (align == 'line-right' || align == 'end') {
  946.       cue.positionAlign = Cue.positionAlign.RIGHT;
  947.     } else if (align == 'center' || align == 'middle') {
  948.       cue.positionAlign = Cue.positionAlign.CENTER;
  949.     } else {
  950.       cue.positionAlign = Cue.positionAlign.AUTO;
  951.     }
  952.   }
  954.   /**
  955.    * @param {!shaka.text.Cue} cue
  956.    * @param {string} value
  957.    * @private
  958.    */
  959.   static setVerticalWritingMode_(cue, value) {
  960.     const Cue = shaka.text.Cue;
  961.     if (value == 'lr') {
  962.       cue.writingMode = Cue.writingMode.VERTICAL_LEFT_TO_RIGHT;
  963.     } else {
  964.       cue.writingMode = Cue.writingMode.VERTICAL_RIGHT_TO_LEFT;
  965.     }
  966.   }
  968.   /**
  969.    * @param {!shaka.text.Cue} cue
  970.    * @param {string} word
  971.    * @return {boolean}
  972.    * @private
  973.    */
  974.   static parsedLineValueAndInterpretation_(cue, word) {
  975.     const Cue = shaka.text.Cue;
  976.     let results = null;
  977.     if ((results = /^line:([\d.]+)%(?:,(start|end|center))?$/.exec(word))) {
  978.       cue.lineInterpretation = Cue.lineInterpretation.PERCENTAGE;
  979.       cue.line = Number(results[1]);
  980.       if (results[2]) {
  981.         goog.asserts.assert(
  982.             results[2].toUpperCase() in Cue.lineAlign,
  983.             results[2].toUpperCase() + ' Should be in Cue.lineAlign values!');
  984.         cue.lineAlign = Cue.lineAlign[results[2].toUpperCase()];
  985.       }
  986.     } else if ((results =
  987.                     /^line:(-?\d+)(?:,(start|end|center))?$/.exec(word))) {
  988.       cue.lineInterpretation = Cue.lineInterpretation.LINE_NUMBER;
  989.       cue.line = Number(results[1]);
  990.       if (results[2]) {
  991.         goog.asserts.assert(
  992.             results[2].toUpperCase() in Cue.lineAlign,
  993.             results[2].toUpperCase() + ' Should be in Cue.lineAlign values!');
  994.         cue.lineAlign = Cue.lineAlign[results[2].toUpperCase()];
  995.       }
  996.     } else {
  997.       return false;
  998.     }
  1000.     return true;
  1001.   }
  1003.   /**
  1004.    * Parses a WebVTT time from the given parser.
  1005.    *
  1006.    * @param {!shaka.util.TextParser} parser
  1007.    * @return {?number}
  1008.    * @private
  1009.    */
  1010.   static parseTime_(parser) {
  1011.     const results = parser.readRegex(shaka.text.VttTextParser.timeFormat_);
  1012.     if (results == null) {
  1013.       return null;
  1014.     }
  1015.     // This capture is optional, but will still be in the array as undefined,
  1016.     // in which case it is 0.
  1017.     const hours = Number(results[1]) || 0;
  1018.     const minutes = Number(results[2]);
  1019.     const seconds = Number(results[3]);
  1020.     const milliseconds = Number(results[4]);
  1021.     if (minutes > 59 || seconds > 59) {
  1022.       return null;
  1023.     }
  1025.     return (milliseconds / 1000) + seconds + (minutes * 60) + (hours * 3600);
  1026.   }
  1028.   /**
  1029.    * This method converts the HTML entities &amp;, &lt;, &gt;, &quot;, &#39;,
  1030.    * &nbsp;, &lrm; and &rlm; in string to their corresponding characters.
  1031.    *
  1032.    * @param {!string} input
  1033.    * @return {string}
  1034.    * @private
  1035.    */
  1036.   static htmlUnescape_(input) {
  1037.     // Used to map HTML entities to characters.
  1038.     const htmlUnescapes = {
  1039.       '&amp;': '&',
  1040.       '&lt;': '<',
  1041.       '&gt;': '>',
  1042.       '&quot;': '"',
  1043.       '&#39;': '\'',
  1044.       '&nbsp;': '\u{a0}',
  1045.       '&lrm;': '\u{200e}',
  1046.       '&rlm;': '\u{200f}',
  1047.     };
  1049.     // Used to match HTML entities and HTML characters.
  1050.     const reEscapedHtml = /&(?:amp|lt|gt|quot|#(0+)?39|nbsp|lrm|rlm);/g;
  1051.     const reHasEscapedHtml = RegExp(reEscapedHtml.source);
  1052.     // This check is an optimization, since replace always makes a copy
  1053.     if (input && reHasEscapedHtml.test(input)) {
  1054.       return input.replace(reEscapedHtml, (entity) => {
  1055.         // The only thing that might not match the dictionary above is the
  1056.         // single quote, which can be matched by many strings in the regex, but
  1057.         // only has a single entry in the dictionary.
  1058.         return htmlUnescapes[entity] || '\'';
  1059.       });
  1060.     }
  1061.     return input || '';
  1062.   }
  1063. };
  1065. /**
  1066.  * @const {number}
  1067.  * @private
  1068.  */
  1069. shaka.text.VttTextParser.MPEG_TIMESCALE_ = 90000;
  1071. /**
  1072.  * @const
  1073.  * @private {!RegExp}
  1074.  * @example 00:00.000 or 00:00:00.000 or 0:00:00.000 or
  1075.  * 00:00.00 or 00:00:00.00 or 0:00:00.00
  1076.  */
  1077. shaka.text.VttTextParser.timeFormat_ =
  1078.     /(?:(\d{1,}):)?(\d{2}):(\d{2})\.(\d{2,3})/g;
  1080. shaka.text.TextEngine.registerParser(
  1081.     'text/vtt', () => new shaka.text.VttTextParser());
  1083. shaka.text.TextEngine.registerParser(
  1084.     'text/vtt; codecs="vtt"', () => new shaka.text.VttTextParser());
  1086. shaka.text.TextEngine.registerParser(
  1087.     'text/vtt; codecs="wvtt"', () => new shaka.text.VttTextParser());