Commit bae68be6 authored by Bastien Zigmann's avatar Bastien Zigmann Committed by Vincent Dubois

Affichage du formulaire de signalisation d'erreur plus propre

parent 2719cba8
......@@ -546,22 +546,23 @@ class Geocropping {
return out += '</table></div>';
}
let content = `<div class='popup-info'>
<div class='row valide-element'>`;
if (this.isConnected) {
content += `
<div class="col-xs-12" role="group">
<button type="button" id="btnValidate" data-id="${properties.id}" data-type="${properties.type}" class='btn btn-success col-xs-4'><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></button>
<button data-toggle="button" aria-pressed"false" type="button" id="btnError" class='btn btn-danger col-xs-4'><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
<a target="_blank" class='btn btn-warning col-xs-4' role='button' href="https://www.openstreetmap.org/edit?${properties.type}=${properties.id}"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></a>
</div>
<div class='collapse element-signal col-xs-12' id='${properties.id}Signal'>`;
content += `
<div class="col-xs-12" role="group">
<button type="button" id="btnValidate" data-id="${properties.id}" data-type="${properties.type}" class='btn btn-success col-xs-4'><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></button>
<button data-toggle="button" aria-pressed"false" type="button" id="btnError" class='btn btn-danger col-xs-4'><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
<button type="button" id="btnSendToOSM" class='btn btn-warning col-xs-4' onclick="window.location.href='https://www.openstreetmap.org/edit?${properties.type}=${properties.id}'"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></button>
<!--<a target="_blank" id="btnSendToOSM" class='btn btn-warning col-xs-4' role='button' href="https://www.openstreetmap.org/edit?${properties.type}=${properties.id}"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></a>-->
</div>`
content += `<div class='collapse element-signal col-xs-12' id='${properties.id}Signal'>`;
if (tags.fixme && tags.fixme !== "") {
content += `<a style='color:red;' href="https://www.openstreetmap.org/edit?${properties.type}=${properties.id}" target="_blank"><span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span> L'objet a déjà été déclaré comme erronné, raison : "${tags.fixme}"</a>`
}
content +=
`<form onsubmit="return false;" role="form" data-id="${properties.id}" data-type="${properties.type}"></br>
`<form onsubmit="return false;" role="form" data-id="${properties.id}" data-type="${properties.type}">
<h2>Signaler une erreur</h2>
<div class="form-group">
<select name="errorType" id="errorType" class="form-control" required="required">
<option value="" hidden disabled selected>Choisir l'erreur...</option>
......@@ -572,14 +573,15 @@ class Geocropping {
</select>
<textarea name="comment" id="comment" maxlength="255" class="form-control" rows="1" placeholder="Commentaire" style="resize:none; overflow:hidden; display:none;"></textarea>
</div>
<div class='valide-element'>
<label>
<input type="checkbox" id="followChanges"> Je souhaite être notifié de la prochaine mise à jour de cet élément.
</label>
<div class='valide-element checkbox'>
<label><input type="checkbox" id="followChanges"> Je souhaite être notifié de la prochaine mise à jour de cet élément.</label>
</div>
<div align="center">
<input value="Signaler" type="submit" class="btn btn-primary">
<input value="Annuler" type="button" id="btnAnnulation" class="btn btn-primary">
</div>
<input value="Signaler" type="submit" class="btn btn-primary" style="align=center">
</form>
</div>`
</div>`
} else {
content += `
<div class="col-xs-12" role="group">
......@@ -600,8 +602,6 @@ class Geocropping {
popupEvent.popup.setContent(content);
$(popupEvent.popup.getElement()).on("click", (e) => {
if ($('.valide-element').has(e.target).length === 0) {
// Si on a pas cliqué sur sur la zone de validation, on ferme la popup
......@@ -614,17 +614,33 @@ class Geocropping {
////////
// Partie signalisation d'erreur
$('button#btnError', popupEvent.popup.getElement()).on('click', e => {
let $valid = $(`#btnValidate`, popupEvent.popup.getElement());
// let $follow = $(`#followChanges`, popupEvent.popup.getElement());
let $error = $(`#btnError`, popupEvent.popup.getElement());
let $sendTo = $(`#btnSendToOSM`, popupEvent.popup.getElement());
$(`#${feature.properties.id}Signal`, popupEvent.popup.getElement()).toggle(0, updatePopup);
if (typeof(tags.fixme) == "undefined" || tags.fixme === ""){
let disabled = $valid.is(':disabled');
$valid.prop('disabled', !disabled);
$valid.prop('disabled', true);
}
$error.prop('disabled', true);
$sendTo.prop('disabled', true);
});
// Dans le formulaire de signalisation d'erreur, permet de le fermet et de revenir au popup de base
$('#btnAnnulation', popupEvent.popup.getElement()).on('click', e => {
let $valid = $(`#btnValidate`, popupEvent.popup.getElement());
let $sendTo = $(`#btnSendToOSM`, popupEvent.popup.getElement());
let $error = $(`#btnError`, popupEvent.popup.getElement());
$(`#${feature.properties.id}Signal`, popupEvent.popup.getElement()).toggle(0, updatePopup);
if (typeof (tags.fixme) == "undefined" || tags.fixme === "") {
$valid.prop('disabled', false);
}
$sendTo.prop('disabled', false);
$error.prop('disabled', false);
});
/**
* Permet de mettre a jour l'élément et ferme la popup
*
......@@ -641,6 +657,7 @@ class Geocropping {
}
let $errorForm = $(`#${properties.id}Signal form`, popupEvent.popup.getElement());
$errorForm.on('submit', e => {
// Invalider l'élément
......@@ -730,7 +747,7 @@ class Geocropping {
if($('#followChanges').prop('checked',true)){
let req = OauthOsm.apiRequest.GetElementId;
req.params.id = $errorForm.data('id');
this._osm._sendRequest(req).then((data : any) => { this._ajoutFollowUnique(data.node["@attributes"].id, data.node["@attributes"].version); }, () => { });
this._osm._sendRequest(req).then((data : any) => { this._ajoutPreferenceUnique(data.node["@attributes"].id, data.node["@attributes"].version); }, () => { });
}
elementChanged();
// OKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKK
......@@ -1397,8 +1414,8 @@ class Geocropping {
this._osm._sendRequest(req);
}
//Ajout d'une preference
_ajoutFollowUnique(id, version){
//Ajout/mise à jour d'une preference
_ajoutPreferenceUnique(id, version){
let req = OauthOsm.apiRequest.UpdateSingleUserPreference;
req.params.key = id;
req.params.value = version;
......
......@@ -311,5 +311,5 @@ declare class Geocropping {
}): void;
_checkChanges(): void;
_removeChanges(resPref: any, changes: number[]): void;
_ajoutFollowUnique(id: any, version: any): void;
_ajoutPreferenceUnique(id: any, version: any): void;
}
......@@ -42,7 +42,7 @@ if (empty($_SERVER['HTTPS'])) {
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/leaflet-messagebox.css" />
<script src="js/osmtogeojson.js"></script>
<script src="js/leaflet.pattern.js"></script>
<!-- <script src="js/leaflet.pattern.js"></script> -->
<script src="js/fr.js"></script>
<script src="js/OauthOsm.js"></script>
<script src="js/MyNotification.js"></script>
......@@ -92,13 +92,16 @@ if (empty($_SERVER['HTTPS'])) {
<label><input type="checkbox" id="clickPos"> Position au clic</label>
</div>
<!-- Option se trouvant das le menu de droite permettant de se connecter au server dev d'OSM pour ne rien casser sur le vrai. Décommenter pour utiliser -->
<!-- <div class="checkbox">
<!-- <div class="checkbox">
<label><input type="checkbox" id="devMode"> Dev API</label>
</div> -->
</div>
<div class="log">
<a href="guide.html">Mode d'emploi</a>
<a href="https://framagit.org/renaudzigmann/Geocropping">Framagit</a>
<a href="https://framagit.org/renaudzigmann/Geocropping/commits/master">Logs des mises à jour</a>
<hr />
<p>Geocropping - Version alpha</p>
</div>
</div>
</div>
......
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment