59 lines
2.1 KiB
HTML
59 lines
2.1 KiB
HTML
<div class="football-container">
|
|
<!-- Sélecteur de couleurs au-dessus du canvas -->
|
|
<div class="toolbar">
|
|
<!-- <div class="color-palette">
|
|
<div *ngFor="let color of colors" [style.background]="color" (click)="setColor(color)" class="color-box" [class.selected]="color === selectedColor">
|
|
</div>
|
|
</div> -->
|
|
|
|
<!-- Saisie du nombre de joueurs -->
|
|
<div class="player-count">
|
|
<label for="playerCount">Nombre de joueurs : </label>
|
|
<input type="number" id="playerCount" [(ngModel)]="playerCount" min="1" max="25" (change)="updatePlayers()">
|
|
</div>
|
|
|
|
<!-- Saisie du nombre de plots -->
|
|
<div class="plot-count">
|
|
<label for="plotCount">Nombre de plots : </label>
|
|
<input type="number" id="plotCount" [(ngModel)]="plotCount" min="1" max="50" (change)="updatePlots()">
|
|
</div>
|
|
|
|
<!-- Saisie du nombre de plots -->
|
|
<div class="piquet-count">
|
|
<label for="piquetCount">Nombre de piquets : </label>
|
|
<input type="number" id="piquetCount" [(ngModel)]="piquetCount" min="1" max="20" (change)="updatePiquets()">
|
|
</div>
|
|
|
|
<!-- Bouton pour réinitialiser le dessin -->
|
|
<button (click)="clearCanvas()" class="clear-button">Réinitialiser</button>
|
|
|
|
<!-- Sélection de forme -->
|
|
<!-- <div class="shape-selector">
|
|
<label for="shape">Forme :</label>
|
|
<select id="shape" [(ngModel)]="selectedShape">
|
|
<option value="none">Aucune</option>
|
|
<option value="rectangle">Rectangle</option>
|
|
<option value="circle">Cercle</option>
|
|
<option value="line">Ligne</option>
|
|
</select>
|
|
</div> -->
|
|
</div>
|
|
|
|
<!-- <canvas #canvas width="800" height="600"
|
|
(mousedown)="startDrawing($event)"
|
|
(mousemove)="draw($event)"
|
|
(mouseup)="stopDrawing()">
|
|
Your browser does not support the canvas element.
|
|
</canvas> -->
|
|
<canvas #canvas width="800" height="600"
|
|
(mousedown)="startDragging($event)"
|
|
(mousemove)="drag($event)"
|
|
(mouseup)="stopDragging()">
|
|
Votre navigateur ne supporte pas l'élément canvas.
|
|
</canvas>
|
|
<!-- <div class="controls">
|
|
<button (click)="clearDrawings()">Effacer les dessins</button>
|
|
</div> -->
|
|
</div>
|
|
|