From 622ffae101e397eca8c0dc49cc919e71e3607f4e Mon Sep 17 00:00:00 2001 From: Richard Date: Tue, 28 Jan 2020 20:50:06 -0800 Subject: [PATCH] prettier --- README.md | 11 +++++-- demo.html | 39 +++++++++++++++---------- voir.js | 87 ++++++++++++++++++++++++++++--------------------------- 3 files changed, 77 insertions(+), 60 deletions(-) diff --git a/README.md b/README.md index 0e45e9a..e27f72f 100644 --- a/README.md +++ b/README.md @@ -62,9 +62,16 @@ class CounterPageRoute extends PageRoute { super("/*") } - async function onRender(){ + async onRender() { // use lit to render to content holder - render(document.body, html`
${session.counter}
` + render( + html` +
+ ${session.counter} +
+ `, + document.body + ); } function onAdd() { diff --git a/demo.html b/demo.html index 270a6fd..1898404 100644 --- a/demo.html +++ b/demo.html @@ -2,49 +2,58 @@ diff --git a/voir.js b/voir.js index 3ef31e6..3588829 100644 --- a/voir.js +++ b/voir.js @@ -1,48 +1,49 @@ class Router { routes = []; - root = '/'; + root = "/"; constructor(options) { - window.addEventListener("load",()=>{ + window.addEventListener("load", () => { this.listen(); - setTimeout(()=>{ + setTimeout(() => { this.routeCheck(); - },1); - }) + }, 1); + }); } add(path, cb) { this.routes.push({ path, cb }); } - clearSlashes(path){ - return path.toString() - .replace(/\/$/, '') - .replace(/^\//, ''); + clearSlashes(path) { + return path + .toString() + .replace(/\/$/, "") + .replace(/^\//, ""); } getCurrentPath() { - let fragment = (decodeURI(window.location.pathname + window.location.search)); - fragment = fragment.replace(/\?(.*)$/, ''); - return (fragment) - }; + let fragment = decodeURI(window.location.pathname + window.location.search); + fragment = fragment.replace(/\?(.*)$/, ""); + return fragment; + } navigate(path) { window.history.pushState(null, null, this.root + this.clearSlashes(path)); - setTimeout(()=>{ + setTimeout(() => { this.routeCheck(); - },1); - }; + }, 1); + } - isExternal(path){ + isExternal(path) { return path.indexOf(window.location.origin) != 0; } listen() { this.interval = setInterval(this.routeCheck.bind(this), 50); - }; + } - routeCheck(){ + routeCheck() { let curPath = this.getCurrentPath(); if (this.current === curPath) return; this.current = curPath; @@ -51,12 +52,12 @@ class Router { const match = this.current.match(route.path); if (match) { match.shift(); - route.cb.call(null,match) + route.cb.call(null, match); return match; } return false; }); - }; + } } const router = new Router(); @@ -64,54 +65,54 @@ const router = new Router(); let currentPageRoute = null; export class PageRoute { - constructor(route){ + constructor(route) { this.firstTime = false; this.router = router; - this.router.add(route,(match)=>{ + this.router.add(route, match => { currentPageRoute = this; this.match = match; - if(this.onInit && !this.firstTime){ + if (this.onInit && !this.firstTime) { spawn(this.onInit.bind(this)); this.firstTime = true; } - if(this.onLoad){ + if (this.onLoad) { spawn(this.onLoad.bind(this)); } - if(this.onRender){ - spawn(this.onRender.bind(this)) + if (this.onRender) { + spawn(this.onRender.bind(this)); } - }) + }); } renderCurrentPage() { - if(currentPageRoute && currentPageRoute.onRender){ + if (currentPageRoute && currentPageRoute.onRender) { currentPageRoute.onRender(); } } - navigate(path){ + navigate(path) { router.navigate(path); } } -export function register(routes){ - for(var i in routes){ - new routes[i]; +export function register(routes) { + for (var i in routes) { + new routes[i](); } } -export function spawn(f){ - f().then(()=>{ - //executed - }) +export function spawn(f) { + f().then(() => { + //executed + }); } -document.addEventListener("click",function(e){ +document.addEventListener("click", function(e) { var el = e.target; - while (el && 'A' !== el.nodeName.toUpperCase()) el = el.parentNode; - if (!el || 'A' !== el.nodeName.toUpperCase()) return; - if(el && !router.isExternal(el.href)){ - router.navigate(el.href.slice(window.location.origin.length)) + while (el && "A" !== el.nodeName.toUpperCase()) el = el.parentNode; + if (!el || "A" !== el.nodeName.toUpperCase()) return; + if (el && !router.isExternal(el.href)) { + router.navigate(el.href.slice(window.location.origin.length)); e.preventDefault(); } -}) \ No newline at end of file +});