Liness/framadate-responsive
5
0
Fork 0
forked from tykayn/funky-framadate-front
Code Pull Requests Activity

affiche les horaires dans un sondage spécial dates

Browse Source
This commit is contained in:
Yannick Francois 2019-03-19 15:07:41 +01:00
parent eb79e61611
commit a5f3e96ad1
3 changed files with 51 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -2,6 +2,8 @@
Expérimentation d'une nouvelle façon de faire des sondage. Expérimentation d'une nouvelle façon de faire des sondage.
https://sketch.cloud/s/MMzYa/dRrDMZ
## Developpement ## Developpement
Si docker est disponible sur la machine : Si docker est disponible sur la machine :

33
public/dates.html
View File

@ -25,20 +25,49 @@
</section> </section>
<section> <section>
<p>Je veux ajouter des dates <select id="ajouterDesHoraires"><option>sans</option><option>avec des</option></select> horaires<span id="identiquesDifferentsPourChaqueJour" style="display:none"> <select><option>identiques</option><option>différents</option></select> pour chaque jour</span>.</p> <p>Je veux ajouter des dates <select id="ajouterDesHoraires"><option>sans</option><option>avec des</option></select> horaires<span id="identiquesDifferentsPourChaqueJour" style="display:none"> <select id="horairesIdentiquesOuDifferents"><option>identiques</option><option>différents</option></select> pour chaque jour</span>.</p>
</section> </section>
<section> <section>
<h1>Mes dates <span>(au format JJ / MM / AAAA)</span></h1> <h1>Les choix <span>(au format JJ / MM / AAAA)</span></h1>
<ul> <ul>
<li> <li>
<i class="far fa-calendar-alt"></i> <i class="far fa-calendar-alt"></i>
<input type="date" name="date-1"> <input type="date" name="date-1">
<button class="remove btn-no-style"><i class="fas fa-trash-alt"></i></button> <button class="remove btn-no-style"><i class="fas fa-trash-alt"></i></button>
<ul class="horaire-different" style="display:none">
<li>
<i class="far fa-chrono-alt"></i>
<input type="text" name="horaire-1">
<button class="remove btn-no-style"><i class="fas fa-trash-alt"></i></button>
</li>
</ul>
</li>
<li>
<i class="far fa-calendar-alt"></i>
<input type="date" name="date-1">
<button class="remove btn-no-style"><i class="fas fa-trash-alt"></i></button>
<ul class="horaire-different" style="display:none">
<li>
<i class="far fa-chrono-alt"></i>
<input type="text" name="horaire-1">
<button class="remove btn-no-style"><i class="fas fa-trash-alt"></i></button>
</li>
</ul>
</li> </li>
</ul> </ul>
<button id="addDateButton">Ajouter une date</button> <button id="addDateButton">Ajouter une date</button>
<ul class="horaire-identique" style="display:none">
<li>
<i class="far fa-chrono-alt"></i>
<input type="text" name="horaire-1">
<button class="remove btn-no-style"><i class="fas fa-trash-alt"></i></button>
</li>
</ul>
</section> </section>
<nav> <nav>

20
public/script.js
View File

@ -120,11 +120,27 @@ if($('#validation-pool-title') && localStorage["title"]) {
if($('#ajouterDesHoraires')) { if($('#ajouterDesHoraires')) {
ajouterDesHoraires.addEventListener('change', () => { ajouterDesHoraires.addEventListener('change', () => {
if (ajouterDesHoraires.value == 'avec des') { if (ajouterDesHoraires.value == 'avec des') {
console.log("avec des")
identiquesDifferentsPourChaqueJour.style.display = 'inline' identiquesDifferentsPourChaqueJour.style.display = 'inline'
$('.horaire-identique').style.display = 'inline'
} else { } else {
console.log("sans")
identiquesDifferentsPourChaqueJour.style.display = 'none' identiquesDifferentsPourChaqueJour.style.display = 'none'
$('.horaire-identique').style.display = 'none'
}
});
}
if($('#horairesIdentiquesOuDifferents')) {
horairesIdentiquesOuDifferents.addEventListener('change', () => {
if (horairesIdentiquesOuDifferents.value == 'identiques') {
$('.horaire-identique').style.display = 'inline'
$$('.horaire-different').forEach( (e) => {
e.style.display = 'none'
});
} else {
$('.horaire-identique').style.display = 'none'
$$('.horaire-different').forEach( (e) => {
e.style.display = 'inline'
});
} }
}); });
} }