Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
loader.load(letterL, obj => {
const l = new L(obj.children[0].geometry);
l.rotation.y = -Math.PI * 0.1;
webgl.add(l);
const tm = new TimelineMax({
});
tm.fromTo(l.position, 2, { y : -0.5, }, { y : 0.15, ease : Power4.easeOut });
tm.fromTo(l.scale, 2, { x : 0.0001, y : 0.0001, z : 0.0001, }, { x : 1, y : 1, z : 1, ease : Power4.easeOut }, 0);
tm.add(() => {
l.timeline.play();
}, '-=0.5');
}, xhr => {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
z: getRandomPos(100),
opacity: 0,
rotation: getRandomPos(720),
rotationX: getRandomPos(360),
rotationY: getRandomPos(360),
},
x: 0,
y: 0,
z: 0,
rotation: 0,
rotationX: 0,
rotationY: 0,
opacity: 1,
delay: 0.5 + Math.random() * 0.5,
immediateRender: true,
ease: Power4.easeOut,
})
return (
<span style="{{">
{letter}
</span>
)
})}
import { Power4 } from 'gsap';
export const tabAnimations = {
backgroundColor: {
duration: 0.2,
},
left: {
duration: 0.3,
easing: Power4.easeOut,
},
width: {
duration: 0.3,
easing: Power4.easeOut,
},
};
import { Power4 } from 'gsap';
export const tabAnimations = {
backgroundColor: {
duration: 0.2,
},
left: {
duration: 0.3,
easing: Power4.easeOut,
},
width: {
duration: 0.3,
easing: Power4.easeOut,
},
};
onScreen (entry) {
TweenMax.to(this.rootElement, 1.5, {
xPercent: 0,
alpha: 1,
delay: 0.15,
ease: Power4.easeOut
})
}
explode() {
const { size, repeat, delay, repeatDelay } = this.state;
const ease = Power4.easeOut;
const angle = Math.PI / 8;
const radius = size * this.radius / 100;
const durations = this.durations;
const { onComplete, onStart, onRepeat } = this.props;
const center = size / 2;
const timelines = [];
this.timeline = new TimelineMax({
repeat, delay, repeatDelay, onComplete, onStart, onRepeat
});
for (let i = 0; i < this.count; i++) {
const x = center + radius * Math.cos(i * angle);
const y = center + radius * Math.sin(i * angle);
const target = this.lines[i];
const start = { x2: x, y2: y };
import {Power2, Power4} from 'gsap';
const PageAnimations = {
defaults: {
duration: 0.5,
properties: {
opacity: 1,
ease: Power4.easeOut
}
}
};
PageAnimations.animateIn = {
duration: PageAnimations.defaults.duration,
properties: PageAnimations.defaults.properties
};
PageAnimations.animateOut = {
duration: PageAnimations.defaults.duration,
properties: {
opacity: 0,
ease: Power2.easeOut
}
};
explode = () => {
const ease = Power4.easeOut;
const { size, delay, repeat, repeatDelay } = this.state;
const { onStart, onComplete, onRepeat } = this.props;
const center = size / 2;
const sizes = [
size * 0.58,
size * 0.3,
size * 0.3,
size * 0.1,
size * 0.1
];
const halfs = [sizes[0] / 2, sizes[1] / 2, sizes[3] / 2];
const front = center - halfs[0];
const back = center + halfs[0];
const positions = {
start: [
{ x: center, y: center },
componentDidMount() {
const excerpt = this._excerpt
const { index } = this.props
TweenMax.fromTo(excerpt, 1, {
opacity: 0,
x: 20
}, {
opacity: 1,
x: 0,
ease: Power4.easeOut,
delay: index * 0.1
})
}
animateShape = () => {
const ease = Power4.easeOut;
const size = this.props.size;
const left = (size * this.left) / 100;
const sliced = (size * this.sliced) / 100;
const timelines = [];
for (let i = 0; i < this.paths.length; i++) {
const path = this.paths[i];
const percent = ((sliced * 100) / (size - (left * 2))) / 2;
const transformOrigin = `${50 + percent}% 50%`;
const degree = i % 2 == 0 ? (this.degree + this.ratio) : -(this.degree - this.ratio);
const rotation = degree * ((i + 1) / 4);
const timeline = new TimelineMax();
timeline.from(path, 1.5, { scale: 0, transformOrigin, ease });
timeline.to(path, 0.9, { rotation, ease }, "-=1.5");