| 1 | import number from "../number.js";
|
|---|
| 2 | import {parseCss, parseSvg} from "./parse.js";
|
|---|
| 3 |
|
|---|
| 4 | function interpolateTransform(parse, pxComma, pxParen, degParen) {
|
|---|
| 5 |
|
|---|
| 6 | function pop(s) {
|
|---|
| 7 | return s.length ? s.pop() + " " : "";
|
|---|
| 8 | }
|
|---|
| 9 |
|
|---|
| 10 | function translate(xa, ya, xb, yb, s, q) {
|
|---|
| 11 | if (xa !== xb || ya !== yb) {
|
|---|
| 12 | var i = s.push("translate(", null, pxComma, null, pxParen);
|
|---|
| 13 | q.push({i: i - 4, x: number(xa, xb)}, {i: i - 2, x: number(ya, yb)});
|
|---|
| 14 | } else if (xb || yb) {
|
|---|
| 15 | s.push("translate(" + xb + pxComma + yb + pxParen);
|
|---|
| 16 | }
|
|---|
| 17 | }
|
|---|
| 18 |
|
|---|
| 19 | function rotate(a, b, s, q) {
|
|---|
| 20 | if (a !== b) {
|
|---|
| 21 | if (a - b > 180) b += 360; else if (b - a > 180) a += 360; // shortest path
|
|---|
| 22 | q.push({i: s.push(pop(s) + "rotate(", null, degParen) - 2, x: number(a, b)});
|
|---|
| 23 | } else if (b) {
|
|---|
| 24 | s.push(pop(s) + "rotate(" + b + degParen);
|
|---|
| 25 | }
|
|---|
| 26 | }
|
|---|
| 27 |
|
|---|
| 28 | function skewX(a, b, s, q) {
|
|---|
| 29 | if (a !== b) {
|
|---|
| 30 | q.push({i: s.push(pop(s) + "skewX(", null, degParen) - 2, x: number(a, b)});
|
|---|
| 31 | } else if (b) {
|
|---|
| 32 | s.push(pop(s) + "skewX(" + b + degParen);
|
|---|
| 33 | }
|
|---|
| 34 | }
|
|---|
| 35 |
|
|---|
| 36 | function scale(xa, ya, xb, yb, s, q) {
|
|---|
| 37 | if (xa !== xb || ya !== yb) {
|
|---|
| 38 | var i = s.push(pop(s) + "scale(", null, ",", null, ")");
|
|---|
| 39 | q.push({i: i - 4, x: number(xa, xb)}, {i: i - 2, x: number(ya, yb)});
|
|---|
| 40 | } else if (xb !== 1 || yb !== 1) {
|
|---|
| 41 | s.push(pop(s) + "scale(" + xb + "," + yb + ")");
|
|---|
| 42 | }
|
|---|
| 43 | }
|
|---|
| 44 |
|
|---|
| 45 | return function(a, b) {
|
|---|
| 46 | var s = [], // string constants and placeholders
|
|---|
| 47 | q = []; // number interpolators
|
|---|
| 48 | a = parse(a), b = parse(b);
|
|---|
| 49 | translate(a.translateX, a.translateY, b.translateX, b.translateY, s, q);
|
|---|
| 50 | rotate(a.rotate, b.rotate, s, q);
|
|---|
| 51 | skewX(a.skewX, b.skewX, s, q);
|
|---|
| 52 | scale(a.scaleX, a.scaleY, b.scaleX, b.scaleY, s, q);
|
|---|
| 53 | a = b = null; // gc
|
|---|
| 54 | return function(t) {
|
|---|
| 55 | var i = -1, n = q.length, o;
|
|---|
| 56 | while (++i < n) s[(o = q[i]).i] = o.x(t);
|
|---|
| 57 | return s.join("");
|
|---|
| 58 | };
|
|---|
| 59 | };
|
|---|
| 60 | }
|
|---|
| 61 |
|
|---|
| 62 | export var interpolateTransformCss = interpolateTransform(parseCss, "px, ", "px)", "deg)");
|
|---|
| 63 | export var interpolateTransformSvg = interpolateTransform(parseSvg, ", ", ")", ")");
|
|---|