Topic: File dialog doesn't recognize filter change after init
Using the Core-API v2.1.8, I'm having trouble changing the settings.filters.mime_types property after calling .init(). I'm using setOption() and it appears to work, based on my console.log output, but the filter is not being applied to the file selection dialog.
Below is a simplification of my code. I'm using a <select> element (#filetype) to allow users to choose the type of file they want to upload. This is set initially by a passed value (sdo.filetype). The sdo.extensions.XXX vars contain strings of file extensions (e.g. "gif,jpg,png").
var filter= {
1 : {title: "All files", extensions : sdo.extensions.all},
2 : {title: "Video files", extensions : sdo.extensions.vid},
3 : {title: "Image files", extensions : sdo.extensions.img}
};
var plup = new plupload.Uploader({
runtimes : 'html5,html4',
browse_button: 'select',
url: 'https://'+sdo.bucket+'.s3.amazonaws.com/',
multipart_params: {
'key' : folder+'${filename}',
'Content-Type' : '',
'x-amz-meta-data' : '',
'AWSAccessKeyId' : aws.key,
'policy' : aws.policy,
'signature' : aws.signature
},
filters : {
max_file_size : '500mb', // Maximum file size
mime_types : []
},
init : {
FilesAdded: function(up, files) {pl_filesadded(up, files)},
FilesRemoved: function(up, files) {pl_filesremoved(up, files)},
BeforeUpload: function(up, file) {pl_beforeupload(up, file)},
UploadProgress: function(up, file) {pl_uploadprogress(up, file)},
FileUploaded: function(up, file, info) {pl_fileuploaded(up, file, info)},
UploadComplete: function(up, files) {pl_uploadcomplete (up, files)},
Error: function(up, args) {pl_error(up, args)}
}
});
$(function() {
// other code...
$("#filetype").change(function() {update_options()});
$("#filetype").val(sdo.filetype).trigger("change");
plup.init();
});
function update_options() {
filetype = $("#filetype").val();
plup.setOption('filters', { mime_types : [filter[filetype]]});
console.log('filter:',plup.settings.filters.mime_types);
// other code...
}This works fine the first time around. The initial value of the #filetype select is set, the change event is triggered and update_options() is called. Then I call init(). If I click my "Select" button, the file dialog is filtered as expected with whatever type was initially set (e.g. just videos).
However, if I use the #filetype menu (after init) to select a different type (triggering update_options()), it doesn't affect the file dialog.
I think my code is working properly. The initial (before init) value is being set correctly and when using the select (after init) the console.log shows the updated value of plup.settings.filters.mime_types - including a regexp element that I didn't provide (I'm assuming it is generated by plupload). Also, plupload does filter the files being added correctly.
I've tested this on the latest versions of Safari (Mac), Edge (Win 10), and Chrome (Mac, Win 10) and the behavior on all is consistent. The system's file select dialog does not use the newer mime type/extension filter.
