--- /dev/null
+<h1>Welcome.</h1>
+<p>You are now in a forum. Select a category from the left or input a
+ valid URL.</p>
--- /dev/null
+<h1> This is not right. </h1>
+<p>This URL is not valid. Try again.</p>
--- /dev/null
+<script>
+ import Glyph from '../glyph/glyph.svelte';
+</script>
+
+<aside class="post-meta" title="Post 2 of 2 metadata">
+ <Glyph uuid="b33f0339f7d64d1ca27f1c0aefb7d753" />
+ <span class="h-card">
+ By: <a href="/a/time4carrots" class="p-nickname u-url">time4carrots</a>.
+ </span>
+ <time role="presentation" class="dt-published" datetime="2018-08-15T04:10:00.929Z">
+ <a href="/p/da9910f3febde91948000ce1535ea">
+ 2018-08-15 04:10:00
+ </a>
+ </time>
+</aside>
+<article class="e-content" title="Post 2 of 2 by time4carrots">
+ <p>It's just how it is...</p>
+</article>
+<hr/>
+
+<style>
+ article, hr, aside {
+ grid-column: col-start 2 / span 11;
+ }
+
+ .post-meta > * {
+ vertical-align: top;
+ }
+</style>
</aside>
<aside class="topic-tags" title="Topic Tags">
Tags:
- <a href="/t/question" class="p-category">question<span class="tag-weight">(5)</span></a>
- <a href="/t/meta" class="p-category">meta<span class="tag-weight">(34)</span></a>
- <a href="/t/carrots" class="p-category">carrots<span class="tag-weight">(1)</span></a>
- <a href="/t/tpbo" class="p-category">tpbo<span class="tag-weight">(2)</span></a>
+ <a href="/g/question" class="p-category">question<span class="tag-weight">(5)</span></a>
+ <a href="/g/meta" class="p-category">meta<span class="tag-weight">(34)</span></a>
+ <a href="/g/carrots" class="p-category">carrots<span class="tag-weight">(1)</span></a>
+ <a href="/g/tpbo" class="p-category">tpbo<span class="tag-weight">(2)</span></a>
</aside>
<aside class="post-meta" title="Post 1 of 2 metadata">
<Glyph uuid="3cd8c84e18144a2da71f6bace9392abc" />
<span class="h-card">
By: <a href="/a/time4carrots" class="p-nickname u-url">time4carrots</a>.
</span>
- <time class="dt-published" datetime="2018-08-15T04:10:00.929Z">
+ <time role="presentation" class="dt-published" datetime="2018-08-15T04:10:00.929Z">
<a href="/p/da9910f3febde91948000ce1535ea">
2018-08-15 04:10:00
</a>
--- /dev/null
+<script>
+ export let params;
+</script>
+
+<h1>Topic Index.</h1>
+<p>This component lists topics for category or tag with id: {params.id}</p>
+
<script>
+ import LightRouter from 'lightrouter';
+
import ForumList from './components/forum_list/forum_list.svelte';
import Header from './components/header/header.svelte';
+
+ // Routed Components
+ import Author from './components/author/author.svelte';
+ import Home from './components/home/home.svelte';
+ import InvalidRoute from './components/invalid_route/invalid_route.svelte';
+ import Post from './components/post/post.svelte';
import Topic from './components/topic/topic.svelte';
+ import TopicIndex from './components/topic_index/topic_index.svelte';
+
+ let page;
+ let params;
+
+ // sets the route params and current page.
+
+ const setRoute = function setRoute(targetPage) {
+
+ return function (routerParams) {
+ params = routerParams;
+ page = targetPage;
+ }
+ }
+
+ const router = new LightRouter({
+ routes: {
+ '': () => page = Home,
+ 'f/{id}': setRoute(TopicIndex),
+ 'g/{id}': setRoute(TopicIndex),
+ 'a/{id}': setRoute(Author),
+ 't/{id}': setRoute(Topic),
+ 'p/{id}': setRoute(Post),
+ '.*': setRoute(InvalidRoute)
+ }
+ });
+
+ router.run();
</script>
<Header />
-<Topic />
+<svelte:component this={ page } params={ params } />
<ForumList />
"type-check": "~0.3.2"
}
},
+ "lightrouter": {
+ "version": "0.3.3",
+ "resolved": "https://registry.npmjs.org/lightrouter/-/lightrouter-0.3.3.tgz",
+ "integrity": "sha1-GJX41G6kAHXfVMCogjYvyKDB0hs="
+ },
"linkify-it": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-2.2.0.tgz",
"koa": "^2.11.0",
"koa-send": "^5.0.0",
"koa-static": "^5.0.0",
+ "lightrouter": "^0.3.3",
"rethinkdb": "^2.4.2",
"uuid": "^3.3.3"
},