The layout.py module source

This module defined ILayout, which is a marker for a generic site layout view.  Models can inherit the view by implementing ILayout.

import grok
from resource import style, favicon, tinymce, textdivs
from interfaces import Interface

class ILayout(Interface):
    ''' This is an interface for the main site layout

            All a model has to do to inherit the Layout view, is to say that it
            implements this interface.

            The Layout view defines a basic HTML document shell consisting of a
            number of parts; the viewlet managers below are place holders for your
            site implementation to fill in the blanks.  What goes in those sections
            will depend on the context.
    '''

# We specify the renderable areas of the page as viewlet managers.
# These areas will always render for instances of ILayout
class MastHead(grok.ViewletManager):
    grok.context(ILayout)

class AuthSection(grok.ViewletManager):
    grok.context(ILayout)

class Navigation(grok.ViewletManager):
    grok.context(ILayout)

class Content(grok.ViewletManager):
    grok.context(ILayout)

class SideBar(grok.ViewletManager):
    grok.context(ILayout)

class Footer(grok.ViewletManager):
    grok.context(ILayout)

# We define a few viewlets which always render for specific areas
# of the page.  These render because the template for the Layout
# view (below) does tal:content='structure provider:masthead' etc.
# The appropriate viewletmanager collects up all the viewlets
# registered for itself and renders them.  No magic involved.
class MastHeadViewlet(grok.Viewlet):
    ''' Render layout masthead
    '''
    grok.context(ILayout)
    grok.viewletmanager(MastHead)

class FooterViewlet(grok.Viewlet):
    ''' Render the layout footer
    '''
    grok.context(ILayout)
    grok.viewletmanager(Footer)

# Finally, the page layout itself is a view which renders the html
# skeleton.  It also includes any resources such as css and javascript
# which would be required by the content.
class Layout(grok.View):
    ''' Renders the base HTML page layout for the site.
        Since for this site, editing, adding and deleting are
        going to be common actions, we provide for these actions as
        URL arguments.  Another approach would have been to use
        traversers, and make the operations part of the URL itself.
    '''
    grok.context(ILayout)
    grok.name('index')
    grok.require('zope.Public')

    editing = False
    adding = False
    deleting = False
    viewing = True

    def update(self, edit=None, add=None, delete=None, nomce=None):
        self.editing = edit is not None
        self.adding = add is not None
        self.deleting = delete is not None
        self.viewing = not (self.editing or self.adding or self.deleting)
        style.need()
        favicon.need()
        if nomce is None:  # Switch includes or omits tinyMCE
            tinymce.need()
        textdivs.need()

 layout.pt is the main site layout page template

Note now the page template defined slots for the various viewlet managers, to be filled by the specific model implementations for the associated viewlets.

<!doctype html>
<html itemscope="itemscope" itemtype="http://schema.org/WebPage" xmlns="http://www.w3.org/1999/xhtml"
	xml:lang="en"
    xmlns:tal="http://xml.zope.org/namespaces/tal"
    xmlns:i18n="http://xml.zope.org/namespaces/i18n" lang="en">
	<head>
		<meta content="IE=9" http-equiv="X-UA-Compatible" />
		<meta content="text/html; charset=UTF-8" http-equiv="content-type" />
		<meta name="viewport" content="width=device-width user-scalable=no" />
		<title tal:content="context/title | context/description | string:Untitled" />
	</head>
	<body i18n:domain="camibox">
		<div class='MastHead rounded-top' tal:content='structure provider:masthead' />
		<div class='ContentWrapper'>
		    <div class='ContentArea'>
                <div class='Navigation' tal:content='structure provider:navigation' />
                <div class='SideBar' tal:content='structure provider:sidebar' />
                <div class='ContentBox'>
                    <div class='Content' tal:content='structure provider:content' />
                </div>
    		</div>
		</div>
        <div class='Footer' tal:content='structure provider:footer' />
	</body>
</html>

We only define the header and footer viewlets in layout.py.

mastheadviewlet.pt is the template for the masthead viewlet:
<div>
    <div style="float:right" tal:content="structure provider:authsection" />
    <div style="float:left">
        <h1>Grok 4 Noobs</h1>
        <h4 class='indent' tal:content='context/title' />
    </div>
    <div style="float:none; clear: both" />
</div>
footerviewlet.pt is the page template for the footer viewlet:
<em>Grok 4 Noobs</em>; A site built using 
<a href="http://grok.zope.org/doc/current/index.html">
Grok
</a>

 

Grok 4 Noobs

The full source for the layout.py module