Source: lib/text/ttml_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.TtmlTextParser');
  9. goog.require('goog.asserts');
  10. goog.require('goog.Uri');
  11. goog.require('shaka.log');
  12. goog.require('shaka.media.ManifestParser');
  13. goog.require('shaka.text.Cue');
  14. goog.require('shaka.text.CueRegion');
  15. goog.require('shaka.text.TextEngine');
  16. goog.require('shaka.util.ArrayUtils');
  17. goog.require('shaka.util.Error');
  18. goog.require('shaka.util.StringUtils');
  19. goog.require('shaka.util.TXml');
  22. /**
  23.  * @implements {shaka.extern.TextParser}
  24.  * @export
  25.  */
  26. shaka.text.TtmlTextParser = class {
  27.   constructor() {
  28.     /** @private {string} */
  29.     this.manifestType_ = shaka.media.ManifestParser.UNKNOWN;
  30.   }
  32.   /**
  33.    * @override
  34.    * @export
  35.    */
  36.   parseInit(data) {
  37.     goog.asserts.assert(false, 'TTML does not have init segments');
  38.   }
  40.   /**
  41.    * @override
  42.    * @export
  43.    */
  44.   setSequenceMode(sequenceMode) {
  45.     // Unused.
  46.   }
  48.   /**
  49.    * @override
  50.    * @export
  51.    */
  52.   setManifestType(manifestType) {
  53.     this.manifestType_ = manifestType;
  54.   }
  56.   /**
  57.    * @override
  58.    * @export
  59.    */
  60.   parseMedia(data, time, uri, images) {
  61.     const TtmlTextParser = shaka.text.TtmlTextParser;
  62.     const TXml = shaka.util.TXml;
  63.     const ttpNs = TtmlTextParser.parameterNs_;
  64.     const ttsNs = TtmlTextParser.styleNs_;
  65.     const str = shaka.util.StringUtils.fromUTF8(data);
  66.     const cues = [];
  68.     // dont try to parse empty string as
  69.     // DOMParser will not throw error but return an errored xml
  70.     if (str == '') {
  71.       return cues;
  72.     }
  74.     const tt = TXml.parseXmlString(str, 'tt', /* includeParent= */ true);
  75.     if (!tt) {
  76.       throw new shaka.util.Error(
  77.           shaka.util.Error.Severity.CRITICAL,
  78.           shaka.util.Error.Category.TEXT,
  79.           shaka.util.Error.Code.INVALID_XML,
  80.           'Failed to parse TTML.');
  81.     }
  83.     const body = TXml.getElementsByTagName(tt, 'body')[0];
  84.     if (!body) {
  85.       return [];
  86.     }
  88.     // Get the framerate, subFrameRate and frameRateMultiplier if applicable.
  89.     const frameRate = TXml.getAttributeNSList(tt, ttpNs, 'frameRate');
  90.     const subFrameRate = TXml.getAttributeNSList(
  91.         tt, ttpNs, 'subFrameRate');
  92.     const frameRateMultiplier =
  93.         TXml.getAttributeNSList(tt, ttpNs, 'frameRateMultiplier');
  94.     const tickRate = TXml.getAttributeNSList(tt, ttpNs, 'tickRate');
  96.     const cellResolution = TXml.getAttributeNSList(
  97.         tt, ttpNs, 'cellResolution');
  98.     const spaceStyle = tt.attributes['xml:space'] || 'default';
  99.     const extent = TXml.getAttributeNSList(tt, ttsNs, 'extent');
  101.     if (spaceStyle != 'default' && spaceStyle != 'preserve') {
  102.       throw new shaka.util.Error(
  103.           shaka.util.Error.Severity.CRITICAL,
  104.           shaka.util.Error.Category.TEXT,
  105.           shaka.util.Error.Code.INVALID_XML,
  106.           'Invalid xml:space value: ' + spaceStyle);
  107.     }
  108.     const collapseMultipleSpaces = spaceStyle == 'default';
  110.     const rateInfo = new TtmlTextParser.RateInfo_(
  111.         frameRate, subFrameRate, frameRateMultiplier, tickRate);
  113.     const cellResolutionInfo = this.getCellResolution_(cellResolution);
  115.     const metadata = TXml.getElementsByTagName(tt, 'metadata')[0];
  116.     const metadataElements =
  117.         (metadata ? metadata.children : []).filter((c) => c != '\n');
  118.     const styles = TXml.getElementsByTagName(tt, 'style');
  119.     const regionElements = TXml.getElementsByTagName(tt, 'region');
  121.     const cueRegions = [];
  122.     for (const region of regionElements) {
  123.       const cueRegion = this.parseCueRegion_(region, styles, extent);
  124.       if (cueRegion) {
  125.         cueRegions.push(cueRegion);
  126.       }
  127.     }
  129.     // A <body> element should only contain <div> elements, not <p> or <span>
  130.     // elements.  We used to allow this, but it is non-compliant, and the
  131.     // loose nature of our previous parser made it difficult to implement TTML
  132.     // nesting more fully.
  133.     if (TXml.findChildren(body, 'p').length) {
  134.       throw new shaka.util.Error(
  135.           shaka.util.Error.Severity.CRITICAL,
  136.           shaka.util.Error.Category.TEXT,
  137.           shaka.util.Error.Code.INVALID_TEXT_CUE,
  138.           '<p> can only be inside <div> in TTML');
  139.     }
  141.     for (const div of TXml.findChildren(body, 'div')) {
  142.       // A <div> element should only contain <p>, not <span>.
  143.       if (TXml.findChildren(div, 'span').length) {
  144.         throw new shaka.util.Error(
  145.             shaka.util.Error.Severity.CRITICAL,
  146.             shaka.util.Error.Category.TEXT,
  147.             shaka.util.Error.Code.INVALID_TEXT_CUE,
  148.             '<span> can only be inside <p> in TTML');
  149.       }
  150.     }
  152.     const cue = this.parseCue_(
  153.         body, time, rateInfo, metadataElements, styles,
  154.         regionElements, cueRegions, collapseMultipleSpaces,
  155.         cellResolutionInfo, /* parentCueElement= */ null,
  156.         /* isContent= */ false, uri, images);
  157.     if (cue) {
  158.       // According to the TTML spec, backgrounds default to transparent.
  159.       // So default the background of the top-level element to transparent.
  160.       // Nested elements may override that background color already.
  161.       if (!cue.backgroundColor) {
  162.         cue.backgroundColor = 'transparent';
  163.       }
  164.       cues.push(cue);
  165.     }
  167.     return cues;
  168.   }
  170.   /**
  171.    * Parses a TTML node into a Cue.
  172.    *
  173.    * @param {!shaka.extern.xml.Node} cueNode
  174.    * @param {shaka.extern.TextParser.TimeContext} timeContext
  175.    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  176.    * @param {!Array<!shaka.extern.xml.Node>} metadataElements
  177.    * @param {!Array<!shaka.extern.xml.Node>} styles
  178.    * @param {!Array<!shaka.extern.xml.Node>} regionElements
  179.    * @param {!Array<!shaka.text.CueRegion>} cueRegions
  180.    * @param {boolean} collapseMultipleSpaces
  181.    * @param {?{columns: number, rows: number}} cellResolution
  182.    * @param {?shaka.extern.xml.Node} parentCueElement
  183.    * @param {boolean} isContent
  184.    * @param {?(string|undefined)} uri
  185.    * @param {!Array<string>} images
  186.    * @return {shaka.text.Cue}
  187.    * @private
  188.    */
  189.   parseCue_(
  190.       cueNode, timeContext, rateInfo, metadataElements, styles, regionElements,
  191.       cueRegions, collapseMultipleSpaces, cellResolution, parentCueElement,
  192.       isContent, uri, images) {
  193.     const TXml = shaka.util.TXml;
  194.     const StringUtils = shaka.util.StringUtils;
  195.     /** @type {shaka.extern.xml.Node} */
  196.     let cueElement;
  197.     /** @type {?shaka.extern.xml.Node} */
  198.     let parentElement = parentCueElement;
  200.     if (TXml.isText(cueNode)) {
  201.       if (!isContent) {
  202.         // Ignore text elements outside the content. For example, whitespace
  203.         // on the same lexical level as the <p> elements, in a document with
  204.         // xml:space="preserve", should not be renderer.
  205.         return null;
  206.       }
  207.       // This should generate an "anonymous span" according to the TTML spec.
  208.       // So pretend the element was a <span>.  parentElement was set above, so
  209.       // we should still be able to correctly traverse up for timing
  210.       // information later.
  211.       /** @type {shaka.extern.xml.Node} */
  212.       const span = {
  213.         tagName: 'span',
  214.         children: [TXml.getTextContents(cueNode)],
  215.         attributes: {},
  216.         parent: null,
  217.       };
  218.       cueElement = span;
  219.     } else {
  220.       cueElement = cueNode;
  221.     }
  222.     goog.asserts.assert(cueElement, 'cueElement should be non-null!');
  224.     let imageElement = null;
  225.     for (const nameSpace of shaka.text.TtmlTextParser.smpteNsList_) {
  226.       imageElement = this.getElementsFromCollection_(
  227.           cueElement, 'backgroundImage', metadataElements, '#',
  228.           nameSpace)[0];
  229.       if (imageElement) {
  230.         break;
  231.       }
  232.     }
  234.     let imageUri = null;
  235.     const backgroundImage = TXml.getAttributeNSList(
  236.         cueElement,
  237.         shaka.text.TtmlTextParser.smpteNsList_,
  238.         'backgroundImage');
  239.     const imsc1ImgUrnTester =
  240.         /^(urn:)(mpeg:[a-z0-9][a-z0-9-]{0,31}:)(subs:)([0-9]+)$/;
  241.     if (backgroundImage && imsc1ImgUrnTester.test(backgroundImage)) {
  242.       const index = parseInt(backgroundImage.split(':').pop(), 10) -1;
  243.       if (index >= images.length) {
  244.         return null;
  245.       }
  246.       imageUri = images[index];
  247.     } else if (uri && backgroundImage && !backgroundImage.startsWith('#')) {
  248.       const baseUri = new goog.Uri(uri);
  249.       const relativeUri = new goog.Uri(backgroundImage);
  250.       const newUri = baseUri.resolve(relativeUri).toString();
  251.       if (newUri) {
  252.         imageUri = newUri;
  253.       }
  254.     }
  256.     if (cueNode.tagName == 'p' || imageElement || imageUri) {
  257.       isContent = true;
  258.     }
  260.     const parentIsContent = isContent;
  262.     const spaceStyle = cueElement.attributes['xml:space'] ||
  263.         (collapseMultipleSpaces ? 'default' : 'preserve');
  265.     const localCollapseMultipleSpaces = spaceStyle == 'default';
  267.     // Parse any nested cues first.
  268.     const isLeafNode = cueElement.children.every(TXml.isText);
  269.     const nestedCues = [];
  270.     if (!isLeafNode) {
  271.       // Otherwise, recurse into the children.  Text nodes will convert into
  272.       // anonymous spans, which will then be leaf nodes.
  273.       for (const childNode of cueElement.children) {
  274.         const nestedCue = this.parseCue_(
  275.             childNode,
  276.             timeContext,
  277.             rateInfo,
  278.             metadataElements,
  279.             styles,
  280.             regionElements,
  281.             cueRegions,
  282.             localCollapseMultipleSpaces,
  283.             cellResolution,
  284.             cueElement,
  285.             isContent,
  286.             uri,
  287.             images,
  288.         );
  290.         // This node may or may not generate a nested cue.
  291.         if (nestedCue) {
  292.           nestedCues.push(nestedCue);
  293.         }
  294.       }
  295.     }
  297.     const isNested = /** @type {boolean} */ (parentCueElement != null);
  299.     const textContent = TXml.getTextContents(cueElement);
  300.     // In this regex, "\S" means "non-whitespace character".
  301.     const hasTextContent = cueElement.children.length &&
  302.         textContent &&
  303.         /\S/.test(textContent);
  305.     const hasTimeAttributes =
  306.         cueElement.attributes['begin'] ||
  307.         cueElement.attributes['end'] ||
  308.         cueElement.attributes['dur'];
  310.     if (!hasTimeAttributes && !hasTextContent && cueElement.tagName != 'br' &&
  311.         nestedCues.length == 0) {
  312.       if (!isNested) {
  313.         // Disregards empty <p> elements without time attributes nor content.
  314.         // <p begin="..." smpte:backgroundImage="..." /> will go through,
  315.         // as some information could be held by its attributes.
  316.         // <p /> won't, as it would not be displayed.
  317.         return null;
  318.       } else if (localCollapseMultipleSpaces) {
  319.         // Disregards empty anonymous spans when (local) trim is true.
  320.         return null;
  321.       }
  322.     }
  324.     // Get local time attributes.
  325.     let {start, end} = this.parseTime_(cueElement, rateInfo);
  326.     // Resolve local time relative to parent elements.  Time elements can appear
  327.     // all the way up to 'body', but not 'tt'.
  328.     while (parentElement && TXml.isNode(parentElement) &&
  329.         parentElement.tagName != 'tt') {
  330.       ({start, end} = this.resolveTime_(parentElement, rateInfo, start, end));
  331.       parentElement =
  332.         /** @type {shaka.extern.xml.Node} */ (parentElement.parent);
  333.     }
  335.     if (start == null) {
  336.       start = 0;
  337.     }
  338.     start += timeContext.periodStart;
  340.     // If end is null, that means the duration is effectively infinite.
  341.     if (end == null) {
  342.       end = Infinity;
  343.     } else {
  344.       end += timeContext.periodStart;
  345.     }
  347.     if (this.manifestType_ !== shaka.media.ManifestParser.HLS) {
  348.       // Clip times to segment boundaries.
  349.       // https://github.com/shaka-project/shaka-player/issues/4631
  350.       start = Math.max(start, timeContext.segmentStart);
  351.       end = Math.min(end, timeContext.segmentEnd);
  352.     }
  354.     if (!hasTimeAttributes && nestedCues.length > 0) {
  355.       // If no time is defined for this cue, base the timing information on
  356.       // the time of the nested cues. In the case of multiple nested cues with
  357.       // different start times, it is the text displayer's responsibility to
  358.       // make sure that only the appropriate nested cue is drawn at any given
  359.       // time.
  360.       start = Infinity;
  361.       end = 0;
  362.       for (const cue of nestedCues) {
  363.         start = Math.min(start, cue.startTime);
  364.         end = Math.max(end, cue.endTime);
  365.       }
  366.     }
  368.     if (cueElement.tagName == 'br') {
  369.       const cue = new shaka.text.Cue(start, end, '');
  370.       cue.lineBreak = true;
  371.       return cue;
  372.     }
  374.     let payload = '';
  375.     if (isLeafNode) {
  376.       // If the childNodes are all text, this is a leaf node.  Get the payload.
  377.       payload = StringUtils.htmlUnescape(
  378.           shaka.util.TXml.getTextContents(cueElement) || '');
  379.       if (localCollapseMultipleSpaces) {
  380.         // Collapse multiple spaces into one.
  381.         payload = payload.replace(/\s+/g, ' ');
  382.       }
  383.     }
  385.     const cue = new shaka.text.Cue(start, end, payload);
  386.     cue.nestedCues = nestedCues;
  388.     if (!isContent) {
  389.       // If this is not a <p> element or a <div> with images, and it has no
  390.       // parent that was a <p> element, then it's part of the outer containers
  391.       // (e.g. the <body> or a normal <div> element within it).
  392.       cue.isContainer = true;
  393.     }
  395.     if (cellResolution) {
  396.       cue.cellResolution = cellResolution;
  397.     }
  399.     // Get other properties if available.
  400.     const regionElement = this.getElementsFromCollection_(
  401.         cueElement, 'region', regionElements, /* prefix= */ '')[0];
  402.     // Do not actually apply that region unless it is non-inherited, though.
  403.     // This makes it so that, if a parent element has a region, the children
  404.     // don't also all independently apply the positioning of that region.
  405.     if (cueElement.attributes['region']) {
  406.       if (regionElement && regionElement.attributes['xml:id']) {
  407.         const regionId = regionElement.attributes['xml:id'];
  408.         cue.region = cueRegions.filter((region) => region.id == regionId)[0];
  409.       }
  410.     }
  412.     let regionElementForStyle = regionElement;
  413.     if (parentCueElement && isNested && !cueElement.attributes['region'] &&
  414.       !cueElement.attributes['style']) {
  415.       regionElementForStyle = this.getElementsFromCollection_(
  416.           parentCueElement, 'region', regionElements, /* prefix= */ '')[0];
  417.     }
  419.     this.addStyle_(
  420.         cue,
  421.         cueElement,
  422.         regionElementForStyle,
  423.         /** @type {!shaka.extern.xml.Node} */(imageElement),
  424.         imageUri,
  425.         styles,
  426.         /** isNested= */ parentIsContent, // "nested in a <div>" doesn't count.
  427.         /** isLeaf= */ (nestedCues.length == 0));
  429.     return cue;
  430.   }
  432.   /**
  433.    * Parses an Element into a TextTrackCue or VTTCue.
  434.    *
  435.    * @param {!shaka.extern.xml.Node} regionElement
  436.    * @param {!Array<!shaka.extern.xml.Node>} styles
  437.    * Defined in the top of tt element and used principally for images.
  438.    * @param {?string} globalExtent
  439.    * @return {shaka.text.CueRegion}
  440.    * @private
  441.    */
  442.   parseCueRegion_(regionElement, styles, globalExtent) {
  443.     const TtmlTextParser = shaka.text.TtmlTextParser;
  444.     const region = new shaka.text.CueRegion();
  445.     const id = regionElement.attributes['xml:id'];
  446.     if (!id) {
  447.       shaka.log.warning('TtmlTextParser parser encountered a region with ' +
  448.                         'no id. Region will be ignored.');
  449.       return null;
  450.     }
  451.     region.id = id;
  453.     let globalResults = null;
  454.     if (globalExtent) {
  455.       globalResults = TtmlTextParser.percentValues_.exec(globalExtent) ||
  456.         TtmlTextParser.pixelValues_.exec(globalExtent);
  457.     }
  458.     const globalWidth = globalResults ? Number(globalResults[1]) : null;
  459.     const globalHeight = globalResults ? Number(globalResults[2]) : null;
  461.     let results = null;
  462.     let percentage = null;
  463.     const extent = this.getStyleAttributeFromRegion_(
  464.         regionElement, styles, 'extent');
  465.     if (extent) {
  466.       percentage = TtmlTextParser.percentValues_.exec(extent);
  467.       results = percentage || TtmlTextParser.pixelValues_.exec(extent);
  468.       if (results != null) {
  469.         region.width = Number(results[1]);
  470.         region.height = Number(results[2]);
  472.         if (!percentage) {
  473.           if (globalWidth != null) {
  474.             region.width = region.width * 100 / globalWidth;
  475.           }
  476.           if (globalHeight != null) {
  477.             region.height = region.height * 100 / globalHeight;
  478.           }
  479.         }
  481.         region.widthUnits = percentage || globalWidth != null ?
  482.                            shaka.text.CueRegion.units.PERCENTAGE :
  483.                            shaka.text.CueRegion.units.PX;
  485.         region.heightUnits = percentage || globalHeight != null ?
  486.                            shaka.text.CueRegion.units.PERCENTAGE :
  487.                            shaka.text.CueRegion.units.PX;
  488.       }
  489.     }
  491.     const origin = this.getStyleAttributeFromRegion_(
  492.         regionElement, styles, 'origin');
  493.     if (origin) {
  494.       percentage = TtmlTextParser.percentValues_.exec(origin);
  495.       results = percentage || TtmlTextParser.pixelValues_.exec(origin);
  496.       if (results != null) {
  497.         region.viewportAnchorX = Number(results[1]);
  498.         region.viewportAnchorY = Number(results[2]);
  500.         if (!percentage) {
  501.           if (globalHeight != null) {
  502.             region.viewportAnchorY = region.viewportAnchorY * 100 /
  503.               globalHeight;
  504.           }
  505.           if (globalWidth != null) {
  506.             region.viewportAnchorX = region.viewportAnchorX * 100 /
  507.               globalWidth;
  508.           }
  509.         } else if (!extent) {
  510.           region.width = 100 - region.viewportAnchorX;
  511.           region.widthUnits = shaka.text.CueRegion.units.PERCENTAGE;
  512.           region.height = 100 - region.viewportAnchorY;
  513.           region.heightUnits = shaka.text.CueRegion.units.PERCENTAGE;
  514.         }
  516.         region.viewportAnchorUnits = percentage || globalWidth != null ?
  517.                   shaka.text.CueRegion.units.PERCENTAGE :
  518.                   shaka.text.CueRegion.units.PX;
  519.       }
  520.     }
  522.     return region;
  523.   }
  525.   /**
  526.    * Ensures any TTML RGBA's alpha range of 0-255 is converted to 0-1.
  527.    * @param {string} color
  528.    * @return {string}
  529.    * @private
  530.    */
  531.   convertTTMLrgbaToHTMLrgba_(color) {
  532.     const rgba = color.match(/rgba\(([^)]+)\)/);
  533.     if (rgba) {
  534.       const values = rgba[1].split(',');
  535.       if (values.length == 4) {
  536.         values[3] = String(Number(values[3]) / 255);
  537.         return 'rgba(' + values.join(',') + ')';
  538.       }
  539.     }
  540.     return color;
  541.   }
  543.   /**
  544.    * Adds applicable style properties to a cue.
  545.    *
  546.    * @param {!shaka.text.Cue} cue
  547.    * @param {!shaka.extern.xml.Node} cueElement
  548.    * @param {shaka.extern.xml.Node} region
  549.    * @param {shaka.extern.xml.Node} imageElement
  550.    * @param {?string} imageUri
  551.    * @param {!Array<!shaka.extern.xml.Node>} styles
  552.    * @param {boolean} isNested
  553.    * @param {boolean} isLeaf
  554.    * @private
  555.    */
  556.   addStyle_(
  557.       cue, cueElement, region, imageElement, imageUri, styles,
  558.       isNested, isLeaf) {
  559.     const TtmlTextParser = shaka.text.TtmlTextParser;
  560.     const TXml = shaka.util.TXml;
  561.     const Cue = shaka.text.Cue;
  563.     // Styles should be inherited from regions, if a style property is not
  564.     // associated with a Content element (or an anonymous span).
  565.     const shouldInheritRegionStyles = isNested || isLeaf;
  567.     const direction = this.getStyleAttribute_(
  568.         cueElement, region, styles, 'direction', shouldInheritRegionStyles);
  569.     if (direction == 'rtl') {
  570.       cue.direction = Cue.direction.HORIZONTAL_RIGHT_TO_LEFT;
  571.     }
  573.     // Direction attribute specifies one-dimensional writing direction
  574.     // (left to right or right to left). Writing mode specifies that
  575.     // plus whether text is vertical or horizontal.
  576.     // They should not contradict each other. If they do, we give
  577.     // preference to writing mode.
  578.     const writingMode = this.getStyleAttribute_(
  579.         cueElement, region, styles, 'writingMode', shouldInheritRegionStyles);
  580.     // Set cue's direction if the text is horizontal, and cue's writingMode if
  581.     // it's vertical.
  582.     if (writingMode == 'tb' || writingMode == 'tblr') {
  583.       cue.writingMode = Cue.writingMode.VERTICAL_LEFT_TO_RIGHT;
  584.     } else if (writingMode == 'tbrl') {
  585.       cue.writingMode = Cue.writingMode.VERTICAL_RIGHT_TO_LEFT;
  586.     } else if (writingMode == 'rltb' || writingMode == 'rl') {
  587.       cue.direction = Cue.direction.HORIZONTAL_RIGHT_TO_LEFT;
  588.     } else if (writingMode) {
  589.       cue.direction = Cue.direction.HORIZONTAL_LEFT_TO_RIGHT;
  590.     }
  592.     const align = this.getStyleAttribute_(
  593.         cueElement, region, styles, 'textAlign', true);
  594.     if (align) {
  595.       cue.positionAlign = TtmlTextParser.textAlignToPositionAlign_.get(align);
  596.       cue.lineAlign = TtmlTextParser.textAlignToLineAlign_.get(align);
  598.       goog.asserts.assert(align.toUpperCase() in Cue.textAlign,
  599.           align.toUpperCase() + ' Should be in Cue.textAlign values!');
  601.       cue.textAlign = Cue.textAlign[align.toUpperCase()];
  602.     } else {
  603.       // Default value is START in the TTML spec: https://bit.ly/32OGmvo
  604.       // But to make the subtitle render consistent with other players and the
  605.       // shaka.text.Cue we use CENTER
  606.       cue.textAlign = Cue.textAlign.CENTER;
  607.     }
  609.     const displayAlign = this.getStyleAttribute_(
  610.         cueElement, region, styles, 'displayAlign', true);
  611.     if (displayAlign) {
  612.       goog.asserts.assert(displayAlign.toUpperCase() in Cue.displayAlign,
  613.           displayAlign.toUpperCase() +
  614.                           ' Should be in Cue.displayAlign values!');
  615.       cue.displayAlign = Cue.displayAlign[displayAlign.toUpperCase()];
  616.     }
  618.     const color = this.getStyleAttribute_(
  619.         cueElement, region, styles, 'color', shouldInheritRegionStyles);
  620.     if (color) {
  621.       cue.color = this.convertTTMLrgbaToHTMLrgba_(color);
  622.     }
  624.     // Background color should not be set on a container.  If this is a nested
  625.     // cue, you can set the background.  If it's a top-level that happens to
  626.     // also be a leaf, you can set the background.
  627.     // See https://github.com/shaka-project/shaka-player/issues/2623
  628.     // This used to be handled in the displayer, but that is confusing.  The Cue
  629.     // structure should reflect what you want to happen in the displayer, and
  630.     // the displayer shouldn't have to know about TTML.
  631.     const backgroundColor = this.getStyleAttribute_(
  632.         cueElement, region, styles, 'backgroundColor',
  633.         shouldInheritRegionStyles);
  634.     if (backgroundColor) {
  635.       cue.backgroundColor = this.convertTTMLrgbaToHTMLrgba_(backgroundColor);
  636.     }
  638.     const border = this.getStyleAttribute_(
  639.         cueElement, region, styles, 'border', shouldInheritRegionStyles);
  640.     if (border) {
  641.       cue.border = border;
  642.     }
  644.     const fontFamily = this.getStyleAttribute_(
  645.         cueElement, region, styles, 'fontFamily', shouldInheritRegionStyles);
  646.     // See https://github.com/sandflow/imscJS/blob/1.1.3/src/main/js/html.js#L1384
  647.     if (fontFamily) {
  648.       switch (fontFamily) {
  649.         case 'monospaceSerif':
  650.           cue.fontFamily = 'Courier New,Liberation Mono,Courier,monospace';
  651.           break;
  652.         case 'proportionalSansSerif':
  653.           cue.fontFamily = 'Arial,Helvetica,Liberation Sans,sans-serif';
  654.           break;
  655.         case 'sansSerif':
  656.           cue.fontFamily = 'sans-serif';
  657.           break;
  658.         case 'monospaceSansSerif':
  659.           // cspell: disable-next-line
  660.           cue.fontFamily = 'Consolas,monospace';
  661.           break;
  662.         case 'proportionalSerif':
  663.           cue.fontFamily = 'serif';
  664.           break;
  665.         default:
  666.           cue.fontFamily = fontFamily.split(',').filter((font) => {
  667.             return font != 'default';
  668.           }).join(',');
  669.           break;
  670.       }
  671.     }
  673.     const fontWeight = this.getStyleAttribute_(
  674.         cueElement, region, styles, 'fontWeight', shouldInheritRegionStyles);
  675.     if (fontWeight && fontWeight == 'bold') {
  676.       cue.fontWeight = Cue.fontWeight.BOLD;
  677.     }
  679.     const wrapOption = this.getStyleAttribute_(
  680.         cueElement, region, styles, 'wrapOption', shouldInheritRegionStyles);
  681.     if (wrapOption && wrapOption == 'noWrap') {
  682.       cue.wrapLine = false;
  683.     } else {
  684.       cue.wrapLine = true;
  685.     }
  687.     const lineHeight = this.getStyleAttribute_(
  688.         cueElement, region, styles, 'lineHeight', shouldInheritRegionStyles);
  689.     if (lineHeight && lineHeight.match(TtmlTextParser.unitValues_)) {
  690.       cue.lineHeight = lineHeight;
  691.     }
  693.     const fontSize = this.getStyleAttribute_(
  694.         cueElement, region, styles, 'fontSize', shouldInheritRegionStyles);
  695.     if (fontSize) {
  696.       const isValidFontSizeUnit =
  697.           fontSize.match(TtmlTextParser.unitValues_) ||
  698.           fontSize.match(TtmlTextParser.percentValue_);
  700.       if (isValidFontSizeUnit) {
  701.         cue.fontSize = fontSize;
  702.       }
  703.     }
  705.     const fontStyle = this.getStyleAttribute_(
  706.         cueElement, region, styles, 'fontStyle', shouldInheritRegionStyles);
  707.     if (fontStyle) {
  708.       goog.asserts.assert(fontStyle.toUpperCase() in Cue.fontStyle,
  709.           fontStyle.toUpperCase() +
  710.                           ' Should be in Cue.fontStyle values!');
  711.       cue.fontStyle = Cue.fontStyle[fontStyle.toUpperCase()];
  712.     }
  714.     if (imageElement) {
  715.       // According to the spec, we should use imageType (camelCase), but
  716.       // historically we have checked for imagetype (lowercase).
  717.       // This was the case since background image support was first introduced
  718.       // in PR #1859, in April 2019, and first released in v2.5.0.
  719.       // Now we check for both, although only imageType (camelCase) is to spec.
  720.       const backgroundImageType =
  721.           imageElement.attributes['imageType'] ||
  722.           imageElement.attributes['imagetype'];
  723.       const backgroundImageEncoding = imageElement.attributes['encoding'];
  724.       const backgroundImageData = (TXml.getTextContents(imageElement)).trim();
  725.       if (backgroundImageType == 'PNG' &&
  726.           backgroundImageEncoding == 'Base64' &&
  727.           backgroundImageData) {
  728.         cue.backgroundImage = 'data:image/png;base64,' + backgroundImageData;
  729.       }
  730.     } else if (imageUri) {
  731.       cue.backgroundImage = imageUri;
  732.     }
  734.     const textOutline = this.getStyleAttribute_(
  735.         cueElement, region, styles, 'textOutline', shouldInheritRegionStyles);
  736.     if (textOutline) {
  737.       // tts:textOutline isn't natively supported by browsers, but it can be
  738.       // mostly replicated using the non-standard -webkit-text-stroke-width and
  739.       // -webkit-text-stroke-color properties.
  740.       const split = textOutline.split(' ');
  741.       if (split[0].match(TtmlTextParser.unitValues_)) {
  742.         // There is no defined color, so default to the text color.
  743.         cue.textStrokeColor = cue.color;
  744.       } else {
  745.         cue.textStrokeColor = this.convertTTMLrgbaToHTMLrgba_(split[0]);
  746.         split.shift();
  747.       }
  748.       if (split[0] && split[0].match(TtmlTextParser.unitValues_)) {
  749.         cue.textStrokeWidth = split[0];
  750.       } else {
  751.         // If there is no width, or the width is not a number, don't draw a
  752.         // border.
  753.         cue.textStrokeColor = '';
  754.       }
  755.       // There is an optional blur radius also, but we have no way of
  756.       // replicating that, so ignore it.
  757.     }
  759.     const letterSpacing = this.getStyleAttribute_(
  760.         cueElement, region, styles, 'letterSpacing', shouldInheritRegionStyles);
  761.     if (letterSpacing && letterSpacing.match(TtmlTextParser.unitValues_)) {
  762.       cue.letterSpacing = letterSpacing;
  763.     }
  765.     const linePadding = this.getStyleAttribute_(
  766.         cueElement, region, styles, 'linePadding', shouldInheritRegionStyles);
  767.     if (linePadding && linePadding.match(TtmlTextParser.unitValues_)) {
  768.       cue.linePadding = linePadding;
  769.     }
  771.     const opacity = this.getStyleAttribute_(
  772.         cueElement, region, styles, 'opacity', shouldInheritRegionStyles);
  773.     if (opacity) {
  774.       cue.opacity = parseFloat(opacity);
  775.     }
  777.     // Text decoration is an array of values which can come both from the
  778.     // element's style or be inherited from elements' parent nodes. All of those
  779.     // values should be applied as long as they don't contradict each other. If
  780.     // they do, elements' own style gets preference.
  781.     const textDecorationRegion = this.getStyleAttributeFromRegion_(
  782.         region, styles, 'textDecoration');
  783.     if (textDecorationRegion) {
  784.       this.addTextDecoration_(cue, textDecorationRegion);
  785.     }
  787.     const textDecorationElement = this.getStyleAttributeFromElement_(
  788.         cueElement, styles, 'textDecoration');
  789.     if (textDecorationElement) {
  790.       this.addTextDecoration_(cue, textDecorationElement);
  791.     }
  793.     const textCombine = this.getStyleAttribute_(
  794.         cueElement, region, styles, 'textCombine', shouldInheritRegionStyles);
  795.     if (textCombine) {
  796.       cue.textCombineUpright = textCombine;
  797.     }
  799.     const ruby = this.getStyleAttribute_(
  800.         cueElement, region, styles, 'ruby', shouldInheritRegionStyles);
  801.     switch (ruby) {
  802.       case 'container':
  803.         cue.rubyTag = 'ruby';
  804.         break;
  805.       case 'text':
  806.         cue.rubyTag = 'rt';
  807.         break;
  808.     }
  809.   }
  811.   /**
  812.    * Parses text decoration values and adds/removes them to/from the cue.
  813.    *
  814.    * @param {!shaka.text.Cue} cue
  815.    * @param {string} decoration
  816.    * @private
  817.    */
  818.   addTextDecoration_(cue, decoration) {
  819.     const Cue = shaka.text.Cue;
  820.     for (const value of decoration.split(' ')) {
  821.       switch (value) {
  822.         case 'underline':
  823.           if (!cue.textDecoration.includes(Cue.textDecoration.UNDERLINE)) {
  824.             cue.textDecoration.push(Cue.textDecoration.UNDERLINE);
  825.           }
  826.           break;
  827.         case 'noUnderline':
  828.           if (cue.textDecoration.includes(Cue.textDecoration.UNDERLINE)) {
  829.             shaka.util.ArrayUtils.remove(cue.textDecoration,
  830.                 Cue.textDecoration.UNDERLINE);
  831.           }
  832.           break;
  833.         case 'lineThrough':
  834.           if (!cue.textDecoration.includes(Cue.textDecoration.LINE_THROUGH)) {
  835.             cue.textDecoration.push(Cue.textDecoration.LINE_THROUGH);
  836.           }
  837.           break;
  838.         case 'noLineThrough':
  839.           if (cue.textDecoration.includes(Cue.textDecoration.LINE_THROUGH)) {
  840.             shaka.util.ArrayUtils.remove(cue.textDecoration,
  841.                 Cue.textDecoration.LINE_THROUGH);
  842.           }
  843.           break;
  844.         case 'overline':
  845.           if (!cue.textDecoration.includes(Cue.textDecoration.OVERLINE)) {
  846.             cue.textDecoration.push(Cue.textDecoration.OVERLINE);
  847.           }
  848.           break;
  849.         case 'noOverline':
  850.           if (cue.textDecoration.includes(Cue.textDecoration.OVERLINE)) {
  851.             shaka.util.ArrayUtils.remove(cue.textDecoration,
  852.                 Cue.textDecoration.OVERLINE);
  853.           }
  854.           break;
  855.       }
  856.     }
  857.   }
  859.   /**
  860.    * Finds a specified attribute on either the original cue element or its
  861.    * associated region and returns the value if the attribute was found.
  862.    *
  863.    * @param {!shaka.extern.xml.Node} cueElement
  864.    * @param {shaka.extern.xml.Node} region
  865.    * @param {!Array<!shaka.extern.xml.Node>} styles
  866.    * @param {string} attribute
  867.    * @param {boolean=} shouldInheritRegionStyles
  868.    * @return {?string}
  869.    * @private
  870.    */
  871.   getStyleAttribute_(cueElement, region, styles, attribute,
  872.       shouldInheritRegionStyles=true) {
  873.     // An attribute can be specified on region level or in a styling block
  874.     // associated with the region or original element.
  875.     const attr = this.getStyleAttributeFromElement_(
  876.         cueElement, styles, attribute);
  877.     if (attr) {
  878.       return attr;
  879.     }
  881.     if (shouldInheritRegionStyles) {
  882.       return this.getStyleAttributeFromRegion_(region, styles, attribute);
  883.     }
  884.     return null;
  885.   }
  887.   /**
  888.    * Finds a specified attribute on the element's associated region
  889.    * and returns the value if the attribute was found.
  890.    *
  891.    * @param {shaka.extern.xml.Node} region
  892.    * @param {!Array<!shaka.extern.xml.Node>} styles
  893.    * @param {string} attribute
  894.    * @return {?string}
  895.    * @private
  896.    */
  897.   getStyleAttributeFromRegion_(region, styles, attribute) {
  898.     const TXml = shaka.util.TXml;
  899.     const ttsNs = shaka.text.TtmlTextParser.styleNs_;
  901.     if (!region) {
  902.       return null;
  903.     }
  905.     const attr = TXml.getAttributeNSList(region, ttsNs, attribute);
  906.     if (attr) {
  907.       return attr;
  908.     }
  910.     return this.getInheritedStyleAttribute_(region, styles, attribute);
  911.   }
  913.   /**
  914.    * Finds a specified attribute on the cue element and returns the value
  915.    * if the attribute was found.
  916.    *
  917.    * @param {!shaka.extern.xml.Node} cueElement
  918.    * @param {!Array<!shaka.extern.xml.Node>} styles
  919.    * @param {string} attribute
  920.    * @return {?string}
  921.    * @private
  922.    */
  923.   getStyleAttributeFromElement_(cueElement, styles, attribute) {
  924.     const TXml = shaka.util.TXml;
  925.     const ttsNs = shaka.text.TtmlTextParser.styleNs_;
  927.     // Styling on elements should take precedence
  928.     // over the main styling attributes
  929.     const elementAttribute = TXml.getAttributeNSList(
  930.         cueElement,
  931.         ttsNs,
  932.         attribute);
  934.     if (elementAttribute) {
  935.       return elementAttribute;
  936.     }
  937.     return this.getInheritedStyleAttribute_(cueElement, styles, attribute);
  938.   }
  940.   /**
  941.    * Finds a specified attribute on an element's styles and the styles those
  942.    * styles inherit from.
  943.    *
  944.    * @param {!shaka.extern.xml.Node} element
  945.    * @param {!Array<!shaka.extern.xml.Node>} styles
  946.    * @param {string} attribute
  947.    * @return {?string}
  948.    * @private
  949.    */
  950.   getInheritedStyleAttribute_(element, styles, attribute) {
  951.     const TXml = shaka.util.TXml;
  952.     const ttsNs = shaka.text.TtmlTextParser.styleNs_;
  953.     const ebuttsNs = shaka.text.TtmlTextParser.styleEbuttsNs_;
  955.     const inheritedStyles = this.getElementsFromCollection_(
  956.         element, 'style', styles, /* prefix= */ '');
  958.     let styleValue = null;
  960.     // The last value in our styles stack takes the precedence over the others
  961.     for (let i = 0; i < inheritedStyles.length; i++) {
  962.       // Check ebu namespace first.
  963.       let styleAttributeValue = TXml.getAttributeNS(
  964.           inheritedStyles[i],
  965.           ebuttsNs,
  966.           attribute);
  968.       if (!styleAttributeValue) {
  969.         // Fall back to tts namespace.
  970.         styleAttributeValue = TXml.getAttributeNSList(
  971.             inheritedStyles[i],
  972.             ttsNs,
  973.             attribute);
  974.       }
  976.       if (!styleAttributeValue) {
  977.         // Next, check inheritance.
  978.         // Styles can inherit from other styles, so traverse up that chain.
  979.         styleAttributeValue = this.getStyleAttributeFromElement_(
  980.             inheritedStyles[i], styles, attribute);
  981.       }
  983.       if (styleAttributeValue) {
  984.         styleValue = styleAttributeValue;
  985.       }
  986.     }
  988.     return styleValue;
  989.   }
  992.   /**
  993.    * Selects items from |collection| whose id matches |attributeName|
  994.    * from |element|.
  995.    *
  996.    * @param {shaka.extern.xml.Node} element
  997.    * @param {string} attributeName
  998.    * @param {!Array<shaka.extern.xml.Node>} collection
  999.    * @param {string} prefixName
  1000.    * @param {string=} nsName
  1001.    * @return {!Array<!shaka.extern.xml.Node>}
  1002.    * @private
  1003.    */
  1004.   getElementsFromCollection_(
  1005.       element, attributeName, collection, prefixName, nsName) {
  1006.     const items = [];
  1008.     if (!element || collection.length < 1) {
  1009.       return items;
  1010.     }
  1012.     const attributeValue = this.getInheritedAttribute_(
  1013.         element, attributeName, nsName);
  1015.     if (attributeValue) {
  1016.       // There could be multiple items in one attribute
  1017.       // <span style="style1 style2">A cue</span>
  1018.       const itemNames = attributeValue.split(' ');
  1020.       for (const name of itemNames) {
  1021.         for (const item of collection) {
  1022.           if ((prefixName + item.attributes['xml:id']) == name) {
  1023.             items.push(item);
  1024.             break;
  1025.           }
  1026.         }
  1027.       }
  1028.     }
  1030.     return items;
  1031.   }
  1034.   /**
  1035.    * Traverses upwards from a given node until a given attribute is found.
  1036.    *
  1037.    * @param {!shaka.extern.xml.Node} element
  1038.    * @param {string} attributeName
  1039.    * @param {string=} nsName
  1040.    * @return {?string}
  1041.    * @private
  1042.    */
  1043.   getInheritedAttribute_(element, attributeName, nsName) {
  1044.     let ret = null;
  1045.     const TXml = shaka.util.TXml;
  1046.     while (!ret) {
  1047.       ret = nsName ?
  1048.           TXml.getAttributeNS(element, nsName, attributeName) :
  1049.           element.attributes[attributeName];
  1050.       if (ret) {
  1051.         break;
  1052.       }
  1054.       // Element.parentNode can lead to XMLDocument, which is not an Element and
  1055.       // has no getAttribute().
  1056.       const parentNode = element.parent;
  1057.       if (parentNode) {
  1058.         element = parentNode;
  1059.       } else {
  1060.         break;
  1061.       }
  1062.     }
  1063.     return ret;
  1064.   }
  1066.   /**
  1067.    * Factor parent/ancestor time attributes into the parsed time of a
  1068.    * child/descendent.
  1069.    *
  1070.    * @param {!shaka.extern.xml.Node} parentElement
  1071.    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1072.    * @param {?number} start The child's start time
  1073.    * @param {?number} end The child's end time
  1074.    * @return {{start: ?number, end: ?number}}
  1075.    * @private
  1076.    */
  1077.   resolveTime_(parentElement, rateInfo, start, end) {
  1078.     const parentTime = this.parseTime_(parentElement, rateInfo);
  1080.     if (start == null) {
  1081.       // No start time of your own?  Inherit from the parent.
  1082.       start = parentTime.start;
  1083.     } else {
  1084.       // Otherwise, the start time is relative to the parent's start time.
  1085.       if (parentTime.start != null) {
  1086.         start += parentTime.start;
  1087.       }
  1088.     }
  1090.     if (end == null) {
  1091.       // No end time of your own?  Inherit from the parent.
  1092.       end = parentTime.end;
  1093.     } else {
  1094.       // Otherwise, the end time is relative to the parent's _start_ time.
  1095.       // This is not a typo.  Both times are relative to the parent's _start_.
  1096.       if (parentTime.start != null) {
  1097.         end += parentTime.start;
  1098.       }
  1099.     }
  1101.     return {start, end};
  1102.   }
  1104.   /**
  1105.    * Parse TTML time attributes from the given element.
  1106.    *
  1107.    * @param {!shaka.extern.xml.Node} element
  1108.    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1109.    * @return {{start: ?number, end: ?number}}
  1110.    * @private
  1111.    */
  1112.   parseTime_(element, rateInfo) {
  1113.     const start = this.parseTimeAttribute_(
  1114.         element.attributes['begin'], rateInfo);
  1115.     let end = this.parseTimeAttribute_(
  1116.         element.attributes['end'], rateInfo);
  1117.     const duration = this.parseTimeAttribute_(
  1118.         element.attributes['dur'], rateInfo);
  1119.     if (end == null && duration != null) {
  1120.       end = start + duration;
  1121.     }
  1122.     return {start, end};
  1123.   }
  1125.   /**
  1126.    * Parses a TTML time from the given attribute text.
  1127.    *
  1128.    * @param {string} text
  1129.    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1130.    * @return {?number}
  1131.    * @private
  1132.    */
  1133.   parseTimeAttribute_(text, rateInfo) {
  1134.     let ret = null;
  1135.     const TtmlTextParser = shaka.text.TtmlTextParser;
  1137.     if (TtmlTextParser.timeColonFormatFrames_.test(text)) {
  1138.       ret = this.parseColonTimeWithFrames_(rateInfo, text);
  1139.     } else if (TtmlTextParser.timeColonFormat_.test(text)) {
  1140.       ret = this.parseTimeFromRegex_(TtmlTextParser.timeColonFormat_, text);
  1141.     } else if (TtmlTextParser.timeColonFormatMilliseconds_.test(text)) {
  1142.       ret = this.parseTimeFromRegex_(
  1143.           TtmlTextParser.timeColonFormatMilliseconds_, text);
  1144.     } else if (TtmlTextParser.timeFramesFormat_.test(text)) {
  1145.       ret = this.parseFramesTime_(rateInfo, text);
  1146.     } else if (TtmlTextParser.timeTickFormat_.test(text)) {
  1147.       ret = this.parseTickTime_(rateInfo, text);
  1148.     } else if (TtmlTextParser.timeHMSFormat_.test(text)) {
  1149.       ret = this.parseTimeFromRegex_(TtmlTextParser.timeHMSFormat_, text);
  1150.     } else if (text) {
  1151.       // It's not empty or null, but it doesn't match a known format.
  1152.       throw new shaka.util.Error(
  1153.           shaka.util.Error.Severity.CRITICAL,
  1154.           shaka.util.Error.Category.TEXT,
  1155.           shaka.util.Error.Code.INVALID_TEXT_CUE,
  1156.           'Could not parse cue time range in TTML');
  1157.     }
  1159.     return ret;
  1160.   }
  1162.   /**
  1163.    * Parses a TTML time in frame format.
  1164.    *
  1165.    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1166.    * @param {string} text
  1167.    * @return {?number}
  1168.    * @private
  1169.    */
  1170.   parseFramesTime_(rateInfo, text) {
  1171.     // 75f or 75.5f
  1172.     const results = shaka.text.TtmlTextParser.timeFramesFormat_.exec(text);
  1173.     const frames = Number(results[1]);
  1175.     return frames / rateInfo.frameRate;
  1176.   }
  1178.   /**
  1179.    * Parses a TTML time in tick format.
  1180.    *
  1181.    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1182.    * @param {string} text
  1183.    * @return {?number}
  1184.    * @private
  1185.    */
  1186.   parseTickTime_(rateInfo, text) {
  1187.     // 50t or 50.5t
  1188.     const results = shaka.text.TtmlTextParser.timeTickFormat_.exec(text);
  1189.     const ticks = Number(results[1]);
  1191.     return ticks / rateInfo.tickRate;
  1192.   }
  1194.   /**
  1195.    * Parses a TTML colon formatted time containing frames.
  1196.    *
  1197.    * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1198.    * @param {string} text
  1199.    * @return {?number}
  1200.    * @private
  1201.    */
  1202.   parseColonTimeWithFrames_(rateInfo, text) {
  1203.     // 01:02:43:07 ('07' is frames) or 01:02:43:07.1 (subframes)
  1204.     const results = shaka.text.TtmlTextParser.timeColonFormatFrames_.exec(text);
  1206.     const hours = Number(results[1]);
  1207.     const minutes = Number(results[2]);
  1208.     let seconds = Number(results[3]);
  1209.     let frames = Number(results[4]);
  1210.     const subframes = Number(results[5]) || 0;
  1212.     frames += subframes / rateInfo.subFrameRate;
  1213.     seconds += frames / rateInfo.frameRate;
  1215.     return seconds + (minutes * 60) + (hours * 3600);
  1216.   }
  1218.   /**
  1219.    * Parses a TTML time with a given regex. Expects regex to be some
  1220.    * sort of a time-matcher to match hours, minutes, seconds and milliseconds
  1221.    *
  1222.    * @param {!RegExp} regex
  1223.    * @param {string} text
  1224.    * @return {?number}
  1225.    * @private
  1226.    */
  1227.   parseTimeFromRegex_(regex, text) {
  1228.     const results = regex.exec(text);
  1229.     if (results == null || results[0] == '') {
  1230.       return null;
  1231.     }
  1232.     // This capture is optional, but will still be in the array as undefined,
  1233.     // in which case it is 0.
  1234.     const hours = Number(results[1]) || 0;
  1235.     const minutes = Number(results[2]) || 0;
  1236.     const seconds = Number(results[3]) || 0;
  1237.     const milliseconds = Number(results[4]) || 0;
  1239.     return (milliseconds / 1000) + seconds + (minutes * 60) + (hours * 3600);
  1240.   }
  1242.   /**
  1243.    * If ttp:cellResolution provided returns cell resolution info
  1244.    * with number of columns and rows into which the Root Container
  1245.    * Region area is divided
  1246.    *
  1247.    * @param {?string} cellResolution
  1248.    * @return {?{columns: number, rows: number}}
  1249.    * @private
  1250.    */
  1251.   getCellResolution_(cellResolution) {
  1252.     if (!cellResolution) {
  1253.       return null;
  1254.     }
  1255.     const matches = /^(\d+) (\d+)$/.exec(cellResolution);
  1257.     if (!matches) {
  1258.       return null;
  1259.     }
  1261.     const columns = parseInt(matches[1], 10);
  1262.     const rows = parseInt(matches[2], 10);
  1264.     return {columns, rows};
  1265.   }
  1266. };
  1268. /**
  1269.  * @summary
  1270.  * Contains information about frame/subframe rate
  1271.  * and frame rate multiplier for time in frame format.
  1272.  *
  1273.  * @example 01:02:03:04(4 frames) or 01:02:03:04.1(4 frames, 1 subframe)
  1274.  * @private
  1275.  */
  1276. shaka.text.TtmlTextParser.RateInfo_ = class {
  1277.   /**
  1278.    * @param {?string} frameRate
  1279.    * @param {?string} subFrameRate
  1280.    * @param {?string} frameRateMultiplier
  1281.    * @param {?string} tickRate
  1282.    */
  1283.   constructor(frameRate, subFrameRate, frameRateMultiplier, tickRate) {
  1284.     /**
  1285.      * @type {number}
  1286.      */
  1287.     this.frameRate = Number(frameRate) || 30;
  1289.     /**
  1290.      * @type {number}
  1291.      */
  1292.     this.subFrameRate = Number(subFrameRate) || 1;
  1294.     /**
  1295.      * @type {number}
  1296.      */
  1297.     this.tickRate = Number(tickRate);
  1298.     if (this.tickRate == 0) {
  1299.       if (frameRate) {
  1300.         this.tickRate = this.frameRate * this.subFrameRate;
  1301.       } else {
  1302.         this.tickRate = 1;
  1303.       }
  1304.     }
  1306.     if (frameRateMultiplier) {
  1307.       const multiplierResults = /^(\d+) (\d+)$/g.exec(frameRateMultiplier);
  1308.       if (multiplierResults) {
  1309.         const numerator = Number(multiplierResults[1]);
  1310.         const denominator = Number(multiplierResults[2]);
  1311.         const multiplierNum = numerator / denominator;
  1312.         this.frameRate *= multiplierNum;
  1313.       }
  1314.     }
  1315.   }
  1316. };
  1318. /**
  1319.  * @const
  1320.  * @private {!RegExp}
  1321.  * @example 50.17% 10%
  1322.  */
  1323. shaka.text.TtmlTextParser.percentValues_ =
  1324.     /^(\d{1,2}(?:\.\d+)?|100(?:\.0+)?)% (\d{1,2}(?:\.\d+)?|100(?:\.0+)?)%$/;
  1326. /**
  1327.  * @const
  1328.  * @private {!RegExp}
  1329.  * @example 0.6% 90% 300% 1000%
  1330.  */
  1331. shaka.text.TtmlTextParser.percentValue_ = /^(\d{1,4}(?:\.\d+)?|100)%$/;
  1333. /**
  1334.  * @const
  1335.  * @private {!RegExp}
  1336.  * @example 100px, 8em, 0.80c
  1337.  */
  1338. shaka.text.TtmlTextParser.unitValues_ = /^(\d+px|\d+em|\d*\.?\d+c)$/;
  1340. /**
  1341.  * @const
  1342.  * @private {!RegExp}
  1343.  * @example 100px
  1344.  */
  1345. shaka.text.TtmlTextParser.pixelValues_ = /^(\d+)px (\d+)px$/;
  1347. /**
  1348.  * @const
  1349.  * @private {!RegExp}
  1350.  * @example 00:00:40:07 (7 frames) or 00:00:40:07.1 (7 frames, 1 subframe)
  1351.  */
  1352. shaka.text.TtmlTextParser.timeColonFormatFrames_ =
  1353.     /^(\d{2,}):(\d{2}):(\d{2}):(\d{2})\.?(\d+)?$/;
  1355. /**
  1356.  * @const
  1357.  * @private {!RegExp}
  1358.  * @example 00:00:40 or 00:40
  1359.  */
  1360. shaka.text.TtmlTextParser.timeColonFormat_ = /^(?:(\d{2,}):)?(\d{2}):(\d{2})$/;
  1362. /**
  1363.  * @const
  1364.  * @private {!RegExp}
  1365.  * @example 01:02:43.0345555 or 02:43.03 or 02:45.5
  1366.  */
  1367. shaka.text.TtmlTextParser.timeColonFormatMilliseconds_ =
  1368.     /^(?:(\d{2,}):)?(\d{2}):(\d{2}\.\d+)$/;
  1370. /**
  1371.  * @const
  1372.  * @private {!RegExp}
  1373.  * @example 75f or 75.5f
  1374.  */
  1375. shaka.text.TtmlTextParser.timeFramesFormat_ = /^(\d*(?:\.\d*)?)f$/;
  1377. /**
  1378.  * @const
  1379.  * @private {!RegExp}
  1380.  * @example 50t or 50.5t
  1381.  */
  1382. shaka.text.TtmlTextParser.timeTickFormat_ = /^(\d*(?:\.\d*)?)t$/;
  1384. /**
  1385.  * @const
  1386.  * @private {!RegExp}
  1387.  * @example 3.45h, 3m or 4.20s
  1388.  */
  1389. shaka.text.TtmlTextParser.timeHMSFormat_ =
  1390.     new RegExp(['^(?:(\\d*(?:\\.\\d*)?)h)?',
  1391.       '(?:(\\d*(?:\\.\\d*)?)m)?',
  1392.       '(?:(\\d*(?:\\.\\d*)?)s)?',
  1393.       '(?:(\\d*(?:\\.\\d*)?)ms)?$'].join(''));
  1395. /**
  1396.  * @const
  1397.  * @private {!Map<string, shaka.text.Cue.lineAlign>}
  1398.  */
  1399. shaka.text.TtmlTextParser.textAlignToLineAlign_ = new Map()
  1400.     .set('left', shaka.text.Cue.lineAlign.START)
  1401.     .set('center', shaka.text.Cue.lineAlign.CENTER)
  1402.     .set('right', shaka.text.Cue.lineAlign.END)
  1403.     .set('start', shaka.text.Cue.lineAlign.START)
  1404.     .set('end', shaka.text.Cue.lineAlign.END);
  1406. /**
  1407.  * @const
  1408.  * @private {!Map<string, shaka.text.Cue.positionAlign>}
  1409.  */
  1410. shaka.text.TtmlTextParser.textAlignToPositionAlign_ = new Map()
  1411.     .set('left', shaka.text.Cue.positionAlign.LEFT)
  1412.     .set('center', shaka.text.Cue.positionAlign.CENTER)
  1413.     .set('right', shaka.text.Cue.positionAlign.RIGHT);
  1415. /**
  1416.  * The namespace URL for TTML parameters.  Can be assigned any name in the TTML
  1417.  * document, not just "ttp:", so we use this with getAttributeNS() to ensure
  1418.  * that we support arbitrary namespace names.
  1419.  *
  1420.  * @const {!Array<string>}
  1421.  * @private
  1422.  */
  1423. shaka.text.TtmlTextParser.parameterNs_ = [
  1424.   'http://www.w3.org/ns/ttml#parameter',
  1425.   'http://www.w3.org/2006/10/ttaf1#parameter',
  1426. ];
  1428. /**
  1429.  * The namespace URL for TTML styles.  Can be assigned any name in the TTML
  1430.  * document, not just "tts:", so we use this with getAttributeNS() to ensure
  1431.  * that we support arbitrary namespace names.
  1432.  *
  1433.  * @const {!Array<string>}
  1434.  * @private
  1435.  */
  1436. shaka.text.TtmlTextParser.styleNs_ = [
  1437.   'http://www.w3.org/ns/ttml#styling',
  1438.   'http://www.w3.org/2006/10/ttaf1#styling',
  1439. ];
  1441. /**
  1442.  * The namespace URL for EBU TTML styles.  Can be assigned any name in the TTML
  1443.  * document, not just "ebutts:", so we use this with getAttributeNS() to ensure
  1444.  * that we support arbitrary namespace names.
  1445.  *
  1446.  * @const {string}
  1447.  * @private
  1448.  */
  1449. shaka.text.TtmlTextParser.styleEbuttsNs_ = 'urn:ebu:tt:style';
  1451. /**
  1452.  * The supported namespace URLs for SMPTE fields.
  1453.  * @const {!Array<string>}
  1454.  * @private
  1455.  */
  1456. shaka.text.TtmlTextParser.smpteNsList_ = [
  1457.   'http://www.smpte-ra.org/schemas/2052-1/2010/smpte-tt',
  1458.   'http://www.smpte-ra.org/schemas/2052-1/2013/smpte-tt',
  1459. ];
  1461. shaka.text.TextEngine.registerParser(
  1462.     'application/ttml+xml', () => new shaka.text.TtmlTextParser());