@abreen/tada 1.8.0 → 1.9.0

package/bin/validators.ts

@@ -80,6 +80,6 @@ export function createSiteConfig({
     themeColor,
     tintHue: Number(tintHue),
     tintAmount: Number(tintAmount),
-    vars: {},
+    vars: { foobar: 123 },
   };
 }

package/build/templates.ts

@@ -122,8 +122,6 @@ export function compileTemplates(
       _.template(fs.readFileSync(filePath, 'utf-8'))({
         vars: siteVariables.vars || {},
         site: siteVariables,
-        base: siteVariables.base,
-        basePath: siteVariables.basePath,
       }),
     );
 

package/build/utils/render.ts

@@ -24,6 +24,7 @@ import {
   toPosix,
   toUrlPath,
 } from './paths';
+import { applySourceTemplate } from './source-template';
 import pkg from '../../package.json' with { type: 'json' };
 import { parseFrontMatterAndContent } from './front-matter';
 import { createMarkdown } from './markdown';
@@ -130,8 +131,6 @@ function createTemplateParameters({
     vars: siteVariables.vars || {},
     ...createGlobals(pageVariables, siteVariables, subPath),
     site: siteVariables,
-    base: siteVariables.base,
-    basePath: siteVariables.basePath,
     page: pageVariables,
     content,
     applyBasePath,
@@ -282,7 +281,8 @@ export function renderCodePageAsset({
   const subPath = toPosix(path.relative(contentDir, path.join(dir, name)));
   const applyBasePath = createApplyBasePath(siteVariables);
   const lang = siteVariables.codeLanguages![ext.slice(1).toLowerCase()];
-  const sourceCode = fs.readFileSync(filePath, 'utf-8');
+  const rawSource = fs.readFileSync(filePath, 'utf-8');
+  const sourceCode = applySourceTemplate(rawSource, siteVariables, filePath);
   const pageDirPath = toPosix(path.relative(contentDir, dir));
 
   log.info`Rendering code page ${B`${subPath + ext}`}`;
@@ -346,20 +346,26 @@ export function renderCopiedContentAsset({
 
   log.info`${label} ${B`${relPath}`}`;
 
-  if (filePath.endsWith('.java') && isFeatureEnabled(siteVariables, 'code')) {
-    const sourceCode = fs.readFileSync(filePath, 'utf-8');
+  if (!isFeatureEnabled(siteVariables, 'code')) {
+    return [{ assetPath: relPath, content: fs.readFileSync(filePath) }];
+  }
+
+  const rawSource = fs.readFileSync(filePath, 'utf-8');
+  const templated = applySourceTemplate(rawSource, siteVariables, filePath);
+
+  if (filePath.endsWith('.java')) {
     const pageDirPath = toPosix(
       path.relative(contentDir, path.dirname(filePath)),
     );
     const rewrittenLines = rewriteProseLinks(
-      sourceCode.split('\n'),
+      templated.split('\n'),
       siteVariables,
       pageDirPath,
     );
     return [{ assetPath: relPath, content: rewrittenLines.join('\n') }];
   }
 
-  return [{ assetPath: relPath, content: fs.readFileSync(filePath) }];
+  return [{ assetPath: relPath, content: templated }];
 }
 
 /** Parses the file, renders using template, returns HTML & params used to generate page */

package/build/utils/source-template.ts

@@ -0,0 +1,27 @@
+import _ from 'lodash';
+import type { SiteVariables } from '../types';
+
+/**
+ * Applies Lodash template syntax to a source code file's contents so that
+ * authors can interpolate site variables (like `<%= vars.fullCourseName %>`)
+ * in their source code. The template context mirrors the one used for JSON
+ * data files in `build/templates.ts`: `vars` and `site`. Invoked from
+ * `renderCodePageAsset` and `renderCopiedContentAsset` only when
+ * `features.code` is enabled.
+ */
+export function applySourceTemplate(
+  source: string,
+  siteVariables: SiteVariables,
+  filePath: string,
+): string {
+  const params = { vars: siteVariables.vars || {}, site: siteVariables };
+
+  try {
+    return _.template(source)(params);
+  } catch (err: unknown) {
+    throw new Error(
+      `${filePath}: Lodash template error in source code: ${(err as Error).message}`,
+      { cause: err },
+    );
+  }
+}

package/init/content/lectures/01/Rectangle.java

@@ -4,6 +4,8 @@
 /// by scaling using a _scale factor_ (a floating-point number between 0 and 1).
 ///
 /// See [`rectangle.py`](./rectangle.py) for a Python version of this class.
+///
+/// Here's `vars.foobar`: <%= vars.foobar %>
 public class Rectangle {
     private int width;
     private int height;

package/init/content/lectures/01/index.md

@@ -8,6 +8,12 @@ author: alex
 
 Here is a sample description of the topics covered at the first lecture.
 
+The value of `vars.foobar` is <%= vars.foobar %>.
+
+You can add any variables you want to the `site.dev.json` and `site.prod.json`
+files under the `"vars"` property and access them using Lodash template syntax
+from Markdown files, HTML files, and source code. (Lodash template subtitution
+only works in source code files when `features.code` is `true`.)
 
 ## Slides
 

package/init/content/lectures/01/rectangle.py

@@ -1,3 +1,8 @@
+#
+# rectangle.py
+#
+# Here's vars.foobar: <%= vars.foobar %>
+#
 class Rectangle:
     """A rectangle with integer side lengths.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abreen/tada",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "type": "module",
   "description": "A static site generator",
   "license": "MIT",

package/src/_layout.scss

@@ -222,8 +222,8 @@ footer {
     &::after {
       content: '';
       display: inline-block;
-      width: 1.3em;
-      height: 1.3em;
+      width: 1.5em;
+      height: 1.5em;
       vertical-align: middle;
       margin-left: 0.2em;
       @include contained-mask(var(--icon-tada));

package/src/print/style.scss

@@ -16,7 +16,8 @@
     }
   }
 
-  header {
+  header,
+  footer {
     display: none !important;
   }
 

package/src/search/index.ts

@@ -181,7 +181,14 @@ function render(
 
         const subTitle = doc.createElement('div');
         subTitle.className = 'title';
-        subTitle.textContent = sub.title;
+        if (result.template === 'code') {
+          subTitle.classList.add('code-page');
+          const code = doc.createElement('code');
+          code.textContent = sub.title;
+          subTitle.appendChild(code);
+        } else {
+          subTitle.textContent = sub.title;
+        }
         subA.appendChild(subTitle);
 
         if (sub.excerpt) {

package/templates/_bottom.html

@@ -1,8 +1,3 @@
-    <% if (site.features.footer) { %>
-    <footer>
-      <p>Generated by <a href="https://github.com/abreen/Tada" target="_blank">Tada</a> <%= tadaVersion %></p>
-    </footer>
-    <% } %>
     </div>
   </body>
 </html>

package/templates/_footer.html

@@ -0,0 +1,5 @@
+<% if (site.features.footer) { %>
+<footer data-pagefind-ignore>
+  <p>Generated by <a href="https://github.com/abreen/Tada" target="_blank">Tada</a> <%= tadaVersion %></p>
+</footer>
+<% } %>

package/templates/_theme.scss

@@ -67,7 +67,7 @@
   --icon-search: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'><circle cx='11' cy='11' r='7' stroke='<%= iconColor %>' stroke-width='2' fill='none'/><line x1='16.5' y1='16.5' x2='22' y2='22' stroke='<%= iconColor %>' stroke-width='2' stroke-linecap='round'/></svg>");
   --icon-chevron: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><polyline points='9 18 15 12 9 6' stroke='<%= iconColor %>' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
   --icon-breadcrumb: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'><path d='M3 7 H17 V22' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/><polyline points='11 16 17 22 23 16' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");
-  --icon-tada: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='39' height='39' viewBox='0 0 24 24'><path fill='black' d='m14.53 1.45l-1.08 1.08l1.6 1.6q.33.375.33.87c0 .495-.11.64-.33.86L11.5 9.47l1 1.08l3.63-3.61c.53-.59.79-1.24.79-1.94s-.26-1.36-.79-1.95zm-3.98 2.02L9.47 4.55l.61.56c.22.22.33.52.33.89s-.11.67-.33.89l-.61.56l1.08 1.08l.56-.61c.53-.59.8-1.23.8-1.92c0-.72-.27-1.37-.8-1.97zM21 5.06c-.69 0-1.33.27-1.92.8l-5.63 5.64l1.08 1l5.58-5.56c.25-.25.55-.38.89-.38s.64.13.89.38l.61.61l1.03-1.08l-.56-.61c-.59-.53-1.25-.8-1.97-.8M7 8L2 22l14-5zm12 3.06c-.7 0-1.34.27-1.94.8l-1.59 1.59l1.08 1.08l1.59-1.59c.25-.25.53-.38.86-.38s.63.13.88.38l1.62 1.59l1.05-1.03l-1.6-1.64c-.59-.53-1.25-.8-1.95-.8'/></svg>");
+  --icon-tada: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 -960 960 960'><path d='m121-172 151-426q4-11 13.48-17.5 9.47-6.5 20.3-6.5 7.22 0 13.52 2.5T331-612l277 276q5 5.4 7.5 11.7 2.5 6.3 2.5 13.5 0 10.8-6.5 20.3T594-277L167-126q-11 4-20.53.97-9.54-3.04-16.47-9.97-6.93-6.93-9.97-16.47Q117-161 121-172Zm791-506q-8 8-17 8t-17-8l-17-17q-13.8-14-34.5-14T792-695L589-491q-7.36 7-17.18 7T555-491q-7-7-7-16.82t7-17.18l203-204q28.07-28 67.53-28Q865-757 894-729l18 18q7 7.09 7 16.55 0 9.45-7 16.45ZM418-797q7.36-7 17.18-7t16.82 7l17 17q27 28.53 27 67.77Q496-673 469-644l-17 17q-7.36 7-17.18 7T418-627q-7-7-7-16.82t7-17.18l17-17q14-13.79 14-33.5T435-745l-18-18q-7-7.09-7-16.55 0-9.45 8-17.45Zm119-50q7-7 16.82-7t17.18 7l51 51q29 29 29 68.47 0 39.46-29 67.53L521-559q-7.09 7-16.55 7-9.45 0-17.45-7t-8-17.18q0-10.18 8-17.82l101-101q14-13.6 14-34t-14-34l-51-50q-7-7.36-7-17.18t7-16.82Zm340 407q-7 7-16.82 7T843-440l-51-51q-13.6-14-34-14t-34 14l-68 68q-7.36 7-17.18 7T622-423q-7-7-7-16.82t7-17.18l68-68q29-27 68.5-27.5T826-525l51 51q7 7.36 7 17.18T877-440Z'/></svg>");
 
   color-scheme: light dark;
 }

package/templates/code.html

@@ -22,6 +22,7 @@
       <% }); %>
     </div>
     <% } %>
+    <%= render('_footer.html') %>
   </main>
   <% if (page.tocHtml) { %>
   <nav class="toc"><%= page.tocHtml %></nav>

package/templates/default.html

@@ -4,6 +4,7 @@
   <%= render('_heading.html') %>
   <main class="body" data-pagefind-body>
     <%= content %>
+    <%= render('_footer.html') %>
   </main>
   <% if (page.toc && page.tocHtml) { %>
   <nav class="toc"><%= page.tocHtml %></nav>

package/templates/literate.html

@@ -7,6 +7,7 @@
       <code><%= page.downloadName %></code><%= render('_download.html') %>
     </div>
     <%= content %>
+    <%= render('_footer.html') %>
   </main>
   <% if (page.toc && page.tocHtml) { %>
   <nav class="toc"><%= page.tocHtml %></nav>