Set the slug based on the file name

pillar/web/utils/forms.py

@@ -80,6 +80,7 @@ class CustomFileSelectWidget(HiddenInput):
         button.append(u'<input class="fileupload" type="file" name="file" '
                       u'data-url="{url}" '
                       u'data-field-name="{name}" '
+                      u'data-field-slug="{slug}" '
                       u'data-token="{token}" '
                       u'data-file-format="{file_format}">'
                       u'<div class="form-upload-progress"> '
@@ -89,6 +90,7 @@ class CustomFileSelectWidget(HiddenInput):
                       u'</div> '
                       u'</div>'.format(url=upload_url,
                                        name=field.name,
+                                       slug=field.name.replace('oid', 'slug'),
                                        token=Markup.escape(current_user.id),
                                        file_format=Markup.escape(file_format_regex)))
 

src/scripts/file_upload.js

@@ -102,9 +102,13 @@ function setup_file_uploader(index, upload_element) {
             }
             $file_id_field.val(pillar_file_id);
 
+            var filename = data.files[0].name;
+
+            // Set the slug based on the name, strip special characters
+            $('#' + $(this).attr('data-field-slug')).val(filename.replace(/[^0-9a-zA-Z]+/g, ""));
+
             // Ugly workaround: If the asset has the default name, name it as the file
             if ($('.form-group.name .form-control').val() == 'New asset') {
-                var filename = data.files[0].name;
                 $('.form-group.name .form-control').val(filename);
                 $('.node-edit-title').html(filename);
             }

src/scripts/tutti/6_jquery_extensions.js

@@ -40,10 +40,11 @@
     }
 
     /***** Attachment handling ******/
-    var attrs = ['for', 'id', 'name', 'data-field-name'];
+    var attrs = ['for', 'id', 'name', 'data-field-name', 'data-field-slug'];
     function resetAttributeNames(section) {
         var tags = section.find('input, select, label, div, a');
         var idx = section.index();
+
         tags.each(function () {
             var $this = $(this);