SlideShare une entreprise Scribd logo
1  sur  35
Chicago, October 19 - 22, 2010
Grails Layouts & Sitemesh
Colin Harrington – Object Partners
Sitemesh :: sitemesh.org
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
whoami
Colin Harrington
Senior Consultant
colin.harrington@gmail.com
colin.harrington@objectpartners.com
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
When & What
Grails 1.3.5
Groovy 1.7.5
Spring 3.0.3
Servlet 2.5
Sitemesh 2.4 (new to Grails 1.1+)
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
GSP
GSP = Groovy Server Pages
GroovyPage
(org.codehaus.groovy.grails.web.pages.GroovyPage)
Part of the
GroovyPagesGrailsPlugin
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Rich View layer
GSP
Taglibs
Page Directives
Expressions
Views
Templates
...
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Grails Layouts
Templating only goes so far...
view + layout
DRY
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Sitemesh
'It is a HTML templating framework based on the
"Decoration" model'
”It is a web-page layout and decoration framework
and web application integration framework to aid in
creating large sites consisting of many pages for
which a consistent look/feel, navigation and layout
scheme is required”
~ Wikipedia
http://en.wikipedia.org/wiki/Java:_View_Technologies_and_Frameworks
http://en.wikipedia.org/wiki/SiteMesh
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Sitemesh
Orignally Developed in 1999 by Joe Walnes.
Now part of the OpenSymphony Project
Implemented in Java
Can decorate any html so
Compatible with {php, asp, perl, python ...}
http://www.opensymphony.com/sitemesh/
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Mesh!
← Layout
Views →
Rendered
Result →
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Demo
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
web.xml
...
<filter>
  <filter­name>sitemesh</filter­name>
  <filter­class>...GrailsPageFilter</filter­class>
</filter>
...
(org.codehaus.groovy.grails.web.sitemesh.GrailsPageFilter)
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
sitemesh.xml
<sitemesh>
  <page­parsers>
    <parser content­type="text/html"                 
      class="...GrailsHTMLPageParser"/>
    <parser 
      content­type="text/html;charset=ISO­8859­1"
      class="...GrailsHTMLPageParser"/>
    <parser content­type="text/html;charset=UTF­8"
      class="...GrailsHTMLPageParser"/>
  </page­parsers>
  ...
</sitemesh>
(org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser)
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
sitemesh.xml
<sitemesh>
    ...
    <decorator­mappers>
        <mapper 
class="...GrailsLayoutDecoratorMapper" />
    </decorator­mappers>
</sitemesh>
(org.codehaus.groovy.grails.web.sitemesh.GrailsLayoutDecoratorMapper)
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Triggering layouts
In order of precedence:

 meta.layout

static 'layout' property on the controller

controller/action conventions:

/layouts/${controller}/${action}.gsp

/layouts/${controller}.gsp 

configured grails.sitemesh.default.layout

  /layouts/application.gsp
meta.layout
<html>
<head>
  <meta name="layout" content="main"/>
  ...
</head>
<body>...</body>
</html>
This triggers grails­app/views/layouts/main.gsp
static layout
Static property on the controller
class BookController {
    static layout = 'customLayout'
    def list = { … } 
}
This will trigger
grails­app/views/layouts/customLayout.gsp for all
of the controller actions in the BookController
(meta.layout has first precedence)
${controller}/${action} convention
Controller & Controller Action Convention
class BookController {
    def list = { … } 
}
grails­app/views/layouts/book/list.gsp
If not → it looks for:
grails­app/views/layouts/book.gsp
Otherwise it gives up and doesn't decorate the Page
${controller}/${action} convention
Controller & Controller-Action Convention
class BookController {
    def list = { … } 
}
grails­app/views/layouts/book/list.gsp
If not → it looks for:
grails­app/views/layouts/book.gsp
grails.sitemesh.default.layout
// grails­app/conf/Config.groovy
grails.sitemesh.default.layout='myLayoutName'
application.gsp
When all else fails:
grails­app/views/layouts/application.gsp
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Basic layout tags
{layoutTitle, layoutHead, layoutBody}
<html>
<head>
    <title><g:layoutTitle default="my page" /></title>
    <g:layoutHead />
