Déplacement des traductions dans le domaine "file_upload" et utilisation dans...

Déplacement des traductions dans le domaine "file_upload" et utilisation dans les templates et le JS.

DependencyInjection/IrsteaFileUploadExtension.php

@@ -48,6 +48,7 @@ class IrsteaFileUploadExtension extends Extension implements PrependExtensionInt
                             "$pluginDir/js/jquery.fileupload-validate.js",
                             "$pluginDir/js/jquery.fileupload-ui.js",
                             "@BazingaJsTranslationBundle/Resources/js/translator.js",
+                            'js/translations/file_upload/*.js',
                             '@IrsteaFileUploadBundle/Resources/js/widget/file_upload.js'
                         ],
                     ],

Resources/js/widget/file_upload.js

@@ -2,19 +2,23 @@
  * Copyright (C) 2015 IRSTEA
  * All rights reserved.
  */
-(function($) {
+(function($, Translator) {
 
     var formatFileSize = function(size) {
+            var unit;
             if(size > 1000000000) {
-                return (size/1000000000).toFixed(2) + ' Gio';
+                size = (size/1000000000).toFixed(2);
+                unit = 'Gi';
+            } else if(size > 1000000) {
+                size = (size/1000000).toFixed(2);
+                unit = 'Mi';
+            } else if(size > 1000) {
+                size = (size/1000).toFixed(2);
+                unit ='Ki';
+            } else {
+                unit = '';
             }
-            if(size > 1000000) {
-                return (size/1000000).toFixed(2) + ' Mio';
-            }
-            if(size > 1000) {
-                return (size/1000).toFixed(2)+ ' Kio';
-            }
-            return size + ' o';
+            return Translator.trans('file_size(%size%,%unit%)', {size:size, unit:unit}, 'file_upload');
         },
         formatBitrate = function(rate) {
             return formatFileSize(rate) + '/s';
@@ -48,7 +52,7 @@
         var showError = function(entry, message) {
                 var $this = $(entry);
                 if(message) {
-                    $this.find('.error').text(message);
+                    $this.find('.error').text(Translator.trans(message));
                 }
                 $this.addClass('alert alert-danger');
                 $this.find('.error').show();
@@ -84,6 +88,7 @@
                 downloadTemplateId: null,
                 filesContainer: $this.find('.fileinput-entries'),
                 dropZone: $this,
+                i18n: Translator.trans,
                 uploadTemplate: function(data) {
                     var rows = $();
                     $.each(data.files, function (index, file) {
@@ -186,4 +191,4 @@
 
     };
 
-})(jQuery);
+})(jQuery, Translator);

Resources/less/file_upload.less

@@ -6,15 +6,15 @@ All rights reserved.
 @import "variables.less";
 
 .fileinput-entry {
-    & > * {
-        margin: 0 0.2em;
+    .cancel, .delete {
+        margin-left: 0.2em;
     }
     .description {
         display: inline;
         width: auto;
         height: auto;
         padding: @padding-xs-vertical @padding-xs-horizontal;
-        //margin: 0;
+        margin: 0 0.2em;
     }
     .progress {
         height: (@line-height-computed / 2);
@@ -34,6 +34,9 @@ All rights reserved.
         }
         .error {
             display: inline;
+            &:after {
+                content: ".";
+            }
         }
         .size, .description {
             display: none;
@@ -49,3 +52,8 @@ All rights reserved.
     height: auto !important;
     min-height: @input-height-base;
 }
+
+.template-upload .size {
+    &:before { content: "("; }
+    &:after  { content: ")"; }
+}

Resources/translations/file_upload.fr.yml

+form:
+    description.placeholder: Description facultative
+    max_number_of_files(%num%): %num% fichiers maximum
+    min_file_size: Taille minimale
+    max_file_size: Taille maximale
+
+file_size(%size%,%unit%): %size% %unit%o
+
+# Message d'erreurs du plugin
+unknownError: Erreur inconnue
+maxNumberOfFiles: Nombre maximum de fichiers dépassé
+acceptFileTypes: Type de fichier non autorisé
+maxFileSize: Le fichier est trop grand
+minFileSize: Le fichier est trop petit
+
+# Messages d'erreur du serveur
+"Invalid CSRF Token": Token CSRF invalide, veuillez recharger la page.
+"Internal server error": Erreur interne du serveur

Resources/translations/messages.fr.yml

 
 button.upload: Ajouter un fichier
-
-form:
-    file_upload:
-        description.placeholder: Description facultative
-        max_number_of_files(%num%): %num% fichiers maximum
-        min_file_size: Taille minimale
-        max_file_size: Taille maximale
-
-file_upload:
-    file_size(%size%,%unit%): %size% %unit%o

Resources/views/Form/file_upload.html.twig

@@ -19,7 +19,7 @@
     <div class="template-download fileinput-entry">
         <input class="id" type="hidden" name="{{ full_name }}{% if multiple %}[{{index|default('__index__')}}]{% endif %}[id]" value="{{ file.id|default }}"/>
         {{ irstea_uploaded_file(file) }}
-        <input class="form-control description" type="text" placeholder="{% trans %}form.file_upload.description.placeholder{% endtrans %}" name="{{ full_name }}{% if multiple %}[{{index|default('__index__')}}]{% endif %}[description]" value="{{ file.description|default }}"/>
+        <input class="form-control description" type="text" placeholder="{% trans from 'file_upload' %}form.description.placeholder{% endtrans %}" name="{{ full_name }}{% if multiple %}[{{index|default('__index__')}}]{% endif %}[description]" value="{{ file.description|default }}"/>
         <span class="error"></span>
         <a href="#" class="danger delete {%- if disabled or read_only %} disabled{% endif -%}" title="{% trans %}button.delete{% endtrans %}">
             {{- irstea_icon('remove') -}}
@@ -55,13 +55,13 @@
             />
         </div>
         {% if multiple and widget_attr["data-max-number-of-files"] is defined %}
-            &nbsp;<small>{% trans with {"%num%": widget_attr["data-max-number-of-files"]}%}form.file_upload.max_number_of_files(%num%){% endtrans %}.</small>
+            &nbsp;<small>{% trans with {"%num%": widget_attr["data-max-number-of-files"]}  from 'file_upload' %}form.max_number_of_files(%num%){% endtrans %}.</small>
         {% endif %}
         {% if widget_attr["data-min-file-size"] is defined %}
-            &nbsp;<small>{% trans %}form.file_upload.min_file_size{% endtrans %}&nbsp;: {{ widget_attr["data-min-file-size"]|irstea_file_size(0) }}</small>
+            &nbsp;<small>{% trans from 'file_upload' %}form.min_file_size{% endtrans %}&nbsp;: {{ widget_attr["data-min-file-size"]|irstea_file_size(0) }}</small>
         {% endif %}
         {% if widget_attr["data-max-file-size"] is defined %}
-            &nbsp;<small>{% trans %}form.file_upload.max_file_size{% endtrans %}&nbsp;: {{ widget_attr["data-max-file-size"]|irstea_file_size(0) }}</small>
+            &nbsp;<small>{% trans from 'file_upload' %}form.max_file_size{% endtrans %}&nbsp;: {{ widget_attr["data-max-file-size"]|irstea_file_size(0) }}</small>
         {% endif %}
     </div>
 {% endblock file_upload_widget %}

Twig/FileUploadExtension.php

@@ -124,12 +124,12 @@ class FileUploadExtension extends Twig_Extension
         $formatter->setAttribute(NumberFormatter::MAX_FRACTION_DIGITS, null !== $precision ? $precision : $defaultPrecision);
 
         return $this->translator->trans(
-            'file_upload.file_size(%size%,%unit%)',
+            'file_size(%size%,%unit%)',
             [
                 '%size%' => $formatter->format($size),
                 '%unit%' => $unit,
             ],
-            null,
+            'file_upload',
             $locale
         );
     }