Prvním praktickým článkem bych vám rád představil plugin do webového frameworku Ruby on Rails nazvaný Nested Layouts (česky pak Vnořené šablony). K porozumění vám bude stačit základní znalost frameworku a web designu.
Při tvorbě aplikací jste se již určitě setkali s problémem, kdy jste části stránky potřebovali v nějakých případech skrývat, či měnit v závislosti na různých okolnostech. Většinou vám z toho vzešlo mnoho šablon, které obsahovaly dlouhý a nepřehledný kód plný podmínek, což byl kámen úrazu hlavně pro web designéry, kteří se v tom lehce ztratili a občas upravili i to, co neměli. Řešení se nabízelo samo. Rozdělit si stránku na několik vrstev, které se mohou libovolně a jednoduše zaměňovat přímo z controlleru. Nebudu vás zbytečně zatěžovat vysvětlováním, kterak věci fungují, ale přejdu rovnou k praktické ukázce.
Mějme jednoduchou webovou aplikaci rozdělenou na dvě části. Část pro všechny návštěvníky a část pro registrované uživatele. Nezaregistrovaným uživatelům chceme zobrazit velký banner po straně a footer element s informacemi. Na barevném schématu vidíte jednotlivé vrstvy pomocí barev (zelená > červená > oranžová) (obr 1). V případě registrovaných uźivatelů nám odpadá velký banner a je nahrazen malým, který je umístěn v pravém sloupci. Tím se nám zůži zbylé místo na obsah. Vrstvy rozděleny (černá > modrá> červená > oranžová) (obr 2). Stejně tak ale můžeme mít jen jednosloupcovou verzi bez reklam (černá > červená > oranžová) (obr 3)
# Příklad kódu, nejprve k obrázku 1 class VisitorsController ["main_without_banner", "crumb_navigation"] end end # Pokud využíváte hojně ve své aplikaci ajax a rádi byste aktualizovali jen # část stránky, není nic lehčího class RegistredController def ajax_update respond_to do |format| format.js { render :action =>"index", :layout => ["two_columns_layout", "crumb_navigation"]} end end end # V šablonách žádná změna nenastává. Tedy na místě, kde se má vloźit dalśí # obsah nechtejte jak jste zvyklí
Doufám, že to jako ukázka stačí a pokud byste rádi vyuźili tento plugin, najdete ho na Githubu
Test
Přečteno 20 268×
Přečteno 16 637×
Přečteno 9 595×
Přečteno 7 615×
Přečteno 7 579×