feat(annonces): ajoute une carte des annonces

develop
François Poulain 2019-02-25 10:05:29 +01:00 commité par François Poulain
Parent 62084a83d8
révision b055b8f191
7 fichiers modifiés avec 110 ajouts et 14 suppressions

Voir le fichier

@ -16,7 +16,7 @@ $(() => {
done();
}
}
function prepareMap(map, mapdiv, height, campagne) {
function prepareMap(map, mapdiv, height, indexArgName, campagne) {
mapdiv.html('');
mapdiv.css('height', height);
map = L.map(mapdiv[0]).setView([50.004, 2.406], 7);
@ -24,7 +24,7 @@ $(() => {
let fullLink = '';
const campagneArg = campagne ? `&campagne=${campagne}` : '';
if (!mapdiv.hasClass('leaflet-map-full')) {
fullLink = `<a href="/carto-full?evts=${data}${campagneArg}"` +
fullLink = `<a href="/carto-full?${indexArgName}=${data}${campagneArg}"` +
'target="_blank">Afficher en grand format</a>, ';
}
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
@ -45,7 +45,7 @@ $(() => {
const apiPath = '/api/v2/pages/';
const campagne = mapdiv.attr('data-campagne');
loadLeaflet(map, () => {
map = prepareMap(map, mapdiv, height, campagne);
map = prepareMap(map, mapdiv, height, 'evts', campagne);
const icon = {};
for (const theme of ['primary', 'secondary', 'tertiary']) {
@ -81,4 +81,45 @@ $(() => {
});
});
});
$('.leaflet-annonce-map').each(function () {
let map;
const mapdiv = $(this);
const w = $(window);
const ratio = Math.max(2 / 3, w.height() / w.width());
const height = mapdiv.width() * ratio;
const apiPath = '/api/v2/pages/';
loadLeaflet(map, () => {
map = prepareMap(map, mapdiv, height, 'annonces', false);
const icon = {};
for (const theme of ['primary', 'secondary', 'tertiary']) {
icon[theme] = L.divIcon({
className: `leaflet-map-icon text-${theme}`,
iconSize: [24, 42],
iconAnchor: [12, 42],
popupAnchor: [0, -30]
});
}
mapdiv.attr('data-src').split(',').map((id) => {
$.get(`${apiPath}${id}/`, (data) => {
data.get_api_queryset.map((evt) => {
const theme = evt.get_theme_color;
const coords = [evt.latitude, evt.longitude];
const content = evt.content;
L.marker(coords, {
icon: icon[theme]
}).addTo(map)
.bindPopup(content, {
className: 'leaflet-map-popup',
maxHeight: height - 120,
keepInView: true
});
return false;
});
});
return false;
});
});
});
});

Voir le fichier

@ -2,6 +2,7 @@
// Cartes
// -----------------------------------------------------------------------------
.leaflet-annonce-map,
.leaflet-map {
height: 200px;
}

Voir le fichier

@ -235,6 +235,14 @@ class Carte(mixins.SetBlockTheme, blocks.StructBlock):
)
@register_contenu()
class CarteAnnonces(mixins.SetBlockTheme, blocks.StructBlock):
class Meta:
icon = 'openquote'
group = 'media'
label = 'carte des annonces'
@register_contenu()
class Tableau(mixins.SetBlockTheme, mixins.SetThemeColor, blocks.StructBlock):
class Meta:

Voir le fichier

@ -1076,6 +1076,40 @@ class AnnonceIndex(mixins.UniqPage, mixins.SiteCommonIndex, SitePage):
return qs
# Export fields over the API
# --------------------------
def get_excerpt(self, a):
return render_to_string(
'biohdf/includes/annonce.html',
context={'annonce': a},
)
@property
def get_api_queryset(self):
fields = [
'id',
'url',
'title',
'geolocalisation',
'longitude',
'latitude',
'get_theme_color',
]
return [
{
**{f: getattr(a, f) for f in fields},
'model_name': a._meta.model_name,
'content': self.get_excerpt(a),
}
for a in self.get_default_queryset()
]
api_fields = [
APIField('get_theme_color'),
APIField('get_api_queryset'),
]
class Annonce(SitePage, mixins.GeoLocated):
"""

Voir le fichier

@ -22,15 +22,19 @@ class CartoView(mixins.ThemeMixin, generic.ListView):
except Exception:
return False
evts = self.request.GET.get('evts', '')
indexes = models.EvenementIndex.objects.filter(
id__in=[int(i) for i in evts.split(',') if can_parse(i)]
)
campagne = taxonomy.Campagne.objects.filter(
slug=self.request.GET.get('campagne', '')
).first()
return {'indexes': indexes, 'campagne': campagne}
indexes = []
if 'evts' in self.request.GET:
evts = self.request.GET.get('evts', '')
indexes = models.EvenementIndex.objects.filter(
id__in=[int(i) for i in evts.split(',') if can_parse(i)]
)
campagne = taxonomy.Campagne.objects.filter(
slug=self.request.GET.get('campagne', '')
).first()
return {'indexes': indexes, 'campagne': campagne}
elif 'annonces' in self.request.GET:
indexes = models.AnnonceIndex.objects.all()
return {'indexes': indexes, 'annonces': True}
class SearchView(mixins.ThemeMixin, generic.ListView):
model = models.SitePage

Voir le fichier

@ -0,0 +1,8 @@
{% extends "./_baseblock.html" %}
{% load wagtailcore_tags %}
{% block interieur %}
<div class="leaflet-annonce-map" data-src="{{ page.get_current_annonce_index.id }}">
Cartographie des annonces engendrés par la page d'index : <a href="{{ page.get_current_annonce_index.url }}"><tt>{{ page.get_current_annonce_index }}</tt></a></li>.
</div>
{% endblock %}

Voir le fichier

@ -5,13 +5,13 @@
{% block content %}
<div class="maincontent">
<div class="leaflet-map leaflet-map-full"
<div class="{% if annonces %}leaflet-annonce-map{% else %}leaflet-map{% endif %} leaflet-map-full"
{% if campagne %}
data-campagne="{{ campagne.slug }}"
{% endif %}
data-src="{% for page in indexes %}{{ page.id }}{% if not forloop.last %},{% endif %}{% endfor %}"
>
Cartographie des formations et évènements engendrés par les pages d'index :
Cartographie des annonces ou formations et évènements engendrés par les pages d'index :
<ul>
{% for page in value.indexes %}
<li><a href="{{ page.url }}"><tt>{{ page.url }}</tt></a></li>