-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
81 lines (74 loc) · 3.95 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Championnat de Ping Pong Fonds FTQ</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Love+Ya+Like+A+Sister" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="js/vue.js"></script>
</head>
<body>
<header>
<h1>Championnat de Ping Pong du projet Espace Epargnant</h1>
</header>
<div id="main">
<section v-if="!newGame">
<button id="new" @click="newGame = !newGame">Nouvelle partie</button>
</section>
<section class="joueurs U--absolute" v-if="newGame">
<h2>Choisis les joueurs</h2>
<section>
<select v-model="selected1">
<option v-for="player in players">{{ player.name }}</option>
</select>
<select v-model="selected2">
<option v-for="player in players">{{ player.name }}</option>
</select>
</section>
<section v-if="addGameScore">
<input type="number" class="score" v-model="score1">
<input type="number" class="score" v-model="score2">
<button class="btn" @click="addGame()">Ajouter une partie</button>
</section>
<section class="btn-section">
<button class="btn" @click="addScore()">Ajouter le score</button>
<button class="btn" @click="newGame = !newGame">Annuler</button>
</section>
</section>
<br><br><br>
<div class="classement U--relative">
<div class="img U--absolute">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" enable-background="new 0 0 1000 1000" xml:space="preserve">
<g><g><path d="M806.3,193.8V71.3H193.8v122.5H10v122.5C10,417.7,92.3,500,193.8,500c19.2,0,37.7-3,55.1-8.4c44.2,63.2,111.6,108.9,189.9,124.8v189.9h-61.3c-67.7,0-122.5,54.8-122.5,122.5h490c0-67.7-54.8-122.5-122.5-122.5h-61.3V616.4c78.3-15.9,145.7-61.6,189.9-124.8c17.4,5.5,35.9,8.4,55.1,8.4C907.7,500,990,417.7,990,316.3V193.8H806.3z M193.8,427.3c-61.2,0-111-49.8-111-111V255h111v61.3c0,38.5,7.1,75.3,20.1,109.2C207.3,426.6,200.6,427.3,193.8,427.3z M917.3,316.3c0,61.2-49.8,111-111,111c-6.8,0-13.5-0.7-20.1-1.8c12.9-33.9,20.1-70.7,20.1-109.2V255h111V316.3z"/></g></g>
</svg>
</div>
<table>
<thead>
<th>Nom</th>
<th>Parties jouées</th>
<th>Victoires</th>
<th>Pourcentage de victoires</th>
</thead>
<tbody>
<tr v-for="player in players">
<td>{{ player.name }}</td>
<td>{{ player.games }}</td>
<td>{{ player.victories }}</td>
<td>{{ percent(player.games,player.victories) }}%</td>
</tr>
</tbody>
</table>
</div>
<div class="historique">
<h2>Historique des parties</h2>
<ul>
<li v-for="item in matches">{{ item.text }}</li>
</ul>
</div>
</div>
<script src="https://www.gstatic.com/firebasejs/4.1.3/firebase.js"></script>
<script src="https://unpkg.com/vuefire/dist/vuefire.js"></script>
<script src="js/app.js"></script>
</body>
</html>