Choix du ou des lieux opé

This commit is contained in:
Evarin 2017-04-19 01:56:15 +02:00
parent 7e8384f086
commit a2109cbb9d
6 changed files with 145 additions and 54 deletions

View file

@ -10,7 +10,7 @@ class LieuResource(ModelResource):
queryset = Lieu.objects.all()
resource_name = "lieu"
def build_filters(self, filters=None):
def build_filters(self, filters=None, **kwargs):
if filters is None:
filters = {}

View file

@ -41,6 +41,9 @@ class AvisLieuForm(HTMLTrimmerForm):
"les_plus": u"Les meilleures raisons de partir à cet endroit",
"les_moins": u"Ce qui vous a gêné ou manqué là-bas",
}
widgets = {
"lieu": forms.HiddenInput(attrs={"class":"lieu-hidden"})
}
class StageForm(forms.ModelForm):
date_widget = forms.DateInput(attrs={"class":"datepicker"})

View file

@ -529,4 +529,11 @@ div.as-results {
height: 400px;
width: 100%;
}
.hidden {
display: none;
}
}
#avis_lieu_vide {
display:none;
}

View file

@ -599,3 +599,12 @@ div.as-results ul li.as-message {
height: 400px;
width: 100%;
}
/* line 532, ../../sass/screen.scss */
.lieu-ui .hidden {
display: none;
}
/* line 537, ../../sass/screen.scss */
#avis_lieu_vide {
display: none;
}

View file

