Usunąć plik z kolejki plupload?

Question

Próbuję ograniczyć rozszerzenia plików, które można przesłać za pomocą programu plupload.

ponieważ filtry nie działają poprawnie w środowisku wykonawczym HTML5 Nie mogę ich użyć. Stąd mam poniższy kod zbindowanych do zdarzenia

var extensionArray = ['pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx']; 
uploader.bind('FilesAdded', function (up, files) { 
    var invalid = 0; 
    for (var i in files) { 
     var extension = files[i].name 
           .substr((files[i].name.lastIndexOf('.') + 1)) 
           .toLowerCase(); 

     if (extension == '' || -1 === $.inArray(extension, extensionArray)) { 
      uploader.splice(i, 1); //also tried uploader.removeFile(files[i]) 
      invalid++; 
      continue; 
     } 
     //dom manipulation to add file occurs here 
    } 
}); 

FilesAdded Ale, podczas gdy to jest zatrzymanie manipulacji DOM występujących w poszukiwaniu nieprawidłowych plików, to nie wydaje się być faktycznie usunięcie elementu z kolejki jako kiedy zainicjować Przesłane przez nich wszystkie są wysyłane!

Dzieje się to zarówno w środowisku HTML5, jak i Flash Runtime. Jeszcze nie testowałem innych.

Wiązanie z wydarzeniem FilesRemoved, nigdy nie jest wyzwalane! ale wstawienie console.log('Invalid files detected'); tuż przed uploader.splice(... jest wyprowadzane na konsolę, więc linia jest wywoływana.

Answer 1

Short Version: Trzeba powiązać ze zdarzeniem filesAdded po wywołaniu funkcji init().

Pierwszym krokiem do debugowania było pobranie the uncompressed version off github^{18 listopada 2012 roku}. Kiedy już to miałem, mogłem prześledzić ten problem.

Głównym problemem wydawało się, że połączenie z removeFile() nigdy nie zostało wywołane, ale dlaczego?

removeFile() został zdefiniowany jako:

removeFile: function (file) { 
    var i; 

    for (i = files.length - 1; i >= 0; i--) { 
     if (files[i].id === file.id) { 
      return this.splice(i, 1)[0]; 
     } 
    } 
} 

Ok, dość proste, to pętle za pośrednictwem tablicy plików, a jeśli jest to plik, który ma identyfikator pasujący potem wywołać funkcję spawów.

Jak wygląda łączenie?

splice() został zdefiniowany jako:

splice:function (start, length) { 
    var removed; 

    // Splice and trigger events 
    removed = files.splice(start === undef ? 0 : start, length === undef ? files.length : length); 

    this.trigger("FilesRemoved", removed); 
    this.trigger("QueueChanged"); 

    return removed; 
} 

porządku, więc to gdzie zdarzenie FilesRemoved powinny zostać wywołany, więc dlaczego nie było?

Powrót w funkcji removeFile(), jak wspomniano, wywołuje tylko splice , jeśli pasujący identyfikator zostanie znaleziony.

Następnym krokiem było sprawdzenie, czy wywoływana była funkcja removeFile.

Wkładanie console.log('removeFile called', files); jako pierwsza linia dał nam wyjście: removeFile called []

Hmmm, pustą tablicę!

OK, Wygląda na to, że wiążemy się z wydarzeniem FilesAdded, które zatrzymuje zwykłe zachowanie, bez problemu. dodajmy po prostu uploader.files.push(file) do naszego wiązania FilesAdded. i oto i oto. po kliknięciu przycisku start wysyłane są tylko poprawne pliki.

Działa ... ale nie do końca.
Miałem tam kilka dodatkowych wiązań, tylko do celów debugowania, jeden z nich był na QueueChanged. rejestrowało to ilość plików w kolejce za każdym razem, gdy nastąpiła zmiana.

Zauważyłem, że liczba plików w kolejce nie odzwierciedlała w rzeczywistości plików usuniętych z kolejki.

Tak więc szybki console.log(uploader.files.length) potwierdził, że działo się tu coś jeszcze.

Kolejnym krokiem było sprawdzenie, jaka była domyślna akcja dodawania plików.

Patrząc zauważyłem, że programiści zdecydowali się również związać z wydarzeniem, robiąc to w funkcji init. Dziwny wybór patrząc na to z mojej perspektywy. Ale to jest ich wybór.

Tak więc, przeglądając ich powiązanie, mieli także files.push(file), co oznacza, że ​​otrzymywaliśmy wszystkie pliki + duplikaty poprawnych plików w tablicy.

Stwierdzając, że wiązanie się dzieje w init(), funkcji, usunąłem uploader.files.push(file) z mojego wiążące, przeniósł init() wywołanie przed moim FilesAdded wiążące. a teraz wszystko działa dobrze.

Answer 2

uploader=newplupload.Uploader({ 
//----- 
}); 

uploader.bind('FilesAdded',function(up,files) 
{ 
//---- 
up.refresh();//RepositionFlash/Silverlight 
}); 

uploader.bind('QueueChanged',function(up,files){ 

//#doc-filelist is the id of dive, which shows the Queue 
$('#doc-filelist').html(''); 

$.each(uploader.files,function(i,file){ 
$('#doc-filelist').append(
'<div id="'+file.id+'">'+ 
file.name+'('+plupload.formatSize(file.size)+')<b></b>'+ 
'<spanclass="remove_file"data-file="'+i+'">X</span>'+ 
'</div>'); 
}); 

if(uploader.files.length==0){ 
// #uploadfiles button for start upload 
$('#uploadfiles').addClass('disabled'); 
} 

}); 

uploader.bind('UploadComplete', function (up, file) { 
    up.splice(); 
    up.refresh(); 

}); 


$('.relevant-document').on('click','.remove_file',function(e){ 

uploader.splice($(this).attr('data-file'),1); 

uploader.refresh(); 
});