- --> OK, mais ces flèches n'ont pas la même action selon les vues
- --> fetchN si liste, problème suivant/précédent sinon
-
-
-board qui bouge et activé que si #hash donnant numéro du problème
-deux listes : tous les problèmes sauf les miens
- + les miens
-
-
-//TODO: filter "my problems" ==> liste séparée (lors de la requête serveur)
---> bouton plutôt sous l'échiquier après soluce (sauf si anonymous)
---> puis dans la vue "my problems (listing échiquier gauche / instrus + soluce cachée à droite
-if (this.mode == "problem")
- {
- // Show problem instructions
- elementArray.push(
- h('div',
- {
- attrs: { id: "instructions-div" },
- "class": {
- "clearer": true,
- "section-content": true,
- },
- },
- [
- h('p',
- {
- attrs: { id: "problem-instructions" },
- domProps: { innerHTML: this.problem.instructions }
- }
- )
- ]
- )
- );
- }
-
-
- // TODO ici :: instrus + diag interactif + solution
- my-board + pilotage via movesList + VariantRules !
-
- <my-problem-preview v-show="stage=='preview'"
- v-for="(p,idx) in problems"
- v-bind:prob="p" v-bind:preview="false" v-bind:key="idx">
+ <div id="mainBoard" v-show="curIdx>=0">
+ <div id="instructions-div" class="section-content">
+ <p id="problem-instructions">{{ curProb.instructions }}</p>
+ </div>
+ <my-board :fen="curProb.fen"></my-board>
+ <div id="solution-div" class="section-content">
+ <h3 class="clickable" @click="showSolution = !showSolution">
+ {{ translations["Show solution"] }}
+ </h3>
+ <p id="problem-solution" v-show="showSolution">{{ curProb.solution }}</p>
+ <div class="button-group" v-show="curProb.uid==userId">
+ <button>Edit</button>
+ <button>Delete</button>
+ </div>
+ </div>
+ </div>
+ <button v-if="!!userId" @click="toggleListDisplay()">My problems (only)</button>
+ <my-problem-summary v-show="curIdx<0"
+ v-for="(p,idx) in sortedProblems" @click="setCurIdx(idx)"
+ v-bind:prob="p" v-bind:preview="false" v-bind:key="p.id">