Almost finished components drafts

[vchess.git] / public / javascripts / components / challengeList.js

diff --git a/public/javascripts/components/challengeList.js b/public/javascripts/components/challengeList.js
index bc2ebd0..66e809e 100644 (file)
--- a/public/javascripts/components/challengeList.js
+++ b/public/javascripts/components/challengeList.js
@@ -1,2 +1,31 @@
-//TODO (avec newGame button ?!)
-// ou challengeSummary organisé dans room...
+Vue.component("my-challenge-list", {
+       props: ["challenges"],
+       computed: {
+               showVariant: function() {
+                       this.challenges.length > 0 && !!this.challenges[0].variant;
+               },
+               showNbPlayers: function() {
+                       this.challenges.length > 0 && !!this.challenges[0].nbPlayers;
+               },
+       },
+       template: `
+               <table>
+                       <tr>
+                               <th v-if="showVariant">Variant</th>
+                               <th>From</th>
+                               <th>To</th>
+                               <th>Cadence</th>
+                               <th v-if="showNbPlayers">Number of players</th>
+                       </tr>
+                       <tr v-for="c in challenges" @click="$emit('click-challenge',c)">
+                               <td v-if="showVariant">{{ c.variant }}</td>
+                               <td>{{ c.from.name }}</td>
+                               <td>
+                                       <span v-for="p in c.to">{{ p.name }}</span>
+                               </td>
+                               <td>{{ c.mainTime }} + {{ c.increment }}</td>
+                               <td v-if="showNbPlayers">{{ c.nbPlayers }}</td>
+                       </tr>
+               </table>
+       `,
+});