From 0a3a457539c772c6b36116a3a6c303ddba72d063 Mon Sep 17 00:00:00 2001 From: James Shiffer <2191476+scoliono@users.noreply.github.com> Date: Fri, 5 Jun 2020 15:00:22 -0700 Subject: [PATCH] fake news, plus refactoring some stuffs --- package-lock.json | 5 -- package.json | 1 - src/components/FakeTweet.svelte | 95 +++++++++++++++++++++++++++++++++ src/routes/a/[slug].json.js | 6 +-- src/routes/a/[slug].svelte | 14 ++--- src/routes/a/_articles.js | 9 ++++ src/routes/a/_posts.js | 63 ---------------------- src/routes/index.svelte | 7 ++- src/server.js | 1 - src/template.html | 1 + 10 files changed, 120 insertions(+), 82 deletions(-) create mode 100644 src/components/FakeTweet.svelte create mode 100644 src/routes/a/_articles.js delete mode 100644 src/routes/a/_posts.js diff --git a/package-lock.json b/package-lock.json index ac68b0f..f9a77f4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -959,11 +959,6 @@ "typedarray": "^0.0.6" } }, - "connect-flash": { - "version": "0.1.1", - "resolved": "https://registry.npmjs.org/connect-flash/-/connect-flash-0.1.1.tgz", - "integrity": "sha1-2GMPJtlaf4UfmVax6MxnMvO2qjA=" - }, "console-browserify": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz", diff --git a/package.json b/package.json index 4e5235e..defb35c 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,6 @@ "bcrypt": "^4.0.1", "body-parser": "^1.19.0", "compression": "^1.7.1", - "connect-flash": "^0.1.1", "cookie-parser": "^1.4.5", "dotenv": "^8.2.0", "express": "^4.17.1", diff --git a/src/components/FakeTweet.svelte b/src/components/FakeTweet.svelte new file mode 100644 index 0000000..db987d2 --- /dev/null +++ b/src/components/FakeTweet.svelte @@ -0,0 +1,95 @@ + + +
+
+ +
+
+
+
+ +
+ +
+ + {author} +{#if verified} + +✔ +{/if} + + @{handle} +
+ +
+
+ +
+
+
+ +
+

{@html fmtMessage(message)}

+ +
+{#if media} + +{/if} +
+
+
+ +
+
+ {fmtCount(likes)} + +
+
+ +
+
Twitter Ads info and privacy +
+
+
+
+
+ +
+
+
{fmtCount(replies)} people are talking about this
+
+
+ +
+
+
diff --git a/src/routes/a/[slug].json.js b/src/routes/a/[slug].json.js index 960a820..cc36288 100644 --- a/src/routes/a/[slug].json.js +++ b/src/routes/a/[slug].json.js @@ -1,8 +1,8 @@ -import posts from './_posts.js'; +import articles from './_articles.js'; const lookup = new Map(); -posts.forEach(post => { - lookup.set(post.slug, JSON.stringify(post)); +articles.forEach(article => { + lookup.set(article.slug, JSON.stringify(article)); }); export function get(req, res, next) { diff --git a/src/routes/a/[slug].svelte b/src/routes/a/[slug].svelte index a9450d0..31b3357 100644 --- a/src/routes/a/[slug].svelte +++ b/src/routes/a/[slug].svelte @@ -6,7 +6,7 @@ const data = await res.json(); if (res.status === 200) { - return { post: data }; + return { article: data }; } else { this.error(res.status, data.message); } @@ -14,7 +14,7 @@ - {post.title} | HOWFEED.BIZ + {article.title} | HOWFEED.BIZ
- {post.title} + {article.title}
-

{post.title}

+

{article.title}

- {@html post.html} + {@html article.html}
diff --git a/src/routes/a/_articles.js b/src/routes/a/_articles.js new file mode 100644 index 0000000..21ca03c --- /dev/null +++ b/src/routes/a/_articles.js @@ -0,0 +1,9 @@ +const articles = [ +]; + +articles.forEach(article => { + article.slug = article.title.toLowerCase().replace(/\W+/g, '-'); + article.html = article.html.replace(/^\t{3}/gm, ''); +}); + +export default articles; diff --git a/src/routes/a/_posts.js b/src/routes/a/_posts.js deleted file mode 100644 index 329d3d8..0000000 --- a/src/routes/a/_posts.js +++ /dev/null @@ -1,63 +0,0 @@ -const posts = [ - { - title: 'How To Disable ABS in Your Car', - date: 1590908400000, - html: ` -

First, you have to know what Svelte is. Svelte is a UI framework with a bold new idea: rather than providing a library that you write code with (like React or Vue, for example), it's a compiler that turns your components into highly optimized vanilla JavaScript. If you haven't already read the introductory blog post, you should!

- -

Sapper is a Next.js-style framework (more on that here) built around Svelte. It makes it embarrassingly easy to create extremely high performance web apps. Out of the box, you get:

- - - -

It's implemented as Express middleware. Everything is set up and waiting for you to get started, but you keep complete control over the server, service worker, webpack config and everything else, so it's as flexible as you need it to be.

- ` - }, - { - title: 'How to Pay Zero in Taxes', - date: 1590908400000, - html: ` -

First, you have to know what Svelte is. Svelte is a UI framework with a bold new idea: rather than providing a library that you write code with (like React or Vue, for example), it's a compiler that turns your components into highly optimized vanilla JavaScript. If you haven't already read the introductory blog post, you should!

- -

Sapper is a Next.js-style framework (more on that here) built around Svelte. It makes it embarrassingly easy to create extremely high performance web apps. Out of the box, you get:

- - - -

It's implemented as Express middleware. Everything is set up and waiting for you to get started, but you keep complete control over the server, service worker, webpack config and everything else, so it's as flexible as you need it to be.

- ` - }, - { - title: 'Here\'s Why Canned Water is Better', - date: 1590908400000, - html: ` -

First, you have to know what Svelte is. Svelte is a UI framework with a bold new idea: rather than providing a library that you write code with (like React or Vue, for example), it's a compiler that turns your components into highly optimized vanilla JavaScript. If you haven't already read the introductory blog post, you should!

- -

Sapper is a Next.js-style framework (more on that here) built around Svelte. It makes it embarrassingly easy to create extremely high performance web apps. Out of the box, you get:

- - - -

It's implemented as Express middleware. Everything is set up and waiting for you to get started, but you keep complete control over the server, service worker, webpack config and everything else, so it's as flexible as you need it to be.

- ` - } -]; - -posts.forEach(post => { - post.slug = post.title.toLowerCase().replace(/\W+/g, '-'); - post.html = post.html.replace(/^\t{3}/gm, ''); -}); - -export default posts; diff --git a/src/routes/index.svelte b/src/routes/index.svelte index f17f217..ce9ab38 100644 --- a/src/routes/index.svelte +++ b/src/routes/index.svelte @@ -1,12 +1,13 @@ @@ -103,6 +104,8 @@

{new Date(date).toLocaleDateString()}

+ {:else} + {/each} diff --git a/src/server.js b/src/server.js index d2c9f45..a297a30 100644 --- a/src/server.js +++ b/src/server.js @@ -53,7 +53,6 @@ express() .post('/cms/login', passport.authenticate('local', { successRedirect: '/cms', failureRedirect: '/cms/login', - failureFlash: true, })) .listen(PORT, err => { if (err) console.log('error', err); diff --git a/src/template.html b/src/template.html index fbcfffb..6ad6bfe 100644 --- a/src/template.html +++ b/src/template.html @@ -8,6 +8,7 @@ %sapper.styles% + %sapper.head%