Merge pull request #2939 from FinnStutzenstein/Encoding

Added UTF-8 byte order mark for csv export

CHANGELOG

@@ -46,6 +46,7 @@ Core:
 - Added watching permissions in client and change the view immediately on changes.
 - Validate HTML strings from CKEditor against XSS attacks.
 - Added success/error symbol to config to show if saving was successful.
+- Added UTF-8 byte order mark for every CSV export.
 
 Motions:
 - Added adjustable line numbering mode (outside, inside, none) for each

openslides/agenda/static/js/agenda/csv.js

@@ -16,7 +16,7 @@ angular.module('OpenSlidesApp.agenda.csv', [])
             });
         };
         return {
-            export: function (element, agenda) {
+            export: function (agenda) {
                 var csvRows = [
                     makeHeaderline()
                 ];
@@ -32,7 +32,7 @@ angular.module('OpenSlidesApp.agenda.csv', [])
                     row.push('"' + (item.is_hidden ? '1' : '')  + '"');
                     csvRows.push(row);
                 });
-                CsvDownload(csvRows, element, 'agenda-export.csv');
+                CsvDownload(csvRows, 'agenda-export.csv');
             },
         };
     }

openslides/agenda/static/js/agenda/site.js

@@ -270,8 +270,7 @@ angular.module('OpenSlidesApp.agenda.site', [
             PdfCreate.download(documentProvider.getDocument(), filename);
         };
         $scope.csvExport = function () {
-            var element = document.getElementById('downloadLinkCSV');
+            AgendaCsvExport.export($scope.itemsFiltered);
-            AgendaCsvExport.export(element, $scope.itemsFiltered);
         };
 
         /** select mode functions **/

openslides/core/config_variables.py

@@ -105,6 +105,16 @@ def get_config_variables():
         group='General',
         subgroup='System')
 
+    # CSV
+
+    yield ConfigVariable(
+        name='general_csv_separator',
+        default_value=',',
+        label='The separator used for the csv export and examples',
+        weight=144,
+        group='General',
+        subgroup='CSV')
+
     # Projector
 
     yield ConfigVariable(

openslides/core/static/js/core/csv.js

@@ -5,19 +5,17 @@
 angular.module('OpenSlidesApp.core.csv', [])
 
 .factory('CsvDownload', [
-    function () {
+    'Config',
-        return function (contentRows, element, fileName) {
+    'FileSaver',
-            if (navigator.msSaveBlob && typeof navigator.msSaveBlob === 'function') {
+    function (Config, FileSaver) {
-                // Bad browsers
+        var utf8_BOM = decodeURIComponent('%EF%BB%BF');
-                var blob = new Blob([contentRows.join('\r\n')]);
+        return function (contentRows, filename) {
-                navigator.msSaveBlob(blob, fileName);
+            var separator = Config.get('general_csv_separator').value;
-            } else { // Good browsers
+            var rows = _.map(contentRows, function (row) {
-                // %0A is the url encoded linefeed character. Needed to be
+                return row.join(separator);
-                // percentage encoded for the data url.
+            });
-                element.href = 'data:text/csv;charset=utf-8,' + contentRows.join('%0A');
+            var blob = new Blob([utf8_BOM + rows.join('\n')]);
-                element.download = fileName;
+            FileSaver.saveAs(blob, filename);
-                element.target = '_blank';
-            }
         };
     }
 ]);

openslides/motions/static/js/motions/csv.js

@@ -15,7 +15,7 @@ angular.module('OpenSlidesApp.motions.csv', [])
             });
         };
         return {
-            export: function (element, motions) {
+            export: function (motions) {
                 var csvRows = [
                     makeHeaderline()
                 ];
@@ -32,16 +32,16 @@ angular.module('OpenSlidesApp.motions.csv', [])
                     row.push('"' + motion.origin + '"');
                     csvRows.push(row);
                 });
-                CsvDownload(csvRows, element, 'motions-export.csv');
+                CsvDownload(csvRows, 'motions-export.csv');
             },
