Nette – validace formuláře – zadejte jméno nebo nick

Při práci s formuláři dost často potřebujete aby byl vyplněn jeden z důležitých údajů. V mém případě uživatel musí zadat svoje jméno nebo nick. Může zadat jméno a zároveň nick, nesmí se však stát že nezadá ani jméno ani nick:

Pro vytvoření podmínky na jiný prvek použijeme addConditionOn. Prvním parametrem je prvek na který se odvoláváme a druhým parametrem je validační pravidlo.

 

Jak v Nette vytvořit PDF fakturu

Pokud budete v Nette potřebovat vytvořit fakturu, doporučuji plugin Eciovni.

Následně stačí jen vytvořit akci a funkci pro zobrazení faktury:

 

Grunt + Bower: Ajax v Nette

Mám projekt v Nette ve kterém potřebuji rozjet Ajax. Na projektu mám již připraven Grunt (jak nainstalovat Grunt) a Bower (slibuji to dlouho ale o tom zase někdy příště).

Pro Ajax v Nette doporučuji nette.ajax.js (od Vojtěcha Dobeše). Nette.ajax.js samozřejmě nainstalujeme přes Bower:

Pro automatizaci používám Grunt (jak nainstalovat Grunt), do kterého existuje nepřeberné množství doplňků.

Pro spojení více .js souborů do jednoho používám doplněk grunt-contrib-concat kde mám vytvořený následující task:

V souboru compiled.js máme potřebné js soubory. Můžeme se pustit do další fáze.

Nette + Ajax

Ajaxace již funkčních částí je v Nette velice jednoduchá. Nyní mám vytvořený formulář který odesílá data. Po odeslání formuláře se znovu načte kompletně celá stránka. Tento skript vylepšíme, aby se po odeslání formuláře nemusela načítat komplet celá stránka ale pouze odeslaný formulář (u mne to je formulář s rezervací).

Pojďme si připravit inicializace knihovny nette.ajax.js do souboru main.js:

Mému formuláři stačí přidat class ajax:

V presenteru nyní máme funkci isAjax, která nám vrací TRUE pokud se jedná o Ajaxový požadavek.

Po odeslání formuláře se přesvědčíme zda byl odeslán Ajaxem:

V latte můžeme jednotlivé bloky zabalit do snippetu a nechat překreslit pouze tento snippet:

Proto Nette miluju!

Nette a Doctrine

Účast na mé první Posobotě předčila veškeré očekávání. Perfektní workshop, skvělé přednášky a úžasní lidé kteří nic netají. Na workshopu jsem díky Filipovi a Chemixovi pronikl do základů Doctrine. Zkusím tyto informace sepsat.

Instalujeme Nette

Ani nemyslete na to že to budete zkoušet bez composeru 🙂

nette-doctrine je název složky do které se sandbox vytvoří.

Instalujeme Kdyby/Doctrine

Pokud máte PHP verzi alespoň 5.4 hned z konzole můžete spustit web server:

webserver se spustí na portu 8888. Pokud do prohlížeče zadáte http://localhost:8888 uvidíte stránku Nette Congratulations!

Práda! Můžeme začít spouštět IDE a zažneme kódovat.

PhpStorm a live templaty pro Doctrine

Rozhodně doporučuji PhpStorm do kterého Filip napsal skvělé live templaty. Ušetří spoustu psaní a času.

Live templaty stáhněte a nahrajte do:

Rozhodně doporučuji soubory: Doctrine.xml, Nette.icls, Nette.xml

Po nahrání je nutné znovu spustit PhpStorm.

Vytvoření databáze

Pojďme si vytvořit databázi a uživatele pro přístup k databázi:

Příkaz vykonáme v Admineru: http://localhost:8888/adminer

Klikneme na tlačítko SQL příkaz. Do okna vložíme kód výše a jeho vykonání potvrdíme tlačítkem Provést.

Tím jsme vytvořili databázi doctrine_devel a uživatele doctrine s heslem doctrine_pass.

Zaregistrování Doctrine do Nette

Do config.neon zamergujeme následující kód:

Do config.local.neon uložíme přístupové údaje do DB pro vývoj u nás na localhostu:

Podle dokuentace Kdyby/Doctrine si vytvoříme první entitu:

app/model/Article.php

V entitě Article definuje id (celé číslo, které se bude inkrementovat) a title (text).

Vytvoření tabulky z entity

V první řadě ověříme zda funguje Doctrine/Console:

