tongong.net

personal website
git clone https://tongong.net/git/tongong.net.git
Log | Files | Refs

commit d6e5966ec6ccbfe5917ce270ec2b533da4f641b8
Author: tongong <tongong@gmx.net>
Date:   Mon,  5 Dec 2022 15:58:58 +0100

build scripts and example pages

Diffstat:
A.gitignore | 2++
AMakefile | 7+++++++
Abuild.js | 63+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Acontent/about/index.html | 3+++
Acontent/index.html | 1+
Acontent/writing/index.html | 2++
Atemplate/bamboo.css | 1+
Atemplate/index.html | 21+++++++++++++++++++++
Atemplate/styles.css | 37+++++++++++++++++++++++++++++++++++++
9 files changed, 137 insertions(+), 0 deletions(-)

diff --git a/.gitignore b/.gitignore @@ -0,0 +1,2 @@ +dist +template/dist diff --git a/Makefile b/Makefile @@ -0,0 +1,7 @@ +build: + tacker template/index.html template/dist/index.html + rm -rf dist/* + qjs build.js + +watch: + find . | entr -s "make build" diff --git a/build.js b/build.js @@ -0,0 +1,63 @@ +import * as std from "std"; +import * as os from "os"; + +function is_dir(path) { + let stat = os.stat(path)[0]; + if (stat == null) return false; + return !!(stat.mode & os.S_IFDIR); +} + +function is_file(path) { + let stat = os.stat(path)[0]; + if (stat == null) return false; + return !!(stat.mode & os.S_IFREG); +} + +function parent_dir(path) { + if (path.endsWith("/")) path = path.slice(0, -1); + if (!path.includes("/")) return "."; + return path.slice(0, path.lastIndexOf("/")); +} + +// creates the directory with all needed parents +function mkdir_p(path) { + if (!is_dir(path)) { + mkdir_p(parent_dir(path)); + os.mkdir(path); + } +} + +// return paths to all pages +function get_pages(entry_path) { + return os.readdir(entry_path)[0].filter(e => e != "." && e != "..") + .map(e => entry_path + "/" + e) + .flatMap(e => { + if (is_dir(e) && !e.endsWith("/src")) { + return get_pages(e); + } else if (is_file(e) && e.endsWith("/index.html")) { + return [e]; + } + }); +} + +// list of paths +const pages = get_pages("content"); + +const template = std.loadFile("template/dist/index.html"); + +pages.forEach(src => { + const dst = src.replace("content/", "dist/"); + + const txt_src = std.loadFile(src); + const title = txt_src.includes("<h1>") ? + txt_src.split("<h1>")[1].split("</h1>")[0] + " | tongong.net" + : "tongong.net"; + const txt = template + .replace("{{title}}", title) + .replace("{{content}}\n", txt_src) + + mkdir_p(parent_dir(dst)); + const dfile = std.open(dst, "w"); + dfile.puts(txt); + dfile.close(); +}); diff --git a/content/about/index.html b/content/about/index.html @@ -0,0 +1,3 @@ +<h1>test page</h1> +<p class="page-intro">an introductory text.</p> +<p>test text blah blah.</p> diff --git a/content/index.html b/content/index.html @@ -0,0 +1 @@ +<p>test text blah blah.</p> diff --git a/content/writing/index.html b/content/writing/index.html @@ -0,0 +1,2 @@ +<h1>writing</h1> +<p>I sometimes like to write.</p> diff --git a/template/bamboo.css b/template/bamboo.css @@ -0,0 +1 @@ +:root{--b-font-main: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--b-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--b-txt: #eceff4;--b-bg-1: #2e3440;--b-bg-2: #3b4252;--b-line: #3b4252;--b-link: #bf616a;--b-btn-bg: #242933;--b-btn-txt: #fff;--b-focus: #88c0d0}*,::before,::after{box-sizing:border-box}html:focus-within{scroll-behavior:smooth}body{max-width:70ch;padding:0 1rem;margin:auto;background:var(--b-bg-1);font-family:var(--b-font-main);text-rendering:optimizeSpeed;line-height:1.5;color:var(--b-txt);-moz-tab-size:4;tab-size:4;word-break:break-word;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,details,blockquote,pre,figure,table,address,hr,fieldset,iframe,audio,video{margin:0 0 1.5rem}h1,h2,h3,h4,h5,h6{line-height:1.25;margin-top:2rem}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}h4{font-size:1rem}h5{font-size:.875rem}h6{font-size:.75rem}a{color:var(--b-link);text-decoration:none}a:hover{text-decoration:underline}img,video,svg{max-width:100%;height:auto}embed,iframe,object{max-width:100%}iframe{border-style:none}abbr[title]{text-decoration:underline;text-decoration:underline dotted}blockquote{margin-left:0;padding:.5rem 0 .5rem 1.5rem;border-left:.25rem solid var(--b-txt)}blockquote>:last-child{margin-bottom:0}small{font-size:.875rem}sub,sup{font-size:.75em;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}hr{height:0;overflow:visible;border:0;border-bottom:1px solid var(--b-line)}pre,code,kbd,samp,tt,var{background:var(--b-bg-2);border-radius:.25rem;padding:.125rem .25rem;font-family:var(--b-font-mono);font-size:.875rem}pre{padding:1rem;border-radius:0;overflow:auto;white-space:pre}pre code{padding:0}details{display:block;padding:.5rem 1rem;background:var(--b-bg-2);border:1px solid var(--b-line);border-radius:.25rem}details>:last-child{margin-bottom:0}details[open]>summary{margin-bottom:1.5rem}summary{display:list-item;cursor:pointer;font-weight:bold}summary:focus{box-shadow:none}table{border-collapse:collapse;width:100%;text-indent:0}table caption{margin-bottom:.5rem}tr{border-bottom:1px solid var(--b-line)}td,th{padding:.5rem 0}th{text-align:left}ul,ol,dd{padding-left:2rem}li>ul,li>ol{margin-bottom:0}fieldset{padding:.5rem .75rem;border:1px solid var(--b-line);border-radius:.25rem}legend{padding:0 .25rem}label{cursor:pointer;display:block;margin-bottom:.25rem}button,input,select,textarea{margin:0;padding:.5rem .75rem;max-width:100%;background:var(--b-bg-2);border:0;border-radius:.25rem;font:inherit;line-height:1.125;color:var(--b-txt)}select,input:not([size]):not([type=button i]):not([type=submit i]):not([type=reset i]):not([type=checkbox i]):not([type=radio i]){width:100%}[type=color i]{min-height:2.125rem}select:not([multiple]):not([size]){padding-right:1.5rem;background-repeat:no-repeat;background-position:right .5rem center;-moz-appearance:none;-webkit-appearance:none;appearance:none}textarea{width:100%;resize:vertical}textarea:not([rows]){height:8rem}button,[type=button i],[type=submit i],[type=reset i]{-webkit-appearance:button;display:inline-block;text-align:center;white-space:nowrap;background:var(--b-btn-bg);color:var(--b-btn-txt);border:0;cursor:pointer;transition:opacity .25s}button:hover,[type=button i]:hover,[type=submit i]:hover,[type=reset i]:hover{opacity:.75}button[disabled],[type=button i][disabled],[type=submit i][disabled],[type=reset i][disabled]{opacity:.5}progress{vertical-align:middle}[type=search i]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.5}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}[aria-busy=true i]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true i],[disabled]{cursor:not-allowed}:focus,details:focus-within{outline:none;box-shadow:0 0 0 2px var(--b-focus)}@media(prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,::before,::after{animation-delay:-1ms !important;animation-duration:1ms !important;animation-iteration-count:1 !important;background-attachment:initial !important;scroll-behavior:auto !important;transition-delay:0 !important;transition-duration:0 !important}}select:not([multiple]):not([size]){background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23eceff4'%3E%3Cpath d='M5 6l5 5 5-5 2 1-7 7-7-7 2-1z'/%3E%3C/svg%3E")} diff --git a/template/index.html b/template/index.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="UTF-8" /> + <title>{{title}}</title> + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" /> + <link rel="stylesheet" href="./bamboo.css"/> + <link rel="stylesheet" href="./styles.css"/> + </head> + <body> + <p class="page-header"> + <a href="https://tongong.net">tongong.net</a> - + <a href="/writing">writing</a> - + <a href="/projects">projects</a> - + <a href="/git">git</a> - + <a href="/about">about</a> + </p> + <hr> +{{content}} + </body> +</html> diff --git a/template/styles.css b/template/styles.css @@ -0,0 +1,37 @@ +:root { + --b-txt: #afbac4; + --b-bg-1: #242930; + --b-bg-2: #353b43; + --b-line: #afbac4; + --b-link: #57cc8a; + --b-btn-bg: #353b43; + --b-btn-txt: #afbac4; + --b-focus: #88c0d0; +} + +h1 { + text-align: center; +} + +h1, h2, h3, h4, h5, h6 { + color: #fff; +} + +p { + text-align: justify; +} + +a { + cursor: pointer; +} + +.page-header { + margin-top: 12px; + margin-bottom: 12px; + text-align: center; +} + +.page-intro { + text-align: center; + font-style: italic; +}