feat!: Rework website generation

- Move src.du into src/INIT.du
- Replace generate.sh with make.sh, which uses multiple stages for
execution and allows customising them.
- Added a stage for sitemap generation in make.sh

1 files changed, 415 insertions, 0 deletions

diff --git a/src/INIT.du b/src/INIT.du
new file mode 100644
index 0000000..717f259
--- /dev/null
+++ b/src/INIT.du
@@ -0,0 +1,415 @@
+'hide Necessary definitions for all pages under src
+
+'if {eq {ifn {OUTPUT_FORMAT};{env OUTPUT_FORMAT}};HTML}
+
+# FILENAME
+
+'def FILENAME {trimEnd {1};du}html
+
+# HEADER
+
+Expected substitutions:
+title - Page title
+desc  - Page description
+
+'def HEADER <!DOCTYPE html>\
+<html lang="en">\
+\
+<head>\
+	<meta charset="UTF-8">\
+	<meta name="author" content="Kamen Mladenov">\
+	<meta name="robots" content="index, follow">\
+	<link rel="icon" href="/img/favicon.ico" type="image/x-icon">\
+	<link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">\
+	<meta name="theme-color" content="#ffffff"/>\
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">\
+	<link rel="stylesheet" href="/styles.css">\
+	<link rel="stylesheet" href="/darkmode.css">\
+	<link rel="stylesheet" href="/hide-js-styling.css">\
+	<link rel="stylesheet" href="/presentation.css">\
+	<link rel="stylesheet" href="./machine_table.css" id="upp2025_w02" disabled>\
+	<script type="text/javascript" src="/scripts/styling-preload.js" crossorigin="anonymous"></script>\
+	<meta name="description" content="{truncate {desc};120}">\
+	<!-- Thanks https://stackoverflow.com/a/25093272/12036073 -->\
+	<meta prefix="og: http://ogp.me/ns#" property="og:type" content="website">\
+	<meta prefix="og: http://ogp.me/ns#" property="og:title" content="{title} &mdash; Syndamia">\
+	<meta prefix="og: http://ogp.me/ns#" property="og:description" content="{truncate {desc};120}">\
+	<meta prefix="og: http://ogp.me/ns#" property="og:image" content="https://syndamia.com/img/meta-banner.png">\
+	<meta prefix="og: http://ogp.me/ns#" property="og:url" content="https://syndamia.com">\
+	<title>{title} &mdash; Syndamia</title>\
+</head>\
+<body id="content-wrapper" text="black" bgcolor="white" link="#336700" vlink="#336700">\
+	<span class="nocss-aid"><a href="#article-container">Jump to content</a><br><br></span>\
+\
+	<nav id="sidebar">\
+		<nav id="header" class="sidebar-section">\
+			<span class="nocss-aid">&#x25B2;</span>\
+			<a href="/">Home</a>\
+			<span id="expandNavbarBtn" class="btn">&#x25B2;</span>\
+			<script type="text/javascript" src="/scripts/expand-navbar.js" crossorigin="anonymous" defer></script>\
+			<span class="nocss-aid"><br></span>\
+		</nav>\
+\
+		<nav id="index" class="sidebar-section">\
+			<span class="nocss-aid">&boxvr;</span>\
+\
+			<span>Text</span><span class="nocss-aid"> &ndash; </span>\
+			<span class="index-list">\
+				<a class="index-list-item" href="/blog">Blog</a>\
+				<span class="nocss-aid">&bull;</span>\
+				<a class="index-list-item" href="/teaching">Teaching</a>\
+			</span>\
+\
+			<span class="nocss-aid"><br>&boxvr;</span>\
+\
+			<span>Interactive</span><span class="nocss-aid"> &ndash; </span>\
+			<span class="index-list">\
+				<a class="index-list-item" href="/slides">Slides</a>\
+				<span class="nocss-aid">&bull;</span>\
+				<a class="index-list-item" href="/preserved-web-pages">Preserved web</a>\
+			</span>\
+\
+			<span class="nocss-aid"><br>&boxvr;</span>\
+\
+			<span>Files</span><span class="nocss-aid"> &ndash; </span>\
+			<span class="index-list">\
+				<a class="index-list-item" href="/preserved-media">Archived media</a>\
+				<span class="nocss-aid">&bull;</span>\
+				<a class="index-list-item" href="/misc">Miscellaneous</a>\
+			</span>\
+\
+			<span class="nocss-aid"><br>&boxur;</span>\
+\
+			<span>Me</span><span class="nocss-aid"> &ndash; </span>\
+			<span class="index-list">\
+				<a class="index-list-item" href="/about">About</a>\
+				<span class="nocss-aid">&bull;</span>\
+				<a class="index-list-item" href="/setup">Setup</a>\
+			</span>\
+			<span class="nocss-aid"><br></span>\
+		</nav>\
+\
+		<!-- This nav is entirely removed in tiny website -->\
+		<nav id="settingsWrapper" class="sidebar-section">\
+			<span id="changeThemeBtn" class="btn setting-btn"><span>Light</span> theme</span>\
+			<span id="changeWidthBtn" class="btn setting-btn"><span>Wide</span> text</span>\
+			<span id="snowBtn" class="btn setting-btn nodisplay"><span>Remove</span> snowflakes</span>\
+		</nav>\
+\
+		<span class="nocss-aid"><br></span>\
+\
+		<nav id="footer" class="sidebar-section">\
+			<span class="nocss-aid">&boxDR;</span>\
+\
+			<a href="/license.html" title="CC BY-SA 4.0 and GNU GPLv3">CC BY-SA 4.0 and GNU GPLv3</a>\
+\
+			<span class="nocss-aid"><br>&boxV;</span><span class="brt"></span>\
+\
+			<a href="/privacy.html" title="Privacy policy">Privacy policy</a> &bull;\
+			<a href="/accessibility.html" title="Accessibility">Accessibility</a><span class="br"></span><span class="nocss-aid"> &bull;</span>\
+			<a href="/regarding-js.html" title="Regarding usage of JavaScript">Regarding JavaScript</a><span class="br"></span><span class="nocss-aid"> &bull;</span>\
+			<a href="/acknowledgements.html" title="Acknowledgements">Acknowledgements</a><span class="br"></span>\
+\
+			<span class="nocss-aid"><br>&boxV;</span><span class="brt"></span>\
+\
+			<a href="https://gitlab.com/Syndamia" target="_blank" title="GitLab">GitLab</a> &bull;\
+			<a href="https://github.com/Syndamia" target="_blank" title="GitHub">GitHub</a> &bull;\
+			<a href="/about/#contact" target="_blank" title="Contact">Contact</a><span class="br"></span><span class="nocss-aid"> &bull;</span>\
+			<a href="https://bg.linkedin.com/in/kamen-mladenov" target="_blank" title="Linkedin">LinkedIn</a><span class="br"></span>\
+\
+			<span class="nocss-aid"><br>&boxUR;</span><span class="brt"></span>\
+\
+			<a href="https://gitlab.com/Syndamia/syndamiadotcom" target="_blank" class="link-tab">Powered with:</a><span class="br"></span>\
+			<a href="https://gitlab.com/Syndamia/dunbar" target="_blank" class="link-tab">dunbar</a><span class="br"></span><span class="nocss-aid">, </span>\
+			<a href="https://invisible-island.net/mawk/" target="_blank" class="link-tab">mawk</a><span class="br"></span><span class="nocss-aid">, </span>\
+			<a href="https://www.gnu.org/software/bash/" target="_blank" class="link-tab">GNU bash</a><span class="br"></span><span class="nocss-aid">, </span>\
+			<a href="http://andre-simon.de/doku/highlight/en/highlight.php" target="_blank" class="link-tab">Highlight</a>\
+		</nav>\
+	</nav>\
+\
+	<article>\
+		<script type="text/javascript" src="/scripts/page-width.js" crossorigin="anonymous" defer></script>\
+		<script type="text/javascript" src="/scripts/snow-preload.js" crossorigin="anonymous" defer></script>\
+		<div id="article-container">{def href_section;0}{def href_url;0}{def slide;0}{def URL;{trimStart {query inputFile};./website/}}
+
+# FOOTER
+
+'def FOOTER <div class="gap"></div>\
+			<footer>\
+				<a href="/{URL}">Original markup</a>\
+				&ensp;&bull;&ensp;\
+				<a href="/license.html">CC BY-SA 4.0</a>\
+				(unless stated otherwise)\
+				&ensp;&bull;&ensp;\
+				2020&ndash;2026\
+			</footer>\
+		</div>\
+	</article>\
+\
+	<div id="scrollBtn" class="btn">&#xFE3D;</div>\
+</body>\
+\
+<script type="text/javascript" src="/scripts/theme-changer.js" crossorigin="anonymous" defer></script>\
+<script type="text/javascript" src="/scripts/back-to-top.js" crossorigin="anonymous" defer></script>\
+<script type="text/javascript" src="/scripts/keyboard.js" crossorigin="anonymous" defer></script>\
+<script type="text/javascript" src="/scripts/snow.js" crossorigin="anonymous" defer></script>\
+\
+</html>
+
+# Blocks
+
+'if {env HIGHLIGHT}
+'cmdprocess code highlight -O html -f -S {default {normalise {LANG}};text}
+'endif
+
+## Attention
+
+'let start question <div class="special-par question-par"><div class="special-contents special-with-icon"><img src="/img/dialog-question.png" class="special-par-icon borderless unzoomable" alt="question">
+'let end   question </div></div>
+
+'let start warn <div class="special-par warn-par"><div class="special-contents special-with-icon"><img src="/img/dialog-warning.png" class="special-par-icon borderless unzoomable" alt="warn">
+'let end   warn </div></div>
+
+'let start important <div class="special-par important-par"><div class="special-contents special-with-icon"><img src="/img/dialog-important.png" class="special-par-icon borderless unzoomable" alt="important">
+'let end   important </div></div>
+
+'let start note <div class="special-par note-par"><div class="special-contents">
+'let end   note </div></div>
+
+## Headers
+
+For each header (except H1) we'll add a "gap" element and an anchor link to the end.
+The gap is only for visual purposes.
+
+href function
+'def fhref {default {normalise {1}};section-{inc {2}}}
+auto href
+'def ahref {def href;{fhref {query line};href_section}}{href}
+url href
+'def uhref {url {1};#{fhref {1};href_url}}
+
+'let start header2 <div class="gap"></div> <h2 id="{ahref}">
+'let end   header2 </h2> <a class="h-anchor" href="#{href}" aria-hidden="true">#</a>
+'let start header3 <div class="gap"></div> <h3 id="{ahref}">
+'let end   header3 </h3> <a class="h-anchor" href="#{href}" aria-hidden="true">#</a>
+'let start header4 <div class="gap"></div> <h4 id="{ahref}">
+'let end   header4 </h4> <a class="h-anchor" href="#{href}" aria-hidden="true">#</a>
+'let start header5 <div class="gap"></div> <h5 id="{ahref}">
+'let end   header5 </h5> <a class="h-anchor" href="#{href}" aria-hidden="true">#</a>
+'let start header6 <div class="gap"></div> <h6 id="{ahref}">
+'let end   header6 </h6> <a class="h-anchor" href="#{href}" aria-hidden="true">#</a>
+
+## Teaching
+
+'let start solution-link <div class="exercise-solution">&lt; 
+'let end   solution-link &gt;</div>
+
+## Contents
+
+'let start contents <div id="contents-container"><h2 id="contents">Contents</h2> <a class="h-anchor" href="#contents" aria-hidden="true">#</a>
+'let end   contents </div>
+
+## Presentations
+
+'let start         font18 <div class="font18">
+'let end           font18 </div>
+'let start     centered18 <div class="centered font18">
+'let end       centered18 </div>
+'let start        slide18 <div id="slide-{inc slide}" class="slide font18">
+'let end          slide18 </div>
+'let start middle_slide18 <div id="slide-{inc slide}" class="slide centered-slide font18"><div></div><div>
+'let end   middle_slide18 </div><div></div></div>
+'let start  title_slide18 <div id="slide-{inc slide}" class="slide centered-slide centered font18"><div></div><div>
+'let end    title_slide18 </div><div></div></div>
+
+'let start         font20 <div class="font20">
+'let end           font20 </div>
+'let start     centered20 <div class="centered font20">
+'let end       centered20 </div>
+'let start        slide20 <div id="slide-{inc slide}" class="slide font20">
+'let end          slide20 </div>
+'let start middle_slide20 <div id="slide-{inc slide}" class="slide centered-slide font20"><div></div><div>
+'let end   middle_slide20 </div><div></div></div>
+'let start  title_slide20 <div id="slide-{inc slide}" class="slide centered-slide centered font20"><div></div><div>
+'let end    title_slide20 </div><div></div></div>
+
+'let start         font22 <div class="font22">
+'let end           font22 </div>
+'let start     centered22 <div class="centered font22">
+'let end       centered22 </div>
+'let start        slide22 <div id="slide-{inc slide}" class="slide font22">
+'let end          slide22 </div>
+'let start middle_slide22 <div id="slide-{inc slide}" class="slide centered-slide font22"><div></div><div>
+'let end   middle_slide22 </div><div></div></div>
+'let start  title_slide22 <div id="slide-{inc slide}" class="slide centered-slide centered font22"><div></div><div>
+'let end    title_slide22 </div><div></div></div>
+
+'let start         font25 <div class="font25">
+'let end           font25 </div>
+'let start     centered25 <div class="centered font25">
+'let end       centered25 </div>
+'let start        slide25 <div id="slide-{inc slide}" class="slide font25">
+'let end          slide25 </div>
+'let start middle_slide25 <div id="slide-{inc slide}" class="slide centered-slide font25"><div></div><div>
+'let end   middle_slide25 </div><div></div></div>
+'let start  title_slide25 <div id="slide-{inc slide}" class="slide centered-slide centered font25"><div></div><div>
+'let end    title_slide25 </div><div></div></div>
+
+'let start         font27 <div class="font27">
+'let end           font27 </div>
+'let start     centered27 <div class="centered font27">
+'let end       centered27 </div>
+'let start        slide27 <div id="slide-{inc slide}" class="slide font27">
+'let end          slide27 </div>
+'let start middle_slide27 <div id="slide-{inc slide}" class="slide centered-slide font27"><div></div><div>
+'let end   middle_slide27 </div><div></div></div>
+'let start  title_slide27 <div id="slide-{inc slide}" class="slide centered-slide centered font27"><div></div><div>
+'let end    title_slide27 </div><div></div></div>
+
+'let start         font35 <div class="font35">
+'let end           font35 </div>
+'let start     centered35 <div class="centered font35">
+'let end       centered35 </div>
+'let start        slide35 <div id="slide-{inc slide}" class="slide font35">
+'let end          slide35 </div>
+'let start middle_slide35 <div id="slide-{inc slide}" class="slide centered-slide font35"><div></div><div>
+'let end   middle_slide35 </div><div></div></div>
+'let start  title_slide35 <div id="slide-{inc slide}" class="slide centered-slide centered font35"><div></div><div>
+'let end    title_slide35 </div><div></div></div>
+
+'let start         font <div>
+'let end           font </div>
+'let start     centered <div class="centered">
+'let end       centered </div>
+'let start        slide <div id="slide-{inc slide}" class="slide">
+'let end          slide </div>
+'let start middle_slide <div id="slide-{inc slide}" class="slide centered-slide"><div></div><div>
+'let end   middle_slide </div><div></div></div>
+'let start  title_slide <div id="slide-{inc slide}" class="slide centered-slide centered"><div></div><div>
+'let end    title_slide </div><div></div></div>
+
+'let start row <div class="layout-table"><div class="layout-row">
+'let end   row </div></div>
+'let start sqrow <div class="layout-table fixed-layout"><div class="layout-row">
+'let end   sqrow </div></div>
+
+'let start  width5% <div class="width5per">
+'let end    width5% </div>
+'let start width10% <div class="width10per">
+'let end   width10% </div>
+'let start width15% <div class="width15per">
+'let end   width15% </div>
+'let start width20% <div class="width20per">
+'let end   width20% </div>
+'let start width25% <div class="width25per">
+'let end   width25% </div>
+'let start width30% <div class="width30per">
+'let end   width30% </div>
+'let start width35% <div class="width35per">
+'let end   width35% </div>
+'let start width40% <div class="width40per">
+'let end   width40% </div>
+'let start width45% <div class="width45per">
+'let end   width45% </div>
+'let start width50% <div class="width50per">
+'let end   width50% </div>
+'let start width55% <div class="width55per">
+'let end   width55% </div>
+'let start width60% <div class="width60per">
+'let end   width60% </div>
+'let start width65% <div class="width65per">
+'let end   width65% </div>
+'let start width70% <div class="width70per">
+'let end   width70% </div>
+'let start width75% <div class="width75per">
+'let end   width75% </div>
+'let start width80% <div class="width80per">
+'let end   width80% </div>
+'let start width85% <div class="width85per">
+'let end   width85% </div>
+'let start width90% <div class="width90per">
+'let end   width90% </div>
+'let start width95% <div class="width95per">
+'let end   width95% </div>
+
+'let start fright <div class="float-right">
+'let end   fright </div>
+'let start column <div class="column">
+'let end   column </div>
+
+# Substitutions
+
+'def due_for_rework {url {b {i Due for rework}};/rework.html}
+'def nohtml {greplace {1};<;&lt\;}
+
+## Country flags
+
+'def gb <img src="/img/gb.svg" class="flag unzoomable svg" alt="ENG" height=18>
+'def bg <img src="/img/bg.svg" class="flag unzoomable svg" alt="BGN" height=18>
+
+## File types
+
+'def    ft-photo <span class="file-type-icon">&#xeb0a;</span>
+'def     ft-text <span class="file-type-icon">&#xeaa2;</span>
+'def      ft-zip <span class="file-type-icon">&#xed4e;</span>
+'def    ft-movie <span class="file-type-icon">&#xeafa;</span>
+'def ft-markdown <span class="file-type-icon">&#xec41;</span>
+'def  ft-browser <span class="file-type-icon">&#xebb7;</span>
+
+## Pagenav
+
+Expects substitutions:
+reading
+created
+edited
+
+'def breadcrumb &raquo; {def x/...;{>= {count {1};/};1}}{if {x/...};{url {substrBefore {1};/};{default {2};./}};{italic {substrAfter {1};/}}} {{if {x/...};breadcrumb;none} {substrAfter {1};/};{substrAfter {2};../}}
+
+'def pagenav <div id="pagenav">\
+    <div id="pagenav-stats">\
+        <strong>Reading: {1}</strong> &ensp;||&ensp; <strong>Created: {2}</strong> &ensp;||&ensp; <strong>Edited: {3}</strong>\
+        &ensp;||&ensp;\
+        <a href="https://gitlab.com/Syndamia/syndamiadotcom/-/blob/master/src/{URL}"><strong>GitLab source</strong></a>\
+    </div>\
+    <div id="pagenav-breadcrumb">\
+        {breadcrumb {trimEnd {URL};.du;/index};{repeat ../;{- {count {URL};/};1}}}\
+    </div>\
+</div>
+
+## Presentations
+
+'def line <hr/>
+
+'def presentation-controller <nav id="presentCont">\
+	<span id="prevSlideBtn" class="btn nodisplay">&#x2190;</span>\
+	<a id="slideIndex" class="nodisplay" href="#slide-0">0</a>\
+	<span id="nextSlideBtn" class="btn nodisplay">&#x2192;</span>\
+	<span id="incrementationBtn" class="btn nodisplay">&#x22EE;</span>\
+	<span id="articleBtn" class="btn setting-btn">As article &#x2632;</span>\
+	<span id="presentBtn" class="btn setting-btn">Present &#x239A;</span>\
+	<span id="printBtn" class="btn setting-btn">Print &#x2399;</span>\
+</nav><br><br>\
+<script type="text/javascript" src="/scripts/presentation.js" crossorigin="anonymous"></script>
+
+'def newrow </div><div class="layout-row">
+
+'def br1 <div class="br1"></div>
+'def br2 <div class="br2"></div>
+'def br3 <div class="br3"></div>
+'def br4 <div class="br4"></div>
+'def br5 <div class="br5"></div>
+'def br6 <div class="br6"></div>
+'def br7 <div class="br7"></div>
+'def br8 <div class="br8"></div>
+'def br9 <div class="br9"></div>
+
+## Pagination
+
+            1         2          3        4    5
+{pagination START_URL;PREV_TITLE;PREV_URL;NEXT;NEXT_URL}
+
+'def pagination {if {1};{code {url {nohtml <<};{1}}} || }{if {2};{code {url {nohtml <} {2};{3}}}}{if {2}{4}; || }{if {4};{code {url {4} {nohtml >};{5}}}}
+
+'else
+'exit 1
+'endif