ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chaos anim changes

Browse Source
This commit is contained in:
ntr 2019-12-18 11:12:36 +10:00
parent 44fa6b8c6a
commit 9ce98fe81f
1 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
client/src/components/anims/chaos.jsx
View File

@ -12,7 +12,8 @@ function projectile(x, y, radius, colour) {
cy={y} cy={y}
r={radius} r={radius}
fill={colour} fill={colour}
stroke="none" stroke={colour === '#a52a2a' ? 'none' : '#f5f5f5'}
stroke-width={colour === '#a52a2a' ? '0' : '0.05em'}
filter={colour === '#a52a2a' ? 'url(#chaosRedFilter)' : 'url(#chaosBlueFilter)'} filter={colour === '#a52a2a' ? 'url(#chaosRedFilter)' : 'url(#chaosBlueFilter)'}
/> />
); );
@ -25,7 +26,7 @@ class Chaos extends Component {
const points = randomPoints(20, 30, { x: 0, y: 0, width: 300, height: 100 }); const points = randomPoints(20, 30, { x: 0, y: 0, width: 300, height: 100 });
this.charges = points.map(coord => { this.charges = points.map(coord => {
const colour = Math.random() >= 0.5 ? '#a52a2a' : '#3050f8'; const colour = Math.random() >= 0.5 ? '#a52a2a' : '#3050f8';
return projectile(coord[0], coord[1], 14, colour); return projectile(coord[0], coord[1], '0.5em', colour);
}); });
} }
@ -84,8 +85,8 @@ class Chaos extends Component {
this.animations.push(anime({ this.animations.push(anime({
targets: ['#chaosRedFilter feTurbulence', '#chaosRedFilter feDisplacementMap'], targets: ['#chaosRedFilter feTurbulence', '#chaosRedFilter feDisplacementMap'],
baseFrequency: 2, baseFrequency: 2,
scale: 20, scale: 5,
numOctaves: 5, numOctaves: 3,
easing: 'easeOutSine', easing: 'easeOutSine',
duration: TIMES.TARGET_DURATION_MS, duration: TIMES.TARGET_DURATION_MS,