Use WebComponent to implement a BananaJack client.
If you want, you can start on these git branches:
start-native
: containing a skeleton for native WebComponentstart-stencil
: containing a skeleton for Stencil
The purpose is to earn lots of 🍌. The rules are a very simplified version of BlackJack.
When you enter the room
- you had to wait the end of the active round
- at the beginning of the round, two cards are given to every active players, including the bank
- the score is the sum of the value of your cards (King, Queen and Jack give 10, Ace can give 1 or 11).
- if score is 21, you have a BananaJack 🎉
- if score is greater than 21, you loose 😢
- otherwise you can
draw
a new card orstay
, notice than if already havestay
once, you cannotdraw
a card
- at the end of the round, players with greater score earn a 🍌, if you have a BananaJack you earn one more 🍌.
You can play here
POST http://ilaborie.org:9898/api/auth/login
With body:
{
"name": "toto"
}
Return a Player
:
{
"id": "12f128c8a81d9fcf58615b6ba871e74e9c961975",
"name": "toto",
"score": 0
}
POST http://ilaborie.org:9898/api/auth/logout
With body:
{
"playerId": "12f128c8a81d9fcf58615b6ba871e74e9c961975"
}
Return a Player
:
{
"id": "12f128c8a81d9fcf58615b6ba871e74e9c961975",
"name": "toto",
"score": 42
}
GET http://ilaborie.org:9898/api/room
Return an array of Room
:
[
{
"bank": {
"canDo": [],
"hand": {
"cards": [ "4H", "5H" ],
"score": 9
},
"move": "burst"
},
"full": false,
"id": 1,
"name": "Room #01",
"players": [
{
"player": {
"id": "d14202bd59734f221afacdee1ae97d5461088c28",
"name": "toto",
"score": 2
},
"status": {
"canDo": [ "draw", "stay" ],
"hand": {
"cards": [ "0S", "8D" ],
"score": 18
},
"move": "in-game"
}
}
]
}, /* ... */
]
POST http://ilaborie.org:9898/api/room/join
With body:
{
"roomId":1,
"playerId":"d14202bd59734f221afacdee1ae97d5461088c28",
}
Return the updated Room
:
{
"id":1,
"name":"Room #01",
"players":[
{
"player": {"id":"d14202bd59734f221afacdee1ae97d5461088c28","name":"toto","score":0},
"status": {
"hand":{"cards":[],"score":0},
"move":"wait",
"canDo":[]
}
}
],
"bank": {
"hand":{"cards":[],"score":0},
"move":"in-game",
"canDo":["draw","stay"]
},
"full":false
}
POST http://ilaborie.org:9898/api/room/leave
With body:
{
"roomId":1,
"playerId":"d14202bd59734f221afacdee1ae97d5461088c28",
}
Return the updated Room
POST http://ilaborie.org:9898/api/room/move
With body:
{
"roomId": 1,
"playerId": "d14202bd59734f221afacdee1ae97d5461088c28",
"action": "stay"
}
Return the updated Room
GET http://ilaborie.org:9898/api/dashboards
Returns a list of player (with score)
[
{
"id": "9472e17c947350be21d5e6990b6808de87053bec",
"name": "Toto",
"score": 0
},
// ...
]
When you join a room, you need to open a WebSocket
at ws://ilaborie.org:9898/ws/<ROOM_ID>
.
When connected, you also need to send a register message like that
{
"playerId": "d14202bd59734f221afacdee1ae97d5461088c28",
}
Then the server notify when event appends, they look like:
interface RoomEvent {
type: string;
round?: number;
step?: number;
room?: Room;
roomId?: number;
player?: Player;
winners?: string;
action?: Move;
}
A new round have started, the room
attribute contains the updated Room
.
A turn is ended, thus another one is starting, the room
attribute contains the updated Room
.
A round is ended, the room
attribute contains the updated Room
.
A player is joining the room, see the player
attribute.
A player is joining the room, see the player
attribute.
A player have made a move, see the action
attribute.
You are free to implements