Separate text parsing and display logic.

Closes #796.
Closes #923.

Change-Id: Ifc2017b40a0fb570103f0fed7bc130aa24819e9f

lib/text/ttml_text_parser.js

@@ -18,6 +18,7 @@
 goog.provide('shaka.text.TtmlTextParser');
 
 goog.require('goog.asserts');
+goog.require('shaka.text.Cue');
 goog.require('shaka.text.TextEngine');
 goog.require('shaka.util.Error');
 goog.require('shaka.util.StringUtils');
@@ -271,7 +272,7 @@ shaka.text.TtmlTextParser.addNewLines_ = function(element, whitespaceTrim) {
  * @param {!Array.<!Element>} styles
  * @param {!Array.<!Element>} regions
  * @param {boolean} whitespaceTrim
- * @return {TextTrackCue}
+ * @return {shaka.text.Cue}
  * @private
  */
 shaka.text.TtmlTextParser.parseCue_ = function(
@@ -310,9 +311,7 @@ shaka.text.TtmlTextParser.parseCue_ = function(
   start += offset;
   end += offset;
 
-  var cue = shaka.text.TextEngine.makeCue(start, end, payload);
-  if (!cue)
-    return null;
+  var cue = new shaka.text.Cue(start, end, payload);
 
   // Get other properties if available
   var region = shaka.text.TtmlTextParser.getElementFromCollection_(
@@ -326,7 +325,7 @@ shaka.text.TtmlTextParser.parseCue_ = function(
 /**
  * Adds applicable style properties to a cue.
  *
- * @param {!TextTrackCue} cue
+ * @param {!shaka.text.Cue} cue
  * @param {!Element} cueElement
  * @param {Element} region
  * @param {!Array.<!Element>} styles
@@ -335,8 +334,9 @@ shaka.text.TtmlTextParser.parseCue_ = function(
 shaka.text.TtmlTextParser.addStyle_ = function(
     cue, cueElement, region, styles) {
   var TtmlTextParser = shaka.text.TtmlTextParser;
-  var results = null;
+  var Cue = shaka.text.Cue;
 
+  var results = null;
 
   var extent = TtmlTextParser.getStyleAttribute_(
       cueElement, region, styles, 'tts:extent');
@@ -351,53 +351,77 @@ shaka.text.TtmlTextParser.addStyle_ = function(
 
   var writingMode = TtmlTextParser.getStyleAttribute_(
       cueElement, region, styles, 'tts:writingMode');
-  var isVerticalText = true;
   if (writingMode == 'tb' || writingMode == 'tblr')
-    cue.vertical = 'lr';
+    cue.writingDirection = Cue.writingDirection.VERTICAL_LEFT;
   else if (writingMode == 'tbrl')
-    cue.vertical = 'rl';
-  else
-    isVerticalText = false;
+    cue.writingDirection = Cue.writingDirection.VERTICAL_RIGHT;
 
   var origin = TtmlTextParser.getStyleAttribute_(
       cueElement, region, styles, 'tts:origin');
   if (origin) {
     results = TtmlTextParser.percentValues_.exec(origin);
     if (results != null) {
-      // for vertical text use first coordinate of tts:origin
-      // to represent line of the cue and second - for position.
-      // Otherwise (horizontal), use them the other way around.
-      if (isVerticalText) {
-        cue.position = Number(results[2]);
-        cue.line = Number(results[1]);
-      } else {
+      // for horizontal text use first coordinate of tts:origin
+      // to represent position of the cue and second - for line.
+      // Otherwise (vertical), use them the other way around.
+      if (cue.writingDirection == Cue.writingDirection.HORIZONTAL) {
         cue.position = Number(results[1]);
         cue.line = Number(results[2]);
+      } else {
+        cue.position = Number(results[2]);
+        cue.line = Number(results[1]);
       }
-      // A boolean indicating whether the line is an integer
-      // number of lines (using the line dimensions of the first
-      // line of the cue), or whether it is a percentage of the
-      // dimension of the video. The flag is set to true when lines
-      // are counted, and false otherwise.
-      cue.snapToLines = false;
+
+      cue.lineInterpretation = Cue.lineInterpretation.PERCENTAGE;
     }
   }
 
   var align = TtmlTextParser.getStyleAttribute_(
       cueElement, region, styles, 'tts:textAlign');
   if (align) {
-    cue.align = align;
-    if (align == 'center') {
-      if (cue.align != 'center') {
-        // Workaround for a Chrome bug http://crbug.com/663797
-        // Chrome does not support align = 'center'
-        cue.align = 'middle';
-      }
-      cue.position = 'auto';
-    }
     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!');
+
+    cue.textAlign = Cue.textAlign[align.toUpperCase()];
   }
+
+  var displayAlign = TtmlTextParser.getStyleAttribute_(
+      cueElement, region, styles, 'tts:displayAlign');
+  if (displayAlign) {
+    goog.asserts.assert(displayAlign.toUpperCase() in Cue.displayAlign,
+                        displayAlign.toUpperCase() +
+                        ' Should be in Cue.displayAlign values!');
+    cue.displayAlign = Cue.displayAlign[displayAlign.toUpperCase()];
+  }
+
+  var color = TtmlTextParser.getStyleAttribute_(
+      cueElement, region, styles, 'tts:color');
+  if (color)
+    cue.color = color;
+
+  var backgroundColor = TtmlTextParser.getStyleAttribute_(
+      cueElement, region, styles, 'tts:backgroundColor');
+  if (backgroundColor)
+    cue.backgroundColor = backgroundColor;
+
+  var fontFamily = TtmlTextParser.getStyleAttribute_(
+      cueElement, region, styles, 'tts:fontFamily');
+  if (fontFamily)
+    cue.fontFamily = fontFamily;
+
+  var fontWeight = TtmlTextParser.getStyleAttribute_(
+      cueElement, region, styles, 'tts:fontWeight');
+  if (fontWeight && fontWeight == 'bold')
+    cue.fontWeight = Cue.fontWeight.BOLD;
+
+  var wrapOption = TtmlTextParser.getStyleAttribute_(
+      cueElement, region, styles, 'tts:wrapOption');
+  if (wrapOption && wrapOption == 'noWrap')
+    cue.wrapLine = false;
 };