diff --git a/app/client.js b/app/client.js index bffc1fc..566f813 100755 --- a/app/client.js +++ b/app/client.js @@ -4,8 +4,9 @@ // P A C K A G E S +import async from "choo-async"; +import asyncHtml from "choo-async/html"; import choo from "choo"; -import html from "choo/html"; import devtools from "choo-devtools"; import ssr from "choo-ssr"; @@ -19,7 +20,8 @@ import wrapper from "./components/wrapper"; // P R O G R A M function main() { - const app = choo(); + const app = async(choo()); + if (process.env.NODE_ENV !== "production") app.use(devtools()); const page = view => ( @@ -39,13 +41,12 @@ function main() { app.route("/api/*", page(require("./views/api"))); app.route("/*", page(require("./views/redirect"))); + app.mount("html"); + return app; } -if (typeof window !== "undefined") { - const app = main(); - app.mount("html"); -} +if (typeof window !== "undefined") main(); @@ -59,14 +60,14 @@ module.exports = exports = main; function shell (head, body) { return (state, emit) => { - const bodyRender = body(state, emit); - const headRender = head(state, emit); + const bodyPromise = Promise.resolve(body(state, emit)); + const headPromise = bodyPromise.then(() => head(state, emit)); // resolve `head` once `body` is resolved - return html` + return asyncHtml` - ${headRender} - ${bodyRender} + ${headPromise} + ${bodyPromise} `; }; diff --git a/app/components/head.js b/app/components/head.js index 8d0801b..97c34d1 100644 --- a/app/components/head.js +++ b/app/components/head.js @@ -2,7 +2,7 @@ -// P A C K A G E +// P A C K A G E S import html from "choo/html"; import { require as local } from "app-root-path"; @@ -17,18 +17,8 @@ let title = ""; // E X P O R T module.exports = exports = (state, emit) => { - /* - let pageTitle = ""; - - if (state.route && state.route !== "/" && state.route !== "*") pageTitle = state.route.charAt(0).toUpperCase() + state.route.slice(1); - if (state.params.wildcard) pageTitle = state.params.wildcard.charAt(0).toUpperCase() + state.params.wildcard.slice(1); - - if (pageTitle === "Api") pageTitle = "API"; - - ${pageTitle.length ? pageTitle + " | " : ""}${config.meta.title} · ${config.meta.tagline} - */ - if (state.route !== "/" && state.params.wildcard) title = `${state.params.wildcard.capitalize()} ∙ LBRY ∙ ${config.meta.tagline}`; + else if (state.route === "api") title = `API ∙ LBRY ∙ ${config.meta.tagline}`; else title = `LBRY ∙ ${config.meta.tagline}`; if (state.title !== title) emit(state.events.DOMTITLECHANGE, title); @@ -36,7 +26,6 @@ module.exports = exports = (state, emit) => { // TODO: // - Support custom metadata (descriptions and whatnot) - // - Update og:url with current URL return html` @@ -52,7 +41,7 @@ module.exports = exports = (state, emit) => { - + @@ -71,14 +60,11 @@ module.exports = exports = (state, emit) => { - `; - - // state.route === "api" || state.route === "api/*" ? : "" }; diff --git a/app/components/wrapper.js b/app/components/wrapper.js index e03917f..e2d6a2f 100644 --- a/app/components/wrapper.js +++ b/app/components/wrapper.js @@ -4,7 +4,7 @@ // P A C K A G E -import html from "choo/html"; +import asyncHtml from "choo-async/html"; // V A R I A B L E S @@ -17,18 +17,16 @@ const navigation = new Navigation(); // E X P O R T -module.exports = exports = children => (state, emit) => { - return html` -
- +module.exports = exports = children => (state, emit) => asyncHtml` +
+ - ${navigation.render({ href: state.href || "/" })} - - ${children(state, emit)} - ${footer(state, emit)} -
- `; -}; + ${navigation.render({ href: state.href || "/" })} + + ${children(state, emit)} + ${footer(state, emit)} +
+`; diff --git a/app/views/api.js b/app/views/api.js index cb16b24..b73c528 100644 --- a/app/views/api.js +++ b/app/views/api.js @@ -4,131 +4,42 @@ // P A C K A G E S +import asyncHtml from "choo-async/html"; import dedent from "dedent"; import fs from "graceful-fs"; -import html from "choo/html"; import raw from "choo/html/raw"; const fetch = require("make-fetch-happen").defaults({ cacheManager: "./cache" }); // V A R I A B L E +// state.route === "api" || state.route === "api/*" ? : "" const apiScripts = ""; // E X P O R T -module.exports = exports = state => { - return generate(state.params.wildcard).then(response => { - // console.log(response); - return html`${response}`; - }); - // generate(state.params.wildcard, response => html`${response}`); -}; - - - -/* -module.exports = exports = () => state => { - console.log(state); - parseApiFile(state.params.wildcard).then(response => { - return html` -
- - -
${raw(createApiContent(response).join(""))}
+module.exports = exports = state => parseApiFile(state.params.wildcard).then(response => asyncHtml` +
+ -function generate(stuff, callback) { - /* - parseApiFile(stuff).then(response => { - const test = ` -
-
- - + + ${raw(apiScripts)} +`); -
${raw(createApiContent(response).join(""))}
-
- ${raw(apiScripts)} - `; - - return callback(test); - }); - */ - - return new Promise((resolve, reject) => { // eslint-disable-line - parseApiFile(stuff).then(response => { - const test = ` -
- - -
${raw(createApiContent(response).join(""))}
-
- - ${raw(apiScripts)} - `; - - return resolve(test); - }); - }); - - /* - Promise.all([parseApiFile(stuff)]).then(response => { - response = response[0]; - - const test = ` -
- - -
${raw(createApiContent(response).join(""))}
-
- - ${raw(apiScripts)} - `; - - return callback(test); - }); - */ -} // H E L P E R S