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 642×
Přečteno 17 078×
Přečteno 9 823×
Přečteno 8 152×
Přečteno 8 135×