_getTransform()

in website/src/components/common/carousel.js [83:121]


  _getTransform(index) {
    const {
      selectedIndex,
      xOffset,
      yOffset,
      zOffset,
      xRotate,
      yRotate,
      zRotate,
      xScale,
      yScale,
      zScale,
      getTransform
    } = this.props;

    const {isVisible} = this.state;
    if (getTransform) {
      return getTransform({index, isVisible});
    }

    const translateX = isVisible ? (index - selectedIndex) * xOffset : 0;
    const translateY = isVisible ? (index - selectedIndex) * yOffset : 0;
    const translateZ = -Math.abs(index - selectedIndex) * zOffset;
    const rotateX = Math.sign(index - selectedIndex) * xRotate;
    const rotateY = Math.sign(index - selectedIndex) * yRotate;
    const rotateZ = Math.sign(index - selectedIndex) * zRotate;
    const scaleX = index - selectedIndex === 0 ? 1 : xScale;
    const scaleY = index - selectedIndex === 0 ? 1 : yScale;
    const scaleZ = index - selectedIndex === 0 ? 1 : zScale;

    return `
      perspective(600px)
      translate3d(${translateX}%, ${translateY}%, ${translateZ}px)
      rotateX(${rotateX}deg)
      rotateY(${rotateY}deg)
      rotateZ(${rotateZ}deg)
      scale3d(${scaleX}, ${scaleY}, ${scaleZ});
    `;
  }