Add support for static pages

package.json

@@ -4,7 +4,7 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "create": "npm run clean && babel-node ./scripts/create.js",
+    "build": "npm run clean && babel-node ./scripts/build.js",
     "clean": "babel-node ./scripts/clean.js",
     "test": "echo \"Error: no test specified\" && exit 1"
   },

radar/2016-02-02/languages-and-frameworks/vue.md

@@ -14,14 +14,3 @@ Hier steht der Rest!
 
 History
 -------
-
-{% include
-  history-entry.html
-  ring="trial"
-  date="2017-12-10"
-  content="This is a history entry
-
-  - Foo
-  - Bar
-  "
-%}

scripts/build.js

@@ -0,0 +1,21 @@
+import {
+  createRadar,
+  outputRadar,
+} from './radar';
+import {
+  createStatic,
+} from './static';
+
+
+(async () => {
+  try {
+    const radar = await createRadar();
+    outputRadar(radar);
+    createStatic(radar);
+
+    console.log('Radar build!');
+    console.log(JSON.stringify(radar, null, 2));
+  } catch(e) {
+    console.error('error:', e);
+  }
+})()

scripts/create.js

@@ -1,51 +0,0 @@
-import {
-  readFile,
-  outputFile,
-} from 'fs-extra';
-import frontmatter from 'front-matter';
-import marked from 'marked';
-import waterfall from 'async/waterfall';
-import {
-  srcPath,
-  distPath,
-} from './file';
-import {
-  createRadar,
-  outputRadar,
-} from './radar';
-
-
-(async () => {
-  try {
-    const radar = await createRadar();
-    outputRadar(radar);
-    // console.log(JSON.stringify(radar, null, 2));
-  } catch(e) {
-    console.error('error:', e);
-  }
-})()
-
-//
-// const fileName = srcPath('v1/tools/grunt.md');
-//
-// console.log('<<< start creating files');
-//
-// waterfall([
-//     (callback) => {
-//       readFile(fileName, 'utf8', callback);
-//     },
-//     (data, callback) => {
-//       const item = frontmatter(data);
-//       const html = marked(item.body);
-//
-//       outputFile(distPath('test3.html'), html, callback);
-//     }
-//   ],
-//   (err, results) => {
-//     if (!err) {
-//       console.log('done creating files >>>');
-//     } else {
-//       console.error(err);
-//     }
-//   }
-// );

scripts/file.js

@@ -1,13 +1,56 @@
 import path from 'path';
+import { walk } from 'walk';
 
 export const relativePath = (...relativePath) => (
   path.resolve(__dirname, '..', ...relativePath)
 );
 
