Add item detail page

tasks/build.js

@@ -1,5 +1,6 @@
 import {
   createRadar,
+  groupByQuadrants,
   outputRadar,
 } from './radar';
 import {
@@ -11,7 +12,9 @@ import {
   try {
     const radar = await createRadar();
     outputRadar(radar);
-    createStatic(radar);
+
+    // const radarByQuadrants = groupByQuadrants(radar);
+    createStatic(radar.quadrants);
 
     console.log('Built radar');
     // console.log(JSON.stringify(radar, null, 2));

tasks/radar.js

@@ -18,12 +18,24 @@ export const createRadar = async (tree) => {
   const revisions = await createRevisionsFromFiles(fileNames);
   const allReleases = getAllReleases(revisions);
   const items = createItems(revisions);
-  const itemsWithIsNewFlag = flagWithIsNew(items, allReleases);
-  const quadrants = groupByQuadrants(itemsWithIsNewFlag);
+  const flaggedItems = flagWithIsNew(items, allReleases);
 
-  return quadrants;
+  const quadrants = groupByQuadrants(flaggedItems);
+
+  return {
+    items: flaggedItems,
+    quadrants,
+  }
 };
 
+export const groupByQuadrants = (items) => (
+  items.reduce((quadrants, item) => ({
+    ...quadrants,
+    [item.quadrant]: addItemToQuadrant(quadrants[item.quadrant], item),
+  }), {})
+);
+
+
 const createRevisionsFromFiles = (fileNames) => (
   Promise.all(fileNames.map((fileName) => {
     return new Promise((resolve, reject) => {
@@ -135,14 +147,17 @@ const revisionCreatesNewHistoryEntry = (revision) => {
          typeof revision.attributes.ring !== 'undefined';
 };
 
-export const outputRadar = (radar) => {
+export const outputRadar = ({ quadrants, items }) => {
+  Object.entries(quadrants).map(async ([quadrantName, quadrant]) => (
+    await outputQuadrantPage(quadrantName, quadrant)
+  ));
   return Promise.all(
-    Object.entries(radar).map(async ([quadrantName, quadrant]) => {
-      await outputQuadrantPage(quadrantName, quadrant);
-      Object.entries(quadrant).map(([itemName, item]) => (
+    items.map(async (item) => {
+
+      // Object.entries(quadrant).map(([itemName, item]) => (
         new Promise((resolve, reject) => {
-          outputFile(distPath(quadrantName, `${itemName}.html`), itemTemplate(vars({
-            quadrantName,
+          outputFile(distPath(item.quadrant, `${item.name}.html`), itemTemplate(vars({
+            itemsInRing: quadrants[item.quadrant][item.attributes.ring],
             item,
           })), (err, data) => {
             if (err) {
@@ -152,11 +167,12 @@ export const outputRadar = (radar) => {
             }
           })
         })
-      ))
+      // ))
     })
   );
 };
 
+
 const outputQuadrantPage = (quadrantName, quadrant) => (
   new Promise((resolve, reject) => {
     outputFile(distPath(`${quadrantName}.html`), quadrantTemplate(vars({
@@ -183,13 +199,6 @@ const isNewItem = (item, allReleases) => {
   return item.revisions[0].release === allReleases[allReleases.length-1]
 }
 
-const groupByQuadrants = (items) => (
-  items.reduce((quadrants, item) => ({
-    ...quadrants,
-    [item.quadrant]: addItemToQuadrant(quadrants[item.quadrant], item),
-  }), {})
-);
-
 const addItemToQuadrant = (quadrant = {}, item) => ({
   ...quadrant,
   [item.attributes.ring]: addItemToRing(quadrant[item.attributes.ring], item),

tasks/template.js

@@ -17,6 +17,6 @@ export const vars = (vars) => ({
   ...vars,
 })
 
-export const item = pug.compileFile(relativePath(templateFolder, 'item.pug'));
+export const item = pug.compileFile(relativePath(templateFolder, 'item-page.pug'));
 
-export const quadrant = pug.compileFile(relativePath(templateFolder, 'quadrant.pug'));
+export const quadrant = pug.compileFile(relativePath(templateFolder, 'quadrant-page.pug'));

tasks/watch.js

@@ -12,7 +12,8 @@ import {
   distPath,
 } from './file';
 
-const watchBuild = (name) => (eventType, fileName) => {
+
+const runBuild = (name) => (
   exec(`npm run build:${name}`, (error, stdout, stderr) => {
     if (error) {
       console.error(`exec error: ${error}`);
@@ -21,12 +22,16 @@ const watchBuild = (name) => (eventType, fileName) => {
     console.log(stdout);
     console.error(stderr);
   })
-}
+);
+
+const watchBuild = (name) => (eventType, fileName) => runBuild(name);
 
 const options = {
   recursive: true,
 }
 
+runBuild('all');
+
 watch(stylesPath(), options, watchBuild('css'));
 watch(jsPath(), options, watchBuild('js'));
 watch(assetsPath(), options, watchBuild('assets'));