player can chii(l?)

src/button.ts

@@ -88,7 +88,7 @@ export function clickChii(
 		r > 10 &&
 		inside
 	) {
-		return q === chiis.length ? 0 : q + 1;
+		return q === chiis.length ? 0 : chiis[q][0].getValue();
 	}
 	return -1;
 }
@@ -97,6 +97,7 @@ export function drawChiis(
 	ctx: CanvasRenderingContext2D,
 	chiis: Array<Array<Tile>>
 ): void {
+	chiis.reverse();
 	const r = 8;
 	const w = 110;
 	const h = 50;
@@ -106,9 +107,7 @@ export function drawChiis(
 	ctx.fillText("Retour", 850 + w * 0.1, 835 + h/2 * 1.3);
 	
 	let dx = 1;
-	console.log("length: ", chiis.length, "\n");
 	for (let i = 0; i < chiis.length; i++) {
-		console.log("trying to draw\n");
 		drawOneChii(
 			ctx,
 			850 - dx * 120,
@@ -128,9 +127,40 @@ function drawOneChii(
 	const r = 8;
 	const w = 110;
 	const h = 50;
+	const dx = 32;
+	const x0 = x + 7;
+	const y0 = y + 5;
 	button(ctx, x, y, r, w, h, "#FFCC33");
-	ctx.fillStyle = "black";
-	ctx.font = "30px garamond";
+	tiles[0].drawTile(
+		ctx,
+		x0,
+		y0,
+		0.4,
+		false,
+		0,
+		false,
+		false
+	);
+	tiles[1].drawTile(
+		ctx,
+		x0 + dx,
+		y0,
+		0.4,
+		false,
+		0,
+		false,
+		false
+	);
+	tiles[2].drawTile(
+		ctx,
+		x0 + 2 * dx,
+		y0,
+		0.4,
+		false,
+		0,
+		false,
+		false
+	);
 }
 
 function button(

src/game.ts

@@ -109,10 +109,11 @@ export class Game {
 				mp.y - rect.y,
 				allChii
 			);	
-			console.log("chii action:", c, "\n");
-
 			if (c === 0) {
 				this.chooseChii = false;
+			} else {
+				this.chooseChii = false;
+				this.chii(c, 0);
 			}
 		} else {
 			let action = clickAction(
@@ -138,8 +139,8 @@ export class Game {
 					this.hasPlayed = false;
 				} else if (action === 1) { // chii
 					let chiis = this.canDoAChii();
-					if (chiis.length === 0) { // only one possible
-						this.chii(chiis[0], 0); // TODO not 0
+					if (chiis.length === 1) { // only one possible
+						this.chii(chiis[0], 0);
 					} else {
 						this.chooseChii = true;
 						this.drawGame();
@@ -250,18 +251,21 @@ export class Game {
 				h.count(t.getFamily(), t.getValue()-1) > 0
 			) {
 				chii.push(t.getValue()-2);
-			} else if (
+			}
+			if (
 				h.count(t.getFamily(), t.getValue()-1) > 0 &&
 				h.count(t.getFamily(), t.getValue()+1) > 0
 			) {
 				chii.push(t.getValue()-1);
-			} else if (
+			}
+			if (
 				h.count(t.getFamily(), t.getValue()+1) > 0 &&
 				h.count(t.getFamily(), t.getValue()+2) > 0
 			) {
 				chii.push(t.getValue());
 			}
 		}
+		console.log(chii, "\n");
 		return chii;
 	}
 
@@ -305,11 +309,11 @@ export class Game {
 					let tt = this.hands[p].find(t.getFamily(), v + dv) as NonNullable<Tile>;
 					chii.push(tt);
 					this.hands[p].push(tt);
+					this.hands[p].sort();
 				}
 			}
 			chiis.push(chii);
 		}
-
 		return chiis;
 	}
 
@@ -405,7 +409,7 @@ export class Game {
 			5 * this.sizeHiddenHand,
 			this.sizeHiddenHand,
 			undefined,
-			false,
+			true,
 			- pi / 2
 		);
 		this.hands[2].drawHand(
@@ -415,7 +419,7 @@ export class Game {
 			5 * this.sizeHiddenHand,
 			this.sizeHiddenHand,
 			undefined,
-			false,
+			true,
 			- pi
 		);
 		this.hands[3].drawHand(
@@ -425,7 +429,7 @@ export class Game {
 			5 * this.sizeHiddenHand,
 			this.sizeHiddenHand,
 			undefined,
-			false,
+			true,
 			pi / 2
 		);
 

src/tile.ts

@@ -49,11 +49,14 @@ export class Tile {
 		size: number,
 		hidden: boolean = false,
 		rotation: number = 0,
-		gray: boolean = false
+		gray: boolean = false,
+		tilted: boolean = true
 	): void {
 		ctx.save();
 		ctx.translate(x + (75 * size) / 2, y + (100 * size) / 2);
+		if (tilted) {
 			ctx.rotate(rotation + this.tilt);
+		}
 
 		if (hidden) {
 			ctx.drawImage(