Adrien/Riichi
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

can technically discard tiles

Browse source
This commit is contained in:
Didictateur 2026-03-13 22:55:41 +01:00
parent 655e1e5c1c
commit 39c1cc7d69
2 changed files with 144 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
frontend/js/game.js
View file

@ -20,11 +20,12 @@ class Hand {
} }
discard(k) { discard(k) {
if (k = this.tiles.length) { if (k === this.tiles.length) {
tile = this.drawn; const tile = this.drawn;
this.drawn = null;
return tile; return tile;
} else { } else {
tile = this.tiles[k]; const tile = this.tiles[k];
this.tiles.splice(k, 1); this.tiles.splice(k, 1);
return tile; return tile;
} }
@ -39,7 +40,9 @@ class Hand {
} }
flatten() { flatten() {
this.tiles.push(this.drawn); if (this.drawn) {
this.tiles.push(this.drawn);
}
this.drawn = null; this.drawn = null;
this.sort(); this.sort();
} }
@ -158,9 +161,11 @@ class Game {
} }
discard(player, k) { discard(player, k) {
const tile = this.hands[player].discard(k); if (player === this.turn) {
this.discards[player].add(tile); const tile = this.hands[player].discard(k);
this.hands[player].flatten(); this.discards[player].add(tile);
this.hands[player].flatten();
}
} }
chii(player, tiles, dir) { chii(player, tiles, dir) {
@ -176,6 +181,13 @@ class Game {
console.assert(dir == 1); console.assert(dir == 1);
this.hands[player].makeGroup(tiles, this.discards[player].beingStollen(), dir); this.hands[player].makeGroup(tiles, this.discards[player].beingStollen(), dir);
} }
botPlay() {
this.draw(this.turn);
const hand = this.hands[this.turn];
const randomIndex = Math.floor(Math.random() * (hand.tiles.length + (hand.drawn ? 1 : 0)));
this.discard(this.turn, randomIndex);
}
} }
export { Discard, Draw, Game, Group, Hand }; export { Discard, Draw, Game, Group, Hand };

126
frontend/pages/riichi/chap5.html
View file

@ -136,6 +136,70 @@
transition: transform 0.2s; transition: transform 0.2s;
z-index: 2; z-index: 2;
} }
#discard-0 {
position: absolute;
transform: translate(-50%, 50%);
bottom: 25%;
left: 50%;
display: flex;
flex-direction: row;
gap: 2px;
flex-wrap: wrap;
width: 400px;
padding: 10px;
}
#discard-1 {
position: absolute;
transform: translate(-50%, -400%) rotate(-90deg) translate(0%, 450%);
bottom: -25%;
left: 50%;
display: flex;
flex-direction: row;
gap: 2px;
flex-wrap: wrap;
width: 400px;
padding: 10px;
}
#discard-2 {
position: absolute;
transform: translate(-50%, -400%) rotate(180deg) translate(0%, 450%);
bottom: -25%;
left: 50%;
display: flex;
flex-direction: row;
gap: 2px;
flex-wrap: wrap;
width: 400px;
padding: 10px;
}
#discard-3 {
position: absolute;
transform: translate(-50%, -400%) rotate(90deg) translate(0%, 450%);
bottom: -25%;
left: 50%;
display: flex;
flex-direction: row;
gap: 2px;
flex-wrap: wrap;
width: 400px;
padding: 10px;
}
#discard-0 div,
#discard-1 div,
#discard-2 div,
#discard-3 div {
flex-shrink: 0;
}
.discard-tile svg {
height: 50px;
width: 35px;
}
</style> </style>
</head> </head>
<body> <body>
@ -151,8 +215,11 @@
<div id="hand-0"></div> <div id="hand-0"></div>
<div id="discard-0"></div> <div id="discard-0"></div>
<div id="hand-1"></div> <div id="hand-1"></div>
<div id="discard-1"></div>
<div id="hand-2"></div> <div id="hand-2"></div>
<div id="discard-2"></div>
<div id="hand-3"></div> <div id="hand-3"></div>
<div id="discard-3"></div>
</div> </div>
</div> </div>
@ -197,12 +264,29 @@
const handTiles = document.createElement('div'); const handTiles = document.createElement('div');
handTiles.className = 'hand-tiles'; handTiles.className = 'hand-tiles';
for (const tile of game.hands[i].tiles) { for (let k = 0; k < game.hands[i].tiles.length; k++) {
const tile = game.hands[i].tiles[k];
const tileDiv = document.createElement('div'); const tileDiv = document.createElement('div');
// Ajouter la classe 'player-tile' uniquement pour le joueur // Ajouter la classe 'player-tile' uniquement pour le joueur
if (i === 0) { if (i === 0) {
tileDiv.className = 'player-tile'; tileDiv.className = 'player-tile';
tileDiv.innerHTML = tile.getSVG(); tileDiv.innerHTML = tile.getSVG();
tileDiv.style.cursor = 'pointer';
const handleClick = (() => {
const tileToDiscard = tile;
return () => {
// Trouver l'index actuel de la tuile
const currentIdx = game.hands[0].tiles.findIndex(t => t === tileToDiscard);
if (currentIdx !== -1) {
game.discard(0, currentIdx);
game.nextTurn();
renderHands();
renderDiscards();
playBotsSequentially();
}
};
})();
tileDiv.addEventListener('click', handleClick);
} else { } else {
// Bots : afficher le dos // Bots : afficher le dos
tileDiv.innerHTML = `<svg class="tile tile-back" viewBox="0 0 310 410" height="82" width="60"> tileDiv.innerHTML = `<svg class="tile tile-back" viewBox="0 0 310 410" height="82" width="60">
@ -221,6 +305,19 @@
if (i === 0) { if (i === 0) {
drawDiv.classList.add('player-tile'); drawDiv.classList.add('player-tile');
drawDiv.innerHTML = game.hands[i].drawn.getSVG(); drawDiv.innerHTML = game.hands[i].drawn.getSVG();
drawDiv.style.cursor = 'pointer';
const drawnTile = game.hands[i].drawn;
const handleDrawnClick = (() => {
return () => {
// Défausser la tuile piochée (index === tiles.length)
game.discard(0, game.hands[0].tiles.length);
game.nextTurn();
renderHands();
renderDiscards();
playBotsSequentially();
};
})();
drawDiv.addEventListener('click', handleDrawnClick);
} else { } else {
drawDiv.innerHTML = `<svg class="tile tile-back" viewBox="0 0 310 410" height="82" width="60"> drawDiv.innerHTML = `<svg class="tile tile-back" viewBox="0 0 310 410" height="82" width="60">
<image href="/img/Regular/Gray.svg" x="10" y="10" height="410" width="310"/> <image href="/img/Regular/Gray.svg" x="10" y="10" height="410" width="310"/>
@ -234,6 +331,33 @@
} }
} }
function renderDiscards() {
for (let i = 0; i < 4; i++) {
const discardDiv = document.getElementById(`discard-${i}`);
discardDiv.innerHTML = '';
for (const tile of game.discards[i].tiles) {
const tileDiv = document.createElement('div');
tileDiv.className = 'discard-tile';
tileDiv.innerHTML = tile.getSVG();
discardDiv.appendChild(tileDiv);
}
}
}
async function playBotsSequentially() {
// Les bots jouent après le joueur humain
while (game.turn !== 0) {
await new Promise(resolve => setTimeout(resolve, 800));
game.botPlay();
game.nextTurn();
renderHands();
renderDiscards();
}
game.draw(0);
renderHands();
renderDiscards();
}
renderHands(); renderHands();
}); });
</script> </script>