diff --git a/WORKLOG.md b/WORKLOG.md index 85c3a5bd..6c6bf1cc 100644 --- a/WORKLOG.md +++ b/WORKLOG.md @@ -34,6 +34,7 @@ *CLIENT* +arrows alignment purge green disable rework scatter hatred maybe diff --git a/client/src/components/targeting.arrows.jsx b/client/src/components/targeting.arrows.jsx index 94175359..1adeee0b 100644 --- a/client/src/components/targeting.arrows.jsx +++ b/client/src/components/targeting.arrows.jsx @@ -37,18 +37,25 @@ class TargetSvg extends Component { ? playerTeam.constructs.findIndex(c => c.id === cast.target_construct_id) : otherTeam.constructs.findIndex(c => c.id === cast.target_construct_id); + const pathOffset = [ + [0, -1, -2], + [1, 0, -1], + [2, 1, 0], + ][source][target]; + const sourceY = height; const sourceX = (source * width / 3) + width / 6; - const targetX = (target * width / 3) + width / 6 + (defensive ? width / 32 : 0) + (source * width / 24) - (width / 24); + const targetX = (target * width / 3) + width / 6 + + (pathOffset * width / 32); const targetY = defensive ? height : 0; - const curveEnd = height * 0.20; - const curveStart = height * 0.80; + const bendStart = height * (0.7 - 0.1 * source); + const bendEnd = height * 0.20; if (defensive) { const path = ` M${sourceX},${sourceY} - L${sourceX},${height * 0.75} - L${targetX},${height * 0.75} + L${sourceX},${bendStart} + L${targetX},${bendStart} L${targetX},${targetY} L${targetX - (width * 0.005)},${height * 0.875} M${targetX},${targetY} @@ -60,9 +67,8 @@ class TargetSvg extends Component { const path = ` M${sourceX},${sourceY} - L${sourceX},${curveStart} - C${sourceX},${curveEnd} ${targetX},${curveStart} ${targetX},${curveEnd} - + L${sourceX},${bendStart} + L${targetX},${bendEnd} L${targetX},${targetY} L${targetX - (width * 0.005)},${height * 0.125} M${targetX},${targetY}