jQuery-FileUpload, snadný upload souborů

cermakpavel
Člen | 4
+
0
-

Je možné nastavit filtraci souborů (typů a případně i počtu) přímo v průzkumníkovi? Tedy že se otevře okno pro výběr souborů a již zde je nastavena filtrace dejme tomu třeba jen na pdf.

JZechy
Člen | 161
+
0
-

@cermakpavel Aktuálně to nejde, přímo na input se nepředává žádná informace o tom, co by měl přijímat.

JZechy
Člen | 161
+
0
-

UPDATE

Po trošku delší pauze jsem se vrátil k vývoji verze 2. Konkrétní datum zatím sice neslibuji, ale když vše půjde dobře, první beta by mohla být k dispozici během víkendu :)

Editoval JZechy (22. 9. 2017 15:51)

JZechy
Člen | 161
+
+1
-

Tak verze 2.0.0-beta1 je na světě a čeká na svá první stažení :).

Pro novou verzi bylo aktualizováno i demo s ukázkami.

Editoval JZechy (28. 9. 2017 14:54)

pitr82
Člen | 121
+
+1
-

@JZechy Super práce,
těším se na betu2, až budou všechny FEATUREs hotové.

JZechy
Člen | 161
+
0
-

@pitr82 Díky :) Tenhle týden se mi snad podaří se do dvojky pustit.

JZechy
Člen | 161
+
+1
-

Na pátek 13. vychází 13. release, snad nebude i tak smolný :-). Verze 2.0.0-beta2.

  • Lze lokalizovat javascriptové hlášky uploaderu. Přidán jak setter, tak i položka do konfigurace.
  • Lze přidávat výchozí soubory.
  • Dle issue #27 Přidán setter a položka konfigurace pro nastavování vlastních hodnot pro konfiguraci blueimpova uploaderu.

Všechny změny verze 2.0.0 shrnuty na wiki.

iguana007
Člen | 970
+
+1
-

JZechy napsal(a):

Na pátek 13. vychází 13. release

Diky, o vikendu otestuju :)

pitr82
Člen | 121
+
+1
-

Ahoj,
@JZechy díky za super práci.
Můžeš na github umístit SandBox s verzí 2.
Díky

JZechy
Člen | 161
+
+1
-

@pitr82 Tenhle týden budu aktualizovat demo na novou verzi, tak pak nahraji :)

pitr82
Člen | 121
+
0
-

JZechy napsal(a):

@pitr82 Tenhle týden budu aktualizovat demo na novou verzi, tak pak nahraji :)

Super,
jestli tam ukážeš co nejvíce features, bude jen dobře :-)

Tomáš Brchaň
Člen | 13
+
+1
-

@JZechy: Ahoj, díky moc za ty úpravy. Přešel jsem na beta verzi a translator funguje. Sice bych preferoval default hlášky v angličtině, ale tím, že to jde snadno v configu změnit, tak to tak nevadí.
Jen drobný nedodělek, není přeložen renderer, takže jsou tam natvrdo hlášky, které se nepřekládají, jako „Nahrát soubor“. Vyřešil jsem to vlastním rendererem, kde jsem si změnit vlastně jen 3 řádky asi takto:

$button->setText($this->translator->translate("Upload File"));

Jinak je to super a díky moc za takovou práci.

Jo a ještě jeden dotaz. Dá se zavolat nějaká JS funkce po úspěšném uploadu? Potřeboval bych refresh galerie obrázků, třeba pomocí AJAXu.
Díky moc.

JZechy
Člen | 161
+
0
-

@TomášBrchaň Ahoj, můžeš využít callbacků, které nabízí blueimpovo javascriptová komponenta.

Mart78
Člen | 31
+
0
-

Ahoj, prosím o pomoc, při volání

$imagesUpload = $form->addFileUpload('anotherImages');

to vyhodí Nette\DI\MissingServiceException – Service of type Nette\Localization\ITranslator not found.
Vyhazuje to FileUploadControl.php na řádku 42.

Mám Nette 2.4. V configu mám jen zaregistrovanou extenzi a

fileUpload:
	maxFileSize: 2M

Zkusil jsem v configu nastavit translator: Nette\Localization\ITranslator a to vyhodilo že parametr je string místo instance.

Neví někdo co s tím mám dělat?

JZechy
Člen | 161
+
+1
-

@Mart78 Ahoj, nahodil jsem menší hotfix verzi 2.0.0-beta4. Teď už by ti to vyhazovat výjimku nemělo. Teda v případě, že jej nedáš do configu, s tím si budu muset ještě pohrát :).

Editoval JZechy (30. 11. 2017 10:07)

Mart78
Člen | 31
+
0
-

Super, pomohlo, díky moc

Mart78
Člen | 31
+
+1
-

