diff --git a/src/fellchensammlung/models.py b/src/fellchensammlung/models.py index b017a81..d955f41 100644 --- a/src/fellchensammlung/models.py +++ b/src/fellchensammlung/models.py @@ -140,6 +140,12 @@ class RescueOrganization(models.Model): return Position(latitude=self.location.latitude, longitude=self.location.longitude) else: return None + @property + def description_short(self): + if self.description is None: + return "" + if len(self.description) > 200: + return self.description[:200] + f" ... [weiterlesen]({self.get_absolute_url()})" diff --git a/src/fellchensammlung/static/fellchensammlung/css/styles.css b/src/fellchensammlung/static/fellchensammlung/css/styles.css index 32a2bcf..1e09dae 100644 --- a/src/fellchensammlung/static/fellchensammlung/css/styles.css +++ b/src/fellchensammlung/static/fellchensammlung/css/styles.css @@ -937,6 +937,10 @@ div.announcement { cursor: pointer; } +.animal-shelter-marker { + background-image: url('../img/animal_shelter.png'); !important; +} + .maplibregl-popup { max-width: 600px !important; } diff --git a/src/fellchensammlung/templates/fellchensammlung/animal-shelters.html b/src/fellchensammlung/templates/fellchensammlung/animal-shelters.html new file mode 100644 index 0000000..f187649 --- /dev/null +++ b/src/fellchensammlung/templates/fellchensammlung/animal-shelters.html @@ -0,0 +1,13 @@ +{% extends "fellchensammlung/base_generic.html" %} +{% load i18n %} + +{% block title %}{% translate "Tierschutzorganisationen" %}{% endblock %} + +{% block content %} +
+
+ {% include "fellchensammlung/partials/partial-map.html" %} +
+
+ {% include "fellchensammlung/lists/list-animal-shelters.html" %} +{% endblock %} diff --git a/src/fellchensammlung/templates/fellchensammlung/lists/list-animal-shelters.html b/src/fellchensammlung/templates/fellchensammlung/lists/list-animal-shelters.html new file mode 100644 index 0000000..3c50983 --- /dev/null +++ b/src/fellchensammlung/templates/fellchensammlung/lists/list-animal-shelters.html @@ -0,0 +1,10 @@ +{% load i18n %} +
+ {% if rescue_organizations %} + {% for rescue_organization in rescue_organizations %} + {% include "fellchensammlung/partials/partial-rescue-organization.html" %} + {% endfor %} + {% else %} +

{% translate "Keine Tierschutzorganisationen gefunden." %}

+ {% endif %} +
diff --git a/src/fellchensammlung/templates/fellchensammlung/partials/partial-map.html b/src/fellchensammlung/templates/fellchensammlung/partials/partial-map.html index bd04728..353e2d0 100644 --- a/src/fellchensammlung/templates/fellchensammlung/partials/partial-map.html +++ b/src/fellchensammlung/templates/fellchensammlung/partials/partial-map.html @@ -52,35 +52,23 @@ {% endif %} {% endfor %} - {% for map_pin in map_pins %} - map.on('load', async () => { - image = await map.loadImage("{% static 'fellchensammlung/img/animal_shelter.png' %}"); - map.addImage('cat', image.data); - map.addSource('point', { - 'type': 'geojson', - 'data': { - 'type': 'FeatureCollection', - 'features': [ - { - 'type': 'Feature', - 'geometry': { - 'type': 'Point', - 'coordinates': [parseFloat({{ map_pin.longitude }}), parseFloat({{ map_pin.latitude }})] - } - } - ] - } - }); - map.addLayer({ - 'id': 'points', - 'type': 'symbol', - 'source': 'point', - 'layout': { - 'icon-image': 'cat', - 'icon-size': 0.25 - } - }); - }); + {% for rescue_orgnization in rescue_organizations %} + {% if rescue_orgnization.location %} + // create the popup + const popup_{{ forloop.counter }} = new maplibregl.Popup({offset: 25}).setHTML(`{% include "fellchensammlung/partials/partial-adoption-notice-minimal.html" %}`); + + // create DOM element for the marker + const el_{{ forloop.counter }} = document.createElement('div'); + el_{{ forloop.counter }}.id = 'marker_{{ forloop.counter }}'; + el_{{ forloop.counter }}.classList.add('animal-shelter-marker', 'marker'); + + const location_popup_{{ forloop.counter }} = [{{ rescue_orgnization.location.longitude | pointdecimal }}, {{ rescue_orgnization.location.latitude | pointdecimal }}]; + // create the marker + new maplibregl.Marker({element: el_{{ forloop.counter }}}) + .setLngLat(location_popup_{{ forloop.counter }}) + .setPopup(popup_{{ forloop.counter }}) // sets a popup on this marker + .addTo(map); + {% endif %} {% endfor %} {% if search_radius %} diff --git a/src/fellchensammlung/templates/fellchensammlung/partials/partial-rescue-organization.html b/src/fellchensammlung/templates/fellchensammlung/partials/partial-rescue-organization.html new file mode 100644 index 0000000..48b9483 --- /dev/null +++ b/src/fellchensammlung/templates/fellchensammlung/partials/partial-rescue-organization.html @@ -0,0 +1,24 @@ +{% load custom_tags %} +{% load i18n %} + +
+
+
+

{{ rescue_organization.name }}

+
+

+ + {% if rescue_organization.location %} + {{ rescue_organization.location.str_hr }} + {% else %} + {{ rescue_organization.location_string }} + {% endif %} +

+

+ {% if rescue_organization.description_short %} + {{ rescue_organization.description_short | render_markdown }} + {% endif %} +

+
+
\ No newline at end of file diff --git a/src/fellchensammlung/urls.py b/src/fellchensammlung/urls.py index b47ecc2..ad1ee21 100644 --- a/src/fellchensammlung/urls.py +++ b/src/fellchensammlung/urls.py @@ -25,6 +25,8 @@ urlpatterns = [ path("vermittlung//add-photo", views.add_photo_to_adoption_notice, name="adoption-notice-add-photo"), # ex: /adoption_notice/2/add-animal path("vermittlung//add-animal", views.adoption_notice_add_animal, name="adoption-notice-add-animal"), + + path("tierschutzorganisationen/", views.list_rescue_organizations, name="rescue-organizations"), path("organisation//", views.detail_view_rescue_organization, name="rescue-organization-detail"), diff --git a/src/fellchensammlung/views.py b/src/fellchensammlung/views.py index 405a507..29c354b 100644 --- a/src/fellchensammlung/views.py +++ b/src/fellchensammlung/views.py @@ -605,11 +605,15 @@ def external_site_warning(request): return render(request, 'fellchensammlung/external_site_warning.html', context=context) +def list_rescue_organizations(request): + rescue_organizations = RescueOrganization.objects.all() + context = {"rescue_organizations": rescue_organizations} + return render(request, 'fellchensammlung/animal-shelters.html', context=context) def detail_view_rescue_organization(request, rescue_organization_id): org = RescueOrganization.objects.get(pk=rescue_organization_id) return render(request, 'fellchensammlung/details/detail-rescue-organization.html', - context={"org": org, "map_center": org.position, "zoom_level": 6, "map_pins": [org.position]}) + context={"org": org, "map_center": org.position, "zoom_level": 6, "rescue_organizations": [org]}) def export_own_profile(request):