Výstup by měl vypadat takto a měl by zobrazovat všechny dostupné příkazy pro Doctrine:

Provedeme validaci:

OK, to je v pořádku:

Podíváme se jaký SQL kód nám Doctrine nabízí pro synchronizaci databáze:

SQL kód pro synchronizaci databáze:

Tento kód můžete vykonat v admineru, neb pokud máte koule můžete ho nechat vykonat přímo z příkazové řádky (hlavouni to nedoporučují):

Nyní když znovu spustíme validaci, vidíme:

Namapování a databáze jsou OK, pojďme na ukládání a zobrazení dat.

Doctrine – ukládání dat

V HomepagePresenter.php si uděláme add akci na přidání záznamů do entity Article:

Definovali jsme $entityManager do které jsme injectli Kdyby\Doctrine\EntityManager.

V actionAdd jsme vytvořili 2 články které uložíme do DB. První s názvem Slabikář a druhý s názvem Čítanka. V DB se můžete přesvědčit že došlo k jejich uložení do tabulky article.

Doctrine výpis dat

Velice podobným způsobem jako jsme ukládali data je budeme vypisovat. Opět budeme potřebovat EntityManager:

v šabloně tyto články zobrazíme:

Jednoduché že ano?

Přidání nového položky do entity

Naše aplikace je známá po celém světě a používají ji milony lidí kteří píší podměty že jim pouze název článku nestačí a chtěli by ještě text článku 🙂 Vyhovíme jim a přidáme do entity Article ještě položku text.

Nyní nám perfektně poslouží Filipovo live templaty. Otevřeme si soubor Article.php a pod proměnou private $title odřádkujeme a napíšeme: col <tab> (napíšeme col a stiskneme klávesu Tab). Ide nám předvygeneruje následující kód:

ve kterém se pohybujeme klávesou Tab. Napíšeme název proměnné (text) a definujeme typ (text). Výsledek vypadá takto:

Provedeme validaci:

která nám oznámí že nemáme synchronizovanou databázi. Podíváme se jaké úpravy databáze nám Doctrine nabízí:

Kód vykonáme v admineru, nebo 🙂

Následná validace by měla být OK. Tím máme přidán sloupec text a můžeme do něho rovnou ukládat data. Vytáhneme námi uložené publikace a donastavíme jim text:

Upravíme šablonu abychom vypisovali text:

 Vyšší liga – vazby mezi entitami

Toto jsme splodili na Workshopu:

Article.php

Author.php

Tag.php

HomepagePresenter.php

Šablona:

 

Celé databázové schéma smažeme a vytvoříme znovu:

Celou ukázku jsem nahrál na GitHub: https://github.com/venca-x/nette-sandbox-doctrine

Composer: jak nainstalovat Nette 2.3.0-beta

Po vystřízlivění ze včerejší posoboty nastal čas vyzkoušet Nette 2.3.0-beta.

Upgrade je jednoduchý. Stačí upravit composer.json:

Velice důležitý je řádek minimum-stability: beta a prefer-stable: true

Následně do konzole pustíte příkaz composer update a můžete testovat Nette 2.3.0-beta

Nette: zmenšení průhledného PNG, zachování průhlednosti

Při zmenšování průhledného PNG obrázku v Nette jsem měl problém se zachováním průhlednosti. Místo průhlednosti byla černá barva. Nakonec jsem problém vyřešil takto:

Kód resize je obalen alphaBlending a saveAlpha

Nette: handle (signál)

Předpokládejme že máme TODO list ve kterém budeme chtít vybraný úkol nastavit jako splněný.

Na takový úkon je vhodný signál:

Signál v šabloně zavoláme jednoduše:

 

Nette + Texy

Pokud si zájemce o web přeje základní formátování textů, vetšinou nejprve sáhnu po Texy. Nemám rád weby které vypadají jako omalovánky (ano, tomu kdo dá tu práci aby každé písmenko ve slově mělo jinou barvu se to moc líbí ale spoustu návštěvníků to odradí). Texy je jednoduchý nástroj kterým můžete bez odborných znalostí psát HTML kód. Příklad si ukážeme na jednoduchém formuláři, jehož odesláním naformátujeme zadaný text přes Texy.

 

Pojďme si ukázat jak zprovoznit  Nette společně s Texy!

Ukázka je na poslední verzi Nette (2.2.6) a poslední verzi Texy (2.6).

Instalace Nette

