DropzoneUploader – hromadný upload souborů nejen pomocí FTP
- ali
- Člen | 342
DropzoneUploader
Nedávno jsem potřeboval vyřešit hromadný upload souborů na FTP server a zaujala mě knihovna DropzoneJs, takže jsem si pro ní napsal tuhle tu jednoduchou komponentu, kterou naleznete na GitHubu nebo v senzačním Componette.
- komponenta je určena pro PHP 7.1, Nette Framework 2.4 a DropzoneJs 5
- komponentu jsem se snažil napsat univerzálně, aby šel do budoucna změnit styl nahravání souborů, takže pokud by někomu nevyhovoval FTP upload nebo klasický Nette\Http\UploadFile::move(), tak si jde jednoduše dopsat vlastní driver pro nahravání
- jednoduché nastavení pomocí konfiguračního souboru NEON
extensions:
webloader: AlesWita\DropzoneUploader\Extension
dropzoneuploader:
dropzoneTemplate: ::constant(AlesWita\DropzoneUploader\Factory::BOOTSTRAP_V4_TEMPLATE)
uploadDriver:
driver: AlesWita\DropzoneUploader\UploadDriver\Ftp
settings:
url: ftp://user:password@my-ftp.cz
settings:
maxFilesize: 1mb
acceptedFiles:
- application/vnd.ms-excel
- application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
addRemoveLinks: true
messages:
dictDefaultMessage: 'Drag & drop files!'- k dispozici je defaultní template a template pro Bootstrap v4
- možnost vykreslení komponenty na části
{control dropzoneUploader:js}
{control dropzoneUploader:form}
{control dropzoneUploader:files}- kompatibilní s nette.ajax.js
$.nette.ext({
load: function(xhr, settings) {
{control dropzoneUploader:js}
Dropzone.discover();
},
});
$.nette.init();- zobrazení již uploadnutých souborů na serveru
- možnost stáhnout uploadnuté soubory
- možnost smazat uploadnuté soubory
- díky callbacku onBeginning, lze měnit dynamicky cestu k nahrávaným souborům
protected function createComponentDropzoneUploader(): AlesWita\DropzoneUploader\DropzoneUploader {
$uploader = $this->dropzoneFactory->getDropzoneUploader();
$uploader->onBeginning[] = function (AlesWita\DropzoneUploader\DropzoneUploader $uploader): void {
$uploader->setFolder('tady');
};
return $uploader;
}momentálně dostupné pouze v dev-master větvi, stable by měla být do konce měsíce
TODO
Move upload driver nezobrazuje již nahrané soubory✔- dopsat testy pro FTP driver
- Bootstrap v3 template (nepoužívám, tak klidně uvítám PR)
Editoval ali (6. 5. 2019 8:29)
- ali
- Člen | 342
Update (26.6.2017)
- vsechny casti komponenty lze vyrenderovat na casti
{control dropzoneUploader:js}
{control dropzoneUploader:form}
{control dropzoneUploader:files}- takze lze JS vlozit do hlavicky stranky a z-ajaxovat pomoci nette.ajax.js
$.nette.ext({
load: function(xhr, settings) {
{control dropzoneUploader:js}
Dropzone.discover();
},
});
$.nette.init();- nyni po opetovnem zobrazeni komponenty, se nactou jiz uploadnute soubory, ktere lze i zpetne smazat
Editoval ali (27. 6. 2017 6:20)
- ali
- Člen | 342
Tady mas ukazku configu, jak by mel vypadat, podle toho by to melo normalne fungovat.
Editoval ali (12. 10. 2017 21:29)
- stolfam
- Člen | 1
Ahoj,
snažím se zprovoznit tohle rozšíření, ale zasekl jsem se na
téhle chybě:
Argument 1 passed to AlesWita\DropzoneUploader\Factory::setTranslator() must implement interface Nette\Localization\ITranslator, string given, called in C:\xampp\htdocs\temp\cache\Nette.Configurator\Container_35b3513886.php on line 509
Víte, prosím, někdo co s tím? Byl bych moc vděčný za jakoukoliv radu :) Díky moc!
- ondrapech
- Člen | 49
ali napsal(a):
Muzes mi ukazat config.neon, jak komponentu nastavujes?
parameters:
application:
errorPresenter: Error
mapping:
*: App\*Module\Presenters\*Presenter
session:
expiration: 14 days
services:
router: App\Router\RouterFactory::createRouter
authenticator: App\Models\MyAuthenticator
- App\Models\BlogModel
extensions:
dropzoneUploader: AlesWita\DropzoneUploader\Extension
dropzoneUploader:
dropzoneTemplate: ::constant(AlesWita\DropzoneUploader\Factory::BOOTSTRAP_V4_TEMPLATE)
uploadDriver:
driver: AlesWita\DropzoneUploader\UploadDriver\Move
settings:
dir: my_dir
settings:
maxFilesize: 1mb
acceptedFiles:
- application/vnd.ms-excel
- application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
addRemoveLinks: true
messages:
dictDefaultMessage: 'Drag & drop files!'Plus, mi to vyhazuje nějaké notice, např. „Undefined index: method“ což mu chybí v settings v configu ale v příkladu nejsou ani nevím jak je nastavit a k čemu slouží.