diff --git a/components/index.mjs b/components/index.mjs
new file mode 100644
index 0000000..81d4665
--- /dev/null
+++ b/components/index.mjs
@@ -0,0 +1,34 @@
+//@ts-check
+import {fetchText} from '../modules/fetchText.mjs'
+import {parseFileList} from '../modules/parseFileList.mjs'
+import {html} from '../modules/html.mjs'
+
+const indexListTemplate = html`Hello World!
`
+
+class IndexList extends HTMLElement {
+
+ static template = indexListTemplate
+ static observedAttributes = ["src"];
+
+ static define(tag = "index-list") {
+ customElements.define(tag, this)
+ }
+
+ shadowRoot = this.shadowRoot || this.attachShadow({ mode: "open" })
+ src = ""
+
+ connectedCallback() {
+ this.shadowRoot.replaceChildren(IndexList.template.content.cloneNode(true))
+ }
+
+ attributeChangedCallback(name, oldValue, newValue) {
+ if (oldValue === newValue) {
+ return;
+ }
+ switch (name) {
+ case "src":
+ this.src = newValue
+ fetchText(newValue).then(parseFileList).then()
+ }
+ }
+}
\ No newline at end of file
diff --git a/modules/generateDomFromString.mjs b/modules/generateDomFromString.mjs
deleted file mode 100644
index 1a4800b..0000000
--- a/modules/generateDomFromString.mjs
+++ /dev/null
@@ -1,13 +0,0 @@
-//@ts-check
-
-/**
- * Generates valid dom elements from a string
- * @param {string} htmlString
- */
-export const generateDomFromString = (htmlString) =>
- /** @type {HTMLElement} */ (
- new DOMParser().parseFromString(`${htmlString}
`, "text/html")
- .firstChild
- );
-
-export default generateDomFromString;
diff --git a/modules/index.mjs b/modules/index.mjs
index b87da6c..b461635 100644
--- a/modules/index.mjs
+++ b/modules/index.mjs
@@ -1,51 +1,5 @@
//@ts-check
-
-import { changeTitle } from "./changeTitle.mjs";
-import { documentMode } from "./documentMode.mjs";
-import { fetchMarkdown } from "./fetchMarkdown.mjs";
-import { fetchText } from "./fetchText.mjs";
-import { generateDomFromString } from "./generateDomFromString.mjs";
-import { getCurrentHashUrl } from "./getCurrentHashUrl.mjs";
-import { getElementById } from "./getElementById.mjs";
-import { isExternalUrl } from "./isExternalUrl.mjs";
-import { isLocalHost } from "./isLocalHost.mjs";
-import { isNotNull } from "./isNotNull.mjs";
-import {
- onDocumentKeyUp,
- onDocumentKeyDown,
- onDocumentKey,
-} from "./onDocumentKey.mjs";
-import { parseFileList } from "./parseFileList.mjs";
-import {
- querySelectorDoc,
- querySelectorParent,
- querySelectorAll,
-} from "./querySelectorAll.mjs";
-import { rewriteLocalUrls } from "./rewriteLocalUrls.mjs";
-import * as templateBlog from "./templateBlogUtils.mjs";
-import { wait } from "./wait.mjs";
-import { waitIfLocalHost } from "./waitIfLocalHost.mjs";
-
-export {
- changeTitle,
- documentMode,
- fetchMarkdown,
- fetchText,
- generateDomFromString,
- getCurrentHashUrl,
- getElementById,
- isExternalUrl,
- isLocalHost,
- isNotNull,
- onDocumentKeyUp,
- onDocumentKeyDown,
- onDocumentKey,
- parseFileList,
- querySelectorDoc,
- querySelectorParent,
- querySelectorAll,
- rewriteLocalUrls,
- templateBlog,
- wait,
- waitIfLocalHost,
-};
+export * from './tickle/index.mjs'
+export * from './utils/index.mjs'
+export { default as blog } from './templateBlog.mjs'
+export { default as musings } from './templateMusings.mjs'
\ No newline at end of file
diff --git a/modules/parseFileList.mjs b/modules/parseFileList.mjs
deleted file mode 100644
index 24ab139..0000000
--- a/modules/parseFileList.mjs
+++ /dev/null
@@ -1,40 +0,0 @@
-//@ts-check
-
-import { isNotNull } from "./isNotNull.mjs";
-
-/**
- * parses a filelist string. That's a string that looks like
- * ```md
- * name dd-mm-yyyy link name
- * name dd-mm-yyyy
- * name linkname
- * name
- * ```
- *
- * @param {string} lines
- */
-export const parseFileList = (lines) =>
- // @ts-ignore
- lines
- .trim()
- .split(`\n`)
- .map((line, index) => {
- const today = new Date().toISOString().split("T")[0];
- const result = line.match(
- /(?.+)\.(?\w{2,3})(?:\s+(?[\d-]+)?(?.+))?/
- );
- if (!result) {
- console.error(`could not parse line number ${index}`);
- return null;
- }
- const {
- // @ts-ignore
- groups: { name, ext, date = today, title = name },
- } = result;
- const href = `/${name}.${ext}`;
- const date_unix = new Date(date).getTime();
- return { name, href, date, title, date_unix, index };
- })
- .filter(isNotNull);
-
-export default parseFileList;
diff --git a/modules/templateBlog.mjs b/modules/templateBlog.mjs
index ecfb49d..aa66a1c 100644
--- a/modules/templateBlog.mjs
+++ b/modules/templateBlog.mjs
@@ -1,4 +1,38 @@
//@ts-check
+import { fetchText } from "./utils/fetchText.mjs";
+import { getElementById } from "./utils/getElementById.mjs";
+import { onDocumentKeyUp } from "./utils/onDocumentKey.mjs";
+import { parseFileList } from "./tickle/parseFileList.mjs";
+import {createMenuEntriesFromFileList} from "./tickle/createMenuEntriesFromFileList.mjs"
+import { sortFileListLines } from "./tickle/sortFileListLines.mjs"
+import { mode } from "./tickle/mode.mjs";
+import {bootstrapRouter} from "./tickle/bootstrapRouter.mjs";
-import blog from "./templateBlogUtils.mjs";
-blog();
+/**
+ * Loads the article list, parses it, creates the menu items
+*/
+export const bootstrap = () => {
+
+ const [Menu, Body, Source, Burger] = ["Menu", "Body", "Source", "Burger"].map(
+ getElementById
+ );
+
+ Burger.addEventListener("click", mode.menuOpen.toggle);
+
+ mode.loading.on();
+ fetchText("./files.txt").then((lines)=>{
+ const links = parseFileList(lines)
+ const firstHref = links[0].href;
+ sortFileListLines(links)
+ Menu.appendChild(createMenuEntriesFromFileList(links))
+ bootstrapRouter(firstHref, (content, raw)=>{
+ Body.innerHTML = "";
+ Source.innerHTML = raw;
+ Body.appendChild(content);
+ })
+ });
+
+ onDocumentKeyUp("?", mode.sourceEnable.toggle);
+};
+
+export default bootstrap;
diff --git a/modules/templateBlogUtils.mjs b/modules/templateBlogUtils.mjs
deleted file mode 100644
index b527f4a..0000000
--- a/modules/templateBlogUtils.mjs
+++ /dev/null
@@ -1,107 +0,0 @@
-//@ts-check
-import { changeTitle } from "./changeTitle.mjs";
-import { getCurrentHashUrl } from "./getCurrentHashUrl.mjs";
-import { fetchMarkdown } from "./fetchMarkdown.mjs";
-import { fetchText } from "./fetchText.mjs";
-import { parseFileList } from "./parseFileList.mjs";
-import { documentMode } from "./documentMode.mjs";
-import { getElementById } from "./getElementById.mjs";
-import { onDocumentKeyUp } from "./onDocumentKey.mjs";
-
-/*****************************************************************
- *
- * Creating references to the important stuff
- *
- ****************************************************************/
-
-/**
- * The elements we will need
- */
-const [Menu, Body, Source, Burger] = ["Menu", "Body", "Source", "Burger"].map(
- getElementById
-);
-
-const loadingMode = documentMode("loading");
-const sourceEnableMode = documentMode("source-enabled");
-const menuOpenMode = documentMode("menu-open");
-
-/*****************************************************************
- *
- * Router
- *
- * Things related to main navigation and to loading pages
- *
- ****************************************************************/
-
-/**
- * Listens to hashchange event, and attempts to read the url.
- * @param {HashChangeEvent} [_evt]
- */
-export const onHashChange = async (_evt) => {
- const { path, params } = getCurrentHashUrl();
- if (!path) {
- return false;
- }
- loadingMode.on();
- const { title, raw, content } = await fetchMarkdown(path);
- changeTitle(title);
- Body.innerHTML = "";
- Source.innerHTML = raw;
- Body.appendChild(content);
- loadingMode.off();
-};
-
-export const loadFileList = () => {
- loadingMode.on();
-
- fetchText("./files.txt").then(fillMenuFromFileList);
-};
-
-/**
- * Called when the file list is obtained (presumably through loading)
- * parses the file list, then fills the side navigation
- * If there's no page loaded, it also loads the first page in the list
- * (the list gets sorted by date, but the first line is the one that gets used)
- * @param {string} lines
- */
-export const fillMenuFromFileList = (lines) => {
- const links = parseFileList(lines).sort(
- ({ date_unix: a }, { date_unix: b }) => a - b
- );
- if (links.length < 1) {
- return;
- }
- Menu.innerHTML = links
- .map(({ href, title }) => `<a data-link href="#${href}">${title}</a>`)
- .join(`\n`);
- if (!getCurrentHashUrl().path) {
- // @ts-ignore
- const href = links.find(({ index }) => index === 0).href;
- window.location.hash = `#${href}`;
- } else {
- onHashChange();
- }
-};
-
-/*****************************************************************
- *
- * Bootstrapping
- *
- * this is where things actually happen
- *
- ****************************************************************/
-
-/**
- * Loads the article list, parses it, creates the menu items
- */
-export const bootstrap = () => {
- Burger.addEventListener("click", menuOpenMode.toggle);
-
- window.addEventListener("hashchange", onHashChange);
-
- loadFileList();
-
- onDocumentKeyUp("?", sourceEnableMode.toggle);
-};
-
-export default bootstrap;
diff --git a/modules/templateMusings.mjs b/modules/templateMusings.mjs
new file mode 100644
index 0000000..aa66a1c
--- /dev/null
+++ b/modules/templateMusings.mjs
@@ -0,0 +1,38 @@
+//@ts-check
+import { fetchText } from "./utils/fetchText.mjs";
+import { getElementById } from "./utils/getElementById.mjs";
+import { onDocumentKeyUp } from "./utils/onDocumentKey.mjs";
+import { parseFileList } from "./tickle/parseFileList.mjs";
+import {createMenuEntriesFromFileList} from "./tickle/createMenuEntriesFromFileList.mjs"
+import { sortFileListLines } from "./tickle/sortFileListLines.mjs"
+import { mode } from "./tickle/mode.mjs";
+import {bootstrapRouter} from "./tickle/bootstrapRouter.mjs";
+
+/**
+ * Loads the article list, parses it, creates the menu items
+*/
+export const bootstrap = () => {
+
+ const [Menu, Body, Source, Burger] = ["Menu", "Body", "Source", "Burger"].map(
+ getElementById
+ );
+
+ Burger.addEventListener("click", mode.menuOpen.toggle);
+
+ mode.loading.on();
+ fetchText("./files.txt").then((lines)=>{
+ const links = parseFileList(lines)
+ const firstHref = links[0].href;
+ sortFileListLines(links)
+ Menu.appendChild(createMenuEntriesFromFileList(links))
+ bootstrapRouter(firstHref, (content, raw)=>{
+ Body.innerHTML = "";
+ Source.innerHTML = raw;
+ Body.appendChild(content);
+ })
+ });
+
+ onDocumentKeyUp("?", mode.sourceEnable.toggle);
+};
+
+export default bootstrap;
diff --git a/modules/tickle/bootstrapRouter.mjs b/modules/tickle/bootstrapRouter.mjs
new file mode 100644
index 0000000..2ec9d72
--- /dev/null
+++ b/modules/tickle/bootstrapRouter.mjs
@@ -0,0 +1,41 @@
+//@ts-check
+
+import { changeTitle } from "../utils/changeTitle.mjs";
+import { getCurrentHashUrl } from "../utils/getCurrentHashUrl.mjs";
+import { fetchMarkdown } from "../utils/fetchMarkdown.mjs";
+import { rewriteLocalUrls } from "../utils/rewriteLocalUrls.mjs";
+import { hasNoHashUrl } from "../utils/getCurrentHashUrl.mjs";
+import { mode } from "./mode.mjs";
+
+/**
+ * Sets up a listener for hashchange events.
+ * Loads the provided default Href if none is set by the user
+ * @param {string} defaultHref
+ * @param {(content: DocumentFragment, raw: string) => void} onPageLoaded
+ */
+export const bootstrapRouter = async (defaultHref, onPageLoaded) => {
+ /**
+ * Listens to hashchange event, and attempts to read the url.
+ * @param {HashChangeEvent} [_evt]
+ */
+ const onHashChange = async (_evt) => {
+ const { path } = getCurrentHashUrl();
+ if (!path) {
+ return false;
+ }
+ mode.loading.on();
+ const { title, raw, content } = await fetchMarkdown(path);
+ changeTitle(title);
+ rewriteLocalUrls(content);
+ onPageLoaded(content, raw)
+ mode.loading.off();
+ };
+
+ window.addEventListener("hashchange", onHashChange);
+
+ if (hasNoHashUrl()) {
+ window.location.hash = `#${defaultHref}`;
+ } else {
+ onHashChange();
+ }
+};
diff --git a/modules/tickle/createMenuEntriesFromFileList.mjs b/modules/tickle/createMenuEntriesFromFileList.mjs
new file mode 100644
index 0000000..63e3548
--- /dev/null
+++ b/modules/tickle/createMenuEntriesFromFileList.mjs
@@ -0,0 +1,18 @@
+//@ts-check
+import { makeTemplate } from "./utils/print.mjs";
+import { generateDomFromString } from "./utils/generateDomFromString.mjs";
+/**
+ * @typedef {import("./parseFileList.mjs").ParsedLine} ParsedLine
+ */
+
+const defaultTemplate = `<a data-link href="#{{href}}">{{title}}</a>`;
+
+/**
+ * Creates menu entries from a list of links.
+ * @param {ParsedLine[]} links
+ * @param {string} template a template for each link, where `{{href}}` is replaced by the href
+ * and `{{title}}` is replaced by the title.
+ * all the keys parsed in `parseFileList.mjs` can be used.
+ */
+export const createMenuEntriesFromFileList = (links, template = defaultTemplate) =>
+ generateDomFromString(links.map(makeTemplate(template)).join("\n"));
diff --git a/modules/tickle/index.mjs b/modules/tickle/index.mjs
new file mode 100644
index 0000000..d6fa8a1
--- /dev/null
+++ b/modules/tickle/index.mjs
@@ -0,0 +1,13 @@
+//@ts-check
+import { bootstrapRouter } from "./bootstrapRouter.mjs";
+import { createMenuEntriesFromFileList } from "./createMenuEntriesFromFileList.mjs";
+import { parseFileList, parseFileListLine } from "./parseFileList.mjs";
+import { sortFileListLines } from "./sortFileListLines.mjs";
+
+export {
+ bootstrapRouter,
+ createMenuEntriesFromFileList,
+ parseFileList,
+ parseFileListLine,
+ sortFileListLines,
+};
diff --git a/modules/tickle/mode.mjs b/modules/tickle/mode.mjs
new file mode 100644
index 0000000..76f5718
--- /dev/null
+++ b/modules/tickle/mode.mjs
@@ -0,0 +1,8 @@
+//@ts-check
+import { documentMode } from "./utils/documentMode.mjs";
+
+export const mode = {
+ loading: documentMode("loading"),
+ sourceEnable: documentMode("source-enabled"),
+ menuOpen: documentMode("menu-open"),
+};
diff --git a/modules/tickle/parseFileList.mjs b/modules/tickle/parseFileList.mjs
new file mode 100644
index 0000000..a691de5
--- /dev/null
+++ b/modules/tickle/parseFileList.mjs
@@ -0,0 +1,59 @@
+//@ts-check
+
+import { today } from "./utils/today.mjs";
+
+/**
+ * @typedef {Exclude<ReturnType<typeof parseFileListLine>, null>} ParsedLine
+ */
+
+/**
+ * Parses a single line of a file list
+ * @param {string} line
+ * @param {number} index
+ * @returns
+ */
+export const parseFileListLine = (line, index) => {
+ const result = line.match(
+ /(?<name>.+)\.(?<ext>\w{2,3})(?:\s+(?<date>[\d-]+)?(?<title>.+))?/
+ );
+ if (!result) {
+ return null;
+ }
+ const {
+ //@ts-ignore
+ groups: { name, ext, date = today, title = name },
+ } = result;
+ const href = `/${name}.${ext}`;
+ const date_unix = new Date(date).getTime();
+ return { name, href, date, title, date_unix, index };
+};
+
+/**
+ * parses a filelist string. That's a string that looks like
+ * ```md
+ * name dd-mm-yyyy link name
+ * name dd-mm-yyyy
+ * name linkname
+ * name
+ * ```
+ * This is very specific to Tickle and unlikely to be very useful anywhere else.
+ * @param {string} lines
+ */
+export const parseFileList = (lines) =>
+ // @ts-ignore
+ lines
+ .trim()
+ .split(`\n`)
+ .reduce((/** @type {ParsedLine[]}*/ arr, line, index) => {
+ const result = parseFileListLine(line.trim(), index);
+ if (!result) {
+ console.error(`could not parse line number ${index}`);
+ return arr;
+ }
+ arr.push(result);
+ return arr;
+ }, []);
+
+parseFileList.parseLine = parseFileListLine;
+
+export default parseFileList;
diff --git a/modules/tickle/sortFileListLines.mjs b/modules/tickle/sortFileListLines.mjs
new file mode 100644
index 0000000..4d086e7
--- /dev/null
+++ b/modules/tickle/sortFileListLines.mjs
@@ -0,0 +1,15 @@
+//@ts-check
+
+/**
+ * @typedef {import("./parseFileList.mjs").ParsedLine} ParsedLine
+ */
+
+/**
+ * Sorts a list of parsed lines by a given property in-place
+ * @param {ParsedLine[]} lines
+ * @param {keyof ParsedLine} property
+ */
+export const sortFileListLines = (lines, property = 'date_unix') =>
+ lines.sort(({ [property]: a }, { [property]: b }) => a - b);
+
+export default sortFileListLines
\ No newline at end of file
diff --git a/modules/changeTitle.mjs b/modules/utils/changeTitle.mjs
similarity index 81%
rename from modules/changeTitle.mjs
rename to modules/utils/changeTitle.mjs
index 6127015..0434918 100644
--- a/modules/changeTitle.mjs
+++ b/modules/utils/changeTitle.mjs
@@ -7,6 +7,8 @@
* changeTitle.title = "My Site"
* changeTitle("Home") // produces "Home | My Site"
* ```
+ * if not `title` is passed, the document title (as found when running the function
+ * the first time) will be used.
* @param {string} title
* @param {string} mainTitle
* @returns
diff --git a/modules/documentMode.mjs b/modules/utils/documentMode.mjs
similarity index 85%
rename from modules/documentMode.mjs
rename to modules/utils/documentMode.mjs
index 3039f46..0cd9342 100644
--- a/modules/documentMode.mjs
+++ b/modules/utils/documentMode.mjs
@@ -8,6 +8,7 @@ export const documentMode = (name) => ({
on: () => document.body.classList.add(`is-${name}`),
off: () => document.body.classList.remove(`is-${name}`),
toggle: () => document.body.classList.toggle(`is-${name}`),
+ has: () => document.body.classList.contains(`is-${name}`),
});
export default documentMode;
diff --git a/modules/utils/documentState.mjs b/modules/utils/documentState.mjs
new file mode 100644
index 0000000..12e0ed1
--- /dev/null
+++ b/modules/utils/documentState.mjs
@@ -0,0 +1,35 @@
+//@ts-check
+
+/**
+ * Creates a document state object that can toggle between exclusive states.
+ * All passed states' css classnames will be prepended with `mode-`.
+ * @param {string[]} states
+ */
+export const documentState = (states) => {
+ const all = states.map((state) => `mode-${state}`);
+
+ /**
+ * @param {any} state
+ * @returns {state is number}
+ */
+ const isValidIndex = (state) =>
+ typeof state === "number" && state >= 0 && state < all.length;
+
+ /**
+ * @param {number} state
+ */
+ const is = (state) =>
+ isValidIndex(state) && document.body.classList.contains(all[state]);
+
+ /**
+ * @param {number|undefined|null|false} state
+ */
+ const set = (state = false) => {
+ document.body.classList.remove(...all);
+ isValidIndex(state) && document.body.classList.add(all[state]);
+ };
+
+ return { set, is };
+};
+
+export default documentState;
diff --git a/modules/fetchMarkdown.mjs b/modules/utils/fetchMarkdown.mjs
similarity index 56%
rename from modules/fetchMarkdown.mjs
rename to modules/utils/fetchMarkdown.mjs
index 0dafc0e..c39ffc1 100644
--- a/modules/fetchMarkdown.mjs
+++ b/modules/utils/fetchMarkdown.mjs
@@ -2,24 +2,21 @@
import { fetchText } from "./fetchText.mjs";
import { waitIfLocalHost } from "./waitIfLocalHost.mjs";
-import { rewriteLocalUrls } from "./rewriteLocalUrls.mjs";
import { generateDomFromString } from "./generateDomFromString.mjs";
+import {getFirstTitleContent} from "./getFirstTitleContent.mjs";
// @ts-ignore
import { micromark } from "https://esm.sh/micromark@3?bundle";
/**
- * Loads and parses a markdown document. Makes use of micromark
+ * Loads and parses a markdown document. Makes use of micromark.
* @param {string} path the path to load
*/
export const fetchMarkdown = (path) =>
fetchText(path)
.then(waitIfLocalHost())
.then((raw) => {
- const content = rewriteLocalUrls(generateDomFromString(micromark(raw)));
- const firstTitleElement = content.querySelector("h1");
- const title = firstTitleElement
- ? firstTitleElement.textContent
- : path.replace(/\.\w{2, 4}$/, "");
+ const content = generateDomFromString(micromark(raw));
+ const title = getFirstTitleContent(content) || path.replace(/\.\w{2, 4}$/, "");
return { title, raw, content };
});
diff --git a/modules/fetchText.mjs b/modules/utils/fetchText.mjs
similarity index 100%
rename from modules/fetchText.mjs
rename to modules/utils/fetchText.mjs
diff --git a/modules/utils/generateDomFromString.mjs b/modules/utils/generateDomFromString.mjs
new file mode 100644
index 0000000..408f51c
--- /dev/null
+++ b/modules/utils/generateDomFromString.mjs
@@ -0,0 +1,15 @@
+//@ts-check
+
+/**
+ * Generates valid dom elements from a string
+ * @param {string} htmlString
+ */
+export const generateDomFromString = (htmlString) =>{
+ const children = new DOMParser().parseFromString(`<div>${htmlString}</div>`, "text/html")
+ .children
+ const fragment = document.createDocumentFragment()
+ fragment.append(...children)
+ return fragment
+ ;}
+
+export default generateDomFromString;
diff --git a/modules/getCurrentHashUrl.mjs b/modules/utils/getCurrentHashUrl.mjs
similarity index 64%
rename from modules/getCurrentHashUrl.mjs
rename to modules/utils/getCurrentHashUrl.mjs
index 6551fa9..d9ffe18 100644
--- a/modules/getCurrentHashUrl.mjs
+++ b/modules/utils/getCurrentHashUrl.mjs
@@ -13,4 +13,11 @@ export const getCurrentHashUrl = () => {
return { path, params };
};
+export const hasCurrentHashUrl = () => getCurrentHashUrl().path !== "";
+
+export const hasNoHashUrl = () => getCurrentHashUrl().path === "";
+
+getCurrentHashUrl.hasCurrentHashUrl = hasCurrentHashUrl;
+getCurrentHashUrl.hasNoHashUrl = hasNoHashUrl;
+
export default getCurrentHashUrl;
diff --git a/modules/getElementById.mjs b/modules/utils/getElementById.mjs
similarity index 100%
rename from modules/getElementById.mjs
rename to modules/utils/getElementById.mjs
diff --git a/modules/utils/getFirstTitleContent.mjs b/modules/utils/getFirstTitleContent.mjs
new file mode 100644
index 0000000..5f08b33
--- /dev/null
+++ b/modules/utils/getFirstTitleContent.mjs
@@ -0,0 +1,12 @@
+/**
+ * Returns the first title content in the document, if there is one.
+ * @param {Node} content
+ * @returns
+ */
+export const getFirstTitleContent = (content = document) => {
+ /** @type {HTMLHeadElement} */
+ const firstTitleElement = content.querySelector("h1");
+ return firstTitleElement ? firstTitleElement.textContent || "" : "";
+};
+
+export default getFirstTitleContent;
diff --git a/modules/utils/html.mjs b/modules/utils/html.mjs
new file mode 100644
index 0000000..afa6f22
--- /dev/null
+++ b/modules/utils/html.mjs
@@ -0,0 +1,17 @@
+/**
+ * Does exactly the same as simply using ``, but allows to
+ * neatly highlight the html string in editors that support it.
+ * Packages the resulting string as a template
+ * @param {TemplateStringsArray} strings
+ * @param {...any} expressions
+ */
+export function html(strings, ...expressions){
+ const parsed = strings.reduce((previous, current, i) => {
+ return previous + current + (expressions[i] ? expressions[i] : '')
+ }, '')
+ const template = document.createElement("template")
+ template.innerHTML = parsed
+ return template
+}
+
+export default html
\ No newline at end of file
diff --git a/modules/utils/identity.mjs b/modules/utils/identity.mjs
new file mode 100644
index 0000000..7dcd8d0
--- /dev/null
+++ b/modules/utils/identity.mjs
@@ -0,0 +1,17 @@
+/**
+ * @template T
+ * @param {T} [value]
+ * @returns {Promise<T>}
+ */
+export const awaitedIdentity = (value) => Promise.resolve(value);
+
+/**
+ * @template T
+ * @param {T} [value]
+ * @returns {T}
+ */
+export const identity = (value) => value
+
+identity.awaited = awaitedIdentity;
+
+export default identity;
\ No newline at end of file
diff --git a/modules/utils/index.mjs b/modules/utils/index.mjs
new file mode 100644
index 0000000..566f4e4
--- /dev/null
+++ b/modules/utils/index.mjs
@@ -0,0 +1,69 @@
+//@ts-check
+
+import { changeTitle } from "./changeTitle.mjs";
+import { documentMode } from "./documentMode.mjs";
+import { documentState } from "./documentState.mjs";
+import { fetchMarkdown } from "./fetchMarkdown.mjs";
+import { fetchText } from "./fetchText.mjs";
+import { generateDomFromString } from "./generateDomFromString.mjs";
+import {
+ getCurrentHashUrl,
+ hasCurrentHashUrl,
+ hasNoHashUrl,
+} from "./getCurrentHashUrl.mjs";
+import { getElementById } from "./getElementById.mjs";
+import { getFirstTitleContent } from "./getFirstTitleContent.mjs";
+import { identity, awaitedIdentity } from "./identity.mjs";
+import { html } from "./html.mjs";
+import { isExternalUrl } from "./isExternalUrl.mjs";
+import { isLocalHost } from "./isLocalHost.mjs";
+import { isNotNull } from "./isNotNull.mjs";
+import { not } from "./not.mjs";
+import {
+ onDocumentKeyUp,
+ onDocumentKeyDown,
+ onDocumentKey,
+} from "./onDocumentKey.mjs";
+import { print, makeTemplate } from "./print.mjs";
+import {
+ querySelectorDoc,
+ querySelectorParent,
+ querySelectorAll,
+} from "./querySelectorAll.mjs";
+import { rewriteLocalUrls } from "./rewriteLocalUrls.mjs";
+import { today } from "./today.mjs";
+import { wait } from "./wait.mjs";
+import { waitIfLocalHost } from "./waitIfLocalHost.mjs";
+
+export {
+ changeTitle,
+ documentMode,
+ documentState,
+ fetchMarkdown,
+ fetchText,
+ generateDomFromString,
+ getCurrentHashUrl,
+ hasCurrentHashUrl,
+ hasNoHashUrl,
+ getElementById,
+ getFirstTitleContent,
+ html,
+ identity,
+ awaitedIdentity,
+ isExternalUrl,
+ isLocalHost,
+ isNotNull,
+ not,
+ onDocumentKeyUp,
+ onDocumentKeyDown,
+ onDocumentKey,
+ print,
+ makeTemplate,
+ querySelectorDoc,
+ querySelectorParent,
+ querySelectorAll,
+ rewriteLocalUrls,
+ today,
+ wait,
+ waitIfLocalHost,
+};
diff --git a/modules/isExternalUrl.mjs b/modules/utils/isExternalUrl.mjs
similarity index 100%
rename from modules/isExternalUrl.mjs
rename to modules/utils/isExternalUrl.mjs
diff --git a/modules/isLocalHost.mjs b/modules/utils/isLocalHost.mjs
similarity index 100%
rename from modules/isLocalHost.mjs
rename to modules/utils/isLocalHost.mjs
diff --git a/modules/isNotNull.mjs b/modules/utils/isNotNull.mjs
similarity index 100%
rename from modules/isNotNull.mjs
rename to modules/utils/isNotNull.mjs
diff --git a/modules/utils/not.mjs b/modules/utils/not.mjs
new file mode 100644
index 0000000..b7dcdc1
--- /dev/null
+++ b/modules/utils/not.mjs
@@ -0,0 +1,9 @@
+/**
+ * Inverter.
+ * Easier to read than "!"
+ * @param {any} a
+ * @returns
+ */
+export const not = a => !a
+
+export default not
\ No newline at end of file
diff --git a/modules/onDocumentKey.mjs b/modules/utils/onDocumentKey.mjs
similarity index 100%
rename from modules/onDocumentKey.mjs
rename to modules/utils/onDocumentKey.mjs
diff --git a/modules/utils/print.mjs b/modules/utils/print.mjs
new file mode 100644
index 0000000..8cc8d1f
--- /dev/null
+++ b/modules/utils/print.mjs
@@ -0,0 +1,19 @@
+/**
+ * Mini-mustache templating system. Simply replaces all occurrences of {{key}} with the value of the key.
+ * @param {string} str
+ * @param {Record<string, any>} replacements
+ */
+export const print = (str, replacements) =>
+ str.replace(/{{(.*?)}}/g, (_match, key) => replacements[key] || '')
+
+
+/**
+ *
+ * @param {string} str
+ * @returns {(replacements: Record<string, any>) => string}
+ */
+export const makeTemplate = (str) => print.bind(null, str)
+
+print.makeTemplate = makeTemplate
+
+export default print
\ No newline at end of file
diff --git a/modules/querySelectorAll.mjs b/modules/utils/querySelectorAll.mjs
similarity index 100%
rename from modules/querySelectorAll.mjs
rename to modules/utils/querySelectorAll.mjs
diff --git a/modules/rewriteLocalUrls.mjs b/modules/utils/rewriteLocalUrls.mjs
similarity index 68%
rename from modules/rewriteLocalUrls.mjs
rename to modules/utils/rewriteLocalUrls.mjs
index acf5bbd..e4ad048 100644
--- a/modules/rewriteLocalUrls.mjs
+++ b/modules/utils/rewriteLocalUrls.mjs
@@ -4,13 +4,13 @@ import isExternalUrl from "./isExternalUrl.mjs";
import { querySelectorParent } from "./querySelectorAll.mjs";
/**
- * Makes sure urls to local pages get passed through the routing system
- * @param {HTMLElement} container the element containing links to find
+ * Makes sure urls to local pages are prepended with #/
+ * @param {ParentNode} container the element containing links to find
*/
export const rewriteLocalUrls = (container) => {
querySelectorParent(container, "a").forEach((a) => {
const href = a.getAttribute("href");
- if (href && !isExternalUrl(href)) {
+ if (href && !isExternalUrl(href) && !href.startsWith("#")) {
a.setAttribute("href", "#/" + href.replace(/^\.?\//, ""));
}
});
diff --git a/modules/utils/today.mjs b/modules/utils/today.mjs
new file mode 100644
index 0000000..313387c
--- /dev/null
+++ b/modules/utils/today.mjs
@@ -0,0 +1,3 @@
+export const today = new Date().toISOString().split("T")[0];
+
+export default today
\ No newline at end of file
diff --git a/modules/wait.mjs b/modules/utils/wait.mjs
similarity index 100%
rename from modules/wait.mjs
rename to modules/utils/wait.mjs
diff --git a/modules/waitIfLocalHost.mjs b/modules/utils/waitIfLocalHost.mjs
similarity index 76%
rename from modules/waitIfLocalHost.mjs
rename to modules/utils/waitIfLocalHost.mjs
index 831af30..844007a 100644
--- a/modules/waitIfLocalHost.mjs
+++ b/modules/utils/waitIfLocalHost.mjs
@@ -1,23 +1,16 @@
//@ts-check
-
import wait from "./wait.mjs";
+import { awaitedIdentity } from "./identity.mjs";
+import isLocalHost from "./isLocalHost.mjs";
-/**
- * @template T
- * @param {T} [value]
- * @returns {Promise<T>}
- */
-// @ts-ignore
-const identity = (value) => Promise.resolve(value);
/**
* Waits the specified amount of time before returning the value
* @param {number} _durationMs Duration, in milliseconds. Defaults to 1 second
* @returns
*/
-const fakeWait = (_durationMs = 1000) => identity;
+const fakeWait = (_durationMs = 1000) => awaitedIdentity;
-import isLocalHost from "./isLocalHost.mjs";
/**
* useful to check for transitions while developing styles, if the loading screen
diff --git a/sally-files.txt b/sally-files.txt
new file mode 100644
index 0000000..1789d88
--- /dev/null
+++ b/sally-files.txt
@@ -0,0 +1,4 @@
+an-armenian-at-a-french-school-in-saudi-arabia.md
+thanks-for-the-piano-lessons.md
+to-the-cannibals-of-mar-mikhail.md
+une-histoire-de-portes-et-de-fenetres.md
\ No newline at end of file
diff --git a/sally.html b/sally.html
new file mode 100644
index 0000000..b29eed5
--- /dev/null
+++ b/sally.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Sally Emerzian
+
+
+
+
+