Merge branch 'master' into doc_sensitivity_module

GeotrekCE · Jun 24, 2024 · 262c166 · 262c166
2 parents d9bc831 + eb4e969
commit 262c166
Show file tree

Hide file tree

Showing 5 changed files with 59 additions and 16 deletions.
diff --git a/dev-requirements.txt b/dev-requirements.txt
@@ -51,14 +51,16 @@ packaging==24.0
     # via
     #   -c requirements.txt
     #   build
-pip-tools==7.3.0
+pip-tools==7.4.1
     # via -r dev-requirements.in
 pycodestyle==2.11.0
     # via flake8
 pyflakes==3.2.0
     # via flake8
 pyproject-hooks==1.0.0
-    # via build
+    # via
+    #   build
+    #   pip-tools
 python-dateutil==2.8.2
     # via
     #   -c requirements.txt

diff --git a/docs/changelog.rst b/docs/changelog.rst
@@ -5,6 +5,10 @@ CHANGELOG
 2.107.0+dev (XXXX-XX-XX)
 ------------------------
 
+**Improvements**
+
+- Allows user to edit flatpage WYSIWYG button-link and suggestion block
+
 **Documentation**
 
 - Improve PostgreSQL upgrade documentation
@@ -14,6 +18,7 @@ CHANGELOG
 
 - Fix: 'length' filter can now be displayed on mobile apps
 - Fix: make 'duration' mobile filter consistent in doc
+- Fix: Label annotation becoming empty when double-clicked (refs #3927)
 
 
 2.107.0 (2024-06-07)

diff --git a/geotrek/common/static/common/js/annotations.js b/geotrek/common/static/common/js/annotations.js
@@ -238,7 +238,7 @@ function initAnnotationsWidget(map) {
             }
             var entry = $('#annotationlist .entry#sample').clone();
             entry.attr({ id: '', 'annotation-id': id });
-            entry.on('click', () => edit_label(entry));
+            entry.on('click', edit_label);
             entry.find('.entry-name').text(annotation.name());
             if (query.editing == id) {
                 entry.find('.entry-adjust').hide();
@@ -258,10 +258,14 @@ function initAnnotationsWidget(map) {
         }
     }
 
-    function edit_label(entry) {
+    function edit_label(event) {
+        var entry = $(event.currentTarget);
         // When clicking annotation name, display text input allowing to change it
-        span = entry.find('.entry-name')
-        text_input = `<input id="label_input" value='${span.text()}' />`;
+        var span = entry.find('.entry-name')
+        if (span.find('input').length) {
+            return
+        }
+        var text_input = `<input id="label_input" value='${span.text()}' />`;
         $(span).html(text_input);
         $('#label_input').focus();
         $('#label_input').on('blur', () => update_edited_label(entry));

diff --git a/geotrek/flatpages/static/flatpages/tinymce/js/additional_tinymce_plugins.js b/geotrek/flatpages/static/flatpages/tinymce/js/additional_tinymce_plugins.js
@@ -6,7 +6,7 @@
 
 document.addEventListener("DOMContentLoaded", function () {
     tinymce.PluginManager.add('button-link', function (editor, url) {
-        var openDialogButtonLink = function () {
+        var openDialogButtonLink = function (defaultValues, element) {
             return editor.windowManager.open({
                 title: 'Lien bouton',
                 body: {
@@ -41,21 +41,35 @@ document.addEventListener("DOMContentLoaded", function () {
                     }
                 ],
                 initialData: {
-                    label: tinymce.activeEditor.selection.getContent(),
+                    label: defaultValues && defaultValues.label || tinymce.activeEditor.selection.getContent(),
+                    target: defaultValues ? !!defaultValues.target : false,
+                    link: defaultValues ? defaultValues.link.replace(window.location.origin, '') : ''
                 },
                 onSubmit: function (api) {
                     var data = api.getData();
                     if (!data.link || !data.label) {
                         return;
                     }
-                    var target = data.target ? ' target="_blank" rel="noopener noreferrer" ' : '';
-                    editor.insertContent('<a class="button-link"' + target + 'href="' + data.link + '">' + data.label + '</a>');
+                    if (element) {
+                        element.textContent = data.label;
+                        element.href = data.link.replace(window.location.origin, '');
+                        if (data.target) {
+                            element.setAttribute('target', '_blank')
+                            element.setAttribute('rel', 'noopener noreferrer')
+                        } else {
+                            element.removeAttribute('target')
+                            element.removeAttribute('rel')
+                        }
+                    } else {
+                        var target = data.target ? ' target="_blank" rel="noopener noreferrer" ' : '';
+                        editor.insertContent('<a class="button-link"' + target + 'href="' + data.link + '">' + data.label + '</a>');
+                    }
                     api.close();
                 }
             });
         };
 
-        var openDialogSuggestion = function () {
+        var openDialogSuggestion = function (defaultValues, element) {
             return editor.windowManager.open({
                 title: 'Suggestions',
                 body: {
@@ -95,15 +109,21 @@ document.addEventListener("DOMContentLoaded", function () {
                         primary: true
                     }
                 ],
-                initialData: {
-                    label: tinymce.activeEditor.selection.getContent(),
-                },
+                initialData: Object.assign(defaultValues || {}, {
+                    label: defaultValues && defaultValues.label || tinymce.activeEditor.selection.getContent(),
+                }),
                 onSubmit: function (api) {
                     var data = api.getData();
                     if (!data.type || !data.ids) {
                         return;
                     }
-                    editor.insertContent('<div class="suggestions" data-label="' + data.label + '" data-type="' + data.type + '" data-ids="' + data.ids + '" style="display: none" contenteditable="false"></div>');
+                    if (element) {
+                        element.dataset.label = data.label;
+                        element.dataset.type = data.type;
+                        element.dataset.ids = data.ids;
+                    } else {
+                        editor.insertContent('<div class="suggestions" data-label="' + data.label + '" data-type="' + data.type + '" data-ids="' + data.ids + '" style="display: none" contenteditable="false"></div>');
+                    }
                     api.close();
                 }
             });
@@ -124,6 +144,18 @@ document.addEventListener("DOMContentLoaded", function () {
                 openDialogSuggestion();
             }
         });
+
+        /* Edit button-link/suggestions block when clicking on it */
+        editor.on('click', function (e) {
+            const element = e.target;
+            if (element.classList.contains('button-link')) {
+                openDialogButtonLink({ label: element.textContent, link: element.href, target: element.target }, element)
+            }
+            if (element.classList.contains('suggestions')) {
+                const data = element.dataset;
+                openDialogSuggestion({ type: data.type, label: data.label, ids: data.ids }, element)
+            }
+        });
     })
 
 }); // end of document DOMContentLoaded event handler
diff --git a/requirements.txt b/requirements.txt
@@ -193,7 +193,7 @@ fiona==1.9.4.post1
     # via
     #   geotrek (setup.py)
     #   mapentity
-geojson==2.5.0
+geojson==3.1.0
     # via
     #   geotrek (setup.py)
     #   tif2geojson