You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
68 lines
1.8 KiB
68 lines
1.8 KiB
import {Action, ActionKind} from "../../model/tactic/Action"
|
|
import BendableArrow from "../../components/arrows/BendableArrow"
|
|
import {RefObject} from "react"
|
|
import {MoveToHead, ScreenHead} from "../../components/actions/ArrowAction"
|
|
import {ComponentId} from "../../model/tactic/Tactic"
|
|
|
|
export interface CourtActionProps {
|
|
origin: ComponentId
|
|
action: Action
|
|
onActionChanges: (a: Action) => void
|
|
onActionDeleted: () => void
|
|
courtRef: RefObject<HTMLElement>
|
|
isInvalid: boolean
|
|
}
|
|
|
|
export function CourtAction({
|
|
origin,
|
|
action,
|
|
onActionChanges,
|
|
onActionDeleted,
|
|
courtRef,
|
|
isInvalid
|
|
}: CourtActionProps) {
|
|
|
|
const color = isInvalid ? "red" : "black"
|
|
|
|
let head
|
|
switch (action.type) {
|
|
case ActionKind.DRIBBLE:
|
|
case ActionKind.MOVE:
|
|
case ActionKind.SHOOT:
|
|
head = () => <MoveToHead color={color} />
|
|
break
|
|
case ActionKind.SCREEN:
|
|
head = () => <ScreenHead color={color}/>
|
|
break
|
|
}
|
|
|
|
let dashArray
|
|
switch (action.type) {
|
|
case ActionKind.SHOOT:
|
|
dashArray = "10 5"
|
|
break
|
|
}
|
|
|
|
return (
|
|
<BendableArrow
|
|
forceStraight={action.type == ActionKind.SHOOT}
|
|
area={courtRef}
|
|
startPos={origin}
|
|
segments={action.segments}
|
|
onSegmentsChanges={(edges) => {
|
|
onActionChanges({ ...action, segments: edges })
|
|
}}
|
|
wavy={action.type == ActionKind.DRIBBLE}
|
|
//TODO place those magic values in constants
|
|
endRadius={action.target ? 26 : 17}
|
|
startRadius={10}
|
|
onDeleteRequested={onActionDeleted}
|
|
style={{
|
|
head,
|
|
dashArray,
|
|
color
|
|
}}
|
|
/>
|
|
)
|
|
}
|