Stáhneme Nette sandbox (přes composer):

příkazem se vytvoří složka nette-texy do které se nahraje Nette + sandbox. Document root pro virtualhost nasměrujeme do nette-texy/www/

Instalace Texy

nainstalujeme samozřejmě přes composer :

 

Zprovoznění Texy

Uděláme si pořádek na hřišti. Nahradíme obsah šablony pro titulní stránku: app/templates/Homepage/default.latte:

 Vytvoření formuláře

app/presenters/HomepagePresenter.php:

Máme formulář který při odeslání odešle do šablony (proměnná $text ) zadaný text.

Zapnutí Texy

Nejprve je nutné přidat Texy do neon.config aby o Nette o Texy vědělo:

app/config/config.neon:

 

 

V souboru app/presenters/BasePresenter.php je nutné vytvořit helper, který bude fomárovat text přes Texy.

V nové verzi Nette (>=2.4) se helper (filtr) registruje takto, metodu createTemplate můžete úplně vynechat):

Nejlepší cesta

Kvůli bezpečnosti, doporučuji tento způsob použití, ve kterém filtr vrací Nette\Utils\Html, který nemusíme nonescapovat. Registrujeme filter klasicky v beforeRender:

A pak již pouze v šabloně vypíšeme:

 

Tip liga – ročník 2014/2015

Znáte Tip ligu? Sportovní nadšenci a sázkaři určitě ano. Jedná se o Facebookovou aplikaci, která je v provozu většinou od září do července. Na každý den je vypsán 1 zápas a uživatelé tipují jeho výsledek (výhra domácích, remíza, výhra hostů). Za každý správný tip získá uživatel 1 bod. Podle počtu bodů se vypočítá pořadí. Za nesprávný tip se body nestrhávají.

tip-liga

Bylo to v roce 2012 kdy chtěl ZdendaKoran utrati jeho nechtěné dítě jménem Tip liga (s kým si ho udělal mi nikdy neřekl – asi je to tak lepší 🙂 ).  Již neměl chuť tuto hru dále rozvíjet a proto jsem se jí s radostí zhostil a začal dělat adoptivního otce. V tu dobu jsem začínal koketovat s Nette. Přepsal jsem Tip ligu do Nette + MySQL a začal se učit Facebook API. Uf, byla to fuška ale zvládl jsem to.

Od té doby uplynulo hodně času a Tip liga začínala fungovat bez chyb a se správně zadanými výsledky. Celý proces zadávání nových zápasů + zadávání výsledků jsem si maximálně ulehčil a zautomatizoval. Prakticky nemusím vůbec psát a pouze klikám. Zadávání výsledků mám rovněž v lite verzi a není problém odkliknout správný výsledek přes telefon odkudkoliv. Tím mám solidní přehled o sportovním dění 🙂

Jenomže 30.dubna 2015 ukončí Facebook podporu api v1.0 ve kterém Tip liga fungovala. Spuštění ročníku 2014/2015 jsem naplánoval na 1.9.2014 a nasadil rovnou api v 2.1 které má být funkční do 7.8.2016. Z nového api jsem trochu zmatený. U tipů proto zatím není možné sdílet tipovaný výsledek zápasu na zdi, ani není možné vidět pořadí mezi přáteli. Pokusím se tyto vlastnosti co nejrychleji zapracovat aby Tip liga neztratila žádnou funkčnost a přibývali spokojení hráči.

V ročníku 2014/2015 přeji hráčům hodně správně tipnutých výsledků a co nejlepší možné umístění.

Nette – jak vytvořit REST API – json

Co to je REST

REST neboli Representational state transfer je způsob jak jednoduše číst (GET), editovat (PUT), mazat (DELETE) a vytvářet (POST) obsah na serveru pomocí HTTP volání.

REST je vhodný pro jednotný a snadný přístup ke zdrojům. Na rozdíl od SOAP či XML-RPC je REST orientován datově, nikoli procedurálně. Všechny REST zdroje mají jednoznačný identifikátor (URL)

Jak na to v Nette?

Zapomeňte na nějaké složité generování v šabloně. Dokonce nebudete potřebovat ani funkci json-encode. V Nette uděláte JSON výstup velice jednoduše.

Ukázka vygenerování JSONu:

Důležité je, že response je možné vygenerovat pouze metodou sendResponse které předhodíte response

TIP: pokud budete chtít posílat i kódování, provedete to následujícím způsobem: