Gallery Nette Plugin – správa fotek snadno a rychle
- stekycz
- Člen | 152
Při práci jsem narazil na potřebu spravovat množství fotek, ať už pro obyčejné galerie nebo pro různé jiné prvky webu (členové klubu, produkty, atd.). Pokaždé jsem to řešil trochu jinak, polovina kódu v modelu zabrala jen kvůli správě obrázků, fotky byly v adresářové struktuře všude možně a prostě údržba nějaké rozumné hierarchie náročná. Na konci června jsem začal pracovat na rozšíření pro Nette, které by mi tuhle práci usnadnilo.
Prozatím nechci uveřejňovat rozdělanou verzi a dám ji světu na oči až
bude v nějaké rozumné fázi. Nicméně už teď obsahuje model včetně
databázové struktury, kontrolky pro zobrazování seznamu galerií a
i seznamu fotek a vlastní konfigurační třídu, kterou lze konfigurovat v
config.neon
. Chystám také při zveřejnění přidat nějaké
demo, které mi zatím běhá jen lokálně.
Proč ale vůbec píšu sem na fórum, aniž bych něco zveřejnil – rád bych se od vás dozvěděl, co byste od takového pluginu očekávali. Jaké možnosti konfigurace, použití, co všechno by to mělo zvládat bez vlastního psaní kódu atd.
Za sebe bych očekával tyto body, které se snažím implementovat:
- Ukládání, update, mazání i načítání dat přes volání metod
- Možnost jednoduše přidat data, která mají být o galerii/fotce ukládány v databázi
- Měnit pořadí fotek v každé galerii zvlášť
- Jmenné prostory pro různé galerie (například produkty a zaměstnanci budou v různých, ať se v tom dá dobře vyznat)
- Možnosti konfigurace prostě maximální :-) Aktuálně vím asi o:
- výška a šířka náhledu fotky
- maximální velikost jedné strany fotky
- složka pro ukládání souborů
- definice jmenných prostorů
- počet galerií na stránku
- počet fotek na stránku
- třídy zajišťující modelovou část (především ukládání dat do databáze a souborů)
- kvalita zmenšeného obrázku
- název složky s náhledy jakožto podsložky galerie
- název klíče použité pro soubor/y ve formulářích
- a možná ještě něco, na co si teď nevzpomenu
Předem díky za náměty a názory :-)
- stekycz
- Člen | 152
Z WYSIWYG editorů jsem naposledy používal CK, částečně bych tam možná zařadil i Texylu. Tiny bohužel nemám zkušenost a nevím, jak tam to spolupracuje. Mám pocit, že u Texyly a možná i u CK stačí nastavit akorát nějaký handler nebo něco podobného. Což by nemuselo být tak náročné. Jak to je u Tiny?
Lazy vytváření náhledů je dobrý nápad a zvažoval jsem tuhle možnost. Asi bych to ale dělal přes konfiguraci, kde by lazy mode bylo možné zapínat a existovala by někde metoda vracející instanci Image náhledu. Lazy mode totiž už vyžaduje vlastní obsluhu načítání obrázků a ne každý si ji chce psát a občas to je skoro zbytečné. Při přímém přístupu na soubor pak lazy mode moc uplatnit nejde. Nebo pokud je to nějak možné a jen nevím jak, budu rád poučen.
- Darkry
- Člen | 101
Ta integrace se můžeš inspirovat tímto:¨
http://kcfinder.sunhater.com/
Je tam návod (Integreta) jak na zapojení do TinyMCE tak do CKEDitoru. Myslim, že by se to dalo použít (teda ten způsob integrace do editorů ne zbytek).
- nanuqcz
- Člen | 822
Co se týče lazy generování náhledů, je tady na to doplněk – před nějakou dobou jsem používal (a pořád používám v projektu na Nette 2.0alfa2) a funguje jak má ;-)
Jinak co se týče návrhů, tak např jmenné prostory a některé konfigurace (výška a šířka náhledu fotky, maximální velikost jedné strany fotky – tohle si každý může nastavit zásahem do šablony) bych určitě nevyužil. Osobně mám radši jednodochost, ale případnou možnost vlastního rozšíření :-)
- Bernard Williams
- Člen | 207
Nazdárek,
já bych uvítal možnost nahrát fotky přes FTP – fotky nahraješ do předem určeného adresáře a na webu jen spustíš script (přejdeš do nějaké části toho pluginu) a on si sám všechny fotky zpracuje, roztřídí, vytvoří náhledy, uloží do DB atd.
Dále by se mi líbilo mít možnost měnit způsob vytvoření náhledu. Nastavení šířky/výšky je jasné, ale tím to nekončí. Co možnost nastavit jen jeden údaj a druhý se dopočítá a další nastavení s kombinací Image::FILL a Image::STRETCH a metodou crop().
Bernard
- ic
- Člen | 430
Myslím, že nahrání přes FTP už není dnes (respektive nebude) tak
aktuální…
je tu <input type="file" multiple>
který dovolí při
nahrání obrázků jich vybrat mnoho.
Nebo jednoduché (pro uživatele) přetažení souborů do okna a jejich
následné nahrání javasctipem… jako je k vidění na Picase (funguje FF a
Chrome, další jsem nezkoušel).
Něco o tom psali na zdrojáku: http://zdrojak.root.cz/…omoci-html5/
Takovou galerii bych taky využil, už jsem na tom dříve dělal, ale musel jsem přestat z důvodu nutnosti udělat něco jiného XD
Takže pokud bych mohl nějak pomoci s vývojem rád bych přiložil ruku k dílu.
Jsem docela daleko s klientskou částí… slideshow s jQuery… organizace do setů a tak
- stekycz
- Člen | 152
xxxObiWan napsal(a):
Co se týče lazy generování náhledů, je tady na to doplněk – před nějakou dobou jsem používal (a pořád používám v projektu na Nette 2.0alfa2) a funguje jak má ;-)
Díky za upozornění, vypadá to velice dobře. Asi by to pro aktuální stav projektu chtělo upravit, ale princip je parádní.
xxxObiWan napsal(a):
Jinak co se týče návrhů, tak např jmenné prostory a některé konfigurace (výška a šířka náhledu fotky, maximální velikost jedné strany fotky – tohle si každý může nastavit zásahem do šablony) bych určitě nevyužil. Osobně mám radši jednodochost, ale případnou možnost vlastního rozšíření :-)
Vzhledem k dosavadní neznalosti výše zmíněného doplňku mi velikosti obrázků přišly užitečné.
Bernard Williams napsal(a):
já bych uvítal možnost nahrát fotky přes FTP – fotky nahraješ do předem určeného adresáře a na webu jen spustíš script (přejdeš do nějaké části toho pluginu) a on si sám všechny fotky zpracuje, roztřídí, vytvoří náhledy, uloží do DB atd.
Rychleji za mě odpověděl už ic. Nicméně v Demu zatím používám MultipleFileUpload
Bernard Williams napsal(a):
Dále by se mi líbilo mít možnost měnit způsob vytvoření náhledu. Nastavení šířky/výšky je jasné, ale tím to nekončí. Co možnost nastavit jen jeden údaj a druhý se dopočítá a další nastavení s kombinací Image::FILL a Image::STRETCH a metodou crop().
Nad tímhle jsem zatím tolik nepřemýšlel. Snažím se to psát tak, aby bylo možné co nejjednodušeji napsat vlastní Control nebo model, respektive jej přepsat. Otázka, zda tohle stojí za zpracování jako nastavení či zda to nepatří do dceřinné třídy.
ic napsal(a):
Takže pokud bych mohl nějak pomoci s vývojem rád bych přiložil ruku k dílu.
Jsem docela daleko s klientskou částí… slideshow s jQuery… organizace do setů a tak
Klientskou část řeším velmi jednoduše, alespoň zatím. Javascriptovou
knihovnu jQuery s fancyboxem a fotky organizované v tabulce. Možností je
samozřejmě (podobně jako v MultipleFileUploadu) vytvořit
více interfaců pro zobrazování a člověk si buď vybere a nebo stejně
vytvoří vlastní. Stejně tak modelová část. Stavím jí nad dibi.
U modelu si myslím spíš, že bude různorodá potřeba. Takže asi vytvořit
nějaký adaptér a přes něj se pak dostávat k datům ať už pomocí dibi,
NotORM nebo jiné knihovny. Zase možnost nabídnout více hned s pluginem.
Díky i za nabídku na spolupráci, nejprve to ale trochu „pofackuju“
dohromady a až hodím link, nějak se můžeme domluvit. Především
s klientskou částí si každý asi pohraje sám podle webu. Tam jediné, co
je možné připravit (a mám na to napsané i TODO), jsou metody pro
patřičné operace (změna pořadí, atd.).
Díky všem za motivy k zamyšlení či přímo k tvorbě!
Ještě připojím nějaké své nápady:
- Možnost přesouvat galerie mezi jmennými prostory/fotky mezi galeriemi – využil by to někdo? Přijde mi to trochu zbytečný. Když chci dát fotku jinam, tak jí tam dám rovnou, ne? Možná ty galerie a namespacy.
- Sám jsem zvyklý na ukládání nějakých informací v databázi. Které informace si ukládáte o galeriích vy? Osobně vetšinou počítám s titulkem a popisem, ale ne vždy. Určitě používám status viditelnosti ve veřejné části webu (bool). Co titulek k jednotlivým fotkám?
- Konfigurovat je možné z PHP i z neon.config, kterou variantu vítáte více a pro které atributy? Složku pro ukládání fotek bych čekal snad výhradně v configu, naopak volba velikosti fotky asi spíš v PHP/šabloně.
- nanuqcz
- Člen | 822
- Konfigurovat je možné z PHP i z neon.config, kterou variantu vítáte více a pro které atributy? Složku pro ukládání fotek bych čekal snad výhradně v configu, naopak volba velikosti fotky asi spíš v PHP/šabloně.
To jako že by měla ta komponenta svůj vlastní config.neon, nebo že by sis vyhradil zvláštní sekci v hlavním config.neonu? Já jsem u komponent zvyklý nastavovat je v PHP při vytváření (a pokud se rozhodnu některé věci dát si do configu, můžu – pak je v PHP komponentě jednoduše předám).
Každopádně pro mě osobně důležitá věc: Čím víc nastavení si dokáže komponenta detekovat automaticky, tím líp (jsem dost líný :-D)
- ras
- Člen | 135
Co bych ocenil ja je:
- prehled vsech vlozenych fotek, vcetne titulku (tj. jednoduse zjistit, kde chybi + moznost nahradit prazdny defaultnim titulkem)
- jednoducha moznost editace titulku (obzvlast v kombinaci s vlozenim pres FTP = ja bych se za nej taky primlouval), tj. nemuset to delat po jedne fotce
- moznost smazat vsechny (ci jen zvolene) nahledy (= uklid, ktery se jednou za cas hodi)
- moznost prirazeni tagu k fotkam (aby v tom nebyl bugr, tak jen tech co si nekde predefinuji)
- moznost ponechat na serveru originaly, ikdyz budu chtit nabizet k zobrazeni jen zmenseniny (napr. 800×600 velike fotky + 175×131 nahled, pricemz original je 4000×3000 pixelu)
- jednoducha obsluha sablon k fotogaleriim
- stekycz
- Člen | 152
Tak konečně jsem se rozhodl, že provozuschopná a zveřejnitelná verze je na světě :-) Kódy jsou k nalezeení na GitHubu. Připojen je i upravený doplněk ImageHelper doporučený xxxObiWan-em. Nezapomněl jsem ani na demo.
Musím říci, že tam je určitě prstor pro zlepšování a doplňování možností. Nicméně v podobě, v jaké je to teď je možné doplněk používat pro jednoduché galerie naprosto bez problémů.
A jak s doplňkěm pracovat? Projdeme si jednotlivé části:
Konfigurace
parameters:
imageHelper:
baseUrl: http://example.com/ # URL webu
tempDir: files/temp # cesta k adresáři se zmenšeninami fotek relativne k WWW_DIR
gallery:
basePath: %wwwDir%/files/gallery # absolutní cesta ke složce pro ukládání fotek
services:
imageHelper:
class: \ImageHelper(@cache, %imageHelper.baseUrl%, %imageHelper.tempDir%)
galleryDataProvider:
class: \steky\nette\gallery\DataProvider\Dibi(@database)
galleryItemModel:
class: \steky\nette\gallery\models\Item(@galleryDataProvider, %gallery.basePath%)
galleryGroupModel:
class: \steky\nette\gallery\models\Group(@galleryDataProvider, %gallery.basePath%)
Přidávání/update galerie
$groupModel = $this->context->galleryGroupModel;
if ($data['gallery_id']) {
$groupModel->update($data); // Předáváme pole dat s informacemi o galerii a s polem fotek
} else {
$groupModel->create($data); // Předáváme pole dat s informacemi o galerii a s polem fotek
}
Použití kontolek
Bohužel se mi nepodařilo (zatím?) najít lepší řešení vytváření
kontrolek než toto přímo v action metodě presenteru.
$control = new GroupControl($this, 'galleries',
$this->context->imageHelper,
$this->context->galleryGroupModel,
$this->context->galleryItemModel,
$this->context->galleryDataProvider->namespaces,
'Homepage:gallery'
);
$control->setAdmin(true, 'Homepage:editGallery');
if ($id) {
$control->useNamespace($id);
}
new ItemControl($this, 'photos',
$this->context->imageHelper,
$this->context->galleryGroupModel,
$this->context->galleryItemModel,
$id
);
A tohle je v podstatě všechno!
Doporučuju projít si metody a API jednotlivých services a kontrolek. Snažil
jsem se o maximální jednoduchost použití a zároveň možnost vlastních
úprav. Největší úpravy by se měly odehrávat v šabloně.
Případné komentáře, nápady, názory, připomínky nebo jakékoli reakce zpracuji a budu se snažit, aby se odrazily v doplňku.
Editoval Gruw (11. 10. 2012 19:04)
- Lawondyss
- Člen | 106
Vyzkoušel jsem si demo a potěšilo mě. Tedy až na jednu „pětistovku“. Po nahrání mého obrázku se namísto něj zobrazuje chyba 500. Předpokládám, že to asi bude tím, že pro demo se soubory neukládají ale do DB se zapíší. Možná by stačil nějaký skript na cronu, který pravidelně bude vracet demo do původního stavu.
- stekycz
- Člen | 152
lysua napsal(a):
Vypadá to velmi dobře. Pokud používám Nette\Database tak musím asi přejít na dibi v případě, že bych to chtěl vyzkoušet že?
Není potřeba přecházet na dibi. Nette\Database je možné také použím,
ale bohužel jsem zatím pro něj nenapsat DataProvider
. Stačí
implementovat rozhraní IDataProvider
. Pokud bude někdo aktivní a
pošle mi kód nebo Pull Request na GitHubu, budu rád :-)
Lawondyss napsal(a):
Vyzkoušel jsem si demo a potěšilo mě. Tedy až na jednu „pětistovku“. Po nahrání mého obrázku se namísto něj zobrazuje chyba 500. Předpokládám, že to asi bude tím, že pro demo se soubory neukládají ale do DB se zapíší. Možná by stačil nějaký skript na cronu, který pravidelně bude vracet demo do původního stavu.
O nějakých chybkách v demu vím. Bohužel je nestíhám opravit a i samotná práce na pluginu mi teď stojí :-/ Do konce března snad vše bude bez problémů. Každopádně díky za tip na crona :-)
- Re4DeR
- Člen | 71
http://nette-gallery.steky.cz/…dmin-list/68 chyba 500.
nette databse by se mi taky libil.