</head>
<body>
     <div class="menu"><!-- common menu here--></div>
     <div class="body">
         <g:layoutBody />
     </div>
</body>
</html>
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Page properties
View:
<html>
<head>
    <meta name="layout" content="myLayout" />
</head>
<body onload="alert('hello');">
Page to be decorated
</body>
</html>
Layout (myLayout.gsp):
<html>
<head><g:layoutHead /></head>
<body onload="${pageProperty(name:'body.onload')}">
    <g:layoutBody />
</body>
</html>
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
<g:pageProperty/>
<g:pageProperty name="page.mainNav"/>
<g:pageProperty name="page.mainNav"
default="home"/>
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
<g:ifPageProperty/>
<g:ifPageProperty name=”showTheContent”>
This content is only displayed if the page
property is present
</g:ifPageProperty>
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
<parameter/>
<parameter name=”myParameter”
value=”foo”>
Accessible as a page property
${pageProperty(name:
'page.myParameter')}
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
<content/>
View:
<body>
...
<content tag="sidebar">
Page specific Sidebar...
</content>
...
</body>
Layout:
<div id="sidebar">
<g:pageProperty name="page.sidebar" default=""/>
</div><!-- #sidebar -->
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
<meta/>
<meta> tags get added as a pageProperty
'meta.propertyName'
<meta name="myProp" content="myContent"/>
<g:pageProperty name="meta.myProp" />
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
<g:applyLayout/>
<g:applyLayout name="fieldsetWrapper">
This goes into the layoutBody of
'fieldsetWrapper' layout
</g:applyLayout>
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Q&A
SpringOne 2GX 2010. All rights reserved. Do not distribute without permission.
Thank you!

Contenu connexe

Similaire à Grails Layouts & Sitemesh

Magento x codekit x sass x compass x skeleton responsive grid
Magento x codekit x sass x compass x skeleton responsive gridMagento x codekit x sass x compass x skeleton responsive grid
Magento x codekit x sass x compass x skeleton responsive gridArush Sehgal
 
29 Advanced Google Tag Manager Tips Every Marketer Should Know
29 Advanced Google Tag Manager Tips Every Marketer Should Know29 Advanced Google Tag Manager Tips Every Marketer Should Know
29 Advanced Google Tag Manager Tips Every Marketer Should KnowMike Arnesen
 
Try Web Components
Try Web ComponentsTry Web Components
Try Web Components拓樹 谷
 
Jedi Mind Tricks for Git
Jedi Mind Tricks for GitJedi Mind Tricks for Git
Jedi Mind Tricks for GitJan Krag
 
Pro git - grasping it conceptually
Pro git - grasping it conceptuallyPro git - grasping it conceptually
Pro git - grasping it conceptuallyseungzzang Kim
 
How to Really Get Git
How to Really Get GitHow to Really Get Git
How to Really Get GitSusan Tan
 
Building Faster Websites
Building Faster WebsitesBuilding Faster Websites
Building Faster WebsitesMatthew Farina
 
GTM container positions: a summary of best & worst
GTM container positions: a summary of best & worstGTM container positions: a summary of best & worst
GTM container positions: a summary of best & worstPhil Pearce
 
Drupal, GraphQL, Views, View Modes and Gatsby for a US Gov site CMS Philly
Drupal, GraphQL, Views, View Modes  and Gatsby for a US Gov site CMS PhillyDrupal, GraphQL, Views, View Modes  and Gatsby for a US Gov site CMS Philly
Drupal, GraphQL, Views, View Modes and Gatsby for a US Gov site CMS PhillyJesus Manuel Olivas
 
The Future of Sharding
The Future of ShardingThe Future of Sharding
The Future of ShardingEDB
 
Juliette Reinders Folmer - Promote your open source project with GitHub Pages...
Juliette Reinders Folmer - Promote your open source project with GitHub Pages...Juliette Reinders Folmer - Promote your open source project with GitHub Pages...
Juliette Reinders Folmer - Promote your open source project with GitHub Pages...Codemotion
 