-            downloadExample: function (element) {
+            downloadExample: function () {
                 var csvRows = [makeHeaderline(),
                     // example entries
                     ['A1', 'Title 1', 'Text 1', 'Reason 1', 'Submitter A', 'Category A', 'Last Year Conference A'],
-                    ['B1', 'Title 2', 'Text 2', 'Reason 2', 'Submitter B', 'Category B', ''                      ],
+                    ['B1', 'Title 2', 'Text 2', 'Reason 2', 'Submitter B', 'Category B', ''],
-                    [''  , 'Title 3', 'Text 3', ''        , ''           , ''          , ''                      ],
+                    [''  , 'Title 3', 'Text 3', '', '', '', ''],
                 ];
-                CsvDownload(csvRows, element, 'motions-example.csv');
+                CsvDownload(csvRows, 'motions-example.csv');
             },
         };
     }

openslides/motions/static/js/motions/site.js

@@ -880,8 +880,7 @@ angular.module('OpenSlidesApp.motions.site', [
 
         // Export as a csv file
         $scope.csvExport = function () {
-            var element = document.getElementById('downloadLinkCSV');
+            MotionCsvExport.export($scope.motionsFiltered);
-            MotionCsvExport.export(element, $scope.motionsFiltered);
         };
         // Export as docx file
         $scope.docxExport = function () {
@@ -1746,8 +1745,7 @@ angular.module('OpenSlidesApp.motions.site', [
         };
         // download CSV example file
         $scope.downloadCSVExample = function () {
-            var element = document.getElementById('downloadLink');
+            MotionCsvExport.downloadExample();
-            MotionCsvExport.downloadExample(element);
         };
     }
 ])

openslides/topics/static/js/topics/csv.js

@@ -15,7 +15,7 @@ angular.module('OpenSlidesApp.topics.csv', [])
             });
         };
         return {
-            downloadExample: function (element) {
+            downloadExample: function () {
                 var csvRows = [makeHeaderline(),
                     // example entries
                     ['Demo 1', 'Demo text 1', '1:00', 'test comment', ''],
@@ -23,7 +23,7 @@ angular.module('OpenSlidesApp.topics.csv', [])
                     ['Demo 2', 'Demo text 2', '1:30', '', '']
 
                 ];
-                CsvDownload(csvRows, element, 'agenda-example.csv');
+                CsvDownload(csvRows, 'agenda-example.csv');
             },
         };
     }

openslides/topics/static/js/topics/site.js

@@ -372,8 +372,7 @@ angular.module('OpenSlidesApp.topics.site', ['OpenSlidesApp.topics', 'OpenSlides
         };
         // download CSV example file
         $scope.downloadCSVExample = function () {
-            var element = document.getElementById('downloadLink');
+            TopicsCsvExample.downloadExample();
-            TopicsCsvExample.downloadExample(element);
         };
      }
 ]);

openslides/users/static/js/users/csv.js

@@ -17,7 +17,7 @@ angular.module('OpenSlidesApp.users.csv', [])
             });
         };
         return {
-            export: function (element, users) {
+            export: function (users) {
                 var csvRows = [
                     makeHeaderline()
                 ];
@@ -38,10 +38,10 @@ angular.module('OpenSlidesApp.users.csv', [])
                     row.push(user.is_committee ? '1' : '0');
                     csvRows.push(row);
                 });
-                CsvDownload(csvRows, element, 'users-export.csv');
+                CsvDownload(csvRows, 'users-export.csv');
             },
 
-            downloadExample: function (element) {
+            downloadExample: function () {
                 // try to get an example with two groups and one with one group
                 var groups = Group.getAll();
                 var csvGroups = '';
@@ -62,7 +62,7 @@ angular.module('OpenSlidesApp.users.csv', [])
                     ['', '', 'Executive Board', '', '', '', '', '', '', '1'],
 
                 ];
-                CsvDownload(csvRows, element, 'users-example.csv');
+                CsvDownload(csvRows, 'users-example.csv');
             }
         };
     }

openslides/users/static/js/users/site.js

@@ -636,8 +636,7 @@ angular.module('OpenSlidesApp.users.site', [
         };
         // Export as a csv file
         $scope.csvExport = function () {
-            var element = document.getElementById('downloadLinkCSV');
+            UserCsvExport.export($scope.usersFiltered);
-            UserCsvExport.export(element, $scope.usersFiltered);
         };
     }
 ])
@@ -1086,8 +1085,7 @@ angular.module('OpenSlidesApp.users.site', [
         };
         // download CSV example file
         $scope.downloadCSVExample = function () {
-            var element = document.getElementById('downloadLink');
+            UserCsvExport.downloadExample();
-            UserCsvExport.downloadExample(element);
         };
     }
 ])