shaka-player 3.3.0 → 3.3.3

package/lib/text/ttml_text_parser.js

@@ -86,16 +86,17 @@ shaka.text.TtmlTextParser = class {
       }
 
       // Get the framerate, subFrameRate and frameRateMultiplier if applicable.
-      const frameRate = XmlUtils.getAttributeNS(tt, ttpNs, 'frameRate');
-      const subFrameRate = XmlUtils.getAttributeNS(tt, ttpNs, 'subFrameRate');
+      const frameRate = XmlUtils.getAttributeNSList(tt, ttpNs, 'frameRate');
+      const subFrameRate = XmlUtils.getAttributeNSList(
+          tt, ttpNs, 'subFrameRate');
       const frameRateMultiplier =
-          XmlUtils.getAttributeNS(tt, ttpNs, 'frameRateMultiplier');
-      const tickRate = XmlUtils.getAttributeNS(tt, ttpNs, 'tickRate');
+          XmlUtils.getAttributeNSList(tt, ttpNs, 'frameRateMultiplier');
+      const tickRate = XmlUtils.getAttributeNSList(tt, ttpNs, 'tickRate');
 
-      const cellResolution = XmlUtils.getAttributeNS(
+      const cellResolution = XmlUtils.getAttributeNSList(
           tt, ttpNs, 'cellResolution');
       const spaceStyle = tt.getAttribute('xml:space') || 'default';
-      const extent = XmlUtils.getAttributeNS(tt, ttsNs, 'extent');
+      const extent = XmlUtils.getAttributeNSList(tt, ttsNs, 'extent');
 
       if (spaceStyle != 'default' && spaceStyle != 'preserve') {
         throw new shaka.util.Error(
@@ -147,28 +148,15 @@ shaka.text.TtmlTextParser = class {
               shaka.util.Error.Code.INVALID_TEXT_CUE,
               '<span> can only be inside <p> in TTML');
         }
+      }
 
-        const pChildren = XmlUtils.findChildren(div, 'p');
-        if (pChildren && pChildren.length) {
-          for (const p of pChildren) {
-            const cue = TtmlTextParser.parseCue_(
-                p, time.periodStart, rateInfo, metadataElements, styles,
-                regionElements, cueRegions, whitespaceTrim,
-                /* isNested= */ false, cellResolutionInfo);
-            if (cue) {
-              cues.push(cue);
-            }
-          }
-        } else {
-          // Only used for parsing the background image
-          const cue = TtmlTextParser.parseCue_(
-              div, time.periodStart, rateInfo, metadataElements, styles,
-              regionElements, cueRegions, whitespaceTrim,
-              /* isNested= */ false, cellResolutionInfo);
-          if (cue) {
-            cues.push(cue);
-          }
-        }
+      const cue = TtmlTextParser.parseCue_(
+          body, time.periodStart, rateInfo, metadataElements, styles,
+          regionElements, cueRegions, whitespaceTrim,
+          cellResolutionInfo, /* parentCueElement= */ null,
+          /* isContent= */ false);
+      if (cue) {
+        cues.push(cue);
       }
     }
 
@@ -186,18 +174,19 @@ shaka.text.TtmlTextParser = class {
    * @param {!Array.<!Element>} regionElements
    * @param {!Array.<!shaka.text.CueRegion>} cueRegions
    * @param {boolean} whitespaceTrim
-   * @param {boolean} isNested
    * @param {?{columns: number, rows: number}} cellResolution
+   * @param {?Element} parentCueElement
+   * @param {boolean} isContent
    * @return {shaka.text.Cue}
    * @private
    */
   static parseCue_(
       cueNode, offset, rateInfo, metadataElements, styles, regionElements,
-      cueRegions, whitespaceTrim, isNested, cellResolution) {
+      cueRegions, whitespaceTrim, cellResolution, parentCueElement, isContent) {
     /** @type {Element} */
     let cueElement;
     /** @type {Element} */
-    let parentElement = /** @type {Element} */(cueNode.parentNode);
+    let parentElement = /** @type {Element} */ (cueNode.parentNode);
 
     if (cueNode.nodeType == Node.COMMENT_NODE) {
       // The comments do not contain information that interests us here.
@@ -205,6 +194,12 @@ shaka.text.TtmlTextParser = class {
     }
 
     if (cueNode.nodeType == Node.TEXT_NODE) {
+      if (!isContent) {
+        // Ignore text elements outside the content. For example, whitespace
+        // on the same lexical level as the <p> elements, in a document with
+        // xml:space="preserve", should not be renderer.
+        return null;
+      }
       // This should generate an "anonymous span" according to the TTML spec.
       // So pretend the element was a <span>.  parentElement was set above, so
       // we should still be able to correctly traverse up for timing
@@ -219,6 +214,21 @@ shaka.text.TtmlTextParser = class {
     }
     goog.asserts.assert(cueElement, 'cueElement should be non-null!');
 
+    let imageElement = null;
+    for (const nameSpace of shaka.text.TtmlTextParser.smpteNsList_) {
+      imageElement = shaka.text.TtmlTextParser.getElementsFromCollection_(
+          cueElement, 'backgroundImage', metadataElements, '#',
+          nameSpace)[0];
+      if (imageElement) {
+        break;
+      }
+    }
+
+    const parentIsContent = isContent;
+    if (cueNode.nodeName == 'p' || imageElement) {
+      isContent = true;
+    }
+
     const spaceStyle = cueElement.getAttribute('xml:space') ||
         (whitespaceTrim ? 'default' : 'preserve');
 
@@ -243,8 +253,9 @@ shaka.text.TtmlTextParser = class {
             regionElements,
             cueRegions,
             localWhitespaceTrim,
-            /* isNested= */ true,
             cellResolution,
+            cueElement,
+            isContent,
         );
 
         // This node may or may not generate a nested cue.
@@ -254,6 +265,8 @@ shaka.text.TtmlTextParser = class {
       }
     }
 
+    const isNested = /** @type {boolean} */ (parentCueElement != null);
+
     // In this regex, "\S" means "non-whitespace character".
     const hasTextContent = /\S/.test(cueElement.textContent);
     const hasTimeAttributes =
@@ -334,6 +347,13 @@ shaka.text.TtmlTextParser = class {
     const cue = new shaka.text.Cue(start, end, payload);
     cue.nestedCues = nestedCues;
 
+    if (!isContent) {
+      // If this is not a <p> element or a <div> with images, and it has no
+      // parent that was a <p> element, then it's part of the outer containers
+      // (e.g. the <body> or a normal <div> element within it).
+      cue.isContainer = true;
+    }
+
     if (cellResolution) {
       cue.cellResolution = cellResolution;
     }
@@ -341,31 +361,32 @@ shaka.text.TtmlTextParser = class {
     // Get other properties if available.
     const regionElement = shaka.text.TtmlTextParser.getElementsFromCollection_(
         cueElement, 'region', regionElements, /* prefix= */ '')[0];
-    if (regionElement && regionElement.getAttribute('xml:id')) {
-      const regionId = regionElement.getAttribute('xml:id');
-      cue.region = cueRegions.filter((region) => region.id == regionId)[0];
-    }
-
-    let imageElement = null;
-    for (const nameSpace of shaka.text.TtmlTextParser.smpteNsList_) {
-      imageElement = shaka.text.TtmlTextParser.getElementsFromCollection_(
-          cueElement, 'backgroundImage', metadataElements, '#',
-          nameSpace)[0];
-      if (imageElement) {
-        break;
+    // Do not actually apply that region unless it is non-inherited, though.
+    // This makes it so that, if a parent element has a region, the children
+    // don't also all independently apply the positioning of that region.
+    if (cueElement.hasAttribute('region')) {
+      if (regionElement && regionElement.getAttribute('xml:id')) {
+        const regionId = regionElement.getAttribute('xml:id');
+        cue.region = cueRegions.filter((region) => region.id == regionId)[0];
       }
     }
 
-    const isLeaf = nestedCues.length == 0;
+    let regionElementForStyle = regionElement;
+    if (parentCueElement && isNested && !cueElement.getAttribute('region') &&
+      !cueElement.getAttribute('style')) {
+      regionElementForStyle =
+          shaka.text.TtmlTextParser.getElementsFromCollection_(
+              parentCueElement, 'region', regionElements, /* prefix= */ '')[0];
+    }
 
     shaka.text.TtmlTextParser.addStyle_(
         cue,
         cueElement,
-        regionElement,
+        regionElementForStyle,
         imageElement,
         styles,
-        isNested,
-        isLeaf);
+        /** isNested= */ parentIsContent, // "nested in a <div>" doesn't count.
+        /** isLeaf= */ (nestedCues.length == 0));
 
     return cue;
   }
@@ -505,23 +526,24 @@ shaka.text.TtmlTextParser = class {
     }
 
     const align = TtmlTextParser.getStyleAttribute_(
-        cueElement, region, styles, 'textAlign', shouldInheritRegionStyles);
+        cueElement, region, styles, 'textAlign', true);
     if (align) {
       cue.positionAlign = TtmlTextParser.textAlignToPositionAlign_[align];
       cue.lineAlign = TtmlTextParser.textAlignToLineAlign_[align];
 
       goog.asserts.assert(align.toUpperCase() in Cue.textAlign,
-          align.toUpperCase() +
-                          ' Should be in Cue.textAlign values!');
+          align.toUpperCase() + ' Should be in Cue.textAlign values!');
 
       cue.textAlign = Cue.textAlign[align.toUpperCase()];
     } else {
-      // Default value is START: https://bit.ly/32OGmvo
-      cue.textAlign = Cue.textAlign.START;
+      // Default value is START in the TTML spec: https://bit.ly/32OGmvo
+      // But to make the subtitle render consitent with other players and the
+      // shaka.text.Cue we use CENTER
+      cue.textAlign = Cue.textAlign.CENTER;
     }
 
     const displayAlign = TtmlTextParser.getStyleAttribute_(
-        cueElement, region, styles, 'displayAlign', shouldInheritRegionStyles);
+        cueElement, region, styles, 'displayAlign', true);
     if (displayAlign) {
       goog.asserts.assert(displayAlign.toUpperCase() in Cue.displayAlign,
           displayAlign.toUpperCase() +
@@ -538,7 +560,7 @@ shaka.text.TtmlTextParser = class {
     // Background color should not be set on a container.  If this is a nested
     // cue, you can set the background.  If it's a top-level that happens to
     // also be a leaf, you can set the background.
-    // See https://github.com/google/shaka-player/issues/2623
+    // See https://github.com/shaka-project/shaka-player/issues/2623
     // This used to be handled in the displayer, but that is confusing.  The Cue
     // structure should reflect what you want to happen in the displayer, and
     // the displayer shouldn't have to know about TTML.
@@ -776,7 +798,7 @@ shaka.text.TtmlTextParser = class {
       return null;
     }
 
-    const attr = XmlUtils.getAttributeNS(region, ttsNs, attribute);
+    const attr = XmlUtils.getAttributeNSList(region, ttsNs, attribute);
     if (attr) {
       return attr;
     }
@@ -801,7 +823,7 @@ shaka.text.TtmlTextParser = class {
 
     // Styling on elements should take precedence
     // over the main styling attributes
-    const elementAttribute = XmlUtils.getAttributeNS(
+    const elementAttribute = XmlUtils.getAttributeNSList(
         cueElement,
         ttsNs,
         attribute);
@@ -844,7 +866,7 @@ shaka.text.TtmlTextParser = class {
 
       if (!styleAttributeValue) {
         // Fall back to tts namespace.
-        styleAttributeValue = XmlUtils.getAttributeNS(
+        styleAttributeValue = XmlUtils.getAttributeNSList(
             inheritedStyles[i],
             ttsNs,
             attribute);
@@ -922,8 +944,9 @@ shaka.text.TtmlTextParser = class {
     let ret = null;
     const XmlUtils = shaka.util.XmlUtils;
     while (element) {
-      ret = nsName ? XmlUtils.getAttributeNS(element, nsName, attributeName)
-                   : element.getAttribute(attributeName);
+      ret = nsName ?
+          XmlUtils.getAttributeNS(element, nsName, attributeName) :
+          element.getAttribute(attributeName);
       if (ret) {
         break;
       }
@@ -1299,20 +1322,26 @@ shaka.text.TtmlTextParser.textAlignToPositionAlign_ = {
  * document, not just "ttp:", so we use this with getAttributeNS() to ensure
  * that we support arbitrary namespace names.
  *
- * @const {string}
+ * @const {!Array.<string>}
  * @private
  */
-shaka.text.TtmlTextParser.parameterNs_ = 'http://www.w3.org/ns/ttml#parameter';
+shaka.text.TtmlTextParser.parameterNs_ = [
+  'http://www.w3.org/ns/ttml#parameter',
+  'http://www.w3.org/2006/10/ttaf1#parameter',
+];
 
 /**
  * The namespace URL for TTML styles.  Can be assigned any name in the TTML
  * document, not just "tts:", so we use this with getAttributeNS() to ensure
  * that we support arbitrary namespace names.
  *
- * @const {string}
+ * @const {!Array.<string>}
  * @private
  */
-shaka.text.TtmlTextParser.styleNs_ = 'http://www.w3.org/ns/ttml#styling';
+shaka.text.TtmlTextParser.styleNs_ = [
+  'http://www.w3.org/ns/ttml#styling',
+  'http://www.w3.org/2006/10/ttaf1#styling',
+];
 
 /**
  * The namespace URL for EBU TTML styles.  Can be assigned any name in the TTML

package/lib/text/ui_text_displayer.js

@@ -108,7 +108,7 @@ shaka.text.UITextDisplayer = class {
   append(cues) {
     // Clone the cues list for performace optimization. We can avoid the cues
     // list growing during the comparisons for duplicate cues.
-    // See: https://github.com/google/shaka-player/issues/3018
+    // See: https://github.com/shaka-project/shaka-player/issues/3018
     const cuesList = [...this.cues_];
     for (const cue of cues) {
       // When a VTT cue spans a segment boundary, the cue will be duplicated
@@ -352,19 +352,22 @@ shaka.text.UITextDisplayer = class {
       type = 'br';
     }
 
+    const needWrapper = !isNested && cue.nestedCues.length > 0;
+
     // Nested cues are inline elements.  Top-level cues are block elements.
     const cueElement = shaka.util.Dom.createHTMLElement(type);
     if (type != 'br') {
-      this.setCaptionStyles_(cueElement, cue, parents);
+      this.setCaptionStyles_(cueElement, cue, parents, needWrapper);
     }
 
     let wrapper = cueElement;
-    if (!isNested && cue.nestedCues.length) {
+    if (needWrapper) {
       // Create a wrapper element which will serve to contain all children into
       // a single item.  This ensures that nested span elements appear
       // horizontally and br elements occupy no vertical space.
       wrapper = shaka.util.Dom.createHTMLElement('span');
       wrapper.classList.add('shaka-text-wrapper');
+      wrapper.style.backgroundColor = cue.backgroundColor;
       cueElement.appendChild(wrapper);
     }
 
@@ -375,9 +378,10 @@ shaka.text.UITextDisplayer = class {
    * @param {!HTMLElement} cueElement
    * @param {!shaka.extern.Cue} cue
    * @param {!Array.<!shaka.extern.Cue>} parents
+   * @param {boolean} hasWrapper
    * @private
    */
-  setCaptionStyles_(cueElement, cue, parents) {
+  setCaptionStyles_(cueElement, cue, parents, hasWrapper) {
     const Cue = shaka.text.Cue;
     const inherit =
         (cb) => shaka.text.UITextDisplayer.inheritProperty_(parents, cb);
@@ -434,13 +438,15 @@ shaka.text.UITextDisplayer = class {
       if (cue.border) {
         elem.style.border = cue.border;
       }
-      const bgColor = inherit((c) => c.backgroundColor);
-      if (bgColor) {
-        elem.style.backgroundColor = bgColor;
-      } else if (text) {
-        // If there is no background, default to a semi-transparent black.
-        // Only do this for the text itself.
-        elem.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';
+      if (!hasWrapper) {
+        const bgColor = inherit((c) => c.backgroundColor);
+        if (bgColor) {
+          elem.style.backgroundColor = bgColor;
+        } else if (text) {
+          // If there is no background, default to a semi-transparent black.
+          // Only do this for the text itself.
+          elem.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';
+        }
       }
       if (text) {
         elem.textContent = text;
@@ -450,7 +456,7 @@ shaka.text.UITextDisplayer = class {
     // The displayAlign attribute specifies the vertical alignment of the
     // captions inside the text container. Before means at the top of the
     // text container, and after means at the bottom.
-    if (isNested) {
+    if (isNested && !parents[parents.length - 1].isContainer) {
       style.display = 'inline';
     } else {
       style.display = 'flex';

package/lib/util/buffer_utils.js

@@ -6,8 +6,6 @@
 
 goog.provide('shaka.util.BufferUtils');
 
-goog.require('shaka.util.Iterables');
-
 
 /**
  * @summary A set of BufferSource utility functions.
@@ -45,7 +43,7 @@ shaka.util.BufferUtils = class {
 
     const uint8A = shaka.util.BufferUtils.toUint8(arr1);
     const uint8B = shaka.util.BufferUtils.toUint8(arr2);
-    for (const i of shaka.util.Iterables.range(arr1.byteLength)) {
+    for (let i = 0; i < arr1.byteLength; i++) {
       if (uint8A[i] != uint8B[i]) {
         return false;
       }