Bug 1338030 - regionCueStyleBox: implementation RegionCueStyleBox which correspong to "the children WebVTT region object". r=rillian
authorbechen@mozilla.com <bechen@mozilla.com>
Fri, 10 Nov 2017 11:40:53 +0800
changeset 444511 ff19950e47d9e9bd1971fea06ad9bafc3ce58a1d
parent 444510 4beea83e0858c03e72c84a8495e373eadbc12a9d
child 444512 a8075676dcb3808a683f2daa4e35c748fe550384
push id1618
push userCallek@gmail.com
push dateThu, 11 Jan 2018 17:45:48 +0000
treeherdermozilla-release@882ca853e05a [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersrillian
bugs1338030
milestone58.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1338030 - regionCueStyleBox: implementation RegionCueStyleBox which correspong to "the children WebVTT region object". r=rillian MozReview-Commit-ID: 2qwU1cYnI50
dom/media/webvtt/vtt.jsm
--- a/dom/media/webvtt/vtt.jsm
+++ b/dom/media/webvtt/vtt.jsm
@@ -630,16 +630,54 @@ const { XPCOMUtils } = require("resource
 
     this.div = window.document.createElement("div");
     this.div.id = region.id; // useless?
     this.applyStyles(regionNodeStyles);
   }
   RegionNodeBox.prototype = _objCreate(StyleBox.prototype);
   RegionNodeBox.prototype.constructor = RegionNodeBox;
 
+  function RegionCueStyleBox(window, cue) {
+    StyleBox.call(this);
+    this.cueDiv = parseContent(window, cue.text, PARSE_CONTENT_MODE.REGION_CUE);
+
+    var regionCueStyles = {
+      position: "relative",
+      writingMode: "horizontal-tb",
+      unicodeBidi: "plaintext",
+      width: "auto",
+      height: "auto",
+      textAlign: cue.align,
+    };
+    // TODO: fix me, LTR and RTL ? using margin replace the "left/right"
+    // 6.1.14.3.3
+    var offset = cue.computedPosition * cue.region.width / 100;
+    // 6.1.14.3.4
+    switch (cue.align) {
+      case "start":
+      case "left":
+        regionCueStyles.left = offset + "%";
+        regionCueStyles.right = "auto";
+        break;
+      case "end":
+      case "right":
+        regionCueStyles.left = "auto";
+        regionCueStyles.right = offset + "%";
+        break;
+      case "middle":
+        break;
+    }
+
+    this.div = window.document.createElement("div");
+    this.applyStyles(regionCueStyles);
+    this.div.appendChild(this.cueDiv);
+  }
+  RegionCueStyleBox.prototype = _objCreate(StyleBox.prototype);
+  RegionCueStyleBox.prototype.constructor = RegionCueStyleBox;
+
   // Represents the co-ordinates of an Element in a way that we can easily
   // compute things with such as if it overlaps or intersects with another Element.
   // Can initialize it with either a StyleBox or another BoxPosition.
   function BoxPosition(obj) {
     var isIE8 = (typeof navigator !== "undefined") &&
       (/MSIE\s8\.0/).test(navigator.userAgent);
 
     // Either a BoxPosition was passed in and we need to copy it, or a StyleBox