wip: make the getMore button work again with new Request

umap/static/umap/js/modules/request.js

@@ -63,6 +63,14 @@ export const Request = BaseRequest.extend({
 // Adds uMap specifics to requests handling
 // like logging, CSRF, etc.
 export const ServerRequest = Request.extend({
+  _fetch: async function (method, uri, headers, data) {
+    // Add a flag so backend can know we are in ajax and adapt the response
+    // See is_ajax in utils.py
+    headers = headers || {}
+    headers['X-Requested-With'] = 'XMLHttpRequest'
+    return await Request.prototype._fetch.call(this, method, uri, headers, data)
+  },
+
   post: async function (uri, headers, data) {
     const token = document.cookie.replace(
       /(?:(?:^|.*;\s*)csrftoken\s*\=\s*([^;]*).*$)|^.*$/,

umap/templates/umap/content.html

@@ -36,33 +36,24 @@
 {% block bottom_js %}
   {{ block.super }}
   <script type="text/javascript">
-    window.addEventListener('DOMContentLoaded', (event => {
-      
-    !(function () {
+    window.addEventListener('DOMContentLoaded', event => {
       const ui = new L.U.UI(document.querySelector('header'))
-      const getMore = function (e) {
+      const server = new window.umap.ServerRequest(ui)
+      const getMore = async function (e) {
         L.DomEvent.stop(e)
-        xhr._ajax({
-          uri: this.href,
-          verb: 'GET',
-          callback: function (data) {
-            const container = this.parentNode
-            container.innerHTML = data
-            const more = document.querySelector('.more_button')
-            if (more) {
-              L.DomEvent.on(more, 'click', getMore, more)
-            }
-          },
-          context: this,
-        })
+        const [{html}, response] = await server.get(this.href)
+        const container = this.parentNode
+        container.innerHTML = html
+        const more = document.querySelector('.more_button')
+        if (more) {
+          L.DomEvent.on(more, 'click', getMore, more)
+        }
       }
       const more = document.querySelector('.more_button')
       if (more) {
         L.DomEvent.on(more, 'click', getMore, more)
       }
-    })(this)
-    }
-    ))
+    })
   </script>
 {% endblock bottom_js %}
 {% block footer %}

umap/views.py

@@ -108,6 +108,12 @@ class PaginatorMixin:
             return [self.list_template_name]
         return super().get_template_names()
 
+    def get(self, *args, **kwargs):
+        response = super().get(*args, **kwargs)
+        if is_ajax(self.request):
+            return simple_json_response(html=response.rendered_content)
+        return response
+
 
 class PublicMapsMixin(object):
     def get_public_maps(self):