Raymonzut
4 years ago
commit
0850426683
11 changed files with 127 additions and 128 deletions
@ -0,0 +1,2 @@ |
|||||||
|
posts/* |
||||||
|
gen/* |
||||||
@ -0,0 +1,49 @@ |
|||||||
|
# Templates will be filled by posts |
||||||
|
index_template = File.read!("./templates/index.html") |
||||||
|
post_template = File.read!("./templates/post.html") |
||||||
|
|
||||||
|
post_contents = File.ls!("./posts") |
||||||
|
|> Enum.reject(fn(x) -> String.starts_with?(x, ".") end) |
||||||
|
|> Enum.map(fn f -> File.read!("./posts/" <> f) end) |
||||||
|
|> Enum.map(fn c -> String.split(c, "\n") end) |
||||||
|
|> Enum.map(fn c -> Enum.reject(c, fn(x) -> x == "" end) end) |
||||||
|
|> Enum.map(fn c -> Enum.chunk_every(c, 2) end) |
||||||
|
|> Enum.map(fn c -> |
||||||
|
Enum.map(c, fn [k, v] -> %{String.to_atom(k) => v} end) |
||||||
|
|> Enum.reduce(%{}, fn(x, acc) -> Map.merge(x, acc) end) |
||||||
|
end) |
||||||
|
|
||||||
|
index_file = post_contents |
||||||
|
|> Enum.sort_by(fn m -> Map.get(m, :date) end) |
||||||
|
|> Enum.reverse() |
||||||
|
# Group by month |
||||||
|
|> Enum.group_by(fn m -> Map.get(m, :date) |> String.slice(0..6) end) |
||||||
|
|> Enum.reverse() |
||||||
|
|> Enum.map(fn {month, posts} -> "\n<h1>" <> month <> "</h1>\n" <> (posts |> |
||||||
|
Enum.map(fn post -> "<h2>" <> (Map.get(post, :date) |> String.slice(0..9)) <> |
||||||
|
" - <a href=\"" <> Map.get(post, :id) <> ".html\">" <> Map.get(post, :title) <> "</a></h2>" |
||||||
|
end) |> Enum.join("\n")) end) |
||||||
|
|> (fn template -> Regex.replace(Regex.compile!("{{index}}"), index_template, fn _, __ -> template end) end).() |
||||||
|
|
||||||
|
File.open!("./gen/index.html", [:write]) |
||||||
|
|> IO.binwrite(index_file) |
||||||
|
|> File.close() |
||||||
|
|
||||||
|
|
||||||
|
post_contents |
||||||
|
|> Enum.each(fn post -> |
||||||
|
File.open!("./gen/" <> Map.get(post, :id) <> ".html", [:write]) |
||||||
|
|> IO.binwrite( |
||||||
|
# Converting handlebars to values |
||||||
|
Regex.compile!("{{(.*)}}") |> |
||||||
|
Regex.replace(post_template, fn _, key -> if key != "content" do Map.get(post, String.to_atom(key)) else |
||||||
|
Map.get(post, String.to_atom(key)) |
||||||
|
# Converting \n to paragraphs |
||||||
|
|> String.split("\\n") |
||||||
|
|> Enum.reject(fn(x) -> x == "" end) |
||||||
|
|> Enum.map(fn paragraph -> ("<p>" <> paragraph <> "</p>\n") end) |
||||||
|
|> Enum.join("") |
||||||
|
end |
||||||
|
end)) |
||||||
|
|> File.close() |
||||||
|
end) |
||||||
@ -1,24 +0,0 @@ |
|||||||
export async function getPosts(id) { |
|
||||||
const BASE_URL = 'https://raymon.dev' |
|
||||||
const BASE_ENDPOINT = '/api/posts' |
|
||||||
const URL = BASE_URL + BASE_ENDPOINT + (id ? `/${id}` : '?sort=-1') |
|
||||||
|
|
||||||
let posts = [] |
|
||||||
|
|
||||||
return await fetch(URL) |
|
||||||
.then(res => res.json()) |
|
||||||
.then(res => { |
|
||||||
if (id !== undefined) { |
|
||||||
if (res === undefined) { |
|
||||||
throw Error("Response body empty") |
|
||||||
} |
|
||||||
return [res] |
|
||||||
} |
|
||||||
else { |
|
||||||
return res |
|
||||||
} |
|
||||||
}) |
|
||||||
.catch(err => { |
|
||||||
console.log(`Error: ${err}`) |
|
||||||
}) |
|
||||||
} |
|
||||||
@ -1,42 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html lang="en"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<meta |
|
||||||
name="description" |
|
||||||
content="Raymon typing nonsense on his blog"> |
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
||||||
<title>Raymon Zutekouw</title> |
|
||||||
|
|
||||||
<link rel="preload" href="./lib/remote.mjs" as="script" crossorigin="anonymous" type="application/javascript"> |
|
||||||
<link rel="preload" href="posts.mjs" as="script" crossorigin="anonymous" type="application/javascript"> |
|
||||||
|
|
||||||
<link defer |
|
||||||
rel="stylesheet" |
|
||||||
href="https://cdn.statically.io/gh/dragonprojects/dragondesign/master/main.min.css" |
|
||||||
media="all" |
|
||||||
> |
|
||||||
<link defer rel="stylesheet" href="css/general.css" media="all"> |
|
||||||
|
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<noscript> |
|
||||||
<p> |
|
||||||
This page isn't as fancy without JavaScript. |
|
||||||
Some parts will not load, but this will be minimal. |
|
||||||
</p> |
|
||||||
</noscript> |
|
||||||
<div id="app"> |
|
||||||
<nav> |
|
||||||
<a href="/">Home</a>| |
|
||||||
<a href="/posts">Posts</a>| |
|
||||||
<a href="/qa">QA</a> |
|
||||||
</nav> |
|
||||||
|
|
||||||
<h3>For those using a RSS reader, subscribe here: <a href="/api/posts/rss.xml">rss.xml</a></h3> |
|
||||||
<!-- Placeholder for posts --> |
|
||||||
<div id="posts"></div> |
|
||||||
<script async type="module" src="posts.mjs"></script> |
|
||||||
</div> |
|
||||||
</body> |
|
||||||
</html> |
|
||||||
@ -1,61 +0,0 @@ |
|||||||
import { getPosts } from "./lib/remote.mjs" |
|
||||||
|
|
||||||
function toMonthYearString(str) { |
|
||||||
const date = new Date(str) |
|
||||||
return `${date.toLocaleString('default', { month: 'long' })} ${date.getFullYear()}` |
|
||||||
} |
|
||||||
async function showPost(id) { |
|
||||||
const post_list = await getPosts(id) |
|
||||||
const post = post_list[0] |
|
||||||
const title = document.createElement("h1") |
|
||||||
title.textContent = post.title |
|
||||||
|
|
||||||
const postsDOM = document.getElementById("posts") |
|
||||||
postsDOM.appendChild(title) |
|
||||||
|
|
||||||
post.content.split('\n').forEach(paragraph => { |
|
||||||
const p = document.createElement("p") |
|
||||||
p.innerHTML = paragraph |
|
||||||
postsDOM.appendChild(p) |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
async function updatePosts() { |
|
||||||
const posts = await getPosts() |
|
||||||
|
|
||||||
const months = posts.map(post => toMonthYearString(post.date)) |
|
||||||
const uniques = Array.from(new Set(posts.map(post => toMonthYearString(post.date)))) |
|
||||||
const month_lists = uniques.map(month => |
|
||||||
posts.filter( |
|
||||||
post => toMonthYearString(post.date) === month |
|
||||||
) |
|
||||||
) |
|
||||||
const postsDOM = document.getElementById("posts") |
|
||||||
uniques.forEach((month, i) => { |
|
||||||
const month_DOM = document.createElement("h1") |
|
||||||
month_DOM.textContent = month |
|
||||||
|
|
||||||
month_lists[i].forEach((post, i) => { |
|
||||||
const post_DOM = document.createElement("h2") |
|
||||||
post_DOM.textContent = `${post.date.substring(0, 10)} - ` |
|
||||||
|
|
||||||
const post_link = document.createElement("a") |
|
||||||
post_link.href = 'posts?post=' + post._id |
|
||||||
post_link.textContent = post.title |
|
||||||
post_DOM.appendChild(post_link) |
|
||||||
|
|
||||||
month_DOM.appendChild(post_DOM) |
|
||||||
}) |
|
||||||
|
|
||||||
postsDOM.appendChild(month_DOM) |
|
||||||
}) |
|
||||||
} |
|
||||||
|
|
||||||
// Check if a specific post is requested
|
|
||||||
let url = new URL(document.location.href); |
|
||||||
url.searchParams.sort(); |
|
||||||
let post_id = url.searchParams.values().next().value; |
|
||||||
|
|
||||||
const reg = /([0-9]|[a-f]){24}/ |
|
||||||
if (post_id && reg.test(post_id)) showPost(post_id) |
|
||||||
else updatePosts() |
|
||||||
@ -0,0 +1,31 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en"> |
||||||
|
<head> |
||||||
|
<meta charset="UTF-8"> |
||||||
|
<meta |
||||||
|
name="description" |
||||||
|
content="Raymon typing nonsense on his blog"> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||||
|
<title>Raymon Zutekouw</title> |
||||||
|
|
||||||
|
<link defer |
||||||
|
rel="stylesheet" |
||||||
|
href="https://cdn.statically.io/gh/dragonprojects/dragondesign/master/main.min.css" |
||||||
|
media="all" |
||||||
|
> |
||||||
|
<link defer rel="stylesheet" href="css/general.css" media="all"> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<main> |
||||||
|
<nav> |
||||||
|
<a href="/">Home</a>| |
||||||
|
<a href="/posts">Posts</a>| |
||||||
|
<a href="/qa">QA</a> |
||||||
|
</nav> |
||||||
|
<header> |
||||||
|
<h1>Post listing</h1> |
||||||
|
</header> |
||||||
|
{{index}} |
||||||
|
</main> |
||||||
|
</body> |
||||||
|
</html> |
||||||
@ -0,0 +1,36 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en"> |
||||||
|
<head> |
||||||
|
<meta charset="UTF-8"> |
||||||
|
<meta |
||||||
|
name="description" |
||||||
|
content="Raymon typing nonsense on his blog"> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||||
|
<title>Raymon Zutekouw</title> |
||||||
|
|
||||||
|
<link defer |
||||||
|
rel="stylesheet" |
||||||
|
href="https://cdn.statically.io/gh/dragonprojects/dragondesign/master/main.min.css" |
||||||
|
media="all" |
||||||
|
> |
||||||
|
<link defer rel="stylesheet" href="css/general.css" media="all"> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<main> |
||||||
|
<nav> |
||||||
|
<a href="/">Home</a>| |
||||||
|
<a href="/posts">Posts</a>| |
||||||
|
<a href="/qa">QA</a> |
||||||
|
</nav> |
||||||
|
|
||||||
|
<article> |
||||||
|
<header> |
||||||
|
<h1>{{title}}</h1> |
||||||
|
<h3>For those using a RSS reader, subscribe here: <a href="/api/posts/rss.xml">rss.xml</a></h3> |
||||||
|
</header> |
||||||
|
<time datetime="{{date}}"></time> |
||||||
|
{{content}} |
||||||
|
</article> |
||||||
|
</main> |
||||||
|
</body> |
||||||
|
</html> |
||||||
Loading…
Reference in new issue