@ -1,4 +1,4 @@
function SelectLieuWidget(STATIC_ROOT, target, callback) {
function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
var map, input, autocomplete;
var $el = $(target);
var ui_el = $el.find('.lieu-ui');
@ -6,6 +6,7 @@ function SelectLieuWidget(STATIC_ROOT, target, callback) {
var content_el = $el.find('.window-content');
var ui_ready = false;
var lieux_db = {};
var message_el = $el.find(".lieu-message");
form_el.detach();
form_el.on("submit", nouveauLieu);
@ -32,11 +33,34 @@ function SelectLieuWidget(STATIC_ROOT, target, callback) {
autocomplete.addListener('place_changed', handlePlaceSearch);
}
this.showWidget = function() {
function setLieuOrigine (lieu) {
map.panTo(lieu.coord);
lieuSurCarte(lieu, greenIcon);
}
this.showWidget = function(lieu_id) {
$el.addClass("visible").removeClass("ajout");
if(!ui_ready)
initUI();
ui_el.removeClass("hidden");
form_el.detach();
if (lieu_id === undefined) {
$el.find("h3").text("Ajouter un lieu");
} else {
lieu_id = lieu_id * 1;
$el.find("h3").text("Modifier le lieu");
if(lieux_db[lieu_id] === undefined) {
$.getJSON(API_LIEU + lieu_id + "/?format=json",
function(data) {
lieux_db[data.id] = data;
setLieuOrigine(data);
askForSuggestions(data.coord);
});
ui_el.addClass("hidden");
} else {
setLieuOrigine(lieux_db[lieu_id]);
}
}
}
this.closeWidget = function() {
@ -92,9 +116,13 @@ function SelectLieuWidget(STATIC_ROOT, target, callback) {
lieux_db.suggestion = data;
map.panTo(data.coord);
lieuSurCarte(data);
lieuSurCarte(data, redIcon);
// Affichage des suggestions
askForSuggestions(location);
}
function askForSuggestions (location) {
$.getJSON("/api/v1/lieu/", {"format":"json",
"lat":location.lat,
"lng":location.lng}, showPropositions);
@ -102,23 +130,27 @@ function SelectLieuWidget(STATIC_ROOT, target, callback) {
// Callback suggestions
function showPropositions(data) {
// TODO gérer les appels concurrents
$.each(data.objects, function(i, item) {
lieuSurCarte(item);
var plieu = lieux_db[item.id];
if(plieu !== undefined)
item = plieu;
else
lieux_db[item.id] = item;
lieuSurCarte(item, blueIcon);
});
}
function lieuSurCarte(data) {
function lieuSurCarte(data, icone) {
// data : des données sur un lieu, sérialisé comme par tastypie
if(data.marqueur !== undefined)
data.marqueur.remove();
var icone = blueIcon;
if(data.marqueur !== undefined) {
if(map.hasLayer(data.marqueur))
return;
}
var fromSuggestion = false;
// Si c'est un résultat d'autocomplete
if(data.fromSuggestion === true) {
icone = redIcon;
fromSuggestion = true;
}
var marqueur = L.marker(data.coord,

View file

@ -66,17 +66,59 @@
});
// Widget du choix du lieu
var lieu_select = new SelectLieuWidget("{{ STATIC_URL|escapejs }}",
$("#lieu_widget"), lieuChoisi);
$("#stage-addlieu").prop("_lieustage_data", "new")
.on("click", lieu_select.showWidget);
var lieu_select = new SelectLieuWidget(
"{{ STATIC_URL|escapejs }}",
"{% url 'avisstage:api_dispatch_list' resource_name="lieu" api_name="v1" %}",
$("#lieu_widget"), lieuChoisi);
var avis_lieu_template = $("#avis_lieu_vide").remove().html();
var lieux_liste = $("#lieux-selector");
lieux_liste.find(".lieu-change")
.on("click", clickLieu);
var lieu_focus;
function clickLieu() {
lieu_focus = this;
lieu_select.showWidget();
var form_id = undefined;
var lieu_id = undefined;
if(this.id != "lieu-ajout") {
form_id = this.id.split("-");
form_id = form_id[form_id.length-1];
var dest_form = $("#avis-lieux-"+form_id);
lieu_id = dest_form.find("input.lieu-hidden").val();
}
lieu_focus = form_id;
lieu_select.showWidget(lieu_id);
}
function lieuChoisi(lieu) {
// TODO
var dest_form, dest_btn;
console.log(lieu);
console.log(lieu_focus);
if(lieu_focus === undefined) {
// Créer un nouveau lieu
var cnt = $("#id_lieux-TOTAL_FORMS");
var i_form = cnt.val()*1;
dest_form = $("<div>").html(avis_lieu_template.replace(/__prefix__/g, i_form));
dest_btn = $("<a>", {href:"javascript:void(0);",
class:"lieu-change",
id:"change-lieux-"+i_form})
.on("click", clickLieu);
lieux_liste.children().last().before(dest_btn);
cnt.val(i_form+1);
$("#avis_lieu_container").append(dest_form);
} else {
// Changer le lieu
dest_form = $("#avis-lieux-"+lieu_focus);
dest_btn = lieux_liste.find("#change-lieux-"+lieu_focus);
}
dest_form.find(".lieu-nom")
.text(lieu.nom+" ("+lieu.ville+")");
dest_btn.text(lieu.nom+" ("+lieu.ville+")");
dest_form.find("input.lieu-hidden")
.val(lieu.id);
lieu_select.closeWidget();
}
@ -118,12 +160,14 @@
{% endfor %}
{# Lieux #}
<div class="field">
<label>Lieux du stage</label>
<label>Lieu(x) du stage</label>
<div class="input">
{% for fform in avis_lieu_formset %}
{{ fform.lieu }}
{% endfor %}
<a href="javascript:void(0);" id="stage-addlieu">Ajouter un lieu</a>
<div id="lieux-selector">
{% for fform in avis_lieu_formset %}
<a id="change-{{ fform.prefix }}" class="lieu-change" href="javascript:void(0)">{{ fform.instance.lieu }}</a>
{% endfor %}
<a id="lieu-ajout" class="lieu-change ajout" href="javascript:void(0)">Ajouter un lieu</a>
</div>
</div>
</div>
@ -147,40 +191,13 @@
{{ avis_lieu_formset.management_form }}
<div id="avis_lieu_container">
{% for fform in avis_lieu_formset %}
<div class="avis_lieu">
<h2>Commentaire sur le lieu</h2>
<div class="avis_lieu" id="avis-{{ fform.prefix }}">
<h2>Commentaire sur le lieu "<span class="lieu-nom">{{ fform.instance.lieu }}</span>"</h2>
{{ fform.non_field_errors }}
{% for field in fform.hidden_fields %}
{{ field }}
{% endfor %}
{% for field in fform.visible_fields %}
{% if not field.name == "lieu" %}
{{ field.errors }}
<div class="field">
<div class="label">
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
{% if field.help_text %}
<p class="help_text">{{ field.help_text }}</p>
{% endif %}
</div>
<div class="input">
{{ field }}
</div>
</div>
{% endif %}
{% endfor %}
</div>
{% endfor %}
</div>
<div id="avis_lieu_vide">
{% with avis_lieu_formset.empty_form as fform %}
<h2>Commentaire sur le lieu</h2>
{{ fform.non_field_errors }}
{% for field in fform.hidden_fields %}
{{ field }}
{% endfor %}
{% for field in fform.visible_fields %}
{% if not field.name == "lieu" %}
{{ field.errors }}
<div class="field">
<div class="label">
@ -193,7 +210,30 @@
{{ field }}
</div>
</div>
{% endif %}
{% endfor %}
</div>
{% endfor %}
</div>
<div id="avis_lieu_vide">
{% with avis_lieu_formset.empty_form as fform %}
<h2>Commentaire sur le lieu "<span class="lieu-nom"></span>"</h2>
{{ fform.non_field_errors }}
{% for field in fform.hidden_fields %}
{{ field }}
{% endfor %}
{% for field in fform.visible_fields %}
{{ field.errors }}
<div class="field">
<div class="label">
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
{% if field.help_text %}
<p class="help_text">{{ field.help_text }}</p>
{% endif %}
</div>
<div class="input">
{{ field }}
</div>
</div>
{% endfor %}
{% endwith %}
</div>