Add file type check to form type file (key: allowedFileTypes)

CHANGELOG.md

@@ -1,3 +1,6 @@
+## next feature release
+* Add file type check to form type `file` (key: `allowedFileTypes`) ([PR#147](https://github.com/mapbender/mapbender-digitizer/pull/147))
+
 ## 2.0.6
 * Show error message when a YAML syntax error occurs in manager ([PR#145](https://github.com/mapbender/mapbender-digitizer/pull/145))
 * Fix popup width & height was ignored ([PR#146](https://github.com/mapbender/mapbender-digitizer/pull/146))

src/Mapbender/DataManagerBundle/Resources/public/FormRenderer.js

@@ -238,15 +238,17 @@
             }
             var self = this;
             $('input[type="file"][data-upload-url][data-name]', scope).each(function() {
-                var $input = $(this);
-                var name = $input.attr('data-name');
-                var $group = $input.closest('.mb-3');
-                var $realInput = $('input[name="' + name + '"]', $group);
-                var url = $input.attr('data-upload-url');
-                var $loadingIcon = $('.-js-loading-indicator', $group);
+                const $input = $(this);
+                const name = $input.attr('data-name');
+                const $group = $input.closest('.mb-3');
+                const $realInput = $('input[name="' + name + '"]', $group);
+                const url = $input.attr('data-upload-url');
+                const datatypes = $input.attr('data-allowed-types');
+                const $loadingIcon = $('.-js-loading-indicator', $group);
                 $input.fileupload({
                     dataType: 'json',
                     url: url,
+                    submit: (e, data) => self.checkFileExtension(data.files, datatypes),
                     success: function(response) {
                         var values = {};
                         values[name] = response.filename;
@@ -273,6 +275,20 @@
                 return false;
             });
         },
+        checkFileExtension: function (files, allowedTypesCsv) {
+            // no value means no restriction
+            if (!allowedTypesCsv) return true;
+            const datatypes = allowedTypesCsv.split(',').map(s => s.trim().toLowerCase());
+            for (let i = 0; i < files.length; ++i) {
+                const file = files[i];
+                const fileExt = (file.name.split('.').pop() || '').toLowerCase();
+                if (datatypes.indexOf(fileExt) === -1) {
+                    Mapbender.info(Mapbender.trans('mb.data-manager.error.invalid_file_extension') + ' ' + datatypes.join(', '));
+                    return false;
+                }
+            }
+            return true;
+        },
         getAttachmentUrl_: function(baseUrl, fieldName, inputValue) {
             if (inputValue && !/^(http[s]?)?:?\/\//.test(inputValue)) {
                 var baseName = inputValue.replace(/^.*?\/([^/]*)$/, '$1');
@@ -374,6 +390,7 @@
                 .attr(settings.attr || {})
                 .attr('accept', (settings.attr || settings).accept || null)
                 .attr('data-upload-url', settings.__uploadUrl__)
+                .attr('data-allowed-types', settings.allowedFileTypes)
                 .attr('data-name', settings.name)
             ;
             var $btnText = $('<span class="upload-button-text">')

src/Mapbender/DataManagerBundle/Resources/translations/messages.de.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Objektdetails
     attachment:
       open: Anhang öffnen
+    error:
+      invalid_file_extension: 'Ungültiger Dateityp. Erlaubte Dateitypen:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.en.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Detail data
     attachment:
       open: Open attachment
+    error:
+      invalid_file_extension: 'Invalid file type. Allowed file types:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.es.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Detalles del objeto
     attachment:
       open: Abrir archivo adjunto
+    error:
+      invalid_file_extension: 'Tipo de archivo no válido. Tipos de archivo permitidos:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.fr.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Données détaillées
     attachment:
       open: Ouvrir la pièce jointe
+    error:
+      invalid_file_extension: 'Type de fichier non valide. Types de fichiers autorisés:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.it.yaml

@@ -31,3 +31,5 @@ mb:
     details_title: Dettagli oggetto
     attachment:
       open: Apri allegato
+    error:
+      invalid_file_extension: 'Tipo di file non valido. Tipi di file consentiti:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.nl.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Detailgegevens
     attachment:
       open: Bijlage openen
+    error:
+      invalid_file_extension: 'Ongeldig bestandstype. Toegestane bestandstypen:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.pl.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Dane szczegółowe
     attachment:
       open: Otwórz załącznik
+    error:
+      invalid_file_extension: 'Nieprawidłowy typ pliku. Dozwolone typy plików:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.pt.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Detalhes do objeto
     attachment:
       open: Abrir anexo
+    error:
+      invalid_file_extension: 'Tipo de arquivo inválido. Tipos de arquivo permitidos:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.ru.yaml

@@ -30,3 +30,5 @@ mb:
     details_title: Детали объекта
     attachment:
       open: Открыть вложение
+    error:
+      invalid_file_extension: 'Недопустимый тип файла. Разрешённые типы файлов:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.tr.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Ayrıntılı veriler
     attachment:
       open: Eki aç
+    error:
+      invalid_file_extension: 'Geçersiz dosya türü. İzin verilen dosya türleri:'

src/Mapbender/DataManagerBundle/Resources/translations/messages.uk.yaml

@@ -32,3 +32,5 @@ mb:
     details_title: Детальні дані
     attachment:
       open: Відкрити вкладення
+    error:
+      invalid_file_extension: 'Недійсний тип файлу. Дозволені типи файлів:'