diff --git a/README.md b/README.md index 2cc5f48..a29913b 100644 --- a/README.md +++ b/README.md @@ -126,3 +126,9 @@ All images are algorithmic art pieces I have created, see [mostlymaths.net/sketc - Uses the [charts.js](https://chartsjs.org) plotting library. - Uses the free and awesome [OpenMeteo API](https://open-meteo.com/en/docs). - Many thanks to [Google Gemini](http://gemini.google.com") for the help. +- Added the following open source fonts: + - [Roboto Mono](https://fonts.google.com/specimen/Roboto+Mono) + - [Reforma 1969](https://pampatype.com/reforma) (or from [FontSquirrel](https://www.fontsquirrel.com/fonts/reforma) to see the license) + - [Inter](https://rsms.me/inter/) + - [Monoid](https://larsenwork.com/monoid/) + diff --git a/fonts.css b/fonts.css new file mode 100644 index 0000000..097d0f4 --- /dev/null +++ b/fonts.css @@ -0,0 +1,52 @@ +@font-face { + font-family: "Inter"; + src: url("./fonts/InterDisplay-Regular.woff2") format("woff2"); +} +@font-face { + font-family: "Inter"; + src: url("./fonts/InterDisplay-Bold.woff2") format("woff2"); + font-weight: bold; + font-style: normal; +} +@font-face { + font-family: "Inter"; + src: url("./fonts/InterDisplay-Italic.woff2") format("woff2"); + font-weight: normal; + font-style: italic; +} +@font-face { + font-family: "Roboto"; + src: url("./fonts/Roboto-Regular.woff") format("woff"); +} +@font-face { + font-family: "Reforma1969"; + src: url("./fonts/Reforma1969-Blanca.woff2") format("woff2"); +} +@font-face { + font-family: "Reforma1969"; + src: url("./fonts/Reforma1969-Negra.woff") format("woff2"); + font-weight: bold; + font-style: normal; +} +@font-face { + font-family: "Reforma1969"; + src: url("./fonts/Reforma1969-BlancaItalica.woff2") format("woff2"); + font-weight: normal; + font-style: italic; +} +@font-face { + font-family: "Monoid"; + src: url("./fonts/monoid-regular.woff2") format("woff2"); +} +@font-face { + font-family: "Monoid"; + src: url("./fonts/monoid-bold.woff2") format("woff2"); + font-weight: bold; + font-style: normal; +} +@font-face { + font-family: "Monoid"; + src: url("./fonts/monoid-italic.woff2") format("woff2"); + font-weight: normal; + font-style: italic; +} diff --git a/fonts/InterDisplay-Bold.woff2 b/fonts/InterDisplay-Bold.woff2 new file mode 100644 index 0000000..11c6719 Binary files /dev/null and b/fonts/InterDisplay-Bold.woff2 differ diff --git a/fonts/InterDisplay-Italic.woff2 b/fonts/InterDisplay-Italic.woff2 new file mode 100644 index 0000000..11f20bc Binary files /dev/null and b/fonts/InterDisplay-Italic.woff2 differ diff --git a/fonts/InterDisplay-Regular.woff2 b/fonts/InterDisplay-Regular.woff2 new file mode 100644 index 0000000..a6c04f6 Binary files /dev/null and b/fonts/InterDisplay-Regular.woff2 differ diff --git a/fonts/Reforma1969-Blanca.woff2 b/fonts/Reforma1969-Blanca.woff2 new file mode 100644 index 0000000..a0f2671 Binary files /dev/null and b/fonts/Reforma1969-Blanca.woff2 differ diff --git a/fonts/Reforma1969-BlancaItalica.woff2 b/fonts/Reforma1969-BlancaItalica.woff2 new file mode 100644 index 0000000..a1f8c9b Binary files /dev/null and b/fonts/Reforma1969-BlancaItalica.woff2 differ diff --git a/fonts/Reforma1969-Negra.woff b/fonts/Reforma1969-Negra.woff new file mode 100644 index 0000000..b0ed496 Binary files /dev/null and b/fonts/Reforma1969-Negra.woff differ diff --git a/fonts/Roboto-Regular.woff b/fonts/Roboto-Regular.woff new file mode 100644 index 0000000..61972db Binary files /dev/null and b/fonts/Roboto-Regular.woff differ diff --git a/fonts/fontawesome/fa-regular-400.ttf b/fonts/fontawesome/fa-regular-400.ttf new file mode 100644 index 0000000..549d68d Binary files /dev/null and b/fonts/fontawesome/fa-regular-400.ttf differ diff --git a/fonts/fontawesome/fa-regular-400.woff2 b/fonts/fontawesome/fa-regular-400.woff2 new file mode 100644 index 0000000..18400d7 Binary files /dev/null and b/fonts/fontawesome/fa-regular-400.woff2 differ diff --git a/fonts/fontawesome/fa-solid-900.ttf b/fonts/fontawesome/fa-solid-900.ttf new file mode 100644 index 0000000..bb2a869 Binary files /dev/null and b/fonts/fontawesome/fa-solid-900.ttf differ diff --git a/fonts/fontawesome/fa-solid-900.woff2 b/fonts/fontawesome/fa-solid-900.woff2 new file mode 100644 index 0000000..758dd4f Binary files /dev/null and b/fonts/fontawesome/fa-solid-900.woff2 differ diff --git a/fonts/fontawesome/regular.css b/fonts/fontawesome/regular.css new file mode 100644 index 0000000..0bd1314 --- /dev/null +++ b/fonts/fontawesome/regular.css @@ -0,0 +1,25 @@ +/*! + * Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com + * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) + * Copyright 2024 Fonticons, Inc. + */ +:root, +:host { + --fa-style-family-classic: "Font Awesome 6 Free"; + --fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free"; +} + +@font-face { + font-family: "Font Awesome 6 Free Regular"; + font-style: normal; + font-weight: 400; + font-display: block; + src: + url("./fa-regular-400.woff2") format("woff2"), + url("./fa-regular-400.ttf") format("truetype"); +} + +.far, +.fa-regular { + font-weight: 400; +} diff --git a/fonts/fontawesome/solid.css b/fonts/fontawesome/solid.css new file mode 100644 index 0000000..fc35949 --- /dev/null +++ b/fonts/fontawesome/solid.css @@ -0,0 +1,25 @@ +/*! + * Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com + * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) + * Copyright 2024 Fonticons, Inc. + */ +:root, +:host { + --fa-style-family-classic: "Font Awesome 6 Free"; + --fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free"; +} + +@font-face { + font-family: "Font Awesome 6 Free Solid"; + font-style: normal; + font-weight: 900; + font-display: block; + src: + url("./fa-solid-900.woff2") format("woff2"), + url("./fa-solid-900.ttf") format("truetype"); +} + +.fas, +.fa-solid { + font-weight: 900; +} diff --git a/fonts/monoid-bold.woff2 b/fonts/monoid-bold.woff2 new file mode 100755 index 0000000..44c0390 Binary files /dev/null and b/fonts/monoid-bold.woff2 differ diff --git a/fonts/monoid-italic.woff2 b/fonts/monoid-italic.woff2 new file mode 100755 index 0000000..ba0605f Binary files /dev/null and b/fonts/monoid-italic.woff2 differ diff --git a/fonts/monoid-regular.woff2 b/fonts/monoid-regular.woff2 new file mode 100755 index 0000000..ec937f5 Binary files /dev/null and b/fonts/monoid-regular.woff2 differ diff --git a/index.html b/index.html index 664752d..48e3458 100644 --- a/index.html +++ b/index.html @@ -1,11 +1,8 @@ + - diff --git a/lib/common.js b/lib/common.js index affd081..80df8e0 100644 --- a/lib/common.js +++ b/lib/common.js @@ -24,7 +24,6 @@ const linkRegex = /\[(.*?)\]\((.*?)\)/; const linkPlusRegex = /\[(.*?)\]\((.*?)\)(\s*.*)/; const linkWithShortcut = /`(.*?)`\s*\[(.*?)\]\((.*?)\)/; - function toTop(div) { const allDivs = document.querySelectorAll("div"); const zs = Array.from(allDivs) diff --git a/lib/parser.js b/lib/parser.js index 63a25f4..c3a8eea 100644 --- a/lib/parser.js +++ b/lib/parser.js @@ -1,120 +1,119 @@ function textToObject(text, hPos = 0, filepath) { - const lines = text.split("\n"); - let obj = {}; - obj._hPos = hPos; - obj._filepath = filepath; - obj.lines = []; // Only used (for now) for quotes - let settings = false; - let projects = false; - for (let i = 0; i < lines.length; i++) { - const line = lines[i].trim(); - // Extract the task. If it has a link, it is the main link. - // Handle settings and projects inline, breaking. - if (line.startsWith("# ")) { - let cleaned = line.replace("# ", "").trim(); - if (cleaned == "Settings") { - settings = true; - obj._valid = true; - obj.settings = {}; - continue; - } - if (cleaned == "Projects") { - projects = true; - obj._valid = true; - obj.projects = []; - continue; - } - if (cleaned == "hr") { - obj.hr = true; - obj._valid = true; - continue; - } - if (cleaned.startsWith("[x]") || cleaned.startsWith("[X]")) { - obj.done = true; - cleaned = cleaned.slice(3); - } - if (cleaned.endsWith("(someday)") || cleaned.endsWith("(Someday)")) { - obj.someday = true; - obj.prio = -1000; - cleaned = cleaned.replace(/\s+\(.omeday\)/, ""); - } - const linkMatch = cleaned.match(linkPlusRegex); - if (linkMatch) { - obj.text = linkMatch[1] + (linkMatch[3] ?? ""); - obj.link = linkMatch[2]; - } else { - obj.text = cleaned; - } + const lines = text.split("\n"); + let obj = {}; + obj._hPos = hPos; + obj._filepath = filepath; + obj.lines = []; // Only used (for now) for quotes + let settings = false; + let projects = false; + for (let i = 0; i < lines.length; i++) { + const line = lines[i].trim(); + // Extract the task. If it has a link, it is the main link. + // Handle settings and projects inline, breaking. + if (line.startsWith("# ")) { + let cleaned = line.replace("# ", "").trim(); + if (cleaned == "Settings") { + settings = true; obj._valid = true; + obj.settings = {}; continue; } - if (line == "[x]" || line == "[X]") { - obj.done = true; + if (cleaned == "Projects") { + projects = true; + obj._valid = true; + obj.projects = []; continue; } - if (line.startsWith("> ")) { - obj.lines.push(line.replace(/^> /, "")); + if (cleaned == "hr") { + obj.hr = true; obj._valid = true; continue; } - if (line.startsWith("prio:") ) { - if(!obj.someday){ - obj.prio = parseInt(line.replace("prio:", "")); - } - continue; + if (cleaned.startsWith("[x]") || cleaned.startsWith("[X]")) { + obj.done = true; + cleaned = cleaned.slice(3); } - if (line.startsWith("color:")) { - obj.color = line.replace("color:", "").trim(); - continue; + if (cleaned.endsWith("(someday)") || cleaned.endsWith("(Someday)")) { + obj.someday = true; + obj.prio = -1000; + cleaned = cleaned.replace(/\s+\(.omeday\)/, ""); } - if (line.startsWith("extracolor:")) { - obj.extraColor = line.replace("extracolor:", "").trim(); - continue; + const linkMatch = cleaned.match(linkPlusRegex); + if (linkMatch) { + obj.text = linkMatch[1] + (linkMatch[3] ?? ""); + obj.link = linkMatch[2]; + } else { + obj.text = cleaned; } + obj._valid = true; + continue; + } + if (line == "[x]" || line == "[X]") { + obj.done = true; + continue; + } + if (line.startsWith("> ")) { + obj.lines.push(line.replace(/^> /, "")); + obj._valid = true; + continue; + } + if (line.startsWith("prio:")) { + if (!obj.someday) { + obj.prio = parseInt(line.replace("prio:", "")); + } + continue; + } + if (line.startsWith("color:")) { + obj.color = line.replace("color:", "").trim(); + continue; + } + if (line.startsWith("extracolor:")) { + obj.extraColor = line.replace("extracolor:", "").trim(); + continue; + } - // Get the lists of links or properties if it's a settings list - if (line.startsWith("- ")) { - const cleaned = line.replace("- ", "").trim(); - if (settings) { - const [prop, val] = cleaned.split(":"); - obj.settings[prop.trim()] = val.trim(); - continue; - } - if (projects) { - const thingy = cleaned.split(","); - if (thingy.length == 1) { - obj.projects.push(thingy[0]); - } else { - obj.projects.push(thingy.map((p) => p.trim())); - } - continue; + // Get the lists of links or properties if it's a settings list + if (line.startsWith("- ")) { + const cleaned = line.replace("- ", "").trim(); + if (settings) { + const [prop, val] = cleaned.split(":"); + obj.settings[prop.trim()] = val.trim(); + continue; + } + if (projects) { + const thingy = cleaned.split(","); + if (thingy.length == 1) { + obj.projects.push(thingy[0]); + } else { + obj.projects.push(thingy.map((p) => p.trim())); } - const linkMatch = cleaned.match(linkRegex); - if (linkMatch) { - if (obj.links) { - obj.links.push([linkMatch[1], linkMatch[2]]); - } else { - obj.links = [[linkMatch[1], linkMatch[2]]]; - } - continue; + continue; + } + const linkMatch = cleaned.match(linkRegex); + if (linkMatch) { + if (obj.links) { + obj.links.push([linkMatch[1], linkMatch[2]]); } else { - // If we are in a list, haven't matched a known property, - // and match no link, we are in a log message. - if (obj.msg) { - obj.msg.push(cleaned); - } else { - obj.msg = [cleaned]; - } + obj.links = [[linkMatch[1], linkMatch[2]]]; } + continue; } else { - // If the line does not start a list and we have not processed a known command… - const cleaned = line.trim(); - if (cleaned) { - // Could be empty, so… - obj.extra = cleaned; + // If we are in a list, haven't matched a known property, + // and match no link, we are in a log message. + if (obj.msg) { + obj.msg.push(cleaned); + } else { + obj.msg = [cleaned]; } } + } else { + // If the line does not start a list and we have not processed a known command… + const cleaned = line.trim(); + if (cleaned) { + // Could be empty, so… + obj.extra = cleaned; + } } - return obj; } - \ No newline at end of file + return obj; +} diff --git a/lib/quoteUtils.js b/lib/quoteUtils.js index 0cbb742..ad50fe0 100644 --- a/lib/quoteUtils.js +++ b/lib/quoteUtils.js @@ -1,4 +1,4 @@ -// TODO(me) This might need cleanup, it has been hacked quickly into the parser +// TODO(me) This might need cleanup, it has been hacked quickly from pieces out of taskUtils /* @@ -10,12 +10,13 @@ Example quotes file: # Settings -- backgroundColor: var(--grey-trans) -- fontSize: 1.5vh +- backgroundColor: #333333ee +- fontSize: 1.4vh - borderRadius: 0.2em -- width: 20em -- padding: 1em -- margin-bottom: 2em +- width: 25em +- padding: 0.4em +- margin-bottom: 1.6em +- font-family: Reforma1969 --- @@ -29,8 +30,6 @@ Douglas Adams Mike Tyson - - */ function quotesFromMarkdown(paths, cb, basepath) { @@ -79,11 +78,11 @@ function quotesFromMarkdown(paths, cb, basepath) { } const getSettings = (objs) => { - return objs.filter(o => o.settings) -} + return objs.filter((o) => o.settings); +}; function addQuotesToDiv(_quotes, targetDivId) { - const settings = getSettings(_quotes) + const settings = getSettings(_quotes); const quotes = settings.concat(shuffleArray(_quotes)); // Just place them at the beginning and call it a day const d = () => document.createElement("DIV"); const targetDiv = document.getElementById(targetDivId); @@ -102,12 +101,13 @@ function addQuotesToDiv(_quotes, targetDivId) { } continue; } - if(rendered){ - // Just show one quote. - return; + if (rendered) { + // Just show one quote. + return; } const div = d(); - const color = colors[Math.floor((Math.random()*colors.length) % colors.length)]; + const color = + colors[Math.floor((Math.random() * colors.length) % colors.length)]; div.style.color = `var(${color})`; div.classList.add("quote"); const q = d(); @@ -116,14 +116,14 @@ function addQuotesToDiv(_quotes, targetDivId) { a.classList.add("author"); for (const line of quote.lines) { const p = document.createElement("p"); - p.textContent = line; + p.innerHTML = line; // To avoid adding a full formatting parser q.appendChild(p); } a.textContent = quote.extra; div.appendChild(q); div.appendChild(a); wrapperNode.appendChild(div); - targetDiv.appendChild(wrapperNode) + targetDiv.appendChild(wrapperNode); rendered = true; } } diff --git a/style.css b/style.css index a0dc2c6..956e372 100644 --- a/style.css +++ b/style.css @@ -19,7 +19,7 @@ body { background: var(--dark); - font-family: "Roboto Mono"; + font-family: "Monoid"; } iframe { @@ -299,15 +299,20 @@ hr.dim { } .quote { - padding-bottom: 2em; + padding-bottom: 1em; } -.quote.text { +.quote .text { + text-align: right; +} +.quote .text p { + margin: 0.5em; } .quote .author { font-size: 90%; filter: grayscale(0.7) opacity(0.8); - float: right; + text-align: center; + padding-left: 8em; }