closes #9, started #8

okwolo · Jan 18, 2018 · b69a1b9 · b69a1b9
1 parent 41b28df
commit b69a1b9
Show file tree

Hide file tree

Showing 9 changed files with 36 additions and 12 deletions.
diff --git a/cmd/build.js b/cmd/build.js
@@ -58,16 +58,26 @@ const generateTemplates = () => {
     const template = fs.readFileSync('./src/template.html', 'utf8');
 
     // require every time so that contents are updated
-    require('../src/pages').forEach(({pathname, component}) => {
+    require('../src/pages').forEach(({title, pathname, description, component}) => {
         const app = okwolo((content) => {
             const dir = path.join('dist', pathname);
             if (!fs.existsSync(dir)) {
                 fs.mkdirSync(dir);
             }
-            content = content.replace('<script', '&#x3C;script');
+            const context = {
+                title,
+                description,
+                content,
+            };
             fs.writeFileSync(
                 path.join(dir, 'index.html'),
-                template.replace('{{content}}', content)
+                template.replace(/\{\{(.*?)\}\}/g, (match, key) => {
+                    if (!key in context) {
+                        console.warn(`build: "${key}" was not found`);
+                        return '';
+                    }
+                    return String(context[key]);
+                })
             );
         });
 

diff --git a/package.json b/package.json
@@ -29,7 +29,7 @@
         "webpack": "^3.10.0"
     },
     "dependencies": {
-        "okwolo": "^3.0.1"
+        "okwolo": "^3.3.0-rc.1"
     },
     "postcss": {
         "plugins": {

diff --git a/src/app.js b/src/app.js
@@ -0,0 +1,8 @@
+const okwolo = require('okwolo/lite');
+
+let app;
+try {
+    app = okwolo();
+} catch (e) {}
+
+module.exports = app;
diff --git a/src/components/example.js b/src/components/example.js
@@ -1,6 +1,6 @@
 require('./example.scss');
 
-// TODO add dropdown arrow (waiting on [email protected])
+// TODO add dropdown arrow
 
 module.exports = ({children}) => () => (
     ['div.example', {}, [

diff --git a/src/components/link.js b/src/components/link.js
@@ -1,3 +1,5 @@
+const app = require('../app');
+
 module.exports = ({path, children}) => () => (
     ['a.link', {
         href: path,

diff --git a/src/index.js b/src/index.js
@@ -1,14 +1,11 @@
 require('./style.scss');
 
-const okwolo = require('okwolo/lite');
-
+const app = require('./app');
 const pages = require('./pages');
 
 const wrapper = document.querySelector('.wrapper');
 
-const app = okwolo(wrapper);
-
-window.app = app;
+app.use('target', wrapper);
 
 app.setState({});
 

diff --git a/src/pages/blobs/index.js b/src/pages/blobs/index.js
@@ -184,7 +184,7 @@ module.exports = () => () => (
                 });
 
                 app.redirect('/user/123/profile');
-                // handler is called with uid='123'
+                // handler is called with {uid: '123'}
             `]],
         ]],
         ['div.section', {}, [

diff --git a/src/pages/index.js b/src/pages/index.js
@@ -2,31 +2,37 @@ module.exports = [
     {
         pathname: '/',
         title: 'okwolo',
+        description: '',
         component: require('../pages/home'),
     },
     {
         pathname: '/syntax/',
         title: 'okwolo - syntax',
+        description: '',
         component: require('../pages/syntax'),
     },
     {
         pathname: '/blobs/',
         title: 'okwolo - blobs',
+        description: '',
         component: require('../pages/blobs'),
     },
     {
         pathname: '/modules/',
         title: 'okwolo - modules',
+        description: '',
         component: require('../pages/modules'),
     },
     {
         pathname: '/kits/',
         title: 'okwolo - kits',
+        description: '',
         component: require('../pages/kits'),
     },
     {
         pathname: '/api/',
         title: 'okwolo - api',
+        description: '',
         component: require('../pages/api'),
     },
 ];
diff --git a/src/template.html b/src/template.html
@@ -1,8 +1,9 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-    <title>okwolo</title>
+    <title>{{title}}</title>
     <meta name="viewport" content="width=device-width">
+    <meta name="description" content="{{description}}"/>
     <link rel="icon" href="/res/favicon.ico">
     <link rel="stylesheet" href="/style.css" />
 </head>