@haiku/player
Version:
Haiku Player is a JavaScript library for building user interfaces
119 lines • 4.6 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Layout3D_1 = require("./../Layout3D");
var css_mat4_1 = require("./../vendor/css-mat4");
var composedTransformsToTimelineProperties_1 = require("./composedTransformsToTimelineProperties");
var MathUtils_1 = require("./MathUtils");
var parseCssValueString_1 = require("./parseCssValueString");
function separate(str) {
var bits = str.split('(');
var type = bits[0];
return {
type: type,
values: bits[1].replace(')', '').split(/\s*,\s*/gi).map(function (str2) { return parseCssValueString_1.default(str2, type); }),
};
}
function parseCssTransformString(inStr) {
var out = {};
if (!inStr) {
return out;
}
var str = inStr.toLowerCase().replace(';', '').trim();
if (str === 'none') {
return out;
}
var parts = str.match(/([a-zA-Z0-9]+\(.+?\))/gi);
if (!parts) {
return out;
}
var specs = parts.map(separate);
var matrices = specs.map(function (spec) {
var layout = {
translate: [0, 0, 0],
rotate: [0, 0, 0],
scale: [1, 1, 1],
};
switch (spec.type) {
case 'rotatex':
layout.rotate[0] = spec.values[0].value;
break;
case 'rotatey':
layout.rotate[1] = spec.values[0].value;
break;
case 'rotatez':
layout.rotate[2] = spec.values[0].value;
break;
case 'translatex':
layout.translate[0] = spec.values[0].value;
break;
case 'translatey':
layout.translate[1] = spec.values[0].value;
break;
case 'translatez':
layout.translate[2] = spec.values[0].value;
break;
case 'scalex':
layout.scale[0] = spec.values[0].value;
break;
case 'scaley':
layout.scale[1] = spec.values[0].value;
break;
case 'scalez':
layout.scale[2] = spec.values[0].value;
break;
case 'rotate':
layout.rotate[2] =
spec.values[0].unit === 'deg' ? MathUtils_1.default.degreesToRadians(spec.values[0].value) : spec.values[0].value;
break;
case 'scale':
layout.scale[0] = spec.values[0].value;
layout.scale[1] = spec.values[1] ? spec.values[1].value : spec.values[0].value;
break;
case 'translate':
layout.translate[0] = spec.values[0].value;
layout.translate[1] = spec.values[1] ? spec.values[1].value : 0;
break;
case 'matrix':
layout.scale[0] = spec.values[0].value;
layout.scale[1] = spec.values[3].value;
layout.translate[0] = spec.values[4].value;
layout.translate[1] = spec.values[5].value;
break;
case 'rotate3d':
if (spec.values.length !== 3) {
break;
}
layout.rotate = spec.values.map(function (axisSpec) {
if (axisSpec.value === 0) {
return 0;
}
if (axisSpec.unit === 'deg') {
return MathUtils_1.default.degreesToRadians(axisSpec.value);
}
return axisSpec.value;
});
break;
case 'scale3d':
layout.scale[0] = spec.values[0].value;
layout.scale[1] = spec.values[1].value;
layout.scale[2] = spec.values[2].value;
break;
case 'translate3d':
layout.translate[0] = spec.values[0].value;
layout.translate[1] = spec.values[1].value;
layout.translate[2] = spec.values[2].value;
break;
case 'matrix3d':
return Layout3D_1.default.copyMatrix(spec.values.map(function (val) {
return val.value;
}));
default:
console.warn('No CSS transform parser available for ' + spec.type);
break;
}
return css_mat4_1.default([], layout);
});
return composedTransformsToTimelineProperties_1.default(out, matrices);
}
exports.default = parseCssTransformString;
//# sourceMappingURL=parseCssTransformString.js.map