import "../../style/basket_court.css"
import { RefObject } from "react"
import CourtPlayer from "./CourtPlayer"

import { Player } from "../../tactic/Player"
<<<<<<< HEAD
import { CourtObject } from "../../tactic/CourtObjects"
import { CourtBall } from "./CourtBall"

export interface BasketCourtProps {
    players: Player[]
    objects: CourtObject[]

    onPlayerRemove: (p: Player) => void
=======
import {BallPiece, CourtBall} from "./BallPiece";
import {Ball} from "../../tactic/Ball";

export interface BasketCourtProps {
    players: Player[]
    ball: Ball
    onPlayerRemove: (p: Player) => void
    onBallDrop: (b: DOMRect) => void
>>>>>>> 7fa76bf (push for trying to resolve problem)
    onPlayerChange: (p: Player) => void

    onBallRemove: () => void

    onBallMoved: (ball: DOMRect) => void

    courtImage: string
    courtRef: RefObject<HTMLDivElement>
}

export function BasketCourt({
    players,
<<<<<<< HEAD
    objects,
=======
    ball,
>>>>>>> 7fa76bf (push for trying to resolve problem)
    onPlayerRemove,
    onBallRemove,
    onBallMoved,
    onPlayerChange,
    courtImage,
    courtRef,
}: BasketCourtProps) {

    return (
        <div
            id="court-container"
            ref={courtRef}
            style={{ position: "relative" }}>
            <img src={courtImage} alt={"court"} id="court-svg" />
            {players.map((player) => {
                return (
                    <CourtPlayer
                        key={player.team + player.role}
                        player={player}
                        onChange={onPlayerChange}
                        onRemove={() => onPlayerRemove(player)}
                        onBallDrop={onBallMoved}
                        parentRef={courtRef}
                    />
                )
            })}
<<<<<<< HEAD

            {objects.map((object) => {
                if (object.type == "ball") {
                    return (
                        <CourtBall
                            onMoved={onBallMoved}
                            ball={object}
                            onRemove={onBallRemove}
                            key="ball"
                        />
                    )
                }
                throw new Error("unknown court object", object.type)
            })}
=======
            <CourtBall ball={ball}/>
>>>>>>> 7fa76bf (push for trying to resolve problem)
        </div>
    )
}