finish departement quizz meca

This commit is contained in:
2020-05-03 19:28:46 +02:00
parent 83984b9c44
commit 6200856e28
3 changed files with 114 additions and 34 deletions

View File

@@ -1,6 +1,6 @@
<template>
<div class="p-2">
<h1 class="text-3xl text-center text-orange-900 font-bold">Quizz</h1>
<h1 class="text-3xl text-center text-orange-900 font-bold mb-4">Quizz</h1>
<div v-if="!selectedQuizz" class="flex justify-center my-4">
<a v-for="(quizz, key) in quizzList"
:key="key"
@@ -9,7 +9,7 @@
{{ key }}
</a>
</div>
<div v-if="!levelQuizz" class="flex justify-center mx-2">
<div v-if="!levelQuizz" class="flex justify-center my-4">
<a v-for="(level, index) in levels"
:key="index"
class="btn-primary mr-1 cursor-pointer"
@@ -19,11 +19,24 @@
</div>
<div v-if="selectedQuizz && levelQuizz">
<div v-if="!responses" class="flex justify-center mt-8">
<span class="btn cursor-pointer" @click="startQuizz">Commencer</span>
<div v-if="!responses" class="flex justify-center my-4">
<span class="btn-primary" @click="startQuizz">Commencer</span>
</div>
<div v-else-if="results" class="flex flex-col items-center">
<div class="text-center text-2xl font-bold my-4">{{ selectedQuizz.name }}</div>
<div class="text-center text-2xl font-bold my-4">{{ note }} / {{ responses.length }}</div>
<span class="btn-primary mt-4" @click="newQuizz">Nouveau Quizz</span>
</div>
<div v-else class="flex flex-col">
<div class="text-center my-4"><span class="text-2xl font-bold">{{ currentQuestion[0] }}</span></div>
<div class="flex justify-center my-4">
<div v-for="(response, index) in currentResponses"
:key="index"
@click="responsed(currentQuestion, response)"
class="btn mx-1">
{{ response }}
</div>
</div>
<div v-else>
Start
</div>
</div>
</div>
@@ -39,33 +52,68 @@ export default {
quizzList: quizz,
selectedQuizz: null,
levels: [
1, 2, 3, 4, 5
1, 2, 3
],
levelQuizz: false,
currentQuestion: null,
currentResponses: null,
responses: null,
results: false,
}
},
computed: {
note() {
let note = 0
this.responses.forEach(response => {
if(response[0][1] === response[1]) {
note = note + 1
}
})
return note
}
},
methods: {
startQuizz: function () {
console.log('start')
this.responses = []
this.selectedQuizz = this.quizzList[this.selectedQuizz]
this.currentQuestion = this.selectedQuizz[Math.floor(Math.random() * this.selectedQuizz.length)]
this.currentResponses = [this.currentQuestion[1]]
let newQuestion = this.newQuestion()
this.currentQuestion = newQuestion.question
this.currentResponses = newQuestion.responses
},
newQuizz: function() {
this.selectedQuizz = null
this.levelQuizz = false
this.responses = null
this.results = false
},
newQuestion: function() {
let responses, question
let random_boolean = (this.selectedQuizz.reversible) ? Math.random() >= 0.5 : false
while (this.currentResponses.length <= (this.levelQuizz * 2 - 1)) {
let response = this.selectedQuizz[Math.floor(Math.random() * this.selectedQuizz.length)]
console.log(response)
if(!this.currentResponses.includes(response[1])) {
this.currentResponses.push(response[1])
question = this.selectedQuizz.responses[Math.floor(Math.random() * this.selectedQuizz.responses.length)].slice()
question = (random_boolean) ? question.reverse() : question
responses = [question[1]]
while (responses.length <= (this.levelQuizz * 2 - 1)) {
let response = this.selectedQuizz.responses[Math.floor(Math.random() * this.selectedQuizz.responses.length)].slice()
response = (random_boolean) ? response.reverse() : response
if(!responses.includes(response[1])) {
responses.push(response[1])
}
}
responses.sort((a, b) => a - b)
console.log(this.currentQuestion, this.currentResponses)
return { question, responses }
},
responsed: function(question, response) {
this.responses.push([question, response])
if(this.responses.length > 9) {
this.results = true
}
let newQuestion = this.newQuestion()
this.currentQuestion = newQuestion.question
this.currentResponses = newQuestion.responses
}
}
}

View File

@@ -1,5 +1,8 @@
{
"Départements" : [
"Départements" : {
"name": "Départements",
"reversible": true,
"responses" : [
["Ain", 1],
["Aisne", 2],
["Allier", 3],
@@ -12,9 +15,38 @@
["Aube", 10],
["Aude", 11],
["Aveyron", 12],
["Bouches-du-Rhône", 13],
["Calvados", 14],
["Cantal", 15],
["Charente", 16],
["Charente-Maritime", 17],
["Cher", 18],
["Corrèze", 19],
["Corse-du-Sud", "2A"],
["Haute-Corse", "2B"],
["Côte-d'Or", 21],
["Côtes-d'Armor", 22],
["Creuse", 23],
["Dordogne", 24],
["Doubs", 25],
["Drôme", 26],
["Eure", 27],
["Eure-et-Loir", 28],
["Finistère", 29],
["Gard", 30],
["Haute-Garonne", 31],
["Gers", 32],
["Gironde", 33],
["Hérault", 34],
["Ille-et-Vilaine", 35],
["Indre", 36],
["Indre-et-Loire", 37],
["Isère", 38],
["Jura", 39],
["Orne", 61],
["Paris", 75]
],
]
},
"Pays" : [
"ail", "amarante", "arachide", "artichaud", "asperge", "aubergine", "basilic", "betterave", "blette", "brocoli", "carotte", "chou", "ciboulette", "concombre", "courge", "courgette", "citrouille", "cresson", "echalote", "endive", "epinard", "fenouil", "flageolet", "gingembre", "haricot", "igname", "jacque", "laitue", "lentille", "marron", "navet", "oignon", "ortie", "oseille", "panais", "patisson", "persil", "piment", "pissenlit", "poireaux", "poivron", "potiron", "potimarron", "radis", "roquette", "scorsonere", "soja", "tomate"
]

View File

@@ -68,7 +68,7 @@
//}
.btn {
@apply border bg-orange-400 text-white py-2 px-4 shadow-sm rounded-md;
@apply border bg-orange-400 text-white py-2 px-4 shadow-sm rounded-md cursor-pointer;
&:hover {
@apply text-white bg-orange-600 transition-all duration-300;