Merge branch 'develop' into release/1.4.5
This commit is contained in:
commit
19bb128d51
@ -2,7 +2,7 @@ const anime = require('animejs').default;
|
||||
|
||||
const { TIMES } = require('../../constants');
|
||||
|
||||
function Banish(id) {
|
||||
function Banish(id, idle) {
|
||||
return anime({
|
||||
targets: [document.getElementById(id)],
|
||||
scaleY: 0,
|
||||
@ -11,6 +11,8 @@ function Banish(id) {
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
duration: TIMES.TARGET_DURATION_MS * 0.45,
|
||||
direction: 'alternate',
|
||||
begin: idle.pause,
|
||||
complete: idle.play,
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -2,7 +2,7 @@ const anime = require('animejs').default;
|
||||
|
||||
const { TIMES } = require('../../constants');
|
||||
|
||||
function Invert(id) {
|
||||
function Invert(id, idle) {
|
||||
return anime({
|
||||
targets: [document.getElementById(id)],
|
||||
rotate: 180,
|
||||
@ -10,6 +10,8 @@ function Invert(id) {
|
||||
duration: TIMES.TARGET_DURATION_MS * 0.45,
|
||||
easing: 'easeInOutElastic',
|
||||
direction: 'alternate',
|
||||
begin: idle.pause,
|
||||
complete: idle.play,
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -2,15 +2,17 @@ const anime = require('animejs').default;
|
||||
|
||||
const { TIMES } = require('../../constants');
|
||||
|
||||
function sourceCast(id, direction) {
|
||||
function sourceCast(id, direction, idle) {
|
||||
const { x, y } = direction;
|
||||
return anime({
|
||||
targets: [document.getElementById(id)],
|
||||
translateX: [0, x * 200],
|
||||
translateY: [0, y * 200],
|
||||
translateX: x * window.screen.width * 0.15,
|
||||
translateY: y * window.screen.height * 0.15,
|
||||
easing: 'easeInOutElastic',
|
||||
direction: 'alternate',
|
||||
duration: TIMES.SOURCE_DURATION_MS,
|
||||
begin: idle.pause,
|
||||
complete: idle.play,
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -37,73 +37,8 @@ class ConstructAvatar extends Component {
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const { animSource, animTarget, construct } = this.props;
|
||||
|
||||
// back to idle
|
||||
if (!animTarget && !animSource) {
|
||||
if (!this.idle) {
|
||||
this.idle = idleAnimation(this.props.construct.id);
|
||||
return this.animations.push(this.idle);
|
||||
}
|
||||
|
||||
return this.idle.play();
|
||||
}
|
||||
|
||||
const isSource = animSource && animSource.constructId === construct.id;
|
||||
|
||||
const selectAnim = () => {
|
||||
if (isSource) {
|
||||
console.warn(construct.name, animSource);
|
||||
return sourceCast(animSource.constructId, animSource.direction);
|
||||
}
|
||||
|
||||
switch (animTarget.skill) {
|
||||
case 'banish': return banish(construct.id);
|
||||
case 'invert': return invert(construct.id);
|
||||
default: return null;
|
||||
}
|
||||
};
|
||||
|
||||
const anim = selectAnim();
|
||||
if (!anim) return false;
|
||||
|
||||
this.idle.pause();
|
||||
this.animations.push(anim);
|
||||
return true;
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { animSource, animTarget, construct } = this.props;
|
||||
|
||||
// back to idle
|
||||
if (!animTarget && !animSource) {
|
||||
if (!this.idle) {
|
||||
this.idle = idleAnimation(this.props.construct.id);
|
||||
return this.animations.push(this.idle);
|
||||
}
|
||||
return this.idle.play();
|
||||
}
|
||||
|
||||
const isSource = animSource && animSource.constructId === construct.id;
|
||||
|
||||
const selectAnim = () => {
|
||||
if (isSource) {
|
||||
return sourceCast(animSource.constructId, animSource.direction);
|
||||
}
|
||||
|
||||
switch (animTarget.skill) {
|
||||
case 'Banish': return banish(construct.id);
|
||||
case 'Invert': return invert(construct.id);
|
||||
default: return null;
|
||||
}
|
||||
};
|
||||
|
||||
const anim = selectAnim();
|
||||
if (!anim) return false;
|
||||
|
||||
this.idle.pause();
|
||||
this.animations.push(anim);
|
||||
return true;
|
||||
this.idle = idleAnimation(this.props.construct.id);
|
||||
return this.animations.push(this.idle);
|
||||
}
|
||||
|
||||
resetAnimations() {
|
||||
@ -132,24 +67,19 @@ class ConstructAvatar extends Component {
|
||||
// this is the source
|
||||
if (animSource && animSource.constructId === construct.id) {
|
||||
// console.warn(construct.name, 'should update')
|
||||
return true;
|
||||
return sourceCast(animSource.constructId, animSource.direction, this.idle);
|
||||
}
|
||||
|
||||
// this is the target
|
||||
if (animTarget && animTarget.constructId.includes(construct.id)) {
|
||||
// console.warn(construct.name, 'should update')
|
||||
return true;
|
||||
switch (animTarget.skill) {
|
||||
case 'Banish': return banish(construct.id, this.idle);
|
||||
case 'Invert': return invert(construct.id, this.idle);
|
||||
default: return null;
|
||||
}
|
||||
}
|
||||
|
||||
// we were previously doing src anim
|
||||
const prevSrc = this.props.animSource && this.props.animSource.constructId === construct.id;
|
||||
if (prevSrc && !animSource) return true;
|
||||
|
||||
const prevTarget = this.props.animTarget && this.props.animTarget.constructId.includes(construct.id);
|
||||
if (prevTarget && !animTarget) return true;
|
||||
|
||||
// console.warn(construct.name, 'not updating');
|
||||
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user