Bug 974017 - Update vtt.js r=rillian.
authorRick Eyre <rick.eyre@hotmail.com>
Mon, 14 Apr 2014 07:57:00 +0200
changeset 178540 3abaf19dcbffc7076bfec2037210b0dbbe76f002
parent 178539 a62a1337c7658155699ce1aa571b7333afc5ed6f
child 178541 84f879f9cdc3563e3a600431ed882ea3a5d7789d
push id26590
push userryanvm@gmail.com
push dateTue, 15 Apr 2014 16:25:35 +0000
treeherdermozilla-central@1f932e462b84 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersrillian
bugs974017
milestone31.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 974017 - Update vtt.js r=rillian. This update contains the optimization for rendering cues with large line values. It also reverts the change to clamp parsed line values to between -1000 and 1000.
content/media/webvtt/vtt.jsm
--- a/content/media/webvtt/vtt.jsm
+++ b/content/media/webvtt/vtt.jsm
@@ -3,17 +3,17 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 this.EXPORTED_SYMBOLS = ["WebVTT"];
 
 /**
  * Code below is vtt.js the JS WebVTT implementation.
  * Current source code can be found at http://github.com/mozilla/vtt.js
  *
- * Code taken from commit 2edc263af6003d539eb2ce442d6102e5d8b75fb5
+ * Code taken from commit 65ae2daaf6ec7e710f591214893bb03d8b7a94b5
  */
 /**
  * Copyright 2013 vtt.js Contributors
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
  *
@@ -124,18 +124,17 @@ this.EXPORTED_SYMBOLS = ["WebVTT"];
           this.set(k, v);
           break;
         }
       }
     },
     // Accept a setting if its a valid (signed) integer.
     integer: function(k, v) {
       if (/^-?\d+$/.test(v)) { // integer
-        // Only take values in the range of -1000 ~ 1000
-        this.set(k, Math.min(Math.max(parseInt(v, 10), -1000), 1000));
+        this.set(k, parseInt(v, 10));
       }
     },
     // Accept a setting if its a valid percentage.
     percent: function(k, v) {
       var m;
       if ((m = v.match(/^([\d]{1,3})(\.[\d]*)?%$/))) {
         v = parseFloat(v);
         if (v >= 0 && v <= 100) {
@@ -805,18 +804,16 @@ this.EXPORTED_SYMBOLS = ["WebVTT"];
   }
   CueStyleBox.prototype = _objCreate(StyleBox.prototype);
   CueStyleBox.prototype.constructor = CueStyleBox;
 
   // 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 self = this;
-
     // Either a BoxPosition was passed in and we need to copy it, or a StyleBox
     // was passed in and we need to copy the results of 'getBoundingClientRect'
     // as the object returned is readonly. All co-ordinate values are in reference
     // to the viewport origin (top left).
     var lh;
     if (obj.div) {
       var rects = (rects = obj.div.childNodes) && (rects = rects[0]) &&
                   rects.getClientRects && rects.getClientRects();
@@ -832,36 +829,37 @@ this.EXPORTED_SYMBOLS = ["WebVTT"];
     this.right = obj.right;
     this.top = obj.top;
     this.height = obj.height;
     this.bottom = obj.bottom;
     this.width = obj.width;
     this.lineHeight = lh !== undefined ? lh : obj.lineHeight;
   }
 
-  // Move the box along a particular axis. If no amount to move is passed, via
-  // the val parameter, then the default amount is the line height of the box.
-  BoxPosition.prototype.move = function(axis, val) {
-    val = val !== undefined ? val : this.lineHeight;
+  // Move the box along a particular axis. Optionally pass in an amount to move
+  // the box. If no amount is passed then the default is the line height of the
+  // box.
+  BoxPosition.prototype.move = function(axis, toMove) {
+    toMove = toMove !== undefined ? toMove : this.lineHeight;
     switch (axis) {
     case "+x":
-      this.left += val;
-      this.right += val;
+      this.left += toMove;
+      this.right += toMove;
       break;
     case "-x":
-      this.left -= val;
-      this.right -= val;
+      this.left -= toMove;
+      this.right -= toMove;
       break;
     case "+y":
-      this.top += val;
-      this.bottom += val;
+      this.top += toMove;
+      this.bottom += toMove;
       break;
     case "-y":
-      this.top -= val;
-      this.bottom -= val;
+      this.top -= toMove;
+      this.bottom -= toMove;
       break;
     }
   };
 
   // Check if this box overlaps another box, b2.
   BoxPosition.prototype.overlaps = function(b2) {
     return this.left < b2.right &&
            this.right > b2.left &&
@@ -976,55 +974,64 @@ this.EXPORTED_SYMBOLS = ["WebVTT"];
           percentage = p;
         }
         // Reset the box position to the specified position.
         b = new BoxPosition(specifiedPosition);
       }
       return bestPosition || specifiedPosition;
     }
 
-    function reverseAxis(axis) {
-      return axis.map(function(a) {
-        return a.indexOf("+") !== -1 ? a.replace("+", "-") : a.replace("-", "+");
-      });
-    }
-
     var boxPosition = new BoxPosition(styleBox),
         cue = styleBox.cue,
         linePos = computeLinePos(cue),
         axis = [];
 
     // If we have a line number to align the cue to.
     if (cue.snapToLines) {
+      var size;
       switch (cue.vertical) {
       case "":
         axis = [ "+y", "-y" ];
+        size = "height";
         break;
       case "rl":
         axis = [ "+x", "-x" ];
+        size = "width";
         break;
       case "lr":
         axis = [ "-x", "+x" ];
+        size = "width";
         break;
       }
 
+      var step = boxPosition.lineHeight,
+          position = step * Math.round(linePos),
+          maxPosition = containerBox[size] + step,
+          initialAxis = axis[0];
+
+      // If the specified intial position is greater then the max position then
+      // clamp the box to the amount of steps it would take for the box to
+      // reach the max position.
+      if (Math.abs(position) > maxPosition) {
+        position = position < 0 ? -1 : 1;
+        position *= Math.ceil(maxPosition / step) * step;
+      }
+
       // If computed line position returns negative then line numbers are
       // relative to the bottom of the video instead of the top. Therefore, we
       // need to increase our initial position by the length or width of the
       // video, depending on the writing direction, and reverse our axis directions.
-      var initialPosition = boxPosition.lineHeight * Math.floor(linePos + 0.5),
-          initialAxis = axis[0];
       if (linePos < 0) {
-        initialPosition += cue.vertical === "" ? containerBox.height : containerBox.width;
-        axis = reverseAxis(axis);
+        position += cue.vertical === "" ? containerBox.height : containerBox.width;
+        axis = axis.reverse();
       }
 
       // Move the box to the specified position. This may not be its best
       // position.
-      boxPosition.move(initialAxis, initialPosition);
+      boxPosition.move(initialAxis, position);
 
     } else {
       // If we have a percentage line value for the cue.
       var calculatedPercentage = (boxPosition.lineHeight / containerBox.height) * 100;
 
       switch (cue.lineAlign) {
       case "middle":
         linePos -= (calculatedPercentage / 2);