rookeries
/
rookeries
1
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity

Fetch page content... as penguins attack!

This commit is contained in:
Dorian 2019-08-02 21:35:21 -04:00
parent 30eb6a4914
commit 40fe2841dc
1 changed files with 15 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
web-app/src/App.js
View File

@ -33,6 +33,7 @@ export class App extends React.Component {
} }
const UPDATE_ROUTE_EVENT = "rookeries-router-push"; const UPDATE_ROUTE_EVENT = "rookeries-router-push";
const PAGE_CONTENT_FETCHED_EVENT = "rookeries-content-fetched";
export class RookeriesApp extends HTMLElement { export class RookeriesApp extends HTMLElement {
static get observedAttributes() { static get observedAttributes() {
@ -45,7 +46,8 @@ export class RookeriesApp extends HTMLElement {
connectedCallback() { connectedCallback() {
this.render(); this.render();
this.addEventListener(UPDATE_ROUTE_EVENT, this.historyChanged); this.addEventListener(UPDATE_ROUTE_EVENT, this.render);
this.addEventListener(PAGE_CONTENT_FETCHED_EVENT, this.render);
} }
static isLocalLink(url) { static isLocalLink(url) {
@ -71,8 +73,16 @@ export class RookeriesApp extends HTMLElement {
rookeriesApp.dispatchEvent(new Event(UPDATE_ROUTE_EVENT)); rookeriesApp.dispatchEvent(new Event(UPDATE_ROUTE_EVENT));
} }
historyChanged() { async fetchPageContent(pageSlug) {
this.render(); const response = await fetch(`/api/pages/${pageSlug}.json`);
const json = await response.json();
const articleContent = Reflect.get(json, "content");
if (articleContent === undefined) {
throw Error(`The article content for the page "${pageSlug}" is undefined`);
}
window.localStorage.setItem(pageSlug, articleContent);
} }
render() { render() {
@ -95,7 +105,8 @@ export class RookeriesApp extends HTMLElement {
const pageContent = window.localStorage.getItem(currentPage); const pageContent = window.localStorage.getItem(currentPage);
if (!pageContent) { if (!pageContent) {
// TODO: Fetch the page... // TODO: Remember to dispatch to trigger a re-render.
this.fetchPageContent(pageContent).then();
} }
const content = pageContent || `<h1>Loading...</h1>`; const content = pageContent || `<h1>Loading...</h1>`;