Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Grails layoutResources equivalent for asset-pipeline

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?

like image 265
mdlandon Avatar asked Nov 05 '13 17:11

mdlandon


1 Answers

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>
like image 149
Yasuharu Nakano Avatar answered Oct 14 '22 15:10

Yasuharu Nakano