@antv/g/es/utils/interpolation.js

import { __read, __spreadArray } from "tslib";
import { GlobalContainer } from 'mana-syringe';
import { StyleValueRegistry } from '../css/interfaces';
import { parseEasingFunction } from './animation';
import { camelCase } from './string';
export function convertEffectInput(keyframes, timing, target) {
  var propertySpecificKeyframeGroups = makePropertySpecificKeyframeGroups(keyframes, timing);
  var interpolations = makeInterpolations(propertySpecificKeyframeGroups, target);
  return function (target, fraction) {
    if (fraction !== null) {
      interpolations.filter(function (interpolation) {
        return fraction >= interpolation.applyFrom && fraction < interpolation.applyTo;
      }).forEach(function (interpolation) {
        var offsetFraction = fraction - interpolation.startOffset;
        var localDuration = interpolation.endOffset - interpolation.startOffset;
        var scaledLocalTime = localDuration === 0 ? 0 : interpolation.easingFunction(offsetFraction / localDuration); // apply updated attribute

        target.style[interpolation.property] = interpolation.interpolation(scaledLocalTime);
      });
    } else {
      for (var property in propertySpecificKeyframeGroups) {
        if (isNotReservedWord(property)) {
          // clear attribute
          target.style[property] = null;
        }
      }
    }
  };
}

function isNotReservedWord(member) {
  return member !== 'offset' && member !== 'easing' && member !== 'composite' && member !== 'computedOffset';
}

function makePropertySpecificKeyframeGroups(keyframes, timing) {
  var propertySpecificKeyframeGroups = {};

  for (var i = 0; i < keyframes.length; i++) {
    for (var member in keyframes[i]) {
      if (isNotReservedWord(member)) {
        var propertySpecificKeyframe = {
          offset: keyframes[i].offset,
          computedOffset: keyframes[i].computedOffset,
          easing: keyframes[i].easing,
          easingFunction: parseEasingFunction(keyframes[i].easing) || timing.easingFunction,
          value: keyframes[i][member]
        };
        propertySpecificKeyframeGroups[member] = propertySpecificKeyframeGroups[member] || []; // @ts-ignore

        propertySpecificKeyframeGroups[member].push(propertySpecificKeyframe);
      }
    }
  }

  return propertySpecificKeyframeGroups;
}

function makeInterpolations(propertySpecificKeyframeGroups, target) {
  var interpolations = [];

  for (var groupName in propertySpecificKeyframeGroups) {
    var keyframes = propertySpecificKeyframeGroups[groupName];

    for (var i = 0; i < keyframes.length - 1; i++) {
      var startIndex = i;
      var endIndex = i + 1;
      var startOffset = keyframes[startIndex].computedOffset;
      var endOffset = keyframes[endIndex].computedOffset;
      var applyFrom = startOffset;
      var applyTo = endOffset;

      if (i === 0) {
        applyFrom = -Infinity;

        if (endOffset === 0) {
          endIndex = startIndex;
        }
      }

      if (i === keyframes.length - 2) {
        applyTo = Infinity;

        if (startOffset === 1) {
          startIndex = endIndex;
        }
      }

      interpolations.push({
        applyFrom: applyFrom,
        applyTo: applyTo,
        startOffset: keyframes[startIndex].computedOffset,
        endOffset: keyframes[endIndex].computedOffset,
        easingFunction: keyframes[startIndex].easingFunction,
        property: groupName,
        interpolation: propertyInterpolation(groupName, keyframes[startIndex].value, keyframes[endIndex].value, target)
      });
    }
  }

  interpolations.sort(function (leftInterpolation, rightInterpolation) {
    return leftInterpolation.startOffset - rightInterpolation.startOffset;
  });
  return interpolations;
}

var InterpolationFactory = function InterpolationFactory(from, to, // eslint-disable-next-line @typescript-eslint/ban-types
convertToString) {
  return function (f) {
    return convertToString(interpolate(from, to, f));
  };
};

function propertyInterpolation(property, left, right, target) {
  var parsedLeft = left;
  var parsedRight = right;
  var registry = GlobalContainer.get(StyleValueRegistry);
  var metadata = registry.getMetadata(property);

  if (metadata && metadata.handler && metadata.interpolable) {
    var propertyHandler = GlobalContainer.get(metadata.handler);

    if (propertyHandler) {
      if (propertyHandler.parser) {
        parsedLeft = propertyHandler.parser(left, target);
        parsedRight = propertyHandler.parser(right, target);
      } // if (propertyHandler.calculator) {
      //   parsedLeft = propertyHandler.calculator(parsedLeft);
      //   // parsedLeft = handler.calculator
      // }
      // merger [left, right, n2string()]


      var interpolationArgs = propertyHandler.mixer(parsedLeft, parsedRight, target);

      if (interpolationArgs) {
        // @ts-ignore
        var interp_1 = InterpolationFactory.apply(void 0, __spreadArray([], __read(interpolationArgs), false));
        return function (t) {
          if (t === 0) return left;
          if (t === 1) return right;
          return interp_1(t);
        };
      }
    }
  } // eslint-disable-next-line @typescript-eslint/no-use-before-define


  return InterpolationFactory(false, true, function (bool) {
    return bool ? right : left;
  });
}
/**
 * interpolate with number, boolean, number[], boolean[]
 */


function interpolate(from, to, f) {
  if (typeof from === 'number' && typeof to === 'number') {
    return from * (1 - f) + to * f;
  }

  if (typeof from === 'boolean' && typeof to === 'boolean' || typeof from === 'string' && typeof to === 'string' // skip string, eg. path ['M', 10, 10]
  ) {
    return f < 0.5 ? from : to;
  }

  if (Array.isArray(from) && Array.isArray(to)) {
    // interpolate arrays/matrix
    if (from.length === to.length) {
      var r = [];

      for (var i = 0; i < from.length; i++) {
        r.push(interpolate(from[i], to[i], f));
      }

      return r;
    }
  }

  throw new Error('Mismatched interpolation arguments ' + from + ':' + to);
}

var FORMAT_ATTR_MAP = {
  d: {
    alias: 'path'
  },
  strokeDasharray: {
    alias: 'lineDash'
  },
  strokeWidth: {
    alias: 'lineWidth'
  },
  textAnchor: {
    alias: 'textAlign',
    values: {
      middle: 'center'
    }
  },
  src: {
    alias: 'img'
  }
};
export function formatAttribute(name, value) {
  var _a;

  var attributeName = camelCase(name);
  var map = FORMAT_ATTR_MAP[attributeName];
  attributeName = (map === null || map === void 0 ? void 0 : map.alias) || attributeName;
  var attributeValue = ((_a = map === null || map === void 0 ? void 0 : map.values) === null || _a === void 0 ? void 0 : _a[value]) || value;
  return [attributeName, attributeValue];
}