65 lines
2.3 KiB
JavaScript
65 lines
2.3 KiB
JavaScript
|
import { mix } from './mix.mjs';
|
||
|
|
import { mixColor } from './mix-color.mjs';
|
||
|
|
import { pipe } from './pipe.mjs';
|
||
|
|
import { warning } from './errors.mjs';
|
||
|
|
import { color } from '../value/types/color/index.mjs';
|
||
|
|
import { complex, analyseComplexValue } from '../value/types/complex/index.mjs';
|
||
|
|
|
||
|
|
const mixImmediate = (origin, target) => (p) => `${p > 0 ? target : origin}`;
|
||
|
|
function getMixer(origin, target) {
|
||
|
|
if (typeof origin === "number") {
|
||
|
|
return (v) => mix(origin, target, v);
|
||
|
|
}
|
||
|
|
else if (color.test(origin)) {
|
||
|
|
return mixColor(origin, target);
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
return origin.startsWith("var(")
|
||
|
|
? mixImmediate(origin, target)
|
||
|
|
: mixComplex(origin, target);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
const mixArray = (from, to) => {
|
||
|
|
const output = [...from];
|
||
|
|
const numValues = output.length;
|
||
|
|
const blendValue = from.map((fromThis, i) => getMixer(fromThis, to[i]));
|
||
|
|
return (v) => {
|
||
|
|
for (let i = 0; i < numValues; i++) {
|
||
|
|
output[i] = blendValue[i](v);
|
||
|
|
}
|
||
|
|
return output;
|
||
|
|
};
|
||
|
|
};
|
||
|
|
const mixObject = (origin, target) => {
|
||
|
|
const output = { ...origin, ...target };
|
||
|
|
const blendValue = {};
|
||
|
|
for (const key in output) {
|
||
|
|
if (origin[key] !== undefined && target[key] !== undefined) {
|
||
|
|
blendValue[key] = getMixer(origin[key], target[key]);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return (v) => {
|
||
|
|
for (const key in blendValue) {
|
||
|
|
output[key] = blendValue[key](v);
|
||
|
|
}
|
||
|
|
return output;
|
||
|
|
};
|
||
|
|
};
|
||
|
|
const mixComplex = (origin, target) => {
|
||
|
|
const template = complex.createTransformer(target);
|
||
|
|
const originStats = analyseComplexValue(origin);
|
||
|
|
const targetStats = analyseComplexValue(target);
|
||
|
|
const canInterpolate = originStats.numVars === targetStats.numVars &&
|
||
|
|
originStats.numColors === targetStats.numColors &&
|
||
|
|
originStats.numNumbers >= targetStats.numNumbers;
|
||
|
|
if (canInterpolate) {
|
||
|
|
return pipe(mixArray(originStats.values, targetStats.values), template);
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
warning(true, `Complex values '${origin}' and '${target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`);
|
||
|
|
return mixImmediate(origin, target);
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
export { mixArray, mixComplex, mixObject };
|