This commit is contained in:
ntr 2019-07-05 18:16:17 +10:00
parent 84325c86f1
commit bd104b65b2
7 changed files with 111 additions and 3 deletions

View File

@ -259,6 +259,7 @@ button[disabled] {
.blue {
color: #3498db;
stroke: #3498db;
stroke-linecap: round;
}
.yellow {

View File

@ -92,7 +92,6 @@ const SKILLS = [
'HasteI',
'HasteStrike',
'HealI',
'HexI',
'HybridBlast',
'HybridI',
'InterceptI',

View File

@ -26,6 +26,7 @@ const Intercept = require('./anims/intercept');
const Invert = require('./anims/invert');
const Link = require('./anims/link');
const Purify = require('./anims/purify');
const Purge = require('./anims/purge');
const Recharge = require('./anims/recharge');
const Refl = require('./anims/reflect');
const Restrict = require('./anims/restrict');
@ -136,7 +137,7 @@ function animations(props) {
case 'Decay': return <Decay />;
case 'DecayTick': return <Decay />;
case 'Invert': return <Invert id={construct.id} />;
case 'Purge': return false;
case 'Purge': return <Purge />;
case 'Silence': return <Silence />;
case 'Restrict': return <Restrict />;

View File

@ -28,7 +28,19 @@ class Link extends Component {
</feMerge>
</filter>
</defs>
<g class='blue' filter='url(#linkFilter)' stroke-width="4px" stroke-linecap="round" >
<g class='blue' filter='url(#linkFilter)' stroke-width="4px">
<path d= "
M 4 34
h 30
q 30 0 30 30
q 0 30 30 30
h 30
q 0 -30 -30 -30
h -60
q -30 0 -30 -30
"/>
</g>
<g class='white' filter='url(#linkFilter)' stroke-width="1px">
<path d= "
M 4 34
h 30

View File

@ -0,0 +1,79 @@
const preact = require('preact');
const { Component } = require('preact');
const anime = require('animejs').default;
const { TIMES } = require('../../constants');
class Purge extends Component {
constructor() {
super();
this.animations = [];
}
render() {
return (
<svg
class='skill-animation green'
version="1.1"
id="purge"
xmlns="http://www.w3.org/2000/svg"
style={{ transform: 'rotate3d(1, 0, 0, 180deg)' }}
viewBox="0 0 256 256">
<filter id='purgeFilter'>
<feGaussianBlur stdDeviation="3"/>
<feColorMatrix mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 19 -9" result="cutoff"/>
<feComposite operator="atop" in="SourceGraphic" in2="cutoff"/>
</filter>
<g id="purge" filter="url(#purgeFilter)">
<polyline
points='128,168 80,240 176,240 128,168'
/>
<polyline
points='176,240 212,216 128,96 44,216 80,240'
/>
<polyline
points='212,216 248,192 128,24 8,192 44,216'
/>
</g>
</svg>
);
}
componentDidMount() {
this.animations.push(anime({
targets: ['#purge'],
opacity: [
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DURATION_MS * 0.2 },
{ value: 0, delay: TIMES.TARGET_DURATION_MS * 0.6, duration: TIMES.TARGET_DURATION_MS * 0.2 },
],
easing: 'easeInOutSine',
}));
this.animations.push(anime({
targets: ['#purge g'],
strokeWidth: [15, 0],
delay: TIMES.TARGET_DELAY_MS,
duration: TIMES.TARGET_DURATION_MS,
easing: 'easeInSine',
}));
this.animations.push(anime({
targets: ['#purgeFilter'],
stdDeviation: 20,
duration: TIMES.TARGET_DURATION_MS,
easing: 'easeInOutSine',
}));
}
// this is necessary because
// skipping / timing / unmounting race conditions
// can cause the animations to cut short, this will ensure the values are reset
// because preact will recycle all these components
componentWillUnmount() {
for (let i = this.animations.length - 1; i >= 0; i--) {
this.animations[i].reset();
}
}
}
module.exports = Purge;

View File

@ -47,6 +47,21 @@ class Ruin extends Component {
style="opacity: 0.5"
/>
</g>
<g class="white" stroke-width='2px' >
<path
d="M3.6 0c.23-2.93-1.9-4.9-4.8-4.77S-6.37-1.87-6.33 1.3s2.92 7.1 8.03 7 9.4-4.78 9.2-10.5-5-11.95-13.4-12.1S-18.77-6.88-18.85 3.3-10.05 24.97 4.8 24.74 32.78 11.38 32.5-6.5 16.15-42.7-7.8-42.7-55.7-22.02-56.2 9.7s27.3 65 72 64 82.32-42.78 81-92.3S55.41-126.63-23-127.4-168.4-56.97-167.6 30.3s65.85 166.15 161.27 186S246.55 187.18 284.83 0"
/>
<path
d="M3.6 0c.23-2.93-1.9-4.9-4.8-4.77S-6.37-1.87-6.33 1.3s2.92 7.1 8.03 7 9.4-4.78 9.2-10.5-5-11.95-13.4-12.1S-18.77-6.88-18.85 3.3-10.05 24.97 4.8 24.74 32.78 11.38 32.5-6.5 16.15-42.7-7.8-42.7-55.7-22.02-56.2 9.7s27.3 65 72 64 82.32-42.78 81-92.3S55.41-126.63-23-127.4-168.4-56.97-167.6 30.3s65.85 166.15 161.27 186S246.55 187.18 284.83 0"
transform="rotate(120)"
style="opacity: 0.75"
/>
<path
d="M3.6 0c.23-2.93-1.9-4.9-4.8-4.77S-6.37-1.87-6.33 1.3s2.92 7.1 8.03 7 9.4-4.78 9.2-10.5-5-11.95-13.4-12.1S-18.77-6.88-18.85 3.3-10.05 24.97 4.8 24.74 32.78 11.38 32.5-6.5 16.15-42.7-7.8-42.7-55.7-22.02-56.2 9.7s27.3 65 72 64 82.32-42.78 81-92.3S55.41-126.63-23-127.4-168.4-56.97-167.6 30.3s65.85 166.15 161.27 186S246.55 187.18 284.83 0"
transform="rotate(240)"
style="opacity: 0.5"
/>
</g>
</svg>
);
}

View File

@ -1655,6 +1655,7 @@ fn silence(source: &mut Construct, target: &mut Construct, mut results: Resoluti
}
fn purge(source: &mut Construct, target: &mut Construct, mut results: Resolutions, skill: Skill) -> Resolutions {
results.push(Resolution::new(source, target).event(Event::Skill { skill }));
while let Some(i) = target.effects
.iter()
.position(|ce| {