V1.4

francoralite/apps/francoralite_api/version.py

@@ -1 +1 @@
-__version__ = "1.3"
+__version__ = "1.4"

francoralite/apps/francoralite_front/static/francoralite_front/js/webcomponents/map.js

@@ -39,7 +39,7 @@ const STYLESHEET = `
 class FrancoraliteMap extends HTMLElement {
 
   static get observedAttributes() {
-    return ["lat", "lng", "zoom", "bounds", "markers-url", "markers-list", "markers-drag", "geojson-data"];
+    return ["lat", "lng", "zoom", "bounds", "markers-url", "markers-list", "markers-drag", "geojson-data","cultural-areas"];
   }
 
   get lat() {
@@ -78,6 +78,10 @@ class FrancoraliteMap extends HTMLElement {
     return JSON.parse(this.getAttribute("geojson-data"));
   }
 
+  get culturalAreas() {
+    return this.getAttribute("cultural-areas");
+  }
+
   attributeChangedCallback(name, oldValue, newValue) {
     // super.attributeChangedCallback(name, oldValue, newValue);
 
@@ -222,8 +226,11 @@ class FrancoraliteMap extends HTMLElement {
       removeOutsideVisibleBounds: true,
     });
 
+
     if (this.geojsonData) {
       L.geoJSON(this.geojsonData).addTo(this.map);
+    } else if (this.culturalAreas ) {
+      this.requestCulturalArea();
     } else if (this.markersList) {
       // There's a markers list !
       this.addMarkers(this.markersList, markersLayer);
@@ -241,11 +248,16 @@ class FrancoraliteMap extends HTMLElement {
       this.map.fitWorld({animate: false});
     } else if (this.lat && this.lng || this.zoom) {
       this.map.setView([this.lat || DEFAULT_LAT, this.lng || DEFAULT_LNG], this.zoom || DEFAULT_ZOOM);
+    } else if (this.geojsonData) {
+      let bounds = L.geoJSON(this.geojsonData).getBounds();
+      this.map.fitBounds(bounds);
     } else {
       this.map.fitBounds(this.bounds || DEFAULT_BOUNDS);
     }
   }
 
+
+
   requestMarkers(markersLayer, dragMarkers='') {
     // Request the locations of the collections
     if (this.markersUrl) {
@@ -312,6 +324,8 @@ class FrancoraliteMap extends HTMLElement {
       }
     };
 
+
+
     // Test the type of the locations
     if (Array.isArray(locations)) {
       locations.forEach(loc => createMarker(loc));
@@ -323,6 +337,30 @@ class FrancoraliteMap extends HTMLElement {
     this.map.addLayer(markersLayer);
   }
 
+  requestCulturalArea() {
+    // Request the locations of the cultural areas
+    let xhr = new XMLHttpRequest();
+    xhr.addEventListener('load', (event) => {
+      const data = JSON.parse(event.target.response);
+      data.forEach(area => {
+        if (!area.geojson) {
+          return;
+        }
+        const geojson = area.geojson;
+        L.geoJSON(geojson, {color: 'orange', fillOpacity: 0.5})
+          .bindTooltip(
+            area.name
+          )
+          .on("click", function(e) {
+              this._map.fitBounds(e.target.getBounds());
+          })
+          .addTo(this.map);
+      });
+    });
+    xhr.open('GET', '/api/cultural_area', true);
+    xhr.send(null);
+  }
+
   setNodeValue(nodeSelector, value) {
     const node = document.querySelector(nodeSelector);
     if (node instanceof HTMLInputElement) {

francoralite/apps/francoralite_front/templates/enum/cultural_area-add.html

@@ -46,6 +46,32 @@
     {% csrf_token %}
     {% field_editor form.name %}
     {% field_editor form.geojson %}
+
+    <!-- Sélection du fichier GeoJSON -->
+    <div class="container_line">
+      <label class="control-label" for="id_geojson_file">{% trans "Choix d'un fichier GeoJSON ..." %}</label>
+      <div class="input-group">
+        <input type="file" id="id_geojson_file" class="form-control" accept=".geojson" />
+        <span class="input-group-btn">
+          <button class="btn btn-default" id="id_geojson_submit" type="button">{% trans "Sélectionner" %}</button>
+        </span>
+      </div>
+      <!-- Lecture du fichier GeoJSON et dépôt dans le champ caché -->
+      <script>
+        document.getElementById('id_geojson_submit').addEventListener('click', function() {
+          const fileInput = document.getElementById('id_geojson_file');
+          const file = fileInput.files[0];
+          const reader = new FileReader();
+          reader.onload = function(event) {
+            const geojson = event.target.result;
+            document.getElementById('id_geojson').value = geojson;
+          };
+          reader.readAsText(file);
+        });
+      </script>
+    </div>
+
+
 
     {% buttons_form %}
   </form>

francoralite/apps/francoralite_front/templates/enum/cultural_area-detail.html

@@ -39,14 +39,18 @@
 {% if cultural_area %}
 
   {% field_data_id form.name cultural_area.name|safe %}
-  {% field_data_id form.geojson cultural_area.geojson|json %}
+  {% if cultural_area.geojson|json|length > 150 %}
+    {% field_data_id form.geojson cultural_area.geojson|json truncate=150 %}
+  {% else %}
+    {% field_data_id form.geojson cultural_area.geojson|json %}
+  {% endif %}
 
   {% if cultural_area.geojson %}
   <div class="map-container">
     <francoralite-map geojson-data="{{ cultural_area.geojson|json|escape }}"></francoralite-map>
   </div>
   {% endif %}
-
+ 
 {% else %}
   <p>{% trans "Cette aire culturelle n'existe pas." %}</p>
 {% endif %}

francoralite/apps/francoralite_front/templates/enum/cultural_area.html

@@ -2,15 +2,24 @@
 {% load i18n %}
 {% load markdown_extra %}
 {% load data_display %}
-
+{% load static %}
 
 {% block javascript %}
   {{ block.super }}
+  <script type="module" src="{% static "francoralite_front/js/webcomponents/map.js" %}"></script>
 {% endblock %}
 
 
 {% block stylesheets %}
   {{ block.super }}
+  <style>
+    francoralite-map {
+      height: 500px;
+      width: 100%;
+      display: inline-block;
+      justify-content: center;
+    }
+  </style>
 {% endblock %}
 
 {% block title_name %}
@@ -36,6 +45,8 @@
 <div class="fullpage">
   <!-- If there is some cultural_area (number of elements > 0 ) -->
 {% if cultural_areas|length > 0 %}
+  <francoralite-map cultural-areas=True></francoralite-map>
+
   <!-- Table to display the cultural_areas -->
   <table class="listing">
   <tr>

francoralite/apps/francoralite_front/templatetags/data_display.py

@@ -61,7 +61,7 @@ def field_data(label, data, empty=True):
     return mark_safe(code)
 
 @register.simple_tag
-def field_data_id(field, data, empty=True):
+def field_data_id(field, data, empty=True, truncate=0):
     try:
         str_label = str(field.label)
     except Exception:
@@ -73,6 +73,9 @@ def field_data_id(field, data, empty=True):
             str_data = ""
     except Exception:
         str_data = data
+
+    if truncate>0:
+        str_data = str_data[:truncate] + " ..."
 
     if empty is False and str_data == "":
         code = ""

francoralite/apps/francoralite_front/tests/enums/enums_test.py

@@ -140,8 +140,10 @@ def test_create_err_409(self, francoralite_context):
             francoralite_context.set_element_value('id_' + self.first_text_field, self.data[0][self.first_text_field])
 
             # Write other field
-            if self.second_text_field is not None:
-                francoralite_context.set_element_value('id_' + self.second_text_field, self.data[0][self.second_text_field])
+            if self.second_text_field is not None :
+                if self.second_text_field == 'geojson':
+                    francoralite_context.set_element_value('id_' + self.second_text_field, '{}')
+                francoralite_context.set_element_value('id_' + self.second_text_field, 'null')
 
             # Validation
             francoralite_context.find_element(by_id='save').click()

francoralite/apps/francoralite_front/tests/enums/test_cultural_area.py

@@ -1,7 +1,7 @@
 from enums_test import EnumsTest
 
 
-class TestCivility(EnumsTest):
+class TestCulturalArea(EnumsTest):
     second_text_field = 'geojson'
     second_text_value = '{"foo": "bar", "spam": 42}'
     clear_fields_on_add = True
@@ -11,9 +11,9 @@ class TestCivility(EnumsTest):
         {"id":"1", "name":"Poitou", "geojson":'{"type": "Polygon", '
             '"coordinates": [[[1.021729, 46.562637], [0.587769, 46.984], '
             '[-0.22522, 47.06638], [-2.312622, 47.017716], '
-            '[-1.653442, 46.327965], [-0.488892, 46.297611], '
-            '[0.447006, 45.926319], [1.021729, 46.562637]]]}'},
+            '[-1.653442, 46.327965], ...'},
         {"id":"2", "name":"Saintonge, Poitou", "geojson":"null"},
         {"id":"3", "name":"Vendée", "geojson":"null"},
     ]
     new_data = {"name":"Québec", "geojson":'{"key": "value", "number": 42}'}
+

setup.py

@@ -47,7 +47,8 @@
     'django-extra-views==0.13.0',
     'pyyaml==5.4.1',
     'Werkzeug==2.2.3',
-    'sqlparse==0.4.2',
+    'django-dirtyfields==1.5.0',
+    'sqlparse==0.4.4',
     'django-markdownx==3.0.1',
     'django_select2==7.6.2',
     'lxml==4.9.1',