Number Scrabble - web implementation

See also: number-scrabble, teaching, teaching-implementation

Aim here is to explore if/how to implement a web app/component that allows me to demonstrate (perhaps play) number-scrabble as part of a lesson. Plan is to split development into

1. Visuals only - no game play/logic, just allow two players to play on a web page
2. Two player game play should work
3. Single player game play

Visuals only

Resources

• CSS playing cards - blog post - 13 year old but quite interesting

• CodePens labelled "playing cards"

  • playing cards in CSS
  • playing cards no JS some animation to turn over

Javascript

• Medium article (part of series) on playing cards with JS

  • related to deck of cards site which is almost what I need
  • repo
  • Could be the one - Javascript mostly functional

• Cards JS

• CardTS - card web components

Other

• Deck of Cards API - fairly up to date

Experiment 1 - Deck of Cards

In theory, I should be able to use one of the example bits of code and replace the local css/js with a CDN and this web page should work

All that's required now is to write Javascript that

• shows up turned cards from 1 to 15
• allow dragging and dropping of the cards

Experiment 2 - Two player game play

• Add a player 1 and player 2 space for dragging cards

• as cards dragged there update a count for that player

  Could be interesting. How to get an event that fires when a card is dropped on a player space?

  For each card add an event listener on stop moving that looks for location