Need to add an ability to prevent dropping a piece that is being dragged.

csharptest commented 6 years ago

Use case: The user clicks and drags a Knight but moves it in a straight line and/or to an illegal square. Ideally the drag-n-drop would query a new event to determine if dropping the piece is allowed in a given location, and if not, display user visual feedback through {cursor: not-allowed;} and snap-back.

    /** 
     * Signature: function(event: { piece: string, sourceSquare: string, targetSquare: string, allowDrop: boolean }) => void
     */
    canDrop: PropTypes.func,

Note: The allowDrop property should default to true, and if set to false by the function, indicate to the user that the piece can not be dropped.

willb335 commented 6 years ago

Ok, this should fit nicely with ReactDnD's canDrop method.

willb335 commented 6 years ago

I think this is outside the scope of chessboardjsx. I want to keep the logic of the game separate from the board.

Signature: function(event: { piece: string, sourceSquare: string, targetSquare: string, allowDrop: boolean }) => void

There would be no way for chessboardjsx to provide an allowDrop param in any meaningful ways since it doesn't know the rules of chess. Best to handle that with chess.js before passing the position to chessboardjsx: HumanVsHuman

I'm not sure if I want to give control of the cursor to the consumer at this point. I think a snapback as in the demo coupled with highlighting the legal squares is enough to show the player what moves are allowed. Making some sort of cursor prop seems a little too niche

willb335 / chessboardjsx

Need to add an ability to prevent dropping a piece that is being dragged. #25