IPhone Web Development With Grails from CodeMash 2009
IPhone Web Development With Grails from CodeMash 2009IPhone Web Development With Grails from CodeMash 2009
IPhone Web Development With Grails from CodeMash 2009Christopher Judd
 
18 Git #burningkeyboards
18 Git #burningkeyboards18 Git #burningkeyboards
18 Git #burningkeyboardsDenis Ristic
 
Getting Groovy With Grails
Getting Groovy With GrailsGetting Groovy With Grails
Getting Groovy With GrailsBryan Basham
 

Similaire à Grails Layouts & Sitemesh (20)

Magento x codekit x sass x compass x skeleton responsive grid
Magento x codekit x sass x compass x skeleton responsive gridMagento x codekit x sass x compass x skeleton responsive grid
Magento x codekit x sass x compass x skeleton responsive grid
 
29 Advanced Google Tag Manager Tips Every Marketer Should Know
29 Advanced Google Tag Manager Tips Every Marketer Should Know29 Advanced Google Tag Manager Tips Every Marketer Should Know
29 Advanced Google Tag Manager Tips Every Marketer Should Know
 
Try Web Components
Try Web ComponentsTry Web Components
Try Web Components
 
Jedi Mind Tricks for Git
Jedi Mind Tricks for GitJedi Mind Tricks for Git
Jedi Mind Tricks for Git
 
Pro git - grasping it conceptually
Pro git - grasping it conceptuallyPro git - grasping it conceptually
Pro git - grasping it conceptually
 
Git
GitGit
Git
 
How to Really Get Git
How to Really Get GitHow to Really Get Git
How to Really Get Git
 
Building Faster Websites
Building Faster WebsitesBuilding Faster Websites
Building Faster Websites
 
SVCC Intro to Grails
SVCC Intro to GrailsSVCC Intro to Grails
SVCC Intro to Grails
 
GTM container positions: a summary of best & worst
GTM container positions: a summary of best & worstGTM container positions: a summary of best & worst
GTM container positions: a summary of best & worst
 
Git setuplinux
Git setuplinuxGit setuplinux
Git setuplinux
 
GitSetupLinux
GitSetupLinuxGitSetupLinux
GitSetupLinux
 
Drupal, GraphQL, Views, View Modes and Gatsby for a US Gov site CMS Philly
Drupal, GraphQL, Views, View Modes  and Gatsby for a US Gov site CMS PhillyDrupal, GraphQL, Views, View Modes  and Gatsby for a US Gov site CMS Philly
Drupal, GraphQL, Views, View Modes and Gatsby for a US Gov site CMS Philly
 
The Future of Sharding
The Future of ShardingThe Future of Sharding
The Future of Sharding
 
Grails Plugins
Grails PluginsGrails Plugins
Grails Plugins
 
Juliette Reinders Folmer - Promote your open source project with GitHub Pages...
Juliette Reinders Folmer - Promote your open source project with GitHub Pages...Juliette Reinders Folmer - Promote your open source project with GitHub Pages...
Juliette Reinders Folmer - Promote your open source project with GitHub Pages...
 
IPhone Web Development With Grails from CodeMash 2009
IPhone Web Development With Grails from CodeMash 2009IPhone Web Development With Grails from CodeMash 2009
IPhone Web Development With Grails from CodeMash 2009
 
18 Git #burningkeyboards
18 Git #burningkeyboards18 Git #burningkeyboards
18 Git #burningkeyboards
 
Git internals
Git internalsGit internals
Git internals
 
Getting Groovy With Grails
Getting Groovy With GrailsGetting Groovy With Grails
Getting Groovy With Grails
 

Dernier

Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEarley Information Science
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slidevu2urc
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Enterprise Knowledge
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024The Digital Insurer
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j
 
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure serviceWhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure servicePooja Nehwal
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxKatpro Technologies
 
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilDeveloping An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilV3cube
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking MenDelhi Call girls
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 

Dernier (20)

Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure serviceWhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
 
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilDeveloping An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 

Grails Layouts & Sitemesh