Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
componentDidMount() {
const path = anime.path('#track-2');
const easings = ['linear', 'easeInCubic', 'easeOutCubic', 'easeInOutCubic'];
const motionPath = anime({
targets: '.square',
translateX: path('x'),
translateY: path('y'),
rotate: path('angle'),
// easing: function (el, i) {
// return easings[i];
// },
easing: 'spring(1, 5, 10, 0)',
duration: 4500,
loop: true,
direction: 'forward',
delay: 1500,
const test3 = anime({
targets: someNodes,
top: "-5000000em"
});
const tl = anime.timeline({
loop: false,
direction: 'normal'
});
tl.add({
targets: ".tiny-divvy-div",
scale: 10000000
});
const path = anime.path('#motionPath path');
test1.play();
test2.reverse();
test3.pause();
tl.seek(4000);
tl.finished.then(() => {
console.log("I wonder if anyone will ever actually read this.");
});
const usesEnums = anime({
targets: ".usingEnumsIsAReallyHandyThing",
direction: "reverse",
easing: "inoutexpo",
someProperty: "+=4000"
});
leave: (e, done) => {
console.log('leaving')
const path = animejs.path('#morphPath #forward')
const timeline = animejs.timeline()
const icon = Array.from(e.children).filter(c => c.className === 'btn__content')
timeline
.add({
targets: icon,
opacity: 0,
duration: 50,
offset:0
})
.add({
targets: e,
opacity: 0,
translateX: path('x'),
translateY: path('y'),
function enterButton (el, done) {
const timeline = anime.timeline()
const path = anime.path('#morphPath #reverse')
el.style.opacity = 0
el.querySelector('.icon').style.opacity = 0
timeline
.add({
targets: el,
translateX: path('x'),
translateY: path('y'),
easing: 'easeOutSine',
offset: 200,
duration: 300
})
.add({
targets: el,
opacity: 1,
duration: 1,
function leaveButton (el, done) {
const timeline = anime.timeline()
const path = anime.path('#morphPath #forward')
timeline
.add({
targets: el,
translateX: path('x'),
translateY: path('y'),
easing: 'easeOutSine',
duration: 300
})
.add({
targets: el.querySelector('.icon'),
offset: 0,
opacity: 0,
duration: 50
})
.add({
enter: (e, done) => {
const path = animejs.path('#morphPath #reverse')
const timeline = animejs.timeline()
timeline
.add({
targets: e,
translateX: path('x'),
translateY: path('y'),
easing: 'linear',
duration: 1000,
complete: done
})
},
leave: (e, done) => {