Refactor interpolation

js/style/style_declaration.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var util = require('../util/util');
+var interpolate = require('../util/interpolate');
 var reference = require('./reference');
 var parseCSSColor = require('csscolorparser').parseCSSColor;
 
@@ -126,9 +126,9 @@ function interpolatedFunction(params, color) {
                     zoomProgress / zoomDiff :
                     (Math.pow(base, zoomProgress) - 1) / (Math.pow(base, zoomDiff) - 1);
 
-            if (color) return interpColor(parseColor(low[1]), parseColor(high[1]), t);
-            else if (low[1].length === 2) return interpVec2(low[1], high[1], t);
-            return util.interp(low[1], high[1], t);
+            if (color) return interpolate.color(parseColor(low[1]), parseColor(high[1]), t);
+            else if (low[1].length === 2) return interpolate.vec2(low[1], high[1], t);
+            return interpolate.number(low[1], high[1], t);
 
         } else if (low) {
             if (color) return parseColor(low[1]);
@@ -157,19 +157,3 @@ function parseColor(value) {
 function prepareColor(c) {
     return [c[0] / 255, c[1] / 255, c[2] / 255, c[3] / 1];
 }
-
-function interpColor(from, to, t) {
-    return [
-        util.interp(from[0], to[0], t),
-        util.interp(from[1], to[1], t),
-        util.interp(from[2], to[2], t),
-        util.interp(from[3], to[3], t)
-    ];
-}
-
-function interpVec2(from, to, t) {
-    return [
-        util.interp(from[0], to[0], t),
-        util.interp(from[1], to[1], t)
-    ];
-}

js/style/style_transition.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var util = require('../util/util');
+var interpolate = require('../util/interpolate');
 
 module.exports = StyleTransition;
 
@@ -13,14 +14,10 @@ function StyleTransition(declaration, oldTransition, value) {
     this.startTime = this.endTime = (new Date()).getTime();
 
     var type = declaration.type;
-    if (type === 'number') {
-        this.interp = util.interp;
-    } else if (type === 'color') {
-        this.interp = interpColor;
-    } else if ((type === 'string' || type === 'array') && declaration.transitionable) {
+    if ((type === 'string' || type === 'array') && declaration.transitionable) {
         this.interp = interpZoomTransitioned;
-    } else if (type === 'array') {
-        this.interp = interpNumberArray;
+    } else {
+        this.interp = interpolate[type];
     }
 
     this.oldTransition = oldTransition;
@@ -65,21 +62,6 @@ StyleTransition.prototype.at = function(z, zoomHistory, t) {
 
 };
 
-function interpNumberArray(from, to, t) {
-    return from.map(function(d, i) {
-        return util.interp(d, to[i], t);
-    });
-}
-
-function interpColor(from, to, t) {
-    return [
-        util.interp(from[0], to[0], t),
-        util.interp(from[1], to[1], t),
-        util.interp(from[2], to[2], t),
-        util.interp(from[3], to[3], t)
-    ];
-}
-
 function interpZoomTransitioned(from, to, t) {
     return {
         from: from.to,

js/symbol/interpolate.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var util = require('../util/util');
+var interp = require('../util/interpolate');
 var Anchor = require('../symbol/anchor');
 
 module.exports = interpolate;
@@ -41,8 +41,8 @@ function interpolate(vertices, spacing, minScale, maxScale, tilePixelRatio, star
             markedDistance += spacing;
 
             var t = (markedDistance - distance) / segmentDist,
-                x = util.interp(a.x, b.x, t),
-                y = util.interp(a.y, b.y, t),
+                x = interp(a.x, b.x, t),
+                y = interp(a.y, b.y, t),
                 s = minScales[added % len];
 
             if (x >= 0 && x < 4096 && y >= 0 && y < 4096) {

js/symbol/rotation_range.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var util = require('../util/util');
+var interpolate = require('../util/interpolate');
 var Point = require('point-geometry');
 
 module.exports = {
@@ -254,8 +254,8 @@ function circleEdgeCollisions(angles, corner, radius, p1, p2) {
 
 function getAngle(p1, p2, d, corner) {
     return (-corner.angleWithSep(
-        util.interp(p1.x, p2.x, d),
-        util.interp(p1.y, p2.y, d)) + 2 * Math.PI) % (2 * Math.PI);
+            interpolate(p1.x, p2.x, d),
+            interpolate(p1.y, p2.y, d)) + 2 * Math.PI) % (2 * Math.PI);
 }
 
 function getCorners(a) {

js/ui/easings.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var util = require('../util/util');
+var interpolate = require('../util/interpolate');
 var browser = require('../util/browser');
 var LatLng = require('../geo/lat_lng');
 var LatLngBounds = require('../geo/lat_lng_bounds');
@@ -97,7 +98,7 @@ util.extend(exports, {
         }
 
         this._ease(function(k) {
-            tr.setZoomAround(util.interp(startZoom, zoom, k), around);
+            tr.setZoomAround(interpolate(startZoom, zoom, k), around);
             this.animationLoop.set(300); // text fading
             this._move(true);
         }, function() {
@@ -152,7 +153,7 @@ util.extend(exports, {
         this.fire('movestart');
 
         this._ease(function(k) {
-            tr.setBearingAround(util.interp(start, bearing, k), around);
+            tr.setBearingAround(interpolate(start, bearing, k), around);
             this._move(false, true);
         }, function() {
             this.rotating = false;
@@ -226,13 +227,13 @@ util.extend(exports, {
 
         this._ease(function (k) {
             if (zoom !== startZoom) {
-                tr.setZoomAround(util.interp(startZoom, zoom, k), around);
+                tr.setZoomAround(interpolate(startZoom, zoom, k), around);
             } else {
                 tr.center = tr.unproject(from.add(to.sub(from).mult(k)));
             }
 
             if (bearing !== startBearing) {
-                tr.bearing = util.interp(startBearing, bearing, k);
+                tr.bearing = interpolate(startBearing, bearing, k);
             }
 
             this.animationLoop.set(300); // text fading
@@ -322,7 +323,7 @@ util.extend(exports, {
             tr.center = tr.unproject(from.add(to.sub(from).mult(us)), startWorldSize);
 
             if (bearing !== startBearing) {
-                tr.bearing = util.interp(startBearing, bearing, k);
+                tr.bearing = interpolate(startBearing, bearing, k);
             }
 
             this.animationLoop.set(300); // text fading

js/util/interpolate.js

@@ -0,0 +1,31 @@
+'use strict';
+
+module.exports = interpolate;
+
+function interpolate(a, b, t) {
+    return (a * (1 - t)) + (b * t);
+}
+
+interpolate.number = interpolate;
+
+interpolate.vec2 = function(from, to, t) {
+    return [
+        interpolate(from[0], to[0], t),
+        interpolate(from[1], to[1], t)
+    ];
+};
+
+interpolate.color = function(from, to, t) {
+    return [
+        interpolate(from[0], to[0], t),
+        interpolate(from[1], to[1], t),
+        interpolate(from[2], to[2], t),
+        interpolate(from[3], to[3], t)
+    ];
+};
+
+interpolate.array = function(from, to, t) {
+    return from.map(function(d, i) {
+        return interpolate(d, to[i], t);
+    });
+};

js/util/util.js

@@ -19,10 +19,6 @@ exports.bezier = function(p1x, p1y, p2x, p2y) {
 
 exports.ease = exports.bezier(0.25, 0.1, 0.25, 1);
 
-exports.interp = function (a, b, t) {
-    return (a * (1 - t)) + (b * t);
-};
-
 exports.premultiply = function (c) {
     c[0] *= c[3];
     c[1] *= c[3];

test/js/util/interpolate.test.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var test = require('tape');
+var interpolate = require('../../../js/util/interpolate');
+
+test('interpolate.number', function(t) {
+    t.equal(interpolate(0, 1, 0.5), 0.5);
+    t.end();
+});
+
+test('interpolate.number', function(t) {
+    t.equal(interpolate.number(0, 1, 0.5), 0.5);
+    t.end();
+});
+
+test('interpolate.color', function(t) {
+    t.deepEqual(interpolate.color([0, 0, 0, 0], [1, 2, 3, 4], 0.5), [0.5, 1, 3 / 2, 2]);
+    t.end();
+});
+
+test('interpolate.array', function(t) {
+    t.deepEqual(interpolate.array([0, 0, 0, 0], [1, 2, 3, 4], 0.5), [0.5, 1, 3 / 2, 2]);
+    t.end();
+});

test/js/util/util.test.js

@@ -8,7 +8,6 @@ test('util', function(t) {
     t.equal(util.easeCubicInOut(0.2), 0.03200000000000001);
     t.equal(util.easeCubicInOut(0.5), 0.5, 'easeCubicInOut=0.5');
     t.equal(util.easeCubicInOut(1), 1, 'easeCubicInOut=1');
-    t.equal(util.interp(0, 1, 0.5), 0.5, 'interp=0.5');
     t.deepEqual(util.premultiply([0, 1, 2, 2]), [0, 2, 4, 2], 'premultiply');
     t.deepEqual(util.keysDifference({a:1}, {}), ['a'], 'keysDifference');
     t.deepEqual(util.keysDifference({a:1}, {a:1}), [], 'keysDifference');