Můžeš se ještě prosím mrknout na controller.js? Po uploadu souboru mi js konzole vyhazuje chybu Uncaught TypeError: Cannot read property 'appendChild' of null na řádku 132.
V třídě renderu mám metodu init takovou:

	public function init() {
		parent::init();

		// nasledujici elementy nepotrebuji
		$this->elements["globalProgressValue"] = null;
		$this->elements["fileProgressValue"] = null;
		$this->elements["fileProgress"] = null;
		$this->elements["globalProgress"] = null;
		$this->elements["fileProgress"] = null;
		$this->elements["filePreview"] = null;
		$this->elements["filename"] = null;

		$this->elements["imagePreview"] = Html::el("img"); // nutné, jinak JS vyhazovalo že je element null
		$this->elements["container"] = Html::el("div"); // nepomaha, stale JS vyhazuje null
		$this->elements["input"]->setAttribute('id', 'dalsiobrazky')->setAttribute('name', 'anotherImageFile');
		$this->elements["delete"]->addAttributes([
			"class" => "fileupload-delete-button"
		])->setHtml("×");
	}

EDIT: už jsem na to přišel, sry za zbytečný post. Metoda buildDefaultTemplate() musí vracet element container.

Editoval Mart78 (30. 11. 2017 15:33)

BuMoRi
Člen | 109
+
0
-

Ahoj, zkouším nejnovější beta verzi (nikdy předtím jsem tuto komponentu nezkoušel) a mám 2 dotazy:

  1. jak se používají ty renderery? z návodu jsem to nevyčet
  2. když v šabloně použiju {control fileUpload}, je vše v pořádku. Ale chtěl bych formulář vykreslit manuálně:
<?php
		<form n:name="fileUpload" class="form-horizontal">
			<div class="form-group">
				<label n:name="uploader" class="control-label">Nahrání</label>
				<input n:name="uploader" class="form-control">
			</div>
		</form>
?>

Takhle se mi ale zobrazí textový input…

JZechy
Člen | 161
+
+1
-

@BuMoRi Ahoj,

  1. Můžeš se podívat na již existující Renderery v základu.
  2. Použij {input uploader} pro vykreslení uploaderu. To, jak bude vykreslen si právě určíš tím Rendererem.
BuMoRi
Člen | 109
+
0
-

Já se omlouvám za začátečnickej dotaz: když chci použít třeba už vytvořený Bootstrap3Renderer, jak ho prohodím za ten základní Html5Renderer? Zkouším v presenteru:
use Zet\FileUpload\Template\Renderer\Bootstrap3Renderer;
A ve formuláři:
$form->setRenderer(new Bootstrap3Renderer);
To spíš jen hádám, nikdy jsem žádné renderery nepoužíval. Takto to ale nefunguje, chybí argument.

JZechy
Člen | 161
+
+1
-

@BuMoRi bud přidat do configu renderer: Zet\FileUpload\Template\Renderer\Bootstrap3Renderer, nebo přes setter napíšeš setRenderer(Bootstrap3Renderer::class)

BuMoRi
Člen | 109
+
0
-

Díky.

BuMoRi
Člen | 109
+
0
-

Ahoj, poradil by mi prosím někdo s nastavením?

<?php
	$form = new Form();
	/** @var FileUploadControl $upload */
	$upload = $form->addFileUpload('uploader');
	$upload->setRenderer(Bootstrap4Renderer::class);
	$upload->setMaxFileSize('1M');
	$upload->setMaxFiles(2);
	$upload->setUIMode(FileUploadControl::UI_MINIMAL);
?>

Funguje mi akorát setRenderer.
SetMaxFileSize také funguje, ale vždy zahlásí „Maximální velikost souboru je 2MB.“. Dle dokumentace nastavit chybovou hlášku přes maxSize. Netuším kde a jak, v configu? To se mi nepodařilo.
SetMaxFiles mi nefunguje, uploader nahrává neomezený počet souborů.
SetUIMode: hned tracy vyhodí chybu Undefined class constant ‚UI_MINIMAL‘.

JZechy
Člen | 161
+
0
-

@BuMoRi Když zkusíš maxFileSize a maxFiles nastavit přes config?

Co se týče UI Mode, ten už od verze 2 není, nahradil jej renderer.

BuMoRi
Člen | 109
+
0
-

JZechy napsal(a):

Když zkusíš maxFileSize a maxFiles nastavit přes config?

maxFileSize v configu funguje, maxFiles ne, nahrává se mi libovolný počet obrázků

JZechy
Člen | 161
+
0
-

@BuMoRi Ahoj, omlouvám se za zdržení, ale svátky jsou svátky. Jakou používáš verzi uploaderu? Neupdatoval si náhodou? Pokud ano, nezapomněl si přenést obsah složky www?

Jinak venku je 2.0.0-beta5 teď a tam s tímto nastavením problém určitě není.

BuMoRi
Člen | 109
+
0
-

Ahoj, používal jsem jen beta4 od začátku. Zkusím teda 5, díky.

BuMoRi
Člen | 109
+
0
-

Je mi jasný, že chyba je u mě, ale naposled teda ještě zkusim otravovat: updatnul jsem na beta5, přesunul složku www, vymazal cache a takto mám config:
extensions:
fileUpload: Zet\FileUpload\FileUploadExtension

