Default Page Layout

When Woof! is installed, it installs a file app/controllers/views/_layout.wtf that contains a page layout. Furthermore, it copies this file to app/controllers/views/layout.wtf which makes it the default page layout for all controllers that do not themselves specialize the layout as described in Page Layout.

An application may of course replace this default layout in app/controllers/views/layout.wtf with its own version. However, the default layout described here provides sufficient flexibility for many applications.

The default Woof! page layout divides a Web page into five page sections:

• The header section which contains content, such as a banner, that pat the top of a page.
• The footer section contains content that is to appear at the bottom of a page.
• The sidebar, which may contain elements such as navigation links that appear alongside the main content.
• The main section contains the primary content of the main page.
• The supplement section contains content related to the main content, such as additional related links, advertising.

All sections in the default layout are optional. Sections that are empty are omitted from the generated Web page with the exception of the main section which is always generated (as an empty section if no content is defined for it). Section content may be generated either through template files or directly created by application code.

Customizing the default layout

Note that the default layout provides some basic but commonly useful options for customizing the appearance of the web page, including the size and location of the sections, page widths and so on. These options are passed through the pagevar object and are set in either the controller constructor or action method depending on how widely the options are to be applied.

These default layout options are summarized below. For more details see the comments in the layout file.

yui_page_width	Determines the width of the web page. May be either a fixed width (see the layout file for valid values) or the keyword fluid (default) which will cause the web page to fill the browser window.
yui_no_margin	If set to false (default), a margin is set around the whole web page. If set to true, no margin is present which can cause bleeding of content into the browser window decorations.
yui_sidebar_pos	Controls positioning of the sidebar page section. Must be one of left (default) or right. The supplement page section is automatically placed on the other side.
yui_sidebar_width	Specifies the width of the sidebar. If positioned on the left, this must be one of 160px, 180px (default) or 300px. If positioned on the right, it must be one of 180px (default), 240px or 300px.
yui_main_percent	Percentage of the width remaining (after the sidebar), taken up by the main page section. Must be one of 25%, 33%, 50%, 66%, or 75%. This is ignored if the supplement page section is empty as in that the main section takes up the entire remaining width.

Woof! uses the YUI stylesheets to provide the underlying styles infrastructure for the default layout. The appropriate style classes are chosen based on the values of the above settings. The defaults and allowed values are part of YUI.

Example

The sample code below shows how an application might customize the default layout. In this example, we set up the options in the ApplicationController class constructor so it will apply to all pages in the application unless overridden by a controller or action. If you want to customize for a specific controller, you could do this customization in the constructor for that controller instead.

oo::class create ApplicationController {
    superclass ::woof::Controller
    constructor args {
        next {*}$args  ;# Call base constructor first
        pagevar set   yui_page_width 750px   yui_sidebar_width 160px
    }
}

Default layout boilerplate

In addition to laying out the page, the default layout template also includes some common HTML boilerplate. By convention, the layout template fetches this boilerplate from the pagevar object. Applications can set the appropriate values in pagevar any time before the page is rendered.

Currently, the following elements of the pagevar object are used.

title	The title to use for the page. If not set, the configuration variable app_name is used.
styles	The list of stylesheets to include in the page. Each element of this list is linked into the page using the include_stylesheet method. If not set, includes a default stylesheet based on YUI. If you do not want any stylesheets at all, set the value to an empty list.