I'm trying to setup a SiteMesh layout in grails v2.3.1 using the asset-pipeline plug-in (v1.0.4), but I'm not sure how to handle inclusion of javascript resources in a specific location of my template (like you would using r:layoutResources if using the resources plugin).
Example layout (grails-app/views/layouts/test.gsp):
<html>
<head>
<title><g:layoutTitle/></title>
<g:layoutHead/>
</head>
<body>
<div class="thecontent">
<g:layoutBody/>
</div>
<asset:javascript src="application.js"/>
<!-- WANT DECORATED PAGE RESOURCES TO BE INCLUDED HERE -->
</body>
</html>
Example gsp (grails-app/views/test.gsp):
<html>
<head>
<meta name="layout" content="test"/>
<title>The Title</title>
<asset:stylesheet src="thispageonly.css"/>
</head>
<body>
<div id="helloworld">
Hello World
</div>
<asset:javascript src="thispageonly.js"/>
</body>
</html>
The resulting decorated page (ignoring asset-pipeline bundling/etc) works for stylesheet (since it's in head) but fails for javascript:
<html>
<head>
<meta name="layout" content="test"/>
<title>The Title</title>
<link rel="stylesheet" href="/assets/thispageonly.css?compile=false"/>
</head>
<body>
<div class="thecontent">
<div id="helloworld">
Hello World
</div>
<!-- *** NOT WHERE I WANT THIS *** -->
<script src="/assets/thispageonly.js?compile=false" type="text/javascript"></script>
</div>
<script src="/assets/application.js?compile=false" type="text/javascript"></script>
</body>
</html>
Currently the only way I can get this to work is to use g:applyLayout and g:pageProperty:
<!-- grails-app/views/layouts/test2.gsp -->
<html>
<head>
<title><g:layoutTitle/></title>
<g:layoutHead/>
</head>
<body>
<div class="thecontent">
<g:layoutBody/>
</div>
<asset:javascript src="application.js"/>
<g:pageProperty name="page.javascript"/>
</body>
</html>
<!-- grails-app/views/test2.gsp -->
<g:applyLayout name="test2">
<html>
<head>
<title>The Title</title>
<asset:stylesheet src="thispageonly.css"/>
</head>
<body>
<div id="helloworld">
Hello World
</div>
<content tag="javascript">
<asset:javascript src="thispageonly.js"/>
</content>
</body>
</html>
</g:applyLayout>
But this departure from meta tag seems overly complicated (plus I'm not clear whether the poorly documented g:pageProperty will be supported as-is in future upgrades). What's the best long-term way of doing this?
FYI: This works well for me though it's a little bit ugly.
<!-- grails-app/views/layouts/test2.gsp -->
<html>
<head>
<title><g:layoutTitle/></title>
<g:layoutHead/>
</head>
<body>
<div class="thecontent">
<g:layoutBody/>
</div>
<asset:javascript src="application.js"/>
<asset:deferredScripts/>
</body>
</html>
<!-- grails-app/views/test2.gsp -->
<g:applyLayout name="test2">
<html>
<head>
<title>The Title</title>
<asset:stylesheet src="thispageonly.css"/>
</head>
<body>
<div id="helloworld">
Hello World
</div>
<asset:script src="${assetPath(src: 'thispageonly.js')}" type="text/javascript" />
</body>
</html>
</g:applyLayout>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With