Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
shadowOpacity: 0.9,
visible: false,
listening: true,
});
globals.layers.get('UI')!.add(sharedReplayLeaderLabel);
globals.elements.sharedReplayLeaderLabel = sharedReplayLeaderLabel;
// Add an animation to alert everyone when shared replay leadership has been transfered
globals.elements.sharedReplayLeaderLabelPulse = new Konva.Tween({
node: sharedReplayLeaderLabel,
width: size * 2,
height: size * 2,
offsetX: 0.025 * winH,
offsetY: 0.025 * winH,
duration: 0.5,
easing: Konva.Easings.EaseInOut,
onFinish: () => {
if (globals.elements.sharedReplayLeaderLabelPulse) {
globals.elements.sharedReplayLeaderLabelPulse.reverse();
}
},
});
globals.elements.sharedReplayLeaderLabelPulse.anim.addLayer(globals.layers.get('UI'));
// Tooltip for the crown
sharedReplayLeaderLabel.tooltipName = 'leader';
// This will get filled in later by the "replayLeader" command
sharedReplayLeaderLabel.tooltipContent = '';
tooltips.init(sharedReplayLeaderLabel, false, true);
// The user can right-click on the crown to pass the replay leader to an arbitrary person
sharedReplayLeaderLabel.on('click', (event) => {
arrow.show();
// Start the arrow at the center position of the clue giver's hand
const centerPos = globals.elements.playerHands[giver].getAbsoluteCenterPos();
arrow.setAbsolutePosition(centerPos);
// Calculate the position of the final arrow destination
// (this must be done after the card is finished tweening)
const pos = getPos(card, rot);
new Konva.Tween({
node: arrow,
duration: 0.5,
x: pos.x,
y: pos.y,
easing: Konva.Easings.EaseOut,
}).play();
};
if (globals.elements.currentPlayerArrowTween) {
globals.elements.currentPlayerArrowTween.destroy();
}
// We want the arrow to always be moving clockwise
const oldRotation = globals.elements.currentPlayerArrow.rotation();
const unmodifiedRotation = rotation;
if (oldRotation > rotation) {
rotation += 360;
}
globals.elements.currentPlayerArrowTween = new Konva.Tween({
node: globals.elements.currentPlayerArrow,
duration: 0.75,
rotation,
easing: Konva.Easings.EaseInOut,
onFinish: () => {
if (globals.elements.currentPlayerArrow) {
globals.elements.currentPlayerArrow.rotation(unmodifiedRotation);
}
},
}).play();
}
};
};
} else {
// Animate the card leaving the hand to the play stacks
// (tweening from the hand to the discard pile is handled in
// the "CardLayout" object)
const card = node.children[0];
card.tweening = true;
node.tween = new Konva.Tween({
node,
duration: 0.8,
x: 0,
y: 0,
scaleX: scale,
scaleY: scale,
rotation: 0,
opacity,
easing: Konva.Easings.EaseOut,
onFinish: () => {
if (!node || !card || !card.parent) {
return;
}
if (card.isMisplayed && card.parent.parent) {
// If the card is misplayed, then tween it to the discard pile
// We check for "card.parent.parent" to fix the bug where
// the tween will still finish if the user goes backward in a replay
card.removeFromParent();
card.animateToDiscardPile();
} else {
card.tweening = false;
node.checkSetDraggable();
this.hideUnder();
}
},
this.draggable(false);
globals.elements.deckPlayAvailableLabel!.hide();
globals.lobby.conn.send('action', {
type: ACTION.DECKPLAY,
});
action.stop();
} else {
// The deck was dragged to an invalid location, so animate the card back to where it was
new Konva.Tween({
node: this,
duration: 0.5,
x: 0,
y: 0,
easing: Konva.Easings.EaseOut,
onFinish: () => {
const layer = globals.layers.get('UI');
if (typeof layer !== 'undefined') {
layer.batchDraw();
}
},
}).play();
}
}
const card = node.children[0] as unknown as HanabiCard;
card.tweening = true;
if (card.doMisplayAnimation) {
// If this card just misplayed, do a special animation
card.doMisplayAnimation = false;
node.rotation(360);
}
node.tween = new Konva.Tween({
node,
duration: 0.5,
x: newX,
y: 0,
scaleX: scale,
scaleY: scale,
rotation: 0,
easing: Konva.Easings.EaseOut,
onFinish: () => {
if (!card || !node) {
return;
}
card.tweening = false;
node.checkSetDraggable();
if (!storedPostAnimationLayout) {
return;
}
storedPostAnimationLayout();
},
}).play();
}
x += ((scale * node.width()) + dist) * (this.reverse ? -1 : 1);
}
fadeInRect = () => {
const { theme } = this.props;
this.rect.current!.to({
fill: theme.pallete.primary[4],
duration: 0.2,
easing: Konva.Easings.EaseOut,
});
};
shuttle.x(x);
shuttle.y(y);
shuttle.scaleX(scale);
shuttle.scaleY(scale);
} else {
if (shuttle.tween) {
shuttle.tween.destroy();
}
shuttle.tween = new Konva.Tween({
x,
y,
scaleX: scale,
scaleY: scale,
node: shuttle,
duration: 0.25,
easing: Konva.Easings.EaseOut,
}).play();
}
};
const handleDragEnd = (e) => {
e.target.to({
duration: 0.5,
easing: Konva.Easings.ElasticEaseOut,
scaleX: 1,
scaleY: 1,
shadowOffsetX: 0,
shadowOffsetY: 0,
});
spritesDispatch({
type: 'DRAG_END',
key: spritekey,
value: {
x: e.target.attrs.x - canvasSize.WIDTH / 2,
y: e.target.attrs.y - canvasSize.HEIGHT / 2,
},
});
};
const handleMouseDown = () => {
fadeOutRect = () => {
this.rect.current!.to({
fill: 'rgba(0,0,0,0)',
duration: 0.2,
easing: Konva.Easings.EaseOut,
});
};