Add first support for booleans in specific poi form section

This commit is contained in:
Léo Serre 2021-05-25 22:53:22 +02:00
parent 26ddc99766
commit 0f8259fe43
3 changed files with 82 additions and 2 deletions

View File

@ -49,7 +49,7 @@ $poi_types = array(
'b_fireplace' => "Cheminée ou poêle à bois en période non gardée ?",
'b_toilet' => "Latrines ou toilettes en période non gardée ?",
'l_water' => "URL du site web :")),
"halt" => array("Gîte d'étape", "Gîte", "#4e9a06", "halt", "Un gîte d'étape est un bâtiment qui permet l'hébergement sur ses plages d'ouvertures, et qui n'est pas accessible autrement.", array(
"halt" => array("Gîte d'étape", "Gîte", "#4e9a06", "halt", "Un gîte d'étape est un bâtiment qui permet l'hébergement uniquement sur ses périodes d'ouvertures.", array(
't_owner' => "Informations sur le⋅la propriétaire, le⋅la gardien⋅ne et moyens de contacts",
't_access' => "Description de l'accès, des transports en commun, et d'éventuels passages délicats",
't_description' => "Description sur le gîte et remarques (période d'ouverture, tarifs, prestations, réservations...)",

View File

@ -103,6 +103,33 @@ form.form input[type=radio]+label img {
height: 32px;
}
form.form .threecb:before {
font-family: "Font Awesome 5 Free";
font-weight: 400;
vertical-align: middle;
padding: 3px 8px 2px 4px;
margin: 5px 10px 5px 0;
display: inline-block;
width: 21px;
background: #ddd;
font-size: 25px;
}
form.form .threecb.check:before {
content: "\f058"; /* check */
}
form.form .threecb.uncheck:before {
content: "\f057"; /* cross */
}
form.form .threecb.intermediate:before {
content: "\f059"; /* question */
}
#abstract {
text-align: center;
color: #555;
font-style: italic;
}
/*****************************************
Controls of the map
*****************************************/

View File

@ -36,10 +36,63 @@
<div class="flex_line" id="type_selector">
<? foreach($poi_types as $type) { ?>
<input type="radio" name="poi_type" value="<?=$type[3]?>" id="<?=$type[3]?>">
<label for="<?=$type[3]?>"><img src="<?=$config['views_url']?>img/<?=$type[3]?>.svg"><br><?=$type[0]?></label>
<label for="<?=$type[3]?>" onclick='updateForm("<?=$type[3]?>")'><img src="<?=$config['views_url']?>img/<?=$type[3]?>.svg"><br><?=$type[0]?></label>
<? } ?>
</div>
<script type="text/javascript">
// Used to store all the forms skeleton and abstracts
<? foreach($poi_types as $type) { ?>
<?=$type[3]?>_abstract="<?=$type[4]?>";
<?=$type[3]?>_jsonform=<?=json_encode($type[5])?>;
<? } ?>
// Manages the three state checkbox feature
function update3State(id) {
input=$("input[name="+id+"]");
label=$("label[for="+id+"]");
switch(+input.val()) {
case 0:
input.val(1);
label.toggleClass('uncheck intermediate')
break;
case 1:
input.val(2);
label.toggleClass('intermediate check')
break;
default:
input.val(0);
label.toggleClass('check uncheck')
}
}
// Updates the specific form section when changing poi type
function updateForm(type) {
$("#abstract").html(this[type+'_abstract']);
html_form="";
$.each(this[type+'_jsonform'],function(index, value){
switch(index.charAt(0)) {
case 'b':
html_form+='<label class="threecb intermediate" for="'+index+'" onclick="update3State(\''+index+'\')" >'+value+'</label><input value="1" type="hidden" name="'+index+'" id="'+index+'"><br>'
break;
case 'n':
break;
case 't':
break;
case 'l':
break;
default:
console.log("ERROR: "+index+"'s type is not known");
}
});
$("#specific_form").html(html_form);
}
</script>
<p id="abstract"></p>
<div id="specific_form"></div>
<input name="submit" id="submit" type="submit" value="Ajouter l'hébergement">
</form>
</section>