DropzoneUploader – hromadný upload souborů nejen pomocí FTP

ali
Člen | 342
+
+3
-

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}
$.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
+
+1
-

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
+
0
-

Update (30.6.2017)

Tak jak jsem slibil, tak jsem vydal stable verzi

Editoval ali (30. 6. 2017 7:16)

pavel81
Člen | 34
+
0
-

zdravím, jak prosím, nastavuje v configu upload do složky?? Lama-pavel

Editoval pavel81 (12. 10. 2017 16:50)

pavel81
Člen | 34
+
0
-

mimochodem, to vypadá, jako velice dobrá componenta. Jen to asi bude potřeba mixnout s nějakým upload managerem

ali
Člen | 342
+
0
-

Takhle:

dropzoneUploader:
	...
	uploadDriver:
		driver: AlesWita\DropzoneUploader\UploadDriver\Move
		settings:
			dir: my_dir
	...

Editoval ali (12. 10. 2017 17:39)

pavel81
Člen | 34
+
0
-

jj, to jsem už viděl. Toto bude tedy úplně postačovat :) A ve scriptu si jednoduše nastavím složku pro ukládání? Vyzkouším to, díky za pomoc :) Pavel
Píšu někdy asi nesmyly, my_dir je zřejmě název mé složky :)

Editoval pavel81 (12. 10. 2017 20:02)

ali
Člen | 342
+
0
-

Jo, presneji v callbacku onBegining

pavel81
Člen | 34
+
0
-

onBegining jsem našel v presenteru a vložil tedy název složky. Nicméně mi to stále vypisuje, že musím nastavit upload driver?? Nevím
Upload driver must be set!

ali
Člen | 342
+
0
-

Tady mas ukazku configu, jak by mel vypadat, podle toho by to melo normalne fungovat.

Editoval ali (12. 10. 2017 21:29)

pavel81
Člen | 34
+
0
-

jj, super. Zatím to vypadá dobře :) Díky moc :)
Pavel

pavel81
Člen | 34
+
0
-

ještě budu muset upravit něco v presenteru, ale zdá se že to už jede bez problémů :) děkuji :)

stolfam
Člen | 1
+
0
-

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!

ali
Člen | 342
+
0
-

Muzes mi ukazat config.neon, jak komponentu nastavujes?

ondrapech
Člen | 49
+
0
-

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ží.

ondrapech
Člen | 49
+
0
-

ali napsal(a):

Muzes mi ukazat config.neon, jak komponentu nastavujes?

A taky
TypeError
Argument 1 passed to Nette\Utils\Strings::upper() must be of the type string, null given, called in C:\php\fotograf\vendor\aleswita\dropzoneuploader\src\Extension.php on line 111

ali
Člen | 342
+
0
-

@ondrapech asi to zkousis na Nette 3, komponenta pro nej jeste neni pripravena..

ondrapech
Člen | 49
+
0
-

ali napsal(a):

@ondrapech asi to zkousis na Nette 3, komponenta pro nej jeste neni pripravena..

Ahoj, zkouším :) Nahoře jsi psal že jo :)

komponenta je určena pro PHP 7.1, Nette Framework 2.4/3.0 a DropzoneJs 5

ali
Člen | 342
+
0
-

@ondrapech opraveno na Nette 2.4, diky za upozorneni

Editoval ali (6. 5. 2019 8:31)