running tests and renamed children into nestedCues

Author: valotvince

AUTHORS

@@ -51,3 +51,4 @@ Tomas Tichy <mr.tichyt@gmail.com>
 Toshihiro Suzuki <t.suzuki326@gmail.com>
 uStudio Inc. <*@ustudio.com>
 Verizon Digital Media Services <*@verizondigitalmedia.com>
+Vincent Valot <valot.vince@gmail.com>

CONTRIBUTORS

@@ -83,4 +83,5 @@ Torbjörn Einarsson <torbjorn.einarsson@edgeware.tv>
 Toshihiro Suzuki <t.suzuki326@gmail.com>
 Vasanth Polipelli <vasanthap@google.com>
 Vignesh Venkatasubramanian <vigneshv@google.com>
+Vincent Valot <valot.vince@gmail.com>
 Yohann Connell <robinconnell@google.com>

externs/shaka/text.js

@@ -316,6 +316,20 @@ shaka.extern.Cue = class {
      * @exportDoc
      */
     this.id;
+
+    /**
+     * Nested cues
+     * @type {Array.<!shaka.extern.Cue>}
+     * @exportDoc
+     */
+    this.nestedCues;
+
+    /**
+     * Whether or not the cue only acts as a spacer between two cues
+     * @type {boolean}
+     * @exportDoc
+     */
+    this.spacer;
   }
 };
 

lib/text/cue.js