fileUpload:
maxFiles: 3
maxFileSize: 1M
fileFilter: Zet\FileUpload\Filter\ImageFilter
uploadModel: App\Model\UploadModel
renderer: Zet\FileUpload\Template\Renderer\Bootstrap4Renderer

Omezení velikosti mi funguje perfektně, omezení počtu vůbec. Ještě nějaké nápady co bych moh mít blbě?

JZechy
Člen | 161
+
0
-

@BuMoRi Máš i řádně zadaný do stránky všechny skripty?

BuMoRi
Člen | 109
+
0
-

JJ, to mám, bez nich by to asi ani nefungovalo, ne?

JZechy
Člen | 161
+
0
-

@BuMoRi Tak zkusit se má vše :). Napadá mě maximálně, jestli ti to ještě nepíše nějakou chybu do konzole, jinak nevím, jak ten error obcházíš v tom případě.

JZechy
Člen | 161
+
+3
-

UPDATE

Po několika úpravách a opravách přes několik beta verzí, vydána ostrá verze 2.0.0 :)

Editoval JZechy (30. 12. 2017 16:37)

BuMoRi
Člen | 109
+
0
-

Tak možná nějak úplně blbě chápu jak to má fungovat… Jakej error myslíš? Já si zadám třeba že chci nahrát max 3 soubory, vyberu 4 a všechny se mi nahrajou a uložej. Bez erroru.

JZechy
Člen | 161
+
0
-

@BuMoRi A zkusil si je vybírat jednotlivě? Možná bude chyba v tom, když se jich přidá X naráz.

BuMoRi
Člen | 109
+
0
-

Aha, no vida :). Je to tak, při jednotlivém vybírání omezení funguje.

JZechy
Člen | 161
+
+1
-

@BuMoRi Tak při vícenásobném výběru to opravdu nefunguje. Zakládám issue, snad co nejdřív opravím.

pitr82
Člen | 121
+
0
-

Ahoj @JZechy ,
máš někde odkaz na Sandbox ?

JZechy napsal(a):

@pitr82 Tenhle týden budu aktualizovat demo na novou verzi, tak pak nahraji :)

JZechy
Člen | 161
+
0
-

@pitr82 Jsem hříšník… Ten mi stále visí rozdělanej bokem.

pitr82
Člen | 121
+
0
-

@JZechy :-) rozumím. Jsi schopen ho v blízké budoucnosti nahodit ? :-)

JZechy napsal(a):

@pitr82 Jsem hříšník… Ten mi stále visí rozdělanej bokem.

Edit:
Jde mi o translator a jeho implementaci.
Resp. jak nejlepe překládat defaultní texty: Nahrát soubor, Soubor, Stav, když používám defaultní Renderery.

Editoval pitr82 (22. 1. 2018 13:49)

JZechy
Člen | 161
+
0
-

@pitr82 Renderer nabízí jeho instanci, takže jej přes $this můžeš zavolat :)

pitr82
Člen | 121
+
0
-

@JZechy takže musím vytvořit vlastní renderer s implementací translatoru?

Edit: Zkoušel jsem nahrát více souboru a nezabralo omezení, Vidím, že na to máš ISSUE…

Editoval pitr82 (23. 1. 2018 8:22)

JZechy
Člen | 161
+
0
-

@pitr82 Ideálně, ty výchozí renderery jsou na jednu stranu spíš ukázkové nebo pokud není třeba řešit překlady.

pitr82
Člen | 121
+
0
-

@JZechy
Nevidím nikde element pro přejmenování souboru.

JZechy
Člen | 161
+
0
-

@pitr82 V druhé verzi aktuálně neexistuje.

nettak2
Člen | 19
+
0
-

@JZechy Ahoj prosim ta mas aj vykreslovanie uploadnuteho obrazku? Alebo nato musim pouzit iny plugin? Diky.

JZechy
Člen | 161
+
0
-

@nettak2 Na to není potřeba plugin, to si jednoduše uděláš/vymyslíš sám :)

iguana007
Člen | 970
+
0
-

nettak2 napsal(a):

@JZechy Ahoj prosim ta mas aj vykreslovanie uploadnuteho obrazku? Alebo nato musim pouzit iny plugin? Diky.

Ja si tento uploader zkombinoval s https://ublaboo.org/image-storage/

nettak2
Člen | 19
+
0
-

Ma niekto skusenosti s ukladanim obrazka do DB (blob) a len si to nasledne vytiahne ? Alebo si to ukladate natvrdo do zlozky? @JZechy @iguana007

JZechy
Člen | 161
+
+1
-

@nettak2 Klasicky do složky, do DB pouze cestu.

Editoval JZechy (26. 2. 2018 11:37)

iguana007
Člen | 970
+
0
-

JZechy napsal(a):

@JZechy Klasicky do složky, do DB pouze cestu.

Ja taky tak