Merge pull request #3 from we-bridge/add_original_file_name

Add original file name, form-specific ids to the fields and remove li…

Author: thomas-barthelemy

EventListener/UploadListener.php

@@ -6,22 +6,24 @@
 
 class UploadListener
 {
-    private $uploadDirectory;
-
-    public function __construct($uploadDirectory)
-    {
-        $this->uploadDirectory = $uploadDirectory;
-    }
-
     public function onUpload(PostPersistEvent $event)
     {
         $response = $event->getResponse();
-        //$response['file_path'] = $this->uploadDirectory . $event->getFile()->getFilename();
+        $uploadDirectory = $event->getConfig()['storage']['directory'];
+
+        $fileBag = $event->getRequest()->files->all();
+        $uploadFile = null;
+        array_walk_recursive($fileBag, function($item, $key) use (&$uploadFile) {
+           if ($item instanceof \Symfony\Component\HttpFoundation\File\UploadedFile) {
+               $uploadFile = $item;
+           }
+        });
         $response['status'] = 'success';
         $response['files'] = array(
             array(
+                'originalName' => $uploadFile->getClientOriginalName(),
                 'name' => $event->getFile()->getFilename(),
-                'url' => $this->uploadDirectory . $event->getFile()->getFilename()
+                'url' => $uploadDirectory . '/' . $event->getFile()->getFilename()
             )
         );
         return $response;

Form/LargeFileType.php

@@ -57,6 +57,13 @@ function (FormEvent $event) use ($options) {
                         'mapped' => false
                     )
                 );
+                $form->getParent()->add(
+                    $form->getConfig()->getName() . 'OriginalName',
+                    'hidden',
+                    array(
+                        'mapped' => false
+                    )
+                );
             }
         );
     }
@@ -70,7 +77,9 @@ function (FormEvent $event) use ($options) {
      */
     public function buildView(FormView $view, FormInterface $form, array $options)
     {
+        $view->vars['view_id_prefix'] = $view->parent->vars['id'] . '_';
         $view->vars['largefile_field'] = $form->getConfig()->getName() . 'Name';
+        $view->vars['largefile_field_original'] = $form->getConfig()->getName() . 'OriginalName';
         $view->vars['label'] = $options['label'];
         $view->vars['largefile_media'] = $options['media'];
         $view->vars['mimeTypesMessage'] = $options['mimeTypesMessage'];

README.md

@@ -69,6 +69,7 @@ $builder
             'media' => 'video',
             'mimeTypesMessage' => "Upload only mp4",
             'maxSizeMessage' => "Maximum size is 40 MB",
+            'previewContainerId' => "previewVideo",
         ],
     )
 ```
@@ -79,6 +80,9 @@ The field will be displayed as an input file styled as a button using bootstrap
 - `media`: refers to the mapping in OneupUploaderBundle's configuration
 - `mimeTypesMessage`: Localized error message to display for incorrect mime type input
 - `maxSizeMessage`: Localized error message to display if upload file is larger than the maximum size allowed
+- `previewContainerId`: Optional. Id of the video tag container which source will be updated upon upload
 
-The bundle will add an extra hidden field to the form with the name of the file field appended with the string "Name" (eg: videoFileName).
-This field can be used by the application to link the uploaded filename with an entity.
+The bundle will add two extra hidden fields to the form:
+- a field with the name of the file field appended with the string "Name" (eg: videoFileName).
+- a field with the name of the file field appended with the string "OriginalName" (eg: videoOriginalFileName).
+These fields can be used by the application to link the uploaded filename with an entity.

Resources/config/services.yml

@@ -2,7 +2,7 @@ services:
 
     webridge_largefile.upload_listener:
         class: Webridge\LargeFileBundle\EventListener\UploadListener
-        arguments: ["uploads%upload_video_rel_directory%"]
+        arguments: []
         tags:
             - { name: kernel.event_listener, event: oneup_uploader.post_persist, method: onUpload }
 

Resources/public/js/largefile.js

@@ -20,7 +20,12 @@ var LargeFile = (function() {
         },
         success: function (files, data, xhr) {
             var inputField = document.getElementById(this.fileInput[0].id);
-            var largeFileField = document.getElementById(inputField.getAttribute('data-largefile-field'));
+            var largeFileField = document.getElementById(
+                inputField.getAttribute('data-largefile-field')
+            );
+            var largeFileFieldOriginal = document.getElementById(
+                inputField.getAttribute('data-largefile-field-original')
+            );
 
             getErrorPlaceHolder(inputField).html('');
 
@@ -31,8 +36,8 @@ var LargeFile = (function() {
                 uploadFinished(inputField, false);
                 return;
             }
-
             largeFileField.value = files.files[0].name;
+            largeFileFieldOriginal.value = files.files[0].originalName;
             //remove the required attribute of the input field
             //to allow form submission
             inputField.removeAttribute('required');                

Resources/views/Form/largefile.html.twig

@@ -16,8 +16,9 @@
         {{ form_widget(
                 form,
                 {'attr': {
-                    'class': form.vars.attr.class ~ ' largefile',
-                    'data-largefile-field': largefile_field,
+                    'class': (form.vars.attr is empty)?'largefile':form.vars.attr.class ~ ' largefile',
+                    'data-largefile-field': view_id_prefix ~ largefile_field,
+                    'data-largefile-field-original': view_id_prefix ~ largefile_field_original,
                     'data-mimeTypesMessage': mimeTypesMessage,
                     'data-maxSizeMessage': maxSizeMessage,
                     'data-url': oneup_uploader_endpoint(largefile_media),
@@ -28,22 +29,29 @@
         {{ form_widget(
                 attribute(form.parent, largefile_field),
                 {
-                    'id': largefile_field
+                    'id': view_id_prefix ~ largefile_field
+                }
+           ) 
+        }}
+        {{ form_widget(
+                attribute(form.parent, largefile_field_original),
+                {
+                    'id': view_id_prefix ~ largefile_field_original
                 }
            ) 
         }}
     </span>
 
     {% endspaceless %}
 
-    <div class="error">
+    <div class="error largefile-error">
         <ul>
-            <li id="{{largefile_field}}_error">
+            <li id="{{view_id_prefix ~ largefile_field}}_error">
             </li>
         </ul>
     </div>
 
-    <div id="{{largefile_field}}_progress" class="largefile_progress progress">
+    <div id="{{view_id_prefix ~ largefile_field}}_progress" class="largefile_progress progress">
         <span class="bar progress-bar"></span>
     </div>