Choix du ou des lieux opé
This commit is contained in:
parent
7e8384f086
commit
a2109cbb9d
6 changed files with 145 additions and 54 deletions
|
@ -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 = {}
|
||||
|
||||
|
|
|
@ -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"})
|
||||
|
|
|
@ -529,4 +529,11 @@ div.as-results {
|
|||
height: 400px;
|
||||
width: 100%;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#avis_lieu_vide {
|
||||
display:none;
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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>
|
||||
|
|
Loading…
Reference in a new issue