Adds a beforeOnUnload event listener for uploading files

src/main/resources/default/assets/common/core.js.pasta

@@ -343,3 +343,22 @@ sirius.executeEmbeddedScripts = function (_container) {
 
     nodeScriptReplace(_container);
 }
+/**@
+ * Warns the user when leaving the current site.
+ *
+ * This should mainly be used to prevent data loss - for example if the user has unsaved changes in a form, or a file
+ * is uploading. You should provide a function which is called when the user unloads the site, and the user is only
+ * warned, if the function returns true. This function should check if the user actually has unsaved data, or a file is
+ * uploading, for example. This method can be called multiple times with different callbacks and if any one of them
+ * return true, the user is warned. If no method is provided, the user is always warned.
+ *
+ * @param shouldWarnCallback the function to call on unload to determine if to warn
+ */
+sirius.warnOnUnload = function (shouldWarnCallback) {
+    window.addEventListener("beforeunload", function (event) {
+        if (!(shouldWarnCallback instanceof Function) || shouldWarnCallback()) {
+            event.preventDefault();
+            return event.returnValue = '';
+        }
+    });
+}

src/main/resources/default/taglib/t/fileUpload.html.pasta

@@ -78,19 +78,23 @@
             }
         },
         init: function () {
-            this.on('success', function (file, response) {
+            const dropzone = this;
+            sirius.warnOnUnload(function () {
+                return dropzone.getUploadingFiles().length + dropzone.getQueuedFiles().length;
+            });
+            dropzone.on('success', function (file, response) {
                 if (response.error) {
                     file.previewElement.classList.add('dz-error');
                     file.previewElement.classList.remove('dz-success');
                     const message = response.message || '___i18n("template.html.uploadFailed")';
                     file.previewElement.querySelector('[data-dz-errormessage]').innerHTML = message;
                     addErrorMessage(message);
                 } else if (response.refresh) {
-                    this.reloadAfterQueueComplete = true;
+                    dropzone.reloadAfterQueueComplete = true;
                 }
             });
-            this.on('queuecomplete', function () {
-                if (this.reloadAfterQueueComplete) {
+            dropzone.on('queuecomplete', function () {
+                if (dropzone.reloadAfterQueueComplete) {
                     setTimeout(function () {
                         document.location.reload(true);
                     }, 2500);

src/main/resources/default/taglib/t/imageUpload.html.pasta

@@ -83,7 +83,11 @@
             }
         },
         init: function () {
-            this.on('success', function (file, response) {
+            const dropzone = this;
+            sirius.warnOnUnload(function () {
+                return dropzone.getUploadingFiles().length + dropzone.getQueuedFiles().length;
+            });
+            dropzone.on('success', function (file, response) {
                 if (response.error) {
                     file.previewElement.classList.add('dz-error');
                     file.previewElement.classList.remove('dz-success');