Ajout d'un draft d'un quizz + un draft de l'exploitation des images via un webrequest sur pictureEngine.js
This commit is contained in:
@ -1,39 +1,32 @@
|
||||
<template>
|
||||
<v-label class="title-style-1">Paramètres</v-label>
|
||||
<v-divider :thickness="2" class="border-opacity-100" color="primary"/>
|
||||
<v-label class="title-style-2">Son</v-label>
|
||||
<div class="mutltiple-per-line">
|
||||
<v-switch hide-details label="Activer le son intégré" v-model="EmbeddedSound" class="ml-15" color="primary"/>
|
||||
<div>
|
||||
<v-slider hide-details class="v-slider-style ml-15" :disabled="EmbeddedSound === false" v-model="EmbeddedSoundVolume" color="primary"/>
|
||||
</div>
|
||||
</div>
|
||||
<v-switch label="Activer le son MQTT" v-model="MQTTSound" class="ml-15" color="primary"/>
|
||||
|
||||
<v-divider />
|
||||
<v-label class="title-style-2">Affichage</v-label>
|
||||
|
||||
<div>
|
||||
<v-switch hide-details label="Activer l'affichage des sattelites" v-model="SattelitesDisplay" class="ml-15 pb-3" color="primary"/>
|
||||
</div>
|
||||
|
||||
<v-divider />
|
||||
<v-label class="title-style-2">MQTT</v-label>
|
||||
|
||||
<div class="mutltiple-per-line">
|
||||
<v-icon v-model="MQTTBrokerState" class="ml-15 mb-5" color="error" icon="record">mdi-record</v-icon>
|
||||
<v-label class="ml-2 mb-10 mt-5">Etat du serveur MQTT</v-label>
|
||||
<v-btn class="ml-10 mb-5" color="primary" @click="goToDebugRoute">Debugger</v-btn>
|
||||
|
||||
</div>
|
||||
<v-divider />
|
||||
<v-label class="title-style-2">Jeu</v-label>
|
||||
|
||||
<div class="mutltiple-per-line">
|
||||
<v-switch hide-details label='Jouer le son de succès lorsque des points sont ajoutés' v-model="SuccessPlay" class="ml-15" color="primary"/>
|
||||
</div>
|
||||
|
||||
<v-switch hide-details label='Jouer le son de erreur lorsque des points sont enlevés' v-model="ErrorPlay" class="ml-15" color="primary"/>
|
||||
<template>
|
||||
<v-label class="title-style-1">Paramètres</v-label>
|
||||
<v-divider :thickness="2" class="border-opacity-100" color="primary"/>
|
||||
<v-label class="title-style-2">Son</v-label>
|
||||
<div class="mutltiple-per-line">
|
||||
<v-switch hide-details label="Activer le son intégré" v-model="EmbeddedSound" class="ml-15" color="primary"/>
|
||||
<div>
|
||||
<v-slider hide-details class="v-slider-style ml-15" :disabled="EmbeddedSound === false" v-model="EmbeddedSoundVolume" color="primary"/>
|
||||
</div>
|
||||
</div>
|
||||
<v-switch label="Activer le son MQTT" v-model="MQTTSound" class="ml-15" color="primary"/>
|
||||
<v-divider />
|
||||
<v-label class="title-style-2">Affichage</v-label>
|
||||
<div>
|
||||
<v-switch hide-details label="Activer l'affichage des sattelites" v-model="SattelitesDisplay" class="ml-15 pb-3" color="primary"/>
|
||||
</div>
|
||||
<v-divider />
|
||||
<v-label class="title-style-2">MQTT</v-label>
|
||||
<div class="mutltiple-per-line">
|
||||
<v-icon v-model="MQTTBrokerState" class="ml-15 mb-5" color="error" icon="record">mdi-record</v-icon>
|
||||
<v-label class="ml-2 mb-10 mt-5">Etat du serveur MQTT</v-label>
|
||||
<v-btn class="ml-10 mb-5" color="primary" @click="goToDebugRoute">Debugger</v-btn>
|
||||
</div>
|
||||
<v-divider />
|
||||
<v-label class="title-style-2">Jeu</v-label>
|
||||
<div class="mutltiple-per-line">
|
||||
<v-switch hide-details label='Jouer le son de succès lorsque des points sont ajoutés' v-model="SuccessPlay" class="ml-15" color="primary"/>
|
||||
</div>
|
||||
<v-switch hide-details label='Jouer le son de erreur lorsque des points sont enlevés' v-model="ErrorPlay" class="ml-15" color="primary"/>
|
||||
|
||||
</template>
|
||||
|
||||
@ -51,92 +44,89 @@
|
||||
const ErrorPlay = ref(false);
|
||||
const router = useRouter();
|
||||
|
||||
const goToDebugRoute = () => {
|
||||
router.push({ name: 'Debugger MQTT' }); // Redirige vers la route nommée 'debugger'
|
||||
};
|
||||
const goToDebugRoute = () => {
|
||||
router.push({
|
||||
name: 'Debugger MQTT'
|
||||
}); // Redirige vers la route nommée 'debugger'
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
if (localStorage.getItem('EmbeddedSound')) {
|
||||
EmbeddedSound.value = localStorage.getItem('EmbeddedSound') === 'true'; // Si l'état de la case à cocher est stocké, le mettre dans la référence
|
||||
}
|
||||
if (localStorage.getItem('MQTTSound')) {
|
||||
MQTTSound.value = localStorage.getItem('MQTTSound') === 'true'; // Si l'état de la case à cocher est stocké, le mettre dans la référence
|
||||
}
|
||||
if (localStorage.getItem('EmbeddedSoundVolume')) {
|
||||
EmbeddedSoundVolume.value = localStorage.getItem('EmbeddedSoundVolume'); // Si l'état de la case à cocher est stocké, le mettre dans la référence
|
||||
}
|
||||
if (localStorage.getItem('SattelitesDisplay')) {
|
||||
SattelitesDisplay.value = localStorage.getItem('SattelitesDisplay') === 'true'; // Added a default value for this switch
|
||||
}
|
||||
if (localStorage.getItem('SuccessPlay')) {
|
||||
SuccessPlay.value = localStorage.getItem('SuccessPlay') === 'true'; // Added a default value for this switch
|
||||
}
|
||||
if (localStorage.getItem('ErrorPlay')) {
|
||||
ErrorPlay.value = localStorage.getItem('ErrorPlay') === 'true'; // Added a default value for this switch
|
||||
}
|
||||
onMounted(() => {
|
||||
if (localStorage.getItem('EmbeddedSound')) {
|
||||
EmbeddedSound.value = localStorage.getItem('EmbeddedSound') === 'true'; // Si l'état de la case à cocher est stocké, le mettre dans la référence
|
||||
}
|
||||
if (localStorage.getItem('MQTTSound')) {
|
||||
MQTTSound.value = localStorage.getItem('MQTTSound') === 'true'; // Si l'état de la case à cocher est stocké, le mettre dans la référence
|
||||
}
|
||||
if (localStorage.getItem('EmbeddedSoundVolume')) {
|
||||
EmbeddedSoundVolume.value = localStorage.getItem('EmbeddedSoundVolume'); // Si l'état de la case à cocher est stocké, le mettre dans la référence
|
||||
}
|
||||
if (localStorage.getItem('SattelitesDisplay')) {
|
||||
SattelitesDisplay.value = localStorage.getItem('SattelitesDisplay') === 'true'; // Added a default value for this switch
|
||||
}
|
||||
if (localStorage.getItem('SuccessPlay')) {
|
||||
SuccessPlay.value = localStorage.getItem('SuccessPlay') === 'true'; // Added a default value for this switch
|
||||
}
|
||||
if (localStorage.getItem('ErrorPlay')) {
|
||||
ErrorPlay.value = localStorage.getItem('ErrorPlay') === 'true'; // Added a default value for this switch
|
||||
}
|
||||
});
|
||||
|
||||
watch(EmbeddedSound, (EmbeddedSoundNewValue) => {
|
||||
if (EmbeddedSoundNewValue !== null) {
|
||||
localStorage.setItem('EmbeddedSound', EmbeddedSoundNewValue); // Mettre à jour l'état de la case à cocher dans le LocalStorage chaque fois qu'il change.
|
||||
}
|
||||
});
|
||||
|
||||
watch(EmbeddedSoundVolume, (EmbeddedSoundVolumeNewValue) => {
|
||||
if (EmbeddedSoundVolumeNewValue !== null) {
|
||||
localStorage.setItem('EmbeddedSoundVolume', EmbeddedSoundVolumeNewValue); // Mettre à jour l'état de la case à cocher dans le LocalStorage chaque fois qu'il change.
|
||||
}
|
||||
});
|
||||
|
||||
watch(MQTTSound, (MQTTSoundNewValue) => {
|
||||
|
||||
if (MQTTSoundNewValue !== null) {
|
||||
localStorage.setItem('MQTTSound', MQTTSoundNewValue); // Mettre à jour l'état de la case à cocher dans le LocalStorage chaque fois qu'il change.
|
||||
}
|
||||
});
|
||||
watch(SattelitesDisplay, (SattelitesDisplaynewValue) => {
|
||||
if (SattelitesDisplaynewValue !== null) {
|
||||
localStorage.setItem('SattelitesDisplay', SattelitesDisplaynewValue); // Added a default value for this switch
|
||||
}
|
||||
});
|
||||
|
||||
watch(SuccessPlay, (SuccessPlaynewValue) => {
|
||||
if (SuccessPlaynewValue !== null) {
|
||||
localStorage.setItem('SuccessPlay', SuccessPlaynewValue); // Added a default value for this switch
|
||||
}
|
||||
});
|
||||
|
||||
watch(ErrorPlay, (ErrorPlaynewValue) => {
|
||||
if (ErrorPlaynewValue !== null) {
|
||||
localStorage.setItem('ErrorPlay', ErrorPlaynewValue); // Added a default value for this switch
|
||||
}
|
||||
});
|
||||
watch(EmbeddedSound, (EmbeddedSoundNewValue) => {
|
||||
if (EmbeddedSoundNewValue !== null) {
|
||||
localStorage.setItem('EmbeddedSound', EmbeddedSoundNewValue); // Mettre à jour l'état de la case à cocher dans le LocalStorage chaque fois qu'il change.
|
||||
}
|
||||
});
|
||||
watch(EmbeddedSoundVolume, (EmbeddedSoundVolumeNewValue) => {
|
||||
if (EmbeddedSoundVolumeNewValue !== null) {
|
||||
localStorage.setItem('EmbeddedSoundVolume', EmbeddedSoundVolumeNewValue); // Mettre à jour l'état de la case à cocher dans le LocalStorage chaque fois qu'il change.
|
||||
}
|
||||
});
|
||||
watch(MQTTSound, (MQTTSoundNewValue) => {
|
||||
if (MQTTSoundNewValue !== null) {
|
||||
localStorage.setItem('MQTTSound', MQTTSoundNewValue); // Mettre à jour l'état de la case à cocher dans le LocalStorage chaque fois qu'il change.
|
||||
}
|
||||
});
|
||||
watch(SattelitesDisplay, (SattelitesDisplaynewValue) => {
|
||||
if (SattelitesDisplaynewValue !== null) {
|
||||
localStorage.setItem('SattelitesDisplay', SattelitesDisplaynewValue); // Added a default value for this switch
|
||||
}
|
||||
});
|
||||
watch(SuccessPlay, (SuccessPlaynewValue) => {
|
||||
if (SuccessPlaynewValue !== null) {
|
||||
localStorage.setItem('SuccessPlay', SuccessPlaynewValue); // Added a default value for this switch
|
||||
}
|
||||
});
|
||||
watch(ErrorPlay, (ErrorPlaynewValue) => {
|
||||
if (ErrorPlaynewValue !== null) {
|
||||
localStorage.setItem('ErrorPlay', ErrorPlaynewValue); // Added a default value for this switch
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.title-style-1{
|
||||
margin-top: 20px;
|
||||
margin-bottom: 16px;
|
||||
margin-left: 20px;
|
||||
font-size: 30px;
|
||||
opacity: 100%;
|
||||
font-weight: 500;
|
||||
}
|
||||
.title-style-2{
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
margin-left: 40px;
|
||||
font-size: 25px;
|
||||
opacity: 100%;
|
||||
font-weight: 500;
|
||||
}
|
||||
.mutltiple-per-line{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.v-slider-style{
|
||||
width: 250px;
|
||||
margin-left: 16px;
|
||||
padding-top: px;
|
||||
}
|
||||
.title-style-1{
|
||||
margin-top: 20px;
|
||||
margin-bottom: 16px;
|
||||
margin-left: 20px;
|
||||
font-size: 30px;
|
||||
opacity: 100%;
|
||||
font-weight: 500;
|
||||
}
|
||||
.title-style-2{
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
margin-left: 40px;
|
||||
font-size: 25px;
|
||||
opacity: 100%;
|
||||
font-weight: 500;
|
||||
}
|
||||
.mutltiple-per-line{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.v-slider-style{
|
||||
width: 250px;
|
||||
margin-left: 16px;
|
||||
padding-top: px;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user