-export const srcPath = (...pathInSrc) => (
+export const radarPath = (...pathInSrc) => (
   relativePath('radar', ...pathInSrc)
 );
 
+export const staticPath = (...pathInSrc) => (
+  relativePath('static-pages', ...pathInSrc)
+);
+
 export const distPath = (...pathInDist) => (
   relativePath('dist', ...pathInDist)
 );
+
+export const getAllMarkdownFiles = (folder) => (
+  getAllFiles(folder, isMarkdownFile)
+);
+
+export const getAllPugFiles = (folder) => (
+  getAllFiles(folder, isPugFile)
+);
+
+const getAllFiles = (folder, predicate) => (
+  new Promise((resolve, reject) => {
+    const walker = walk(folder, { followLinks: false });
+    const files = [];
+
+    walker.on("file", (root, fileStat, next) => {
+      if (predicate(fileStat.name)) {
+        files.push(path.resolve(root, fileStat.name));
+      }
+      next();
+    });
+
+    walker.on("errors", (root, nodeStatsArray, next) => {
+      nodeStatsArray.forEach(function (n) {
+        console.error("[ERROR] " + n.name)
+        console.error(n.error.message || (n.error.code + ": " + n.error.path));
+      });
+      next();
+    });
+
+    walker.on("end", () => {
+      resolve(files.sort());
+    });
+  })
+);
+
+const isMarkdownFile = (name) => name.match(/\.md$/);
+
+const isPugFile = (name) => name.match(/\.pug$/);

scripts/radar.js

@@ -1,46 +1,21 @@
-import { walk } from 'walk';
 import fs, { readFile, outputFile } from 'fs-extra';
 import path from 'path';
 import frontmatter from 'front-matter';
 import marked from 'marked';
-import { srcPath, distPath } from './file';
+import {
+  radarPath,
+  distPath,
+  getAllMarkdownFiles,
+} from './file';
 import { item as itemTemplate } from './template';
 
 export const createRadar = async (tree) => {
-  const fileNames = await getAllMarkdownFiles();
+  const fileNames = (await getAllMarkdownFiles(radarPath())).reverse();
   const revisions = await createRevisionsFromFiles(fileNames);
   const quadrants = createQuadrants(revisions);
   return quadrants;
 };
 
-const getAllMarkdownFiles = () => (
-  new Promise((resolve, reject) => {
-    const walker = walk(srcPath(), { followLinks: false });
-    const files = [];
-
-    walker.on("file", (root, fileStat, next) => {
-      if (isMarkdownFile(fileStat.name)) {
-        files.push(path.resolve(root, fileStat.name));
-      }
-      next();
-    });
-
-    walker.on("errors", (root, nodeStatsArray, next) => {
-      nodeStatsArray.forEach(function (n) {
-        console.error("[ERROR] " + n.name)
-        console.error(n.error.message || (n.error.code + ": " + n.error.path));
-      });
-      next();
-    });
-
-    walker.on("end", () => {
-      resolve(files.sort().reverse());
-    });
-  })
-);
-
-const isMarkdownFile = (name) => name.match(/\.md$/);
-
 const createRevisionsFromFiles = (fileNames) => (
   Promise.all(fileNames.map((fileName) => {
     return new Promise((resolve, reject) => {
@@ -99,7 +74,6 @@ const addRevisionToItem = (item = {
     ...rest,
   } = revision;
   return {
-    quadrant,
     attributes: {
       ...item.attributes,
       ...revision.attributes,
@@ -114,8 +88,10 @@ export const outputRadar = (radar) => {
     Object.entries(radar).map(([quadrantName, quadrant]) => (
       Object.entries(quadrant).map(([itemName, item]) => (
         new Promise((resolve, reject) => {
-          console.log(JSON.stringify(item, null, 2));
+          outputFile(distPath(quadrantName, `${itemName}.html`), itemTemplate({
-          outputFile(distPath(quadrantName, `${itemName}.html`), itemTemplate(item), (err, data) => {
+            quadrantName,
+            item,
+          }), (err, data) => {
             if (err) {
               reject(err);
             } else {

scripts/static.js

@@ -0,0 +1,39 @@
+import { outputFile } from 'fs-extra';
+import pug from 'pug';
+import frontmatter from 'front-matter';
+import marked from 'marked';
+import {
+  staticPath,
+  distPath,
+  getAllPugFiles,
+} from './file';
+
+export const createStatic = async (radar) => {
+  const paths = await getAllPugFiles(staticPath());
+  const fileNames = getPlainFileNames(paths);
+  return renderStaticPages(radar, fileNames);
+  return fileNames;
+};
+
+const getPlainFileNames = (paths) => (
+  paths.map((fileName) => {
+    const [ nameWithSuffix ] = fileName.split('/').slice(-1);
+    return nameWithSuffix.substr(0, nameWithSuffix.length - 4);
+  })
+)
+
+const renderStaticPages = (radar, fileNames) => (
+  Promise.all(fileNames.map((name) => (
+    new Promise((resolve, reject) => (
+      outputFile(distPath(`${name}.html`), pug.renderFile(staticPath(`${name}.pug`), {
+        radar,
+      }), (err, data) => {
+        if (err) {
+          reject(err);
+        } else {
+          resolve(data);
+        }
+      })
+    ))
+  )))
+);

static-pages/index.pug

@@ -0,0 +1,14 @@
+extends ../templates/layout.pug
+
+block vars
+  - var title='Overview'
+
+block content
+  ul
+    each quadrant, quadrantName in radar
+      li
+        h4= quadrantName
+        ul
+          each radarItem, itemName in quadrant
+            li
+              a(href='/' + quadrantName + '/' + itemName + '.html')= radarItem.attributes.title

templates/item.pug

@@ -1,18 +1,21 @@
 extends layout.pug
 
+block vars
+  - var title=item.attributes.title
+
 block content
-  a(href='/' + quadrant + '.html') #{quadrant}
+  a(href='/' + quadrantName + '.html') #{quadrantName}
-  h1 #{attributes.title}
+  h1 #{item.attributes.title}
     = ' '
-    small #{attributes.ring}
+    small #{item.attributes.ring}
 
   hr
   section
-    != revisions[0].body
+    != item.revisions[0].body
   hr
 
   ul
-    each revision, index in revisions
+    each revision, index in item.revisions
       if index > 0
         li
           = revision.version

templates/layout.pug

@@ -1,7 +1,13 @@
+block vars
 html
   head
-    title #{attributes.title} - AOE Tech Radar
+    title #{title} - AOE Tech Radar
     block scripts
       script(src='/jquery.js')
+
+  h3 AOE Tech Radar
+    
+  hr
+
   body
     block content