@@ -187,7 +187,7 @@ shaka.text.Cue = class {
      * @override
      * @exportInterface
      */
-    this.children = [];
+    this.nestedCues = [];
 
     /**
      * @override

lib/text/simple_text_displayer.js

@@ -214,10 +214,6 @@ shaka.text.SimpleTextDisplayer = class {
       vttCue.position = shakaCue.position;
     }
 
-    if (shakaCue.color !== null) {
-      vttCue.text = `<c.${shakaCue.color}>${shakaCue.payload}</c>`;
-    }
-
     return vttCue;
   }
 

lib/text/ttml_text_parser.js

@@ -178,15 +178,15 @@ shaka.text.TtmlTextParser = class {
    * (begin and end attributes)
    *
    * @param {Element} element
-   * @return {!Array.<!Element>}
+   * @return {!NodeList.<!Element>|Array}
    * @private
    */
   static getLeafCues_(element) {
     if (!element) {
       return [];
     }
 
-    return Array.from(element.querySelectorAll('[begin][end]'));
+    return element.querySelectorAll('[begin][end]');
   }
 
 
@@ -254,7 +254,7 @@ shaka.text.TtmlTextParser = class {
     // If cueElement has neither time attributes, nor
     // non-whitespace text, don't try to make a cue out of it.
     if (
-      /^\s*$/.test(cueElement.textContent) ||
+      /^[\s\n]*$/.test(cueElement.textContent) ||
       (
         !isChild &&
         !cueElement.hasAttribute('begin') &&
@@ -272,12 +272,13 @@ shaka.text.TtmlTextParser = class {
     const duration = shaka.text.TtmlTextParser.parseTime_(
         cueElement.getAttribute('dur'), rateInfo);
     let payload = '';
-    const children = [];
+    const nestedCues = [];
     // If one of the children is text node type
     // stop going down and write the payload
     if (
       Array.from(cueElement.childNodes).find(
-          (childNode) => childNode.nodeType === Node.TEXT_NODE
+          (childNode) => childNode.nodeType === Node.TEXT_NODE &&
+          /\w+/.test(childNode.textContent)
       )
     ) {
       payload = shaka.text.TtmlTextParser.sanitizeTextContent(
@@ -300,7 +301,7 @@ shaka.text.TtmlTextParser = class {
         );
 
         if (childCue) {
-          children.push(childCue);
+          nestedCues.push(childCue);
         }
       }
     }
@@ -320,7 +321,7 @@ shaka.text.TtmlTextParser = class {
     end += offset;
 
     const cue = new shaka.text.Cue(start, end, payload);
-    cue.children = children;
+    cue.nestedCues = nestedCues;
 
     // Get other properties if available.
     const regionElement = shaka.text.TtmlTextParser.getElementFromCollection_(

test/text/ttml_text_parser_unit.js

@@ -43,21 +43,36 @@ describe('TtmlTextParser', () => {
     // When xml:space="default", ignore whitespace outside tags.
     verifyHelper(
         [
-          {start: 62.03, end: 62.05, payload: 'A B C'},
+          {
+            start: 62.03,
+            end: 62.05,
+            nestedCues: [{payload: 'A B C'}],
+            payload: '',
+          },
         ],
         '<tt xml:space="default">' + ttBody + '</tt>',
         {periodStart: 0, segmentStart: 0, segmentEnd: 0});
     // When xml:space="preserve", take them into account.
     verifyHelper(
         [
-          {start: 62.03, end: 62.05, payload: '\n       A    B   C  \n    '},
+          {
+            start: 62.03,
+            end: 62.05,
+            nestedCues: [{payload: '\n       A    B   C  \n    '}],
+            payload: '',
+          },
         ],
         '<tt xml:space="preserve">' + ttBody + '</tt>',
         {periodStart: 0, segmentStart: 0, segmentEnd: 0});
     // The default value for xml:space is "default".
     verifyHelper(
         [
-          {start: 62.03, end: 62.05, payload: 'A B C'},
+          {
+            start: 62.03,
+            end: 62.05,
+            nestedCues: [{payload: 'A B C'}],
+            payload: '',
+          },
         ],
         '<tt>' + ttBody + '</tt>',
         {periodStart: 0, segmentStart: 0, segmentEnd: 0});
@@ -78,6 +93,25 @@ describe('TtmlTextParser', () => {
         '<tt><body><p begin="3.45" end="1a"></p></body></tt>');
   });
 
+  it('supports spans as nestedCues of paragraphs', () => {
+    verifyHelper(
+        [
+          {
+            start: 62.05,
+            end: 3723.2,
+            payload: '',
+            nestedCues: [
+              {payload: 'First cue'},
+              {payload: '', spacer: true},
+              {payload: 'Second cuee'},
+            ],
+          },
+        ],
+        '<tt><body><p begin="01:02.05" end="01:02:03.200">' +
+        '<span>First cue</span><br /><span>Second cue</span></p></body></tt>',
+        {periodStart: 0, segmentStart: 0, segmentEnd: 0});
+  });
+
   it('supports colon formatted time', () => {
     verifyHelper(
         [
@@ -645,7 +679,12 @@ describe('TtmlTextParser', () => {
         {periodStart: 0, segmentStart: 0, segmentEnd: 0});
     verifyHelper(
         [
-          {start: 62.05, end: 3723.2, payload: 'Line1\nLine2'},
+          {
+            start: 62.05,
+            end: 3723.2,
+            nestedCues: [{payload: 'Line1\nLine2'}],
+            payload: '',
+          },
         ],
         '<tt><body><p begin="01:02.05" ' +
         'end="01:02:03.200"><span>Line1<br/>Line2</span></p></body></tt>',
@@ -801,32 +840,48 @@ describe('TtmlTextParser', () => {
     const result = new shaka.text.TtmlTextParser().parseMedia(data, time);
     const properties = ['textAlign', 'lineAlign', 'positionAlign', 'size',
       'line', 'position', 'direction', 'color', 'writingMode',
-      'backgroundColor', 'fontWeight', 'fontFamily',
+      'backgroundColor', 'fontWeight', 'fontFamily', 'spacer',
       'wrapLine', 'lineHeight', 'fontStyle', 'fontSize'];
     expect(result).toBeTruthy();
     expect(result.length).toBe(cues.length);
+
     for (let i = 0; i < cues.length; i++) {
-      expect(result[i].startTime).toBeCloseTo(cues[i].start, 3);
-      expect(result[i].endTime).toBeCloseTo(cues[i].end, 3);
-      expect(result[i].payload).toBe(cues[i].payload);
+      const cue = cues[i];
+      const resultCue = result[i];
+
+      expect(resultCue.startTime).toBeCloseTo(cue.start, 3);
+      expect(resultCue.endTime).toBeCloseTo(cue.end, 3);
+      expect(resultCue.payload).toBe(cue.payload);
 
-      if (cues[i].region) {
-        verifyRegion(cues[i].region, result[i].region);
+      if (cue.region) {
+        verifyRegion(cue.region, resultCue.region);
       }
 
-      const asObj = /** @type {!Object} */ (result[i]);
+      const asObj = /** @type {!Object} */ (resultCue);
       for (const property of properties) {
-        if (property in cues[i]) {
-          expect(asObj[property]).toEqual(cues[i][property]);
+        if (property in cue) {
+          expect(asObj[property]).toEqual(cue[property]);
         }
       }
 
-      if (cues[i].textDecoration) {
-        for (let j = 0; j < cues[i].textDecoration.length; j++) {
-          expect(/** @type {?} */ (result[i]).textDecoration[j])
-              .toBe(cues[i].textDecoration[j]);
+      if (cue.textDecoration) {
+        for (let j = 0; j < cue.textDecoration.length; j++) {
+          expect(/** @type {?} */ (resultCue).textDecoration[j])
+              .toBe(cue.textDecoration[j]);
         }
       }
+
+      const resultCueChildren = resultCue.nestedCues;
+      const expectedCueChildren = cue.nestedCues;
+
+      expect(resultCueChildren.length).toBe(expectedCueChildren);
+      for (let k = 0; k < expectedCueChildren.length; k++) {
+        const expectedCueChild = expectedCueChildren[k];
+        const resultCueChild = resultCueChildren[k];
+
+        expect(resultCueChild.payload).toBe(expectedCueChild.payload);
+        expect(resultCueChild.spacer).toBe(expectedCueChild.spacer);
+      }
     }
   }
 

ui/text_displayer.js

@@ -186,14 +186,14 @@ shaka.ui.TextDisplayer = class {
   }
 
   /**
-   * Displays children cues of a cue
+   * Displays a nested cue
    *
    * @param {Element} container
    * @param {!shaka.extern.Cue} cue
    * @returns {Element} the created captions container
    * @private
    */
-  displayChildrenCue_(container, cue) {
+  displayNestedCue_(container, cue) {
     const captions = shaka.util.Dom.createHTMLElement('span');
 
     if (cue.spacer) {
@@ -215,19 +215,19 @@ shaka.ui.TextDisplayer = class {
    * @private
    */
   displayCue_(container, cue) {
-    if (cue.children.length) {
-      const childrenContainer = shaka.util.Dom.createHTMLElement('p');
-      childrenContainer.style.width = '100%';
-      this.setCaptionStyles_(childrenContainer, cue);
+    if (cue.nestedCues.length) {
+      const nestedCuesContainer = shaka.util.Dom.createHTMLElement('p');
+      nestedCuesContainer.style.width = '100%';
+      this.setCaptionStyles_(nestedCuesContainer, cue);
 
-      for (let i = 0; i < cue.children.length; i++) {
-        this.displayChildrenCue_(childrenContainer, cue.children[i]);
+      for (let i = 0; i < cue.nestedCues.length; i++) {
+        this.displayNestedCue_(nestedCuesContainer, cue.nestedCues[i]);
       }
 
-      container.appendChild(childrenContainer);
-      this.currentCuesMap_.set(cue, childrenContainer);
+      container.appendChild(nestedCuesContainer);
+      this.currentCuesMap_.set(cue, nestedCuesContainer);
     } else {
-      this.currentCuesMap_.set(cue, this.displayChildrenCue_(container, cue));
+      this.currentCuesMap_.set(cue, this.displayNestedCue_(container, cue));
     }
   }