Commit de05dbe7 authored by Chunchi Che's avatar Chunchi Che

Merge branch 'optimize/animation' into 'main'

Optimize/animation

See merge request mycard/Neos!224
parents e06ef308 64588205
Pipeline #22273 passed with stages
in 15 minutes and 55 seconds
...@@ -30,9 +30,9 @@ export default async (chaining: ygopro.StocGameMessage.MsgChaining) => { ...@@ -30,9 +30,9 @@ export default async (chaining: ygopro.StocGameMessage.MsgChaining) => {
await eventbus.call(Task.Focus, target.uuid); await eventbus.call(Task.Focus, target.uuid);
console.color("blue")(`${target.meta.text.name} chaining`); console.color("blue")(`${target.meta.text.name} chaining`);
// 临时办法,这里延迟500ms // 临时办法,这里延迟800ms
// 长期:需要实现动画序列,一个动画完成后才执行下一个动画 // 长期:需要实现动画序列,一个动画完成后才执行下一个动画
await sleep(1000); await sleep(800);
} else { } else {
console.warn(`<Chaining>target from ${location} is null`); console.warn(`<Chaining>target from ${location} is null`);
} }
......
...@@ -144,7 +144,7 @@ async function _handleGameMsg(pb: ygopro.YgoStocMsg) { ...@@ -144,7 +144,7 @@ async function _handleGameMsg(pb: ygopro.YgoStocMsg) {
break; break;
} }
case "shuffle_hand": { case "shuffle_hand": {
onMsgShuffleHand(msg.shuffle_hand); await onMsgShuffleHand(msg.shuffle_hand);
break; break;
} }
......
import { ygopro } from "@/api"; import { ygopro } from "@/api";
import { eventbus, Task } from "@/infra";
import { cardStore } from "@/stores"; import { cardStore } from "@/stores";
type MsgShuffleHand = ygopro.StocGameMessage.MsgShuffleHand; type MsgShuffleHand = ygopro.StocGameMessage.MsgShuffleHand;
export default (shuffleHand: MsgShuffleHand) => { export default async (shuffleHand: MsgShuffleHand) => {
const { hands: codes, player: controller } = shuffleHand; const { hands: codes, player: controller } = shuffleHand;
// 本质上是要将手卡的sequence变成和codes一样的顺序 // 本质上是要将手卡的sequence变成和codes一样的顺序
...@@ -13,13 +14,16 @@ export default (shuffleHand: MsgShuffleHand) => { ...@@ -13,13 +14,16 @@ export default (shuffleHand: MsgShuffleHand) => {
hash.get(code)?.push(sequence); hash.get(code)?.push(sequence);
}); });
hands.forEach((hand) => { for (const hand of hands) {
const sequences = hash.get(hand.code); const sequences = hash.get(hand.code);
if (sequences !== undefined) { if (sequences !== undefined) {
const sequence = sequences.pop(); const sequence = sequences.pop();
if (sequence !== undefined) { if (sequence !== undefined) {
hand.location.sequence = sequence; hand.location.sequence = sequence;
hash.set(hand.code, sequences); hash.set(hand.code, sequences);
// 触发动画
await eventbus.call(Task.Move, hand.uuid);
} else { } else {
console.warn( console.warn(
`<ShuffleHand>sequence poped is none, controller=${controller}, code=${hand.code}, sequence=${sequence}` `<ShuffleHand>sequence poped is none, controller=${controller}, code=${hand.code}, sequence=${sequence}`
...@@ -32,5 +36,5 @@ export default (shuffleHand: MsgShuffleHand) => { ...@@ -32,5 +36,5 @@ export default (shuffleHand: MsgShuffleHand) => {
)}, codes=${codes}` )}, codes=${codes}`
); );
} }
}); }
}; };
...@@ -64,6 +64,7 @@ export const Card: FC<{ idx: number }> = React.memo(({ idx }) => { ...@@ -64,6 +64,7 @@ export const Card: FC<{ idx: number }> = React.memo(({ idx }) => {
} }
}; };
// 这里后期应该去掉?
useEffect(() => { useEffect(() => {
move(state.location.zone); move(state.location.zone);
}, []); }, []);
...@@ -108,9 +109,10 @@ export const Card: FC<{ idx: number }> = React.memo(({ idx }) => { ...@@ -108,9 +109,10 @@ export const Card: FC<{ idx: number }> = React.memo(({ idx }) => {
); );
// <<< 动画 <<< // <<< 动画 <<<
const idleInteractivities = snap.idleInteractivities;
useEffect(() => { useEffect(() => {
setHighlight(!!snap.idleInteractivities.length); setHighlight(!!idleInteractivities.length);
}, [snap.idleInteractivities]); }, [idleInteractivities]);
return ( return (
<animated.div <animated.div
......
import { config } from "@react-spring/web";
import { ygopro } from "@/api"; import { ygopro } from "@/api";
import { type CardType, matStore } from "@/stores"; import { type CardType, matStore } from "@/stores";
...@@ -19,7 +21,7 @@ export const focus = async (props: { card: CardType; api: SpringApi }) => { ...@@ -19,7 +21,7 @@ export const focus = async (props: { card: CardType; api: SpringApi }) => {
}); });
await asyncStart(api)({ y: current.y, ry: current.ry, rz: current.rz }); await asyncStart(api)({ y: current.y, ry: current.ry, rz: current.rz });
} else { } else {
await asyncStart(api)({ z: 200 }); await asyncStart(api)({ z: 200, config: config.gentle });
await asyncStart(api)({ z: current.z }); await asyncStart(api)({ z: current.z, config: config.default });
} }
}; };
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment