Source: lib/text/ttml_text_parser.js

  1. /**
  2.  * @license
  3.  * Copyright 2016 Google Inc.
  4.  *
  5.  * Licensed under the Apache License, Version 2.0 (the "License");
  6.  * you may not use this file except in compliance with the License.
  7.  * You may obtain a copy of the License at
  8.  *
  9.  *     http://www.apache.org/licenses/LICENSE-2.0
  10.  *
  11.  * Unless required by applicable law or agreed to in writing, software
  12.  * distributed under the License is distributed on an "AS IS" BASIS,
  13.  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14.  * See the License for the specific language governing permissions and
  15.  * limitations under the License.
  16.  */
  18. goog.provide('shaka.text.TtmlTextParser');
  20. goog.require('goog.asserts');
  21. goog.require('shaka.log');
  22. goog.require('shaka.text.Cue');
  23. goog.require('shaka.text.CueRegion');
  24. goog.require('shaka.text.TextEngine');
  25. goog.require('shaka.util.ArrayUtils');
  26. goog.require('shaka.util.Error');
  27. goog.require('shaka.util.StringUtils');
  28. goog.require('shaka.util.XmlUtils');
  31. /**
  32.  * @constructor
  33.  * @implements {shaka.extern.TextParser}
  34.  * @export
  35.  */
  36. shaka.text.TtmlTextParser = function() {};
  39. /**
  40.  * @const {string}
  41.  * @private
  42.  */
  43. shaka.text.TtmlTextParser.parameterNs_ = 'http://www.w3.org/ns/ttml#parameter';
  46. /**
  47.  * @const {string}
  48.  * @private
  49.  */
  50. shaka.text.TtmlTextParser.styleNs_ = 'http://www.w3.org/ns/ttml#styling';
  53. /**
  54.  * @override
  55.  * @export
  56.  */
  57. shaka.text.TtmlTextParser.prototype.parseInit = function(data) {
  58.   goog.asserts.assert(false, 'TTML does not have init segments');
  59. };
  62. /**
  63.  * @override
  64.  * @export
  65.  */
  66. shaka.text.TtmlTextParser.prototype.parseMedia = function(data, time) {
  67.   const TtmlTextParser = shaka.text.TtmlTextParser;
  68.   const XmlUtils = shaka.util.XmlUtils;
  69.   const ttpNs = TtmlTextParser.parameterNs_;
  70.   const ttsNs = TtmlTextParser.styleNs_;
  71.   let str = shaka.util.StringUtils.fromUTF8(data);
  72.   let ret = [];
  73.   let parser = new DOMParser();
  74.   let xml = null;
  76.     // dont try to parse empty string as
  77.     // DOMParser will not throw error but return an errored xml
  78.     if (str == '') {
  79.       return ret;
  80.     }
  82.   try {
  83.     xml = parser.parseFromString(str, 'text/xml');
  84.   } catch (exception) {
  85.     throw new shaka.util.Error(
  86.         shaka.util.Error.Severity.CRITICAL,
  87.         shaka.util.Error.Category.TEXT,
  88.           shaka.util.Error.Code.INVALID_XML,
  89.           'Failed to parse TTML.');
  90.   }
  92.   if (xml) {
  93.       const parserError = xml.getElementsByTagName('parsererror')[0];
  94.       if (parserError) {
  95.         throw new shaka.util.Error(
  96.             shaka.util.Error.Severity.CRITICAL,
  97.             shaka.util.Error.Category.TEXT,
  98.             shaka.util.Error.Code.INVALID_XML,
  99.             parserError.textContent);
  100.       }
  102.     // Try to get the framerate, subFrameRate and frameRateMultiplier
  103.     // if applicable
  104.     let frameRate = null;
  105.     let subFrameRate = null;
  106.     let frameRateMultiplier = null;
  107.     let tickRate = null;
  108.     let spaceStyle = null;
  109.     let extent = null;
  110.     let tts = xml.getElementsByTagName('tt');
  111.     let tt = tts[0];
  112.     // TTML should always have tt element.
  113.     if (!tt) {
  114.       throw new shaka.util.Error(
  115.           shaka.util.Error.Severity.CRITICAL,
  116.           shaka.util.Error.Category.TEXT,
  117.             shaka.util.Error.Code.INVALID_XML,
  118.             'TTML does not contain <tt> tag.');
  119.     } else {
  120.       frameRate = XmlUtils.getAttributeNS(tt, ttpNs, 'frameRate');
  121.       subFrameRate = XmlUtils.getAttributeNS(tt, ttpNs, 'subFrameRate');
  122.       frameRateMultiplier =
  123.           XmlUtils.getAttributeNS(tt, ttpNs, 'frameRateMultiplier');
  124.       tickRate = XmlUtils.getAttributeNS(tt, ttpNs, 'tickRate');
  125.       spaceStyle = tt.getAttribute('xml:space') || 'default';
  126.       extent = XmlUtils.getAttributeNS(tt, ttsNs, 'extent');
  127.     }
  129.     if (spaceStyle != 'default' && spaceStyle != 'preserve') {
  130.       throw new shaka.util.Error(
  131.           shaka.util.Error.Severity.CRITICAL,
  132.           shaka.util.Error.Category.TEXT,
  133.             shaka.util.Error.Code.INVALID_XML,
  134.             'Invalid xml:space value: ' + spaceStyle);
  135.     }
  136.     let whitespaceTrim = spaceStyle == 'default';
  138.     let rateInfo = new TtmlTextParser.RateInfo_(
  139.         frameRate, subFrameRate, frameRateMultiplier, tickRate);
  141.     const metadataElements = TtmlTextParser.getLeafNodes_(
  142.         tt.getElementsByTagName('metadata')[0]);
  143.     let styles = TtmlTextParser.getLeafNodes_(
  144.         tt.getElementsByTagName('styling')[0]);
  145.     let regionElements = TtmlTextParser.getLeafNodes_(
  146.         tt.getElementsByTagName('layout')[0]);
  147.     let cueRegions = [];
  148.     for (let i = 0; i < regionElements.length; i++) {
  149.       let cueRegion = TtmlTextParser.parseCueRegion_(
  150.           regionElements[i], styles, extent);
  151.       if (cueRegion) {
  152.         cueRegions.push(cueRegion);
  153.       }
  154.     }
  156.   const textNodes = TtmlTextParser.getLeafCues_(
  157.       tt.getElementsByTagName('body')[0]);
  158.   for (const node of textNodes) {
  159.     const cue = TtmlTextParser.parseCue_(
  160.         node, time.periodStart, rateInfo, metadataElements, styles,
  161.         regionElements, cueRegions, whitespaceTrim, false);
  162.       if (cue) {
  163.         ret.push(cue);
  164.       }
  165.     }
  166.   }
  168.   return ret;
  169. };
  172. /**
  173.  * @const
  174.  * @private {!RegExp}
  175.  * @example 50.17% 10%
  176.  */
  177. shaka.text.TtmlTextParser.percentValues_ =
  178.     /^(\d{1,2}(?:\.\d+)?|100(?:\.0+)?)% (\d{1,2}(?:\.\d+)?|100(?:\.0+)?)%$/;
  181. /**
  182.  * @const
  183.  * @private {!RegExp}
  184.  * @example 100px
  185.  */
  186. shaka.text.TtmlTextParser.unitValues_ = /^(\d+px|\d+em)$/;
  189. /**
  190.  * @const
  191.  * @private {!RegExp}
  192.  * @example 100px
  193.  */
  194. shaka.text.TtmlTextParser.pixelValues_ = /^(\d+)px (\d+)px$/;
  196. /**
  197.  * @const
  198.  * @private {!RegExp}
  199.  * @example 00:00:40:07 (7 frames) or 00:00:40:07.1 (7 frames, 1 subframe)
  200.  */
  201. shaka.text.TtmlTextParser.timeColonFormatFrames_ =
  202.     /^(\d{2,}):(\d{2}):(\d{2}):(\d{2})\.?(\d+)?$/;
  205. /**
  206.  * @const
  207.  * @private {!RegExp}
  208.  * @example 00:00:40 or 00:40
  209.  */
  210. shaka.text.TtmlTextParser.timeColonFormat_ = /^(?:(\d{2,}):)?(\d{2}):(\d{2})$/;
  213. /**
  214.  * @const
  215.  * @private {!RegExp}
  216.  * @example 01:02:43.0345555 or 02:43.03
  217.  */
  218. shaka.text.TtmlTextParser.timeColonFormatMilliseconds_ =
  219.     /^(?:(\d{2,}):)?(\d{2}):(\d{2}\.\d{2,})$/;
  222. /**
  223.  * @const
  224.  * @private {!RegExp}
  225.  * @example 75f or 75.5f
  226.  */
  227. shaka.text.TtmlTextParser.timeFramesFormat_ = /^(\d*(?:\.\d*)?)f$/;
  230. /**
  231.  * @const
  232.  * @private {!RegExp}
  233.  * @example 50t or 50.5t
  234.  */
  235. shaka.text.TtmlTextParser.timeTickFormat_ = /^(\d*(?:\.\d*)?)t$/;
  238. /**
  239.  * @const
  240.  * @private {!RegExp}
  241.  * @example 3.45h, 3m or 4.20s
  242.  */
  243. shaka.text.TtmlTextParser.timeHMSFormat_ =
  244.     new RegExp(['^(?:(\\d*(?:\\.\\d*)?)h)?',
  245.                 '(?:(\\d*(?:\\.\\d*)?)m)?',
  246.                 '(?:(\\d*(?:\\.\\d*)?)s)?',
  247.                 '(?:(\\d*(?:\\.\\d*)?)ms)?$'].join(''));
  250. /**
  251.  * @const
  252.  * @private {!Object.<string, shaka.text.Cue.lineAlign>}
  253.  */
  254. shaka.text.TtmlTextParser.textAlignToLineAlign_ = {
  255.   'left': shaka.text.Cue.lineAlign.START,
  256.   'center': shaka.text.Cue.lineAlign.CENTER,
  257.   'right': shaka.text.Cue.lineAlign.END,
  258.   'start': shaka.text.Cue.lineAlign.START,
  259.   'end': shaka.text.Cue.lineAlign.END,
  260. };
  263. /**
  264.  * @const
  265.  * @private {!Object.<string, shaka.text.Cue.positionAlign>}
  266.  */
  267. shaka.text.TtmlTextParser.textAlignToPositionAlign_ = {
  268.   'left': shaka.text.Cue.positionAlign.LEFT,
  269.   'center': shaka.text.Cue.positionAlign.CENTER,
  270.   'right': shaka.text.Cue.positionAlign.RIGHT,
  271. };
  274. /**
  275.  * Gets the leaf nodes of the xml node tree. Ignores the text, br elements
  276.  * and the spans positioned inside paragraphs
  277.  *
  278.  * @param {Element} element
  279.  * @return {!Array.<!Element>}
  280.  * @private
  281.  */
  282. shaka.text.TtmlTextParser.getLeafNodes_ = function(element) {
  283.   let result = [];
  284.   if (!element) {
  285.     return result;
  286.   }
  288.   for (const node of element.childNodes) {
  289.     if (
  290.       node.nodeType == Node.ELEMENT_NODE &&
  291.       node.nodeName !== 'br'
  292.     ) {
  293.       // Get the leaves the child might contain.
  294.       goog.asserts.assert(node instanceof Element,
  295.           'Node should be Element!');
  296.       const leafChildren = shaka.text.TtmlTextParser.getLeafNodes_(
  297.           /** @type {Element} */(node));
  298.       goog.asserts.assert(leafChildren.length > 0,
  299.                           'Only a null Element should return no leaves!');
  301.       result = result.concat(leafChildren);
  302.     }
  303.   }
  305.   // if no result at this point, the element itself must be a leaf.
  306.   if (!result.length) {
  307.     result.push(element);
  308.   }
  310.   return result;
  311. };
  314. /**
  315.  * Get the leaf nodes that can act as cues
  316.  * (at least begin attribute)
  317.  *
  318.  * @param {Element} element
  319.  * @return {!Array.<!Element>}
  320.  * @private
  321.  */
  322. shaka.text.TtmlTextParser.getLeafCues_ = function(element) {
  323.   if (!element) {
  324.     return [];
  325.   }
  327.   let ret = [];
  328.   // Recursively find any child elements that have a 'begin' attribute.
  329.   for (const child of element.childNodes) {
  330.     if (child instanceof Element) {
  331.       if (child.hasAttribute('begin')) {
  332.         ret.push(child);
  333.       } else {
  334.         ret = ret.concat(shaka.text.TtmlTextParser.getLeafCues_(child));
  335.       }
  336.     }
  337.   }
  338.   return ret;
  339. };
  342. /**
  343.  * Trims and removes multiple spaces from a string
  344.  *
  345.  * @param {Element} element
  346.  * @param {boolean} whitespaceTrim
  347.  * @return {string}
  348.  * @private
  349.  */
  350. shaka.text.TtmlTextParser.sanitizeTextContent = function(
  351.     element, whitespaceTrim) {
  352.   let payload = '';
  354.   for (const node of element.childNodes) {
  355.     if (node.nodeName == 'br' && element.childNodes[0] !== node) {
  356.       payload += '\n';
  357.     } else if (node.childNodes && node.childNodes.length > 0) {
  358.       payload += shaka.text.TtmlTextParser.sanitizeTextContent(
  359.           /** @type {!Element} */ (node),
  360.           whitespaceTrim
  361.       );
  362.     } else if (whitespaceTrim) {
  363.       // Trim leading and trailing whitespace.
  364.       let trimmed = node.textContent.trim();
  365.       // Collapse multiple spaces into one.
  366.       trimmed = trimmed.replace(/\s+/g, ' ');
  368.       payload += trimmed;
  369.     } else {
  370.       payload += node.textContent;
  371.     }
  372.   }
  374.   return payload;
  375. };
  378. /**
  379.  * Parses an Element into a TextTrackCue or VTTCue.
  380.  *
  381.  * @param {!Element} cueElement
  382.  * @param {number} offset
  383.  * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  384.  * @param {!Array.<!Element>} metadataElements
  385.  * @param {!Array.<!Element>} styles
  386.  * @param {!Array.<!Element>} regionElements
  387.  * @param {!Array.<!shaka.text.CueRegion>} cueRegions
  388.  * @param {boolean} whitespaceTrim
  389.    * @param {boolean} isNested
  390.  * @return {shaka.text.Cue}
  391.  * @private
  392.  */
  393. shaka.text.TtmlTextParser.parseCue_ = function(
  394.     cueElement, offset, rateInfo, metadataElements, styles, regionElements,
  395.     cueRegions, whitespaceTrim, isNested) {
  396.   if (isNested && cueElement.nodeName == 'br') {
  397.     const cue = new shaka.text.Cue(0, 0, '');
  398.     cue.spacer = true;
  400.     return cue;
  401.   }
  403.     const isTextContentEmpty = /^[\s\n]*$/.test(cueElement.textContent);
  404.     const hasNoTimeAttributes = cueElement.nodeType == Node.ELEMENT_NODE &&
  405.         !cueElement.hasAttribute('begin') &&
  406.         !cueElement.hasAttribute('end');
  408.     if (
  409.       cueElement.nodeType != Node.ELEMENT_NODE ||
  410.       /* Disregards empty elements without time attributes nor content
  411.        * <p begin="..." smpte:backgroundImage="..." /> will go through,
  412.        *    as some information could be holded by its attributes
  413.        * <p />, <div></div> won't,
  414.        *    as they don't have means to be displayed into a playback sequence
  415.        */
  416.       (hasNoTimeAttributes && isTextContentEmpty) ||
  417.       /*
  418.        * Let nested cue without time attributes through:
  419.        *    time attributes are holded by its parent
  420.        */
  421.       (hasNoTimeAttributes && !isNested)
  422.     ) {
  423.     return null;
  424.   }
  426.   const spaceStyle = cueElement.getAttribute('xml:space') ||
  427.       (whitespaceTrim ? 'default' : 'preserve');
  428.   const localWhitespaceTrim = spaceStyle == 'default';
  430.   // Get time.
  431.   let start = shaka.text.TtmlTextParser.parseTime_(
  432.       cueElement.getAttribute('begin'), rateInfo);
  433.   let end = shaka.text.TtmlTextParser.parseTime_(
  434.       cueElement.getAttribute('end'), rateInfo);
  435.   let duration = shaka.text.TtmlTextParser.parseTime_(
  436.       cueElement.getAttribute('dur'), rateInfo);
  438.   if (end == null && duration != null) {
  439.     end = start + duration;
  440.   }
  442.     if (!isNested && (start == null || end == null)) {
  443.     throw new shaka.util.Error(
  444.         shaka.util.Error.Severity.CRITICAL,
  445.         shaka.util.Error.Category.TEXT,
  446.         shaka.util.Error.Code.INVALID_TEXT_CUE);
  447.   }
  449.   if (isNested && start == null) {
  450.     start = 0;
  451.   } else {
  452.     start += offset;
  453.   }
  455.   if (isNested && end == null) {
  456.     end = 0;
  457.   } else {
  458.     end += offset;
  459.   }
  461.   let payload = '';
  462.   const nestedCues = [];
  463.   // If one of the children is a text node with something other than whitespace
  464.   // in it, stop going down and write the payload.
  465.   if (
  466.     Array.from(cueElement.childNodes).find(
  467.         (childNode) => childNode.nodeType === Node.TEXT_NODE &&
  468.         /\S+/.test(childNode.textContent)
  469.     )
  470.   ) {
  471.     payload = shaka.text.TtmlTextParser.sanitizeTextContent(
  472.         cueElement,
  473.         localWhitespaceTrim);
  474.   } else {
  475.     for (const childNode of cueElement.childNodes) {
  476.       const nestedCue = shaka.text.TtmlTextParser.parseCue_(
  477.           /** @type {!Element} */ (childNode),
  478.           offset,
  479.           rateInfo,
  480.           metadataElements,
  481.           styles,
  482.           regionElements,
  483.           cueRegions,
  484.           localWhitespaceTrim,
  485.           /* isNested */ true);
  487.       if (nestedCue) {
  488.         // Set the start time and end time for the nested cues.
  489.         nestedCue.startTime = nestedCue.startTime || start;
  490.         nestedCue.endTime = nestedCue.endTime || end;
  491.         nestedCues.push(nestedCue);
  492.       }
  493.     }
  494.   }
  496.   const cue = new shaka.text.Cue(start, end, payload);
  497.   cue.nestedCues = nestedCues;
  499.   // Get other properties if available.
  500.   const regionElement = shaka.text.TtmlTextParser.getElementsFromCollection_(
  501.       cueElement, 'region', regionElements, /* prefix= */ '')[0];
  502.   if (regionElement && regionElement.getAttribute('xml:id')) {
  503.     const regionId = regionElement.getAttribute('xml:id');
  504.     cue.region = cueRegions.filter((region) => region.id == regionId)[0];
  505.   }
  506.   const imageElement = shaka.text.TtmlTextParser.getElementsFromCollection_(
  507.       cueElement, 'backgroundImage', metadataElements, '#',
  508.       shaka.text.TtmlTextParser.smpteNs_)[0];
  510.   shaka.text.TtmlTextParser.addStyle_(
  511.       cue,
  512.       cueElement,
  513.       regionElement,
  514.       imageElement,
  515.       styles);
  517.   return cue;
  518. };
  521. /**
  522.  * Parses an Element into a TextTrackCue or VTTCue.
  523.  *
  524.  * @param {!Element} regionElement
  525.  * @param {!Array.<!Element>} styles Defined in the top of tt  element and
  526.  * used principally for images.
  527.  * @param {?string} globalExtent
  528.  * @return {shaka.text.CueRegion}
  529.  * @private
  530.  */
  531. shaka.text.TtmlTextParser.parseCueRegion_ = function(regionElement, styles,
  532.   globalExtent) {
  533.   const TtmlTextParser = shaka.text.TtmlTextParser;
  534.   let region = new shaka.text.CueRegion();
  535.   let id = regionElement.getAttribute('xml:id');
  536.   if (!id) {
  537.     shaka.log.warning('TtmlTextParser parser encountered a region with ' +
  538.                       'no id. Region will be ignored.');
  539.     return null;
  540.   }
  541.   region.id = id;
  543.   let globalResults = null;
  544.   if (globalExtent) {
  545.     globalResults = TtmlTextParser.percentValues_.exec(globalExtent) ||
  546.       TtmlTextParser.pixelValues_.exec(globalExtent);
  547.   }
  548.   const globalWidth = globalResults ? Number(globalResults[1]) : null;
  549.   const globalHeight = globalResults ? Number(globalResults[2]) : null;
  551.   let results = null;
  552.   let percentage = null;
  553.   let extent = TtmlTextParser.getStyleAttributeFromRegion_(
  554.       regionElement, styles, 'extent');
  555.   if (extent) {
  556.     percentage = TtmlTextParser.percentValues_.exec(extent);
  557.     results = percentage || TtmlTextParser.pixelValues_.exec(extent);
  558.     if (results != null) {
  559.       if (globalWidth != null) {
  560.         region.width = Number(results[1]) * 100 / globalWidth;
  561.       } else {
  562.         region.width = Number(results[1]);
  563.       }
  564.       if (globalHeight != null) {
  565.         region.height = Number(results[2]) * 100 / globalHeight;
  566.       } else {
  567.         region.height = Number(results[2]);
  568.       }
  569.       region.widthUnits = percentage || globalWidth != null ?
  570.                          shaka.text.CueRegion.units.PERCENTAGE :
  571.                          shaka.text.CueRegion.units.PX;
  573.       region.heightUnits = percentage || globalHeight != null ?
  574.                          shaka.text.CueRegion.units.PERCENTAGE :
  575.                          shaka.text.CueRegion.units.PX;
  576.     }
  577.   }
  579.   let origin = TtmlTextParser.getStyleAttributeFromRegion_(
  580.       regionElement, styles, 'origin');
  581.   if (origin) {
  582.     percentage = TtmlTextParser.percentValues_.exec(origin);
  583.     results = percentage || TtmlTextParser.pixelValues_.exec(origin);
  584.     if (results != null) {
  585.       if (globalWidth != null) {
  586.         region.viewportAnchorX = Number(results[1]) * 100 / globalWidth;
  587.       } else {
  588.         region.viewportAnchorX = Number(results[1]);
  589.       }
  590.       if (globalHeight != null) {
  591.         region.viewportAnchorY = Number(results[2]) * 100 / globalHeight;
  592.       } else {
  593.         region.viewportAnchorY = Number(results[2]);
  594.       }
  595.       region.viewportAnchorUnits = percentage || globalWidth != null ?
  596.                 shaka.text.CueRegion.units.PERCENTAGE :
  597.                 shaka.text.CueRegion.units.PX;
  598.     }
  599.   }
  601.   return region;
  602. };
  604. /**
  605.  * Adds applicable style properties to a cue.
  606.  *
  607.  * @param {!shaka.text.Cue} cue
  608.  * @param {!Element} cueElement
  609.  * @param {Element} region
  610.  * @param {Element} imageElement
  611.  * @param {!Array.<!Element>} styles
  612.  * @private
  613.  */
  614. shaka.text.TtmlTextParser.addStyle_ = function(
  615.     cue, cueElement, region, imageElement, styles) {
  616.   const TtmlTextParser = shaka.text.TtmlTextParser;
  617.   const Cue = shaka.text.Cue;
  619.   let direction = TtmlTextParser.getStyleAttribute_(
  620.       cueElement, region, styles, 'direction');
  621.   if (direction == 'rtl') {
  622.     cue.direction = Cue.direction.HORIZONTAL_RIGHT_TO_LEFT;
  623.   }
  625.   // Direction attribute specifies one-dimentional writing direction
  626.   // (left to right or right to left). Writing mode specifies that
  627.   // plus whether text is vertical or horizontal.
  628.   // They should not contradict each other. If they do, we give
  629.   // preference to writing mode.
  630.   let writingMode = TtmlTextParser.getStyleAttribute_(
  631.       cueElement, region, styles, 'writingMode');
  632.   // Set cue's direction if the text is horizontal, and cue's writingMode if
  633.   // it's vertical.
  634.   if (writingMode == 'tb' || writingMode == 'tblr') {
  635.     cue.writingMode = Cue.writingMode.VERTICAL_LEFT_TO_RIGHT;
  636.   } else if (writingMode == 'tbrl') {
  637.     cue.writingMode = Cue.writingMode.VERTICAL_RIGHT_TO_LEFT;
  638.   } else if (writingMode == 'rltb' || writingMode == 'rl') {
  639.     cue.direction = Cue.direction.HORIZONTAL_RIGHT_TO_LEFT;
  640.   } else if (writingMode) {
  641.     cue.direction = Cue.direction.HORIZONTAL_LEFT_TO_RIGHT;
  642.   }
  644.   let align = TtmlTextParser.getStyleAttribute_(
  645.       cueElement, region, styles, 'textAlign');
  646.   if (align) {
  647.     cue.positionAlign = TtmlTextParser.textAlignToPositionAlign_[align];
  648.     cue.lineAlign = TtmlTextParser.textAlignToLineAlign_[align];
  650.     goog.asserts.assert(align.toUpperCase() in Cue.textAlign,
  651.                         align.toUpperCase() +
  652.                         ' Should be in Cue.textAlign values!');
  654.     cue.textAlign = Cue.textAlign[align.toUpperCase()];
  655.   } else {
  656.     // Default value is START: https://bit.ly/32OGmvo
  657.     cue.textAlign = Cue.textAlign.START;
  658.   }
  660.   let displayAlign = TtmlTextParser.getStyleAttribute_(
  661.       cueElement, region, styles, 'displayAlign');
  662.   if (displayAlign) {
  663.     goog.asserts.assert(displayAlign.toUpperCase() in Cue.displayAlign,
  664.                         displayAlign.toUpperCase() +
  665.                         ' Should be in Cue.displayAlign values!');
  666.     cue.displayAlign = Cue.displayAlign[displayAlign.toUpperCase()];
  667.   }
  669.   let color = TtmlTextParser.getStyleAttribute_(
  670.       cueElement, region, styles, 'color');
  671.   if (color) {
  672.     cue.color = color;
  673.   }
  675.   let backgroundColor = TtmlTextParser.getStyleAttribute_(
  676.       cueElement, region, styles, 'backgroundColor');
  677.   if (backgroundColor) {
  678.     cue.backgroundColor = backgroundColor;
  679.   }
  681.   let fontFamily = TtmlTextParser.getStyleAttribute_(
  682.       cueElement, region, styles, 'fontFamily');
  683.   if (fontFamily) {
  684.     cue.fontFamily = fontFamily;
  685.   }
  687.   let fontWeight = TtmlTextParser.getStyleAttribute_(
  688.       cueElement, region, styles, 'fontWeight');
  689.   if (fontWeight && fontWeight == 'bold') {
  690.     cue.fontWeight = Cue.fontWeight.BOLD;
  691.   }
  693.   let wrapOption = TtmlTextParser.getStyleAttribute_(
  694.       cueElement, region, styles, 'wrapOption');
  695.   if (wrapOption && wrapOption == 'noWrap') {
  696.     cue.wrapLine = false;
  697.   }
  699.   let lineHeight = TtmlTextParser.getStyleAttribute_(
  700.       cueElement, region, styles, 'lineHeight');
  701.   if (lineHeight && lineHeight.match(TtmlTextParser.unitValues_)) {
  702.     cue.lineHeight = lineHeight;
  703.   }
  705.   let fontSize = TtmlTextParser.getStyleAttribute_(
  706.       cueElement, region, styles, 'fontSize');
  707.   if (fontSize && fontSize.match(TtmlTextParser.unitValues_)) {
  708.     cue.fontSize = fontSize;
  709.   }
  711.   let fontStyle = TtmlTextParser.getStyleAttribute_(
  712.       cueElement, region, styles, 'fontStyle');
  713.   if (fontStyle) {
  714.     goog.asserts.assert(fontStyle.toUpperCase() in Cue.fontStyle,
  715.                         fontStyle.toUpperCase() +
  716.                         ' Should be in Cue.fontStyle values!');
  717.     cue.fontStyle = Cue.fontStyle[fontStyle.toUpperCase()];
  718.   }
  720.   if (imageElement) {
  721.     // According to the spec, we should use imageType (camelCase), but
  722.     // historically we have checked for imagetype (lowercase).
  723.     // This was the case since background image support was first introduced
  724.     // in PR #1859, in April 2019, and first released in v2.5.0.
  725.     // Now we check for both, although only imageType (camelCase) is to spec.
  726.     const backgroundImageType =
  727.         imageElement.getAttribute('imageType') ||
  728.         imageElement.getAttribute('imagetype');
  729.     const backgroundImageEncoding = imageElement.getAttribute('encoding');
  730.     const backgroundImageData = imageElement.textContent.trim();
  731.     if (backgroundImageType == 'PNG' &&
  732.         backgroundImageEncoding == 'Base64' &&
  733.         backgroundImageData) {
  734.       cue.backgroundImage = 'data:image/png;base64,' + backgroundImageData;
  735.     }
  736.   }
  738.   // Text decoration is an array of values which can come both from the
  739.   // element's style or be inherited from elements' parent nodes. All of those
  740.   // values should be applied as long as they don't contradict each other. If
  741.   // they do, elements' own style gets preference.
  742.   let textDecorationRegion = TtmlTextParser.getStyleAttributeFromRegion_(
  743.       region, styles, 'textDecoration');
  744.   if (textDecorationRegion) {
  745.     TtmlTextParser.addTextDecoration_(cue, textDecorationRegion);
  746.   }
  748.   let textDecorationElement = TtmlTextParser.getStyleAttributeFromElement_(
  749.       cueElement, styles, 'textDecoration');
  750.   if (textDecorationElement) {
  751.     TtmlTextParser.addTextDecoration_(cue, textDecorationElement);
  752.   }
  753. };
  756. /**
  757.  * Parses text decoration values and adds/removes them to/from the cue.
  758.  *
  759.  * @param {!shaka.text.Cue} cue
  760.  * @param {string} decoration
  761.  * @private
  762.  */
  763. shaka.text.TtmlTextParser.addTextDecoration_ = function(cue, decoration) {
  764.   const Cue = shaka.text.Cue;
  765.   let values = decoration.split(' ');
  766.   for (let i = 0; i < values.length; i++) {
  767.     switch (values[i]) {
  768.       case 'underline':
  769.         if (!cue.textDecoration.includes(Cue.textDecoration.UNDERLINE)) {
  770.           cue.textDecoration.push(Cue.textDecoration.UNDERLINE);
  771.         }
  772.         break;
  773.       case 'noUnderline':
  774.         if (cue.textDecoration.includes(Cue.textDecoration.UNDERLINE)) {
  775.           shaka.util.ArrayUtils.remove(cue.textDecoration,
  776.                                        Cue.textDecoration.UNDERLINE);
  777.         }
  778.         break;
  779.       case 'lineThrough':
  780.         if (!cue.textDecoration.includes(Cue.textDecoration.LINE_THROUGH)) {
  781.           cue.textDecoration.push(Cue.textDecoration.LINE_THROUGH);
  782.         }
  783.         break;
  784.       case 'noLineThrough':
  785.         if (cue.textDecoration.includes(Cue.textDecoration.LINE_THROUGH)) {
  786.           shaka.util.ArrayUtils.remove(cue.textDecoration,
  787.                                        Cue.textDecoration.LINE_THROUGH);
  788.         }
  789.         break;
  790.       case 'overline':
  791.         if (!cue.textDecoration.includes(Cue.textDecoration.OVERLINE)) {
  792.           cue.textDecoration.push(Cue.textDecoration.OVERLINE);
  793.         }
  794.         break;
  795.       case 'noOverline':
  796.         if (cue.textDecoration.includes(Cue.textDecoration.OVERLINE)) {
  797.           shaka.util.ArrayUtils.remove(cue.textDecoration,
  798.                                        Cue.textDecoration.OVERLINE);
  799.         }
  800.         break;
  801.     }
  802.   }
  803. };
  806. /**
  807.  * Finds a specified attribute on either the original cue element or its
  808.  * associated region and returns the value if the attribute was found.
  809.  *
  810.  * @param {!Element} cueElement
  811.  * @param {Element} region
  812.  * @param {!Array.<!Element>} styles
  813.  * @param {string} attribute
  814.  * @return {?string}
  815.  * @private
  816.  */
  817. shaka.text.TtmlTextParser.getStyleAttribute_ = function(
  818.     cueElement, region, styles, attribute) {
  819.   // An attribute can be specified on region level or in a styling block
  820.   // associated with the region or original element.
  821.   const TtmlTextParser = shaka.text.TtmlTextParser;
  822.   let attr = TtmlTextParser.getStyleAttributeFromElement_(
  823.       cueElement, styles, attribute);
  824.   if (attr) {
  825.     return attr;
  826.   }
  828.   return TtmlTextParser.getStyleAttributeFromRegion_(
  829.       region, styles, attribute);
  830. };
  833. /**
  834.  * Finds a specified attribute on the element's associated region
  835.  * and returns the value if the attribute was found.
  836.  *
  837.  * @param {Element} region
  838.  * @param {!Array.<!Element>} styles
  839.  * @param {string} attribute
  840.  * @return {?string}
  841.  * @private
  842.  */
  843. shaka.text.TtmlTextParser.getStyleAttributeFromRegion_ = function(
  844.     region, styles, attribute) {
  845.   const XmlUtils = shaka.util.XmlUtils;
  846.   const ttsNs = shaka.text.TtmlTextParser.styleNs_;
  848.   if (!region) {
  849.     return null;
  850.   }
  852.   let regionChildren = shaka.text.TtmlTextParser.getLeafNodes_(region);
  853.   for (let i = 0; i < regionChildren.length; i++) {
  854.     let attr = XmlUtils.getAttributeNS(regionChildren[i], ttsNs, attribute);
  855.     if (attr) {
  856.       return attr;
  857.     }
  858.   }
  860.   return shaka.text.TtmlTextParser.getInheritedStyleAttribute_(
  861.       region, styles, attribute);
  862. };
  865. /**
  866.  * Finds a specified attribute on the cue element and returns the value
  867.  * if the attribute was found.
  868.  *
  869.  * @param {!Element} cueElement
  870.  * @param {!Array.<!Element>} styles
  871.  * @param {string} attribute
  872.  * @return {?string}
  873.  * @private
  874.  */
  875. shaka.text.TtmlTextParser.getStyleAttributeFromElement_ = function(
  876.     cueElement, styles, attribute) {
  877.   const XmlUtils = shaka.util.XmlUtils;
  878.   const ttsNs = shaka.text.TtmlTextParser.styleNs_;
  880.   // Styling on elements should take precedence
  881.   // over the main styling attributes
  882.   const elementAttribute = XmlUtils.getAttributeNS(
  883.       cueElement,
  884.       ttsNs,
  885.       attribute);
  887.   if (elementAttribute) {
  888.     return elementAttribute;
  889.   }
  891.   return shaka.text.TtmlTextParser.getInheritedStyleAttribute_(
  892.       cueElement, styles, attribute);
  893. };
  896. /**
  897.  * Finds a specified attribute on an element's styles and the styles those
  898.  * styles inherit from.
  899.  *
  900.  * @param {!Element} element
  901.  * @param {!Array.<!Element>} styles
  902.  * @param {string} attribute
  903.  * @return {?string}
  904.  * @private
  905.  */
  906. shaka.text.TtmlTextParser.getInheritedStyleAttribute_ = function(
  907.     element, styles, attribute) {
  908.   const XmlUtils = shaka.util.XmlUtils;
  909.   const ttsNs = shaka.text.TtmlTextParser.styleNs_;
  911.   const inheritedStyles = shaka.text.TtmlTextParser.getElementsFromCollection_(
  912.       element, 'style', styles, /* prefix= */ '');
  914.   let styleValue = null;
  916.   // The last value in our styles stack takes the precedence over the others
  917.   for (let i = 0; i < inheritedStyles.length; i++) {
  918.     let styleAttributeValue = XmlUtils.getAttributeNS(
  919.         inheritedStyles[i],
  920.         ttsNs,
  921.         attribute);
  923.     if (!styleAttributeValue) {
  924.       // Styles can inherit from other styles, so traverse up that chain.
  925.       styleAttributeValue =
  926.           shaka.text.TtmlTextParser.getStyleAttributeFromElement_(
  927.               inheritedStyles[i], styles, attribute);
  928.     }
  930.     if (styleAttributeValue) {
  931.       styleValue = styleAttributeValue;
  932.     }
  933.   }
  935.   return styleValue;
  936. };
  939. /**
  940.  * Selects items from |collection| whose id matches |attributeName|
  941.  * from |element|.
  942.  *
  943.  * @param {Element} element
  944.  * @param {string} attributeName
  945.  * @param {!Array.<Element>} collection
  946.  * @param {string} prefixName
  947.  * @param {string=} nsName
  948.  * @return {!Array.<!Element>}
  949.  * @private
  950.  */
  951. shaka.text.TtmlTextParser.getElementsFromCollection_ = function(
  952.     element, attributeName, collection, prefixName, nsName) {
  953.   const items = [];
  955.   if (!element || collection.length < 1) {
  956.     return items;
  957.   }
  959.   const attributeValue = shaka.text.TtmlTextParser.getInheritedAttribute_(
  960.       element, attributeName, nsName);
  962.   if (attributeValue) {
  963.     // There could be multiple items in one attribute
  964.     // <span style="style1 style2">A cue</span>
  965.     const itemNames = attributeValue.split(' ');
  967.     for (const name of itemNames) {
  968.       for (const item of collection) {
  969.         if ((prefixName + item.getAttribute('xml:id')) == name) {
  970.           items.push(item);
  971.           break;
  972.         }
  973.       }
  974.     }
  975.   }
  977.   return items;
  978. };
  981. /**
  982.  * Traverses upwards from a given node until a given attribute is found.
  983.  *
  984.  * @param {!Element} element
  985.  * @param {string} attributeName
  986.  * @param {string=} nsName
  987.  * @return {?string}
  988.  * @private
  989.  */
  990. shaka.text.TtmlTextParser.getInheritedAttribute_ = function(
  991.     element, attributeName, nsName) {
  992.   let ret = null;
  993.   const XmlUtils = shaka.util.XmlUtils;
  994.   while (element) {
  995.     ret = nsName ? XmlUtils.getAttributeNS(element, nsName, attributeName)
  996.                  : element.getAttribute(attributeName);
  997.     if (ret) {
  998.       break;
  999.     }
  1001.     // Element.parentNode can lead to XMLDocument, which is not an Element and
  1002.     // has no getAttribute().
  1003.     let parentNode = element.parentNode;
  1004.     if (parentNode instanceof Element) {
  1005.       element = parentNode;
  1006.     } else {
  1007.       break;
  1008.     }
  1009.   }
  1010.   return ret;
  1011. };
  1014. /**
  1015.  * Parses a TTML time from the given word.
  1016.  *
  1017.  * @param {string} text
  1018.  * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1019.  * @return {?number}
  1020.  * @private
  1021.  */
  1022. shaka.text.TtmlTextParser.parseTime_ = function(text, rateInfo) {
  1023.   let ret = null;
  1024.   const TtmlTextParser = shaka.text.TtmlTextParser;
  1026.   if (TtmlTextParser.timeColonFormatFrames_.test(text)) {
  1027.     ret = TtmlTextParser.parseColonTimeWithFrames_(rateInfo, text);
  1028.   } else if (TtmlTextParser.timeColonFormat_.test(text)) {
  1029.     ret = TtmlTextParser.parseTimeFromRegex_(
  1030.         TtmlTextParser.timeColonFormat_, text);
  1031.   } else if (TtmlTextParser.timeColonFormatMilliseconds_.test(text)) {
  1032.     ret = TtmlTextParser.parseTimeFromRegex_(
  1033.         TtmlTextParser.timeColonFormatMilliseconds_, text);
  1034.   } else if (TtmlTextParser.timeFramesFormat_.test(text)) {
  1035.     ret = TtmlTextParser.parseFramesTime_(rateInfo, text);
  1036.   } else if (TtmlTextParser.timeTickFormat_.test(text)) {
  1037.     ret = TtmlTextParser.parseTickTime_(rateInfo, text);
  1038.   } else if (TtmlTextParser.timeHMSFormat_.test(text)) {
  1039.     ret = TtmlTextParser.parseTimeFromRegex_(
  1040.         TtmlTextParser.timeHMSFormat_, text);
  1041.   }
  1043.   return ret;
  1044. };
  1047. /**
  1048.  * Parses a TTML time in frame format.
  1049.  *
  1050.  * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1051.  * @param {string} text
  1052.  * @return {?number}
  1053.  * @private
  1054.  */
  1055. shaka.text.TtmlTextParser.parseFramesTime_ = function(rateInfo, text) {
  1056.   // 75f or 75.5f
  1057.   let results = shaka.text.TtmlTextParser.timeFramesFormat_.exec(text);
  1058.   let frames = Number(results[1]);
  1060.   return frames / rateInfo.frameRate;
  1061. };
  1064. /**
  1065.  * Parses a TTML time in tick format.
  1066.  *
  1067.  * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1068.  * @param {string} text
  1069.  * @return {?number}
  1070.  * @private
  1071.  */
  1072. shaka.text.TtmlTextParser.parseTickTime_ = function(rateInfo, text) {
  1073.   // 50t or 50.5t
  1074.   let results = shaka.text.TtmlTextParser.timeTickFormat_.exec(text);
  1075.   let ticks = Number(results[1]);
  1077.   return ticks / rateInfo.tickRate;
  1078. };
  1081. /**
  1082.  * Parses a TTML colon formatted time containing frames.
  1083.  *
  1084.  * @param {!shaka.text.TtmlTextParser.RateInfo_} rateInfo
  1085.  * @param {string} text
  1086.  * @return {?number}
  1087.  * @private
  1088.  */
  1089. shaka.text.TtmlTextParser.parseColonTimeWithFrames_ = function(
  1090.     rateInfo, text) {
  1091.   // 01:02:43:07 ('07' is frames) or 01:02:43:07.1 (subframes)
  1092.   let results = shaka.text.TtmlTextParser.timeColonFormatFrames_.exec(text);
  1094.   let hours = Number(results[1]);
  1095.   let minutes = Number(results[2]);
  1096.   let seconds = Number(results[3]);
  1097.   let frames = Number(results[4]);
  1098.   let subframes = Number(results[5]) || 0;
  1100.   frames += subframes / rateInfo.subFrameRate;
  1101.   seconds += frames / rateInfo.frameRate;
  1103.   return seconds + (minutes * 60) + (hours * 3600);
  1104. };
  1107. /**
  1108.  * Parses a TTML time with a given regex. Expects regex to be some
  1109.  * sort of a time-matcher to match hours, minutes, seconds and milliseconds
  1110.  *
  1111.  * @param {!RegExp} regex
  1112.  * @param {string} text
  1113.  * @return {?number}
  1114.  * @private
  1115.  */
  1116. shaka.text.TtmlTextParser.parseTimeFromRegex_ = function(regex, text) {
  1117.   let results = regex.exec(text);
  1118.   if (results == null || results[0] == '') {
  1119.     return null;
  1120.   }
  1121.   // This capture is optional, but will still be in the array as undefined,
  1122.   // in which case it is 0.
  1123.   let hours = Number(results[1]) || 0;
  1124.   let minutes = Number(results[2]) || 0;
  1125.   let seconds = Number(results[3]) || 0;
  1126.   let miliseconds = Number(results[4]) || 0;
  1128.   return (miliseconds / 1000) + seconds + (minutes * 60) + (hours * 3600);
  1129. };
  1132. /**
  1133.  * Contains information about frame/subframe rate
  1134.  * and frame rate multiplier for time in frame format.
  1135.  *
  1136.  * @example 01:02:03:04(4 frames) or 01:02:03:04.1(4 frames, 1 subframe)
  1137.  * @param {?string} frameRate
  1138.  * @param {?string} subFrameRate
  1139.  * @param {?string} frameRateMultiplier
  1140.  * @param {?string} tickRate
  1141.  * @constructor
  1142.  * @struct
  1143.  * @private
  1144.  */
  1145. shaka.text.TtmlTextParser.RateInfo_ = function(
  1146.     frameRate, subFrameRate, frameRateMultiplier, tickRate) {
  1147.   /**
  1148.    * @type {number}
  1149.    */
  1150.   this.frameRate = Number(frameRate) || 30;
  1152.   /**
  1153.    * @type {number}
  1154.    */
  1155.   this.subFrameRate = Number(subFrameRate) || 1;
  1157.   /**
  1158.    * @type {number}
  1159.    */
  1160.   this.tickRate = Number(tickRate);
  1161.   if (this.tickRate == 0) {
  1162.     if (frameRate) {
  1163.       this.tickRate = this.frameRate * this.subFrameRate;
  1164.     } else {
  1165.       this.tickRate = 1;
  1166.     }
  1167.   }
  1169.   if (frameRateMultiplier) {
  1170.     const multiplierResults = /^(\d+) (\d+)$/g.exec(frameRateMultiplier);
  1171.     if (multiplierResults) {
  1172.       const numerator = Number(multiplierResults[1]);
  1173.       const denominator = Number(multiplierResults[2]);
  1174.       const multiplierNum = numerator / denominator;
  1175.       this.frameRate *= multiplierNum;
  1176.     }
  1177.   }
  1178. };
  1181. /**
  1182.  * The namespace URL for SMPTE fields.
  1183.  * @const {string}
  1184.  * @private
  1185.  */
  1186. shaka.text.TtmlTextParser.smpteNs_ =
  1187.     'http://www.smpte-ra.org/schemas/2052-1/2010/smpte-tt';
  1190. shaka.text.TextEngine.registerParser(
  1191.     'application/ttml+xml',
  1192.     shaka.text.TtmlTextParser);