fix(blog): set post in ViewData for article

feat(prism): define hex/binary langs for better highlighting
feat: add post metadata for social embed support
2023-08-14 00:58:58 +01:00 · 2023-08-14 00:58:32 +01:00 · 2023-08-14 00:57:46 +01:00 · 2023-08-14 00:57:13 +01:00 · 2023-08-14 00:56:59 +01:00 · 2023-08-14 00:56:45 +01:00
6 changed files with 49 additions and 17 deletions
--- a/OliverBooth/Markdown/Template/TemplateInlineParser.cs
+++ b/OliverBooth/Markdown/Template/TemplateInlineParser.cs
@ -65,7 +65,6 @@ public sealed class TemplateInlineParser : InlineParser
            Params = paramsList.AsReadOnly()
        };

-        slice.End = slice.Start;
        slice.Start += template.Length + 4;
        return true;
    }
--- a/OliverBooth/Pages/Blog/Article.cshtml
+++ b/OliverBooth/Pages/Blog/Article.cshtml
@ -1,4 +1,4 @@
-@page "/{year:int}/{month:int}/{day:int}/{slug}"
+@page "/blog/{year:int}/{month:int}/{day:int}/{slug}"
@using Humanizer
@using OliverBooth.Data.Blog
@model Article
@ -9,6 +9,7 @@
 }

@{
+    ViewData["Post"] = post;
    ViewData["Title"] = post.Title;
    IBlogAuthor author = post.Author;
    DateTimeOffset published = post.Published;
--- a/OliverBooth/Pages/Blog/RawArticle.cshtml
+++ b/OliverBooth/Pages/Blog/RawArticle.cshtml
@ -1,2 +1,2 @@
-@page "/{year:int}/{month:int}/{day:int}/{slug}/raw"
+@page "/blog/{year:int}/{month:int}/{day:int}/{slug}/raw"
@model RawArticle
--- a/OliverBooth/Pages/Shared/_Layout.cshtml
+++ b/OliverBooth/Pages/Shared/_Layout.cshtml
@ -1,13 +1,17 @@
+@using OliverBooth.Data.Blog
+@using OliverBooth.Services
+@inject IBlogPostService BlogPostService
@{
-    string rootUrl = Environment.GetEnvironmentVariable("ROOT_URL") ?? "https://oliverbooth.dev";
-    string blogUrl = Environment.GetEnvironmentVariable("BLOG_URL") ?? "https://blog.oliverbooth.dev";
+    HttpRequest request = Context.Request;
+    var url = new Uri($"{request.Scheme}://{request.Host}{request.Path}{request.QueryString}");
 }
 <!DOCTYPE html>
 <html lang="en" data-bs-theme="dark">
 <head>
-    <meta charset="utf-8"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-    <meta name="color-scheme" content="dark"/>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="color-scheme" content="dark">
+    <meta name="theme-color" content="#121212">
    @if (ViewData["Title"] != null)
    {
        <title>@ViewData["Title"] - Oliver Booth</title>
@ -16,6 +20,20 @@
    {
        <title>Oliver Booth</title>
    }
+    @if (ViewData["Post"] is IBlogPost post)
+    {
+        string excerpt = BlogPostService.RenderExcerpt(post, out bool trimmed);
+        <meta name="title" content="@post.Title">
+        <meta name="description" content="@excerpt">
+        <meta property="og:title" content="@post.Title">
+        <meta property="og:description" content="@excerpt">
+        <meta property="og:type" content="article">
+        <meta property="og:url" content="@url">
+        <meta property="twitter:title" content="@post.Title">
+        <meta property="twitter:description" content="@excerpt">
+        <meta property="twitter:card" content="summary">
+        <meta property="twitter:url" content="@url">
+    }
    <link rel="shortcut icon" href="/img/favicon.png" asp-append-version="true">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.1/css/bootstrap.min.css" integrity="sha512-Z/def5z5u2aR89OuzYcxmDJ0Bnd5V1cKqBEbvLOiUNWdg9PQeXVvXLI90SE4QOHGlfLqUnDNVAYyZi8UwUTmWQ==" crossorigin="anonymous" referrerpolicy="no-referrer">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.16.8/katex.min.css" integrity="sha512-7nTa5CnxbzfQgjQrNmHXB7bxGTUVO/DcYX6rpgt06MkzM0rVXP3EYCv/Ojxg5H0dKbY7llbbYaqgfZjnGOAWGA==" crossorigin="anonymous" referrerpolicy="no-referrer">
@ -40,22 +58,22 @@
 <nav>
    <ul class="site-nav">
        <li>
-            <a href="@rootUrl">About</a>
+            <a asp-page="/index">About</a>
        </li>
        <li>
-            <a href="@blogUrl">Blog</a>
+            <a asp-page="/blog/index">Blog</a>
        </li>
        <li>
-            <a href="@rootUrl/tutorials">Tutorials</a>
+            <a asp-page="/tutorials/index">Tutorials</a>
        </li>
        <li>
-            <a href="@rootUrl/projects">Projects</a>
+            <a asp-page="/projects/index">Projects</a>
        </li>
        <li>
-            <a href="@rootUrl/contact">Contact</a>
+            <a asp-page="/contact/index">Contact</a>
        </li>
        <li>
-            <a href="@rootUrl/donate">Donate</a>
+            <a asp-page="/donate">Donate</a>
        </li>
    </ul>
 </nav>
@ -72,11 +90,13 @@
    <div class="container text-center">
        &copy; @DateTime.UtcNow.Year
        &bullet;
-        <a href="@rootUrl/privacy/index">Privacy</a>
+        <a asp-page="/privacy/index">Privacy</a>
        &bullet;
        <a href="https://mastodon.olivr.me/@@oliver" rel="me">Mastodon</a>
        &bullet;
-        <a href="@blogUrl/feed"><i class="fa-solid fa-rss text-orange"></i></a>
+        <a asp-controller="Rss" asp-action="OnGet">
+            <i class="fa-solid fa-rss text-orange"></i>
+        </a>
    </div>
 </footer>

--- a/src/ts/UI.ts
+++ b/src/ts/UI.ts
@ -48,7 +48,7 @@ class UI {
            post: {
                title: post.title,
                excerpt: post.excerpt,
-                url: `${post.url.year}/${post.url.month}/${post.url.day}/${post.url.slug}`,
+                url: `/blog/${post.url.year}/${post.url.month}/${post.url.day}/${post.url.slug}`,
                date: TimeUtility.formatRelativeTimestamp(post.published),
                formattedDate: post.formattedDate,
                date_humanized: `${post.updated ? "Updated" : "Published"} ${post.humanizedTimestamp}`,
--- a/src/ts/app.ts
+++ b/src/ts/app.ts
@ -10,6 +10,18 @@ declare const Prism: any;

 (() => {
    Prism.languages.extend('markup', {});
+    Prism.languages.hex = {
+        'number': {
+            pattern: /(?:[a-f0-9]{3}){1,2}\b/i,
+            lookbehind: true
+        }
+    };
+    Prism.languages.binary = {
+        'number': {
+            pattern: /[10]+/i,
+            lookbehind: true
+        }
+    };
    Prism.languages.insertBefore('custom', 'tag', {
        'mark': {
            pattern: /<\/?mark(?:\s+\w+(?:=(?:"[^"]*"|'[^']*'|[^\s'">=]+))?\s*|\s*)\/?>/,
Author	SHA1	Message	Date
Oliver Booth	1cdad4c17c	fix(blog): set post in ViewData for article	2023-08-14 00:58:58 +01:00
Oliver Booth	b9e2597bc0	feat(prism): define hex/binary langs for better highlighting	2023-08-14 00:58:32 +01:00
Oliver Booth	e7cbe0330b	feat: add post metadata for social embed support	2023-08-14 00:57:46 +01:00
Oliver Booth	9ce4b844fe	style: format RSS link child	2023-08-14 00:57:13 +01:00
Oliver Booth	c3e64a6cde	style: add theme-color #121212	2023-08-14 00:56:59 +01:00
Oliver Booth	adf9e63008	style: remove self-closing /	2023-08-14 00:56:45 +01:00
Oliver Booth	fdea721f4f	fix: fix support for inline templates	2023-08-14 00:56:05 +01:00
Oliver Booth	eb2a63e136	fix(blog): use tag helpers to generate href	2023-08-13 18:12:42 +01:00
Oliver Booth	193b2486a1	refactor(blog): use /blog prefix for article endpoints	2023-08-13 18:12:13 +01:00