diff options
| -rw-r--r-- | misc/render_template.php | 48 | ||||
| -rw-r--r-- | routes/global_timeline.php | 22 | ||||
| -rw-r--r-- | routes/static.php | 19 | ||||
| -rw-r--r-- | static/style.css | 53 | ||||
| -rw-r--r-- | templates/global_timeline.php | 6 | ||||
| -rw-r--r-- | templates/note.php | 11 | ||||
| -rw-r--r-- | templates/skeleton.php | 22 |
7 files changed, 160 insertions, 21 deletions
diff --git a/misc/render_template.php b/misc/render_template.php new file mode 100644 index 0000000..1ee349d --- /dev/null +++ b/misc/render_template.php @@ -0,0 +1,48 @@ +<?php + +/* +here is a horrible example of php jank. +TODO: anything better than this +i'm terribly sorry for future me / anyone else who has to deal with this +*/ + +$__spooky_magical_template_global_state = []; + +function render_template(string $templateName, array $args = []) { + global $__spooky_magical_template_global_state; + $__spooky_magical_template_global_state['slotParentArgs'] = $__spooky_magical_template_global_state['slotArgs'] ?? null; + $__spooky_magical_template_global_state['slotArgs'] = $args; + foreach ($args as $key => $value) { + ${$key} = $value; + } + + if (!function_exists('slot')) { + function slot() { + global $__spooky_magical_template_global_state; + if (isset($__spooky_magical_template_global_state['slotParentArgs'])) { + $parentArgs = $__spooky_magical_template_global_state['slotParentArgs']; + foreach ($parentArgs as $key => $value) { + global ${$key}; + ${$key} = $value; + } + } + ($__spooky_magical_template_global_state['slotContent'] ?? function () {})(); + if (isset($parentArgs)) { + foreach ($parentArgs as $key => $value) { + unset(${$key}); + } + } + } + function call_template(string $templateName, array $args = [], callable $slotContent = null) { + global $__spooky_magical_template_global_state; + $__spooky_magical_template_global_state['slotContent'] = $slotContent; + render_template($templateName, $args); + } + } + + require __DIR__ . '/../templates/' . $templateName . '.php'; + + foreach ($args as $key => $value) { + unset(${$key}); + } +}
\ No newline at end of file diff --git a/routes/global_timeline.php b/routes/global_timeline.php index c32419c..654d2c7 100644 --- a/routes/global_timeline.php +++ b/routes/global_timeline.php @@ -5,25 +5,5 @@ use Digitigrade\Timeline\GlobalTimeline; Router::getInstance()->mount('/feed/global', function (array $args) { $notes = (new GlobalTimeline())->getNotes(); - ?> - <!DOCTYPE html> - <html lang="en"> - - <head> - <title>digitigrade global timeline</title> - </head> - - <body> - <h1>Global timeline</h1> - <?php foreach ($notes as $n): ?> - <div style="margin: 8px; padding: 8px; border: 1px solid"> - <b><?= $n->author->displayName ?></b> <small><?= $n->author->uri ?></small><br> - <p><?= $n->plainContent ?></p> - <small><?= $n->created->format('c') ?></small> - </div> - <?php endforeach; ?> - </body> - - </html> - <?php + render_template('global_timeline', ['notes' => $notes]); });
\ No newline at end of file diff --git a/routes/static.php b/routes/static.php new file mode 100644 index 0000000..2850d8f --- /dev/null +++ b/routes/static.php @@ -0,0 +1,19 @@ +<?php + +use Digitigrade\HttpResponseStatus\NotFound; +use Digitigrade\Router; + +Router::getInstance()->mount('/static/:path', function (array $args) { + // TODO: support nested paths (needs changes in router i think) + $realPath = __DIR__ . '/../static/' . $args['path']; + if (!is_file($realPath)) { + throw new NotFound('static resource ' . $args['path'] . ' does not exist'); + } + $fileExtension = explode('.', basename($realPath)); + $fileExtension = $fileExtension[count($fileExtension) - 1]; + header('Content-Type: ' . match ($fileExtension) { + 'css' => 'text/css', + default => mime_content_type($realPath) + }); + echo file_get_contents($realPath); +});
\ No newline at end of file diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..3ea07c0 --- /dev/null +++ b/static/style.css @@ -0,0 +1,53 @@ +html, +body { + background: white; + color: black; + margin: 0; + padding: 0; + font-family: sans-serif; + display: flex; + flex-direction: column; + align-items: center; +} + +header { + background: #3b005e; + color: white; + padding: 16px; + margin-bottom: 8px; + display: flex; + width: 100vw; + box-sizing: border-box; + + *:not(:last-child) { + margin-right: 8px; + } +} + +#siteTitle { + font-weight: bold; +} + +main { + width: min(800px, 100vw); +} + +article.note { + background: #eee; + color: black; + border-radius: 16px; + margin: 16px; + padding: 16px; + display: grid; + grid-template-columns: max-content 1fr; + gap: 8px; + + img.authorAvatar { + width: 64px; + aspect-ratio: 1; + } + + .authorName { + font-weight: bold; + } +} diff --git a/templates/global_timeline.php b/templates/global_timeline.php new file mode 100644 index 0000000..dbecd7b --- /dev/null +++ b/templates/global_timeline.php @@ -0,0 +1,6 @@ +<?php call_template('skeleton', ['pageTitle' => 'Global timeline'], function () { + global $notes; + foreach ($notes as $n) { + call_template('note', ['note' => $n]); + } +});
\ No newline at end of file diff --git a/templates/note.php b/templates/note.php new file mode 100644 index 0000000..c3ec9fd --- /dev/null +++ b/templates/note.php @@ -0,0 +1,11 @@ +<article class="note"> + <img class="authorAvatar" src="<?= $note->author->avatar ?>"> + <div> + <a class="authorName" <?= isset($note->author->homepage) ? 'href="' . $note->author->homepage . '"' : '' ?>> + <?= $note->author->displayName ?> + </a> + <div class="postContent"> + <?= $note->plainContent ?> + </div> + </div> +</article>
\ No newline at end of file diff --git a/templates/skeleton.php b/templates/skeleton.php new file mode 100644 index 0000000..d1e08e0 --- /dev/null +++ b/templates/skeleton.php @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <title><?= $pageTitle ?></title> + <link rel="stylesheet" href="/static/style.css"> +</head> + +<body> + <header> + <span id="siteTitle">Digitigrade???????</span> + <nav> + <span>navigation links go here i suppose?</span> + </nav> + </header> + <main> + <h1><?= $pageTitle ?></h1> + <?php slot(); ?> + </main> +</body> + +</html>
\ No newline at end of file |