Added $base$ attribute for layouts.

This is the (relative) path to the wiki's base directory, relative to the directory of the page being rendered. Use this to keep relative links to css, javascript, images, etc. in the layout accessible even to pages in subdirectories.
jgm · Aug 3, 2009 · c83e054 · c83e054
1 parent bdfa6b2
commit c83e054
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 4 deletions.
diff --git a/README.markdown b/README.markdown
@@ -480,6 +480,10 @@ are rendered:
 - `$gendate$`:   the date the page was generated
 - `$sitetitle$`:   the site title from `config.yaml`
 - `$pagetitle$`:   the page title as defined in `index.yaml`
+- `$base$`:  the path to the website's base directory, relative to the
+  page being rendered (put this in front of urls for css and javascript
+  in the layout file, so that these resources can be found even when
+  you're in a subdirectory of the site)
 
 ### Previewing a site
 

diff --git a/Yst/Render.hs b/Yst/Render.hs
@@ -112,11 +112,15 @@ renderPage site page = do
   layoutTempl <- getTemplate layout g
   let format = formatFromExtension (stripStExt layout)
   let contents = converterForFormat format rawContents
+  let base' = case length (filter (=='/') $ pageUrl page) of
+                    0  -> ""
+                    n  -> concat $ replicate n "../"
   return $ render
          . setAttribute "sitetitle" (siteTitle site)
          . setAttribute "pagetitle" (pageTitle page)
          . setAttribute "gendate" todaysDate 
          . setAttribute "contents" contents
+         . setAttribute "base" base'
          . setAttribute "nav" menuHtml
          $ layoutTempl
 

diff --git a/demo/layout.html.st b/demo/layout.html.st
@@ -2,10 +2,10 @@
 <head>
    <title>$sitetitle$ - $pagetitle$</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-   <link rel="stylesheet" type="text/css" href="css/screen.css" />
-   <link rel="stylesheet" type="text/css" media="print" href="css/print.css" />
+   <link rel="stylesheet" type="text/css" href="$base$css/screen.css" />
+   <link rel="stylesheet" type="text/css" media="print" href="$base$css/print.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
-   <script src="js/nav.js" type="text/javascript"></script>
+   <script src="$base$js/nav.js" type="text/javascript"></script>
 </head>
 <body>
   <div id="doc3" class="yui-t1">
@@ -19,4 +19,4 @@ $nav$
     </div>
   </div>
 </body>
-</html>
+</html>