Reaction
Overview
Reaction is a set of web libraries that extend the power and flexibility of Catalyst. Reaction has a different view on your application than the typical Catalyst TT view. Let’s discuss this a bit.
Get some Skin
Reaction treats a tree of templates that control layout along with web assets (such as CSS and Javascript) as a skin.
One can build upon two skins that core Reaction provides:
- base - simplistic amount of XHTML
- default - builds on base by adding more complete XHTML.
These Reaction skin directories are found in trunk at:
share/skin/
Home Base
The base skin, like most all other skins, has directories:
- layout - where the template files go
- web - where the web assets such as CSS and Javascript go.
Site wide Layout Fragments
The default container template1 for one’s site is site_layout.tt found at:
share/skin/base/layout/site_layout.tt
Widget
If you crack open site_layout.tt you will notice POD like directives. For example the file starts with:
=for layout widget [% doctype %] <html> <head> [% head %] </head> <body> [% body %] </body> </html>
A chunk of layout markup like this is referred to as a fragment. This particular fragment is called widget. It has a special purpose in that it drives the template file. It is the beginning of the display chain and all other fragments to be displayed must go through the widget fragment.
Head
Notice for a moment the second layout fragment head, starts with =for layout head.
=for layout head <title>[% title %]</title> [% head_meta %] [% head_scripts %] [% head_style %]
The head layout fragment is referred to in the widget layout fragment by the TT variable [% head %]. In other words, the content of the head fragment will be inserted in the widget fragment in place of [% head %].
META Info
Web pages often have some meta tags. If one looks closer at the head fragment they can see the variable [% head_meta %] which in turn refers to another layout fragment of the same name, head_meta:
=for layout head_meta [% meta_info %]
This in turn use meta_info, but if you search in the site_layout.tt (or elsewhere in share/) you will not find a layout fragment defined with the name meta_info. Uh-oh, where does the value for this variable come from.
Widgets
Fear not, layout fragments have a tight relationship another piece of the Reaction view puzzle, namely Reaction::UI::Widget. In particular, one can find the meta_info fragment implemented in Reaction::UI::Widget::SiteLayout. Here is the code:
implements fragment meta_info {
my $self = shift;
if ( $_{viewport}->meta_info->{'http_header'} ) {
my $http_header = delete $_{viewport}->meta_info->{'http_header'};
arg 'http_header' => $http_header;
render 'meta_http_header' => over [keys %$http_header];
}
render 'meta_member' => over [keys %{$_{viewport}->meta_info}];
};
Notice now we are in Perl code land versus TTish space. Reaction has some unique declarative phrases. Some of them are:
- implements fragment
- arg => $value
- render $fragment => over @array
1 Assuming one has extended base or default skin from Reaction core.
Showing changes from previous revision. Removed | Added
