feat: add Blazor to project

fix: fix rare assertion error
feat: add support for maintaining indentation on newline
2024-02-27 19:49:42 +00:00 · 2024-02-27 19:00:10 +00:00 · 2024-02-27 16:08:55 +00:00 · 2024-02-27 14:53:32 +00:00 · 2024-02-27 14:49:29 +00:00 · 2024-02-27 13:42:09 +00:00
15 changed files with 774 additions and 724 deletions
--- a/Gulpfile.js
+++ b/Gulpfile.js
@ -1,4 +1,5 @@
 const gulp = require("gulp");
+const fs = require("fs");
 const sass = require('gulp-sass')(require("sass"));
 const cleanCSS = require("gulp-clean-css");
 const rename = require("gulp-rename");
@ -26,11 +27,17 @@ function compileTS() {
        .pipe(gulp.dest(`tmp/js`));
 }

-function bundleJS() {
-    return gulp.src(["tmp/js/*.js", "tmp/js/app/app.js", "tmp/js/admin/admin.js"])
-        .pipe(named())
-        .pipe(webpack({ mode: "production", output: { filename: "[name].min.js" } }))
-        .pipe(gulp.dest(`${destDir}/js`));
+function bundleJS(done) {
+    const tasks = fs.readdirSync("tmp/js", {withFileTypes: true})
+        .filter(dirent => dirent.isDirectory())
+        .map(d => bundleDir(d.name));
+    return gulp.parallel(...tasks)(done);
+
+    function bundleDir(directory) {
+        return () => gulp.src(`tmp/js/${directory}/${directory}.js`)
+            .pipe(webpack({mode: "production", output: {filename: `${directory}.min.js`}}))
+            .pipe(gulp.dest(`${destDir}/js`));
+    }
 }

 function copyJS() {
--- a/OliverBooth/Dockerfile
+++ b/OliverBooth/Dockerfile
@ -15,11 +15,9 @@ FROM mcr.microsoft.com/dotnet/sdk:8.0 AS build
 COPY --from=build-deps /src/OliverBooth/wwwroot /src/OliverBooth/wwwroot
 WORKDIR /src
 COPY ["OliverBooth/OliverBooth.csproj", "OliverBooth/"]
-RUN dotnet restore "OliverBooth/OliverBooth.csproj"
 COPY . .

 WORKDIR "/src/OliverBooth"
-RUN dotnet build "OliverBooth.csproj" -c Release -o /app/build

 FROM build AS publish
 RUN dotnet publish "OliverBooth.csproj" -c Release -o /app/publish /p:UseAppHost=false
--- a/OliverBooth/OliverBooth.csproj
+++ b/OliverBooth/OliverBooth.csproj
@ -10,25 +10,25 @@
    <ItemGroup>
        <PackageReference Include="Alexinea.Extensions.Configuration.Toml" Version="7.0.0"/>
        <PackageReference Include="Asp.Versioning.Mvc" Version="8.0.0"/>
-        <PackageReference Include="AspNetCore.ReCaptcha" Version="1.7.0"/>
+        <PackageReference Include="AspNetCore.ReCaptcha" Version="1.8.1"/>
        <PackageReference Include="BCrypt.Net-Core" Version="1.6.0"/>
        <PackageReference Include="HtmlAgilityPack" Version="1.11.59"/>
        <PackageReference Include="Humanizer.Core" Version="2.14.1"/>
        <PackageReference Include="MailKit" Version="4.3.0"/>
-        <PackageReference Include="MailKitSimplified.Sender" Version="2.8.0"/>
-        <PackageReference Include="Markdig" Version="0.34.0"/>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="8.0.0"/>
-        <PackageReference Include="Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation" Version="8.0.0"/>
-        <PackageReference Include="Microsoft.Extensions.FileProviders.Embedded" Version="8.0.0"/>
+        <PackageReference Include="MailKitSimplified.Sender" Version="2.9.0"/>
+        <PackageReference Include="Markdig" Version="0.35.0"/>
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="8.0.2"/>
+        <PackageReference Include="Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation" Version="8.0.2"/>
+        <PackageReference Include="Microsoft.Extensions.FileProviders.Embedded" Version="8.0.2"/>
        <PackageReference Include="NetBarcode" Version="1.7.0"/>
        <PackageReference Include="Otp.NET" Version="1.3.0"/>
-        <PackageReference Include="Pomelo.EntityFrameworkCore.MySql" Version="7.0.0"/>
+        <PackageReference Include="Pomelo.EntityFrameworkCore.MySql" Version="8.0.0"/>
        <PackageReference Include="Serilog" Version="3.1.1"/>
-        <PackageReference Include="Serilog.AspNetCore" Version="8.0.0"/>
+        <PackageReference Include="Serilog.AspNetCore" Version="8.0.1"/>
        <PackageReference Include="Serilog.Extensions.Logging" Version="8.0.0"/>
        <PackageReference Include="Serilog.Sinks.Console" Version="5.0.1"/>
        <PackageReference Include="Serilog.Sinks.File" Version="5.0.0"/>
-        <PackageReference Include="SmartFormat.NET" Version="3.3.0"/>
+        <PackageReference Include="SmartFormat.NET" Version="3.3.2"/>
        <PackageReference Include="X10D" Version="3.3.1"/>
        <PackageReference Include="X10D.Hosting" Version="3.3.1"/>
        <PackageReference Include="ZString" Version="2.5.1"/>
--- a/OliverBooth/Pages/Admin/EditBlogPost.cshtml
+++ b/OliverBooth/Pages/Admin/EditBlogPost.cshtml
@ -31,7 +31,7 @@

    <div class="d-flex flex-row flex-fill">
        <div class="flex-fill mb-0 highlighting-container" style="border-right: 2px dashed #FFFFFF;">
-            <textarea id="content" spellcheck="false">@post.Body</textarea>
+            <textarea id="content" class="tab-support" spellcheck="false">@post.Body</textarea>
            <pre id="highlighting" aria-hidden="true"><code id="highlighting-content" class="language-markdown">@post.Body</code></pre>
        </div>
        <div class="flex-fill mb-0" style="overflow-y: scroll; background: #1E1E1E; max-height: calc(100vh - 35px)">
--- a/OliverBooth/Pages/Index.cshtml
+++ b/OliverBooth/Pages/Index.cshtml
@ -1,12 +1,17 @@
@page

 <main class="container">
-    <h1 class="display-4">Hi, I'm Oliver.</h1>
-    <p class="lead">I'm a tech enthusiast, coffee drinker, and software developer.</p>
-
-    <p class="text-center">
-        <img src="~/img/headshot_512x512_2023.jpg" style="width: 512px; max-width: 100%;">
-    </p>
+    <div class="row align-items-center mb-3">
+        <div id="landing-page-intro" class="col-sm-12 col-md-6">
+            <h1 class="display-4">Hi, I'm Oliver.</h1>
+            <p class="lead">
+                Coffee enthusiast with a love for all things tech. Tech enthusiast with a love for all things coffee.
+            </p>
+        </div>
+        <div id="landing-page-headshot" class="col-sm-12 col-md-6 justify-content-right">
+            <img src="~/img/headshot_512x512_2023.jpg" class="rounded-circle" style="width: 50%; max-width: 512px;" alt="Headshot">
+        </div>
+    </div>

    <p>
        My primary focus is C#, though I have dabbled in several other languages such as Java, Kotlin, VB, C/C++,
--- a/OliverBooth/Pages/Shared/_AdminLayout.cshtml
+++ b/OliverBooth/Pages/Shared/_AdminLayout.cshtml
@ -1,4 +1,3 @@
-@using System.Diagnostics
@using OliverBooth.Data.Blog
@using OliverBooth.Data.Web
@using OliverBooth.Services
@ -17,7 +16,6 @@
    {
        UserService.TryGetUser(session.UserId, out user);
    }
-    Debug.Assert(user is not null);
 }
 <!DOCTYPE html>
 <html lang="en" data-bs-theme="dark">
@ -75,6 +73,7 @@
    <link rel="stylesheet" href="~/css/ribbon.min.css" asp-append-version="true">
    <link rel="stylesheet" href="~/css/admin.min.css" asp-append-version="true">
    @await RenderSectionAsync("Styles", required: false)
+    <base href="~/">
 </head>
 <body>
 <main class="d-flex flex-nowrap">
@ -98,7 +97,7 @@
                    <i class="fa-solid fa-newspaper fa-fw"></i> Blog Posts
                </a>
            </li>
-            @if (user.HasPermission("projects:read"))
+            @if (user?.HasPermission("projects:read") != true)
            {
                <li>
                    <a asp-page="Projects" class="nav-link @(currentPage == "/Admin/Projects" ? "active" : "text-white")" aria-current="page">
@ -106,7 +105,7 @@
                    </a>
                </li>
            }
-            @if (user.HasPermission("users:read"))
+            @if (user?.HasPermission("users:read") != true)
            {
                <li>
                    <a asp-page="Users" class="nav-link @(currentPage == "/Admin/Users" ? "active" : "text-white")" aria-current="page">
@ -118,8 +117,8 @@
        <hr>
        <div class="dropdown">
            <a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
-                <img src="@user.AvatarUrl" alt="" width="32" height="32" class="rounded-circle me-2">
-                <strong>@user.DisplayName</strong>
+                <img src="@user?.AvatarUrl" alt="" width="32" height="32" class="rounded-circle me-2">
+                <strong>@user?.DisplayName</strong>
            </a>
            <ul class="dropdown-menu dropdown-menu-dark text-small shadow">
                <li><a class="dropdown-item" href="#">New project...</a></li>
@ -146,6 +145,7 @@
 <script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.16.8/katex.min.js" integrity="sha512-aoZChv+8imY/U1O7KIHXvO87EOzCuKO0GhFtpD6G2Cyjo/xPeTgdf3/bchB10iB+AojMTDkMHDPLKNxPJVqDcw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/js/all.min.js" integrity="sha512-uKQ39gEGiyUJl4AI6L+ekBdGKpGw4xJ55+xyJG7YFlJokPNYegn9KwQ3P8A7aFQAUtUsAQHep+d/lrGqrbPIDQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.8/handlebars.min.js" integrity="sha512-E1dSFxg+wsfJ4HKjutk/WaCzK7S2wv1POn1RRPGh8ZK+ag9l244Vqxji3r6wgz9YBf6+vhQEYJZpSjqWFPg9gg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src="~/_framework/blazor.server.js"></script>
 <script src="~/js/prism.min.js" asp-append-version="true" data-manual></script>
 <script src="~/js/app.min.js" asp-append-version="true"></script>
 <script src="~/js/admin.min.js" asp-append-version="true"></script>
--- a/OliverBooth/Pages/Shared/_Layout.cshtml
+++ b/OliverBooth/Pages/Shared/_Layout.cshtml
@ -60,11 +60,13 @@
    <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@100;400;700&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;700&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Gabarito:wght@400;500;600;700;800;900&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="~/css/prism.min.css" asp-append-version="true">
    <link rel="stylesheet" href="~/css/prism.vs.min.css" asp-append-version="true">
    <link rel="stylesheet" href="~/css/app.min.css" asp-append-version="true">
    <link rel="stylesheet" href="~/css/ribbon.min.css" asp-append-version="true">
    @await RenderSectionAsync("Styles", required: false)
+    <base href="~/">
 </head>
 <body>
 <header class="container" style="margin-top: 20px;">
@ -150,6 +152,7 @@
 <script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.16.8/katex.min.js" integrity="sha512-aoZChv+8imY/U1O7KIHXvO87EOzCuKO0GhFtpD6G2Cyjo/xPeTgdf3/bchB10iB+AojMTDkMHDPLKNxPJVqDcw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/js/all.min.js" integrity="sha512-uKQ39gEGiyUJl4AI6L+ekBdGKpGw4xJ55+xyJG7YFlJokPNYegn9KwQ3P8A7aFQAUtUsAQHep+d/lrGqrbPIDQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.8/handlebars.min.js" integrity="sha512-E1dSFxg+wsfJ4HKjutk/WaCzK7S2wv1POn1RRPGh8ZK+ag9l244Vqxji3r6wgz9YBf6+vhQEYJZpSjqWFPg9gg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src="~/_framework/blazor.server.js"></script>
 <script src="~/js/prism.min.js" asp-append-version="true" data-manual></script>
 <script src="~/js/app.min.js" asp-append-version="true"></script>

--- a/OliverBooth/Pages/_Imports.razor
+++ b/OliverBooth/Pages/_Imports.razor
@ -0,0 +1,5 @@
+@using System.Net.Http
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.JSInterop
+@using Microsoft.AspNetCore.Components.Web
--- a/OliverBooth/Program.cs
+++ b/OliverBooth/Program.cs
@ -53,6 +53,7 @@ builder.Services.AddHostedSingleton<IUserService, UserService>();
 builder.Services.AddHostedSingleton<ISessionService, SessionService>();
 builder.Services.AddRazorPages().AddRazorRuntimeCompilation();
 builder.Services.AddControllersWithViews();
+builder.Services.AddServerSideBlazor().AddInteractiveServerComponents();
 builder.Services.AddRouting(options => options.LowercaseUrls = true);
 builder.Services.AddReCaptcha(builder.Configuration.GetSection("ReCaptcha"));

@ -78,5 +79,6 @@ app.UseAuthorization();

 app.MapControllers();
 app.MapRazorPages();
+app.MapBlazorHub();

 app.Run();
--- a/package-lock.json
+++ b/package-lock.json
--- a/src/scss/admin.scss
+++ b/src/scss/admin.scss
@ -127,3 +127,7 @@ textarea {
    display: none;
  }
 }
+
+table.table tr:hover td {
+  background-color: rgba(#03A9F4, 10%);
+}
--- a/src/scss/app.scss
+++ b/src/scss/app.scss
@ -367,6 +367,7 @@ td.trim-p p:last-child {
  background-size: cover;
  border-radius: 10px;
  cursor: pointer;
+
  * {
    cursor: pointer;
  }
@ -384,6 +385,7 @@ td.trim-p p:last-child {
    &:first-child {
      border-left: none;
    }
+
    &:last-child {
      border-right: none;
    }
@ -392,7 +394,7 @@ td.trim-p p:last-child {

 .post-tags a.badge {
  transition: color 250ms, background-color 250ms;
-  
+
  &:link, &:visited, &:active {
    background-color: #2D2D2D !important;
    color: #fff;
@ -407,12 +409,50 @@ td.trim-p p:last-child {
 .mastodon-update-card.card {
  background-color: desaturate(darken(#6364FF, 50%), 50%);
  margin-bottom: 50px;
-  
+
  p:last-child {
    margin-bottom: 0;
  }
-  
+
  button.btn.btn-mastodon {
    background-color: #6364FF;
  }
+}
+
+#landing-page-intro {
+  text-align: left;
+  
+  h1.display-4 {
+    font-family: "Titillium Web", sans-serif;
+    font-weight: 600;
+    font-style: normal;
+  }
+  
+  p.lead {
+    font-family: "Titillium Web", sans-serif;
+    font-weight: 400;
+    font-style: normal;
+  }
+}
+
+#landing-page-headshot {
+  text-align: right;
+
+  img {
+    transition: border-radius .4s;
+
+    &:hover {
+      border-radius: 5px !important;
+    }
+  }
+}
+
+@media (max-width: 768px) {
+  #landing-page-intro {
+    text-align: center;
+  }
+
+  #landing-page-headshot {
+    text-align: center;
+  }
 }
--- a/src/ts/admin/AdminUI.ts
+++ b/src/ts/admin/AdminUI.ts
@ -0,0 +1,62 @@
+import adminUI from "./AdminUI";
+
+declare const Prism: any;
+class AdminUI {
+    static highlightingContent: HTMLElement;
+    static highlighting: HTMLElement;
+    static _content: HTMLTextAreaElement;
+    static _saveButton: HTMLButtonElement;
+    
+    static init() {
+        const content = AdminUI.content;
+        AdminUI.highlightingContent = document.getElementById("highlighting-content");
+        AdminUI.highlighting = document.getElementById("highlighting");
+        content.addEventListener("input", () => AdminUI.updateEditView());
+        content.addEventListener("scroll", () => AdminUI.syncEditorScroll());
+    }
+
+    public static get content() {
+        if (!AdminUI._content) {
+            AdminUI._content = document.getElementById("content") as HTMLTextAreaElement;
+        }
+        
+        return AdminUI._content;
+    }
+
+    public static get saveButton() {
+        if (!AdminUI._saveButton) {
+            AdminUI._saveButton = document.getElementById("save-button") as HTMLButtonElement;
+        }
+
+        return AdminUI._saveButton;
+    }
+    
+    public static updateEditView() {
+        AdminUI.highlightingContent.innerHTML = Prism.highlight(AdminUI.content.value, Prism.languages.markdown);
+
+        document.querySelectorAll("#highlighting-content span.token.code").forEach(el => {
+            const languageSpan = el.querySelector(".code-language") as HTMLSpanElement;
+            if (!languageSpan) {
+                return;
+            }
+
+            const language = languageSpan.innerText;
+            const span = el.querySelector(".code-block");
+            if (!span) {
+                return;
+            }
+
+            span.outerHTML = `<code class="${span.className} language-${language}" style="padding:0;">${span.innerHTML}</code>`;
+            Prism.highlightAllUnder(languageSpan.parentElement);
+        });
+
+        AdminUI.syncEditorScroll();
+    }
+
+    static syncEditorScroll() {
+        AdminUI.highlighting.scrollTop = AdminUI._content.scrollTop;
+        AdminUI.highlighting.scrollLeft = AdminUI._content.scrollLeft;
+    }
+}
+
+export default AdminUI;
--- a/src/ts/admin/EditBlogPost.ts
+++ b/src/ts/admin/EditBlogPost.ts
@ -1,8 +1,8 @@
 import BlogPost from "../app/BlogPost";
 import API from "../app/API";
 import UI from "../app/UI";
-
-declare const Prism: any;
+import AdminUI from "./AdminUI";
+import "./TabSupport"

 (() => {
    getCurrentBlogPost().then(post => {
@ -10,14 +10,12 @@ declare const Prism: any;
            return;
        }

-        const saveButton = document.getElementById("save-button") as HTMLButtonElement;
-        const preview = document.getElementById("article-preview") as HTMLAnchorElement;
-        const content = document.getElementById("content") as HTMLTextAreaElement;
-        const title = document.getElementById("post-title") as HTMLInputElement;
-        const highlighting = document.getElementById("highlighting");
-        const highlightingContent = document.getElementById("highlighting-content");
+        AdminUI.init();

-        saveButton.addEventListener("click", async (e: MouseEvent) => {
+        const preview = document.getElementById("article-preview") as HTMLAnchorElement;
+        const title = document.getElementById("post-title") as HTMLInputElement;
+
+        AdminUI.saveButton.addEventListener("click", async (e: MouseEvent) => {
            await savePost();
        });

@ -31,28 +29,15 @@ declare const Prism: any;
            }
        });

-        content.addEventListener("keydown", async (e: KeyboardEvent) => {
-            if (e.key === "Tab") {
-                e.preventDefault();
-
-                const start = content.selectionStart;
-                const end = content.selectionEnd;
-                const text = content.value;
-                content.value = `${text.slice(0, start)}    ${text.slice(start, end)}`;
-                updateEditView();
-                content.selectionStart = start + 4;
-                content.selectionEnd = end ? end + 4 : start + 4;
-            }
-        });
-
        async function savePost(): Promise<void> {
+            const saveButton = AdminUI.saveButton;
            saveButton.classList.add("btn-primary");
            saveButton.classList.remove("btn-success");

            saveButton.setAttribute("disabled", "disabled");
            saveButton.innerHTML = '<i class="fa-solid fa-spinner fa-spin fa-fw"></i> Saving ...';

-            post = await API.updatePost(post, {content: content.value, title: title.value});
+            post = await API.updatePost(post, {content: AdminUI.content.value, title: title.value});

            saveButton.classList.add("btn-success");
            saveButton.classList.remove("btn-primary");
@ -66,33 +51,7 @@ declare const Prism: any;
            }, 2000);
        }

-        updateEditView();
-        content.addEventListener("input", () => updateEditView());
-        content.addEventListener("scroll", () => syncEditorScroll());
-        function updateEditView() {
-            highlightingContent.innerHTML = Prism.highlight(content.value, Prism.languages.markdown);
-            document.querySelectorAll("#highlighting-content span.token.code").forEach(el => {
-                const languageSpan = el.querySelector(".code-language") as HTMLSpanElement;
-                if (!languageSpan) {
-                    return;
-                }
-
-                const language = languageSpan.innerText;
-                const span = el.querySelector(".code-block");
-                if (!span) {
-                    return;
-                }
-
-                span.outerHTML = `<code class="${span.className} language-${language}" style="padding:0;">${span.innerHTML}</code>`;
-                Prism.highlightAllUnder(highlightingContent);
-            });
-            syncEditorScroll();
-        }
-        
-        function syncEditorScroll() {
-            highlighting.scrollTop = content.scrollTop;
-            highlighting.scrollLeft = content.scrollLeft;
-        }
+        AdminUI.updateEditView();
    });

    async function getCurrentBlogPost(): Promise<BlogPost> {
--- a/src/ts/admin/TabSupport.ts
+++ b/src/ts/admin/TabSupport.ts
@ -0,0 +1,112 @@
+import AdminUI from "./AdminUI";
+import adminUI from "./AdminUI";
+
+(() => {
+    const textareas = document.querySelectorAll("textarea.tab-support");
+    textareas.forEach((textarea: HTMLTextAreaElement) => {
+        textarea.addEventListener("keydown", (e: KeyboardEvent) => {
+            let text: string;
+
+            // Enter Key?
+            if (e.key === "Enter") {
+                const selStart = textarea.selectionStart;
+                const selEnd = textarea.selectionEnd;
+                let sel = selStart;
+                // selection?
+                if (sel == selEnd) {
+                    // find start of the current line
+                    let text = textarea.value;
+                    while (sel > 0 && text[sel - 1] !== '\n')
+                        sel--;
+
+                    console.log(`Line starts at index ${sel}`);
+
+                    const lineStart = sel;
+                    while (text[sel] === ' ' || text[sel] === '\t')
+                        sel++;
+
+                    console.log(`Identation ends at ${sel} (sel + ${sel - lineStart})`);
+
+                    if (sel > lineStart) {
+                        const lineEnd = lineStart + text.indexOf('\n', lineStart);
+                        console.log(`Line starts at index ${lineEnd}`);
+                        e.preventDefault();
+
+                        const indentStr = text.slice(lineStart, sel);
+                        console.log(`Indent string is "${indentStr}"`);
+
+                        // insert carriage return and indented text
+                        textarea.value = `${text.slice(0, selStart)}\n${indentStr}${text.slice(selStart)}`;
+
+                        // Scroll caret visible
+                        textarea.blur();
+                        textarea.focus();
+                        textarea.selectionEnd = selEnd + indentStr.length + 1; // +1 for \n
+                        AdminUI.updateEditView();
+                        return false;
+                    }
+                }
+            }
+
+            // Tab key?
+            if (e.key === "Tab") {
+                e.preventDefault();
+                let selStart = textarea.selectionStart;
+
+                // selection?
+                if (selStart == textarea.selectionEnd) {
+                    // These single character operations are undoable
+                    if (e.shiftKey) {
+                        text = textarea.value;
+                        if (selStart > 0 && (text[selStart - 1] === '\t' || text.slice(selStart - 4, selStart) === "    ")) {
+                            document.execCommand("delete");
+                        }
+                    } else {
+                        document.execCommand("insertText", false, "    ");
+                    }
+                } else {
+                    // Block indent/unindent trashes undo stack.
+                    // Select whole lines
+                    let selEnd = textarea.selectionEnd;
+                    text = textarea.value;
+                    while (selStart > 0 && text[selStart - 1] !== '\n')
+                        selStart--;
+                    while (selEnd > 0 && text[selEnd - 1] !== '\n' && selEnd < text.length)
+                        selEnd++;
+
+                    // Get selected text
+                    let lines = text.slice(selStart, selEnd - selStart).split('\n');
+
+                    // Insert tabs
+                    for (let i = 0; i < lines.length; i++) {
+                        // Don't indent last line if cursor at start of line
+                        if (i == lines.length - 1 && lines[i].length == 0)
+                            continue;
+
+                        // Tab or Shift+Tab?
+                        if (e.shiftKey) {
+                            if (lines[i].startsWith('\t'))
+                                lines[i] = lines[i].slice(1);
+                            else if (lines[i].startsWith("    "))
+                                lines[i] = lines[i].slice(4);
+                        } else {
+                            lines[i] = `    ${lines[i]}`;
+                        }
+                    }
+
+                    const result = lines.join('\n');
+
+                    // Update the text area
+                    textarea.value = text.slice(0, selStart) + result + text.slice(selEnd);
+                    textarea.selectionStart = selStart;
+                    textarea.selectionEnd = selStart + lines.length;
+                }
+
+                AdminUI.updateEditView();
+                return false;
+            }
+
+            return true;
+        });
+    });
+})();
Author	SHA1	Message	Date
Oliver Booth	db097acc3c	feat: add Blazor to project	2024-02-27 19:49:42 +00:00
Oliver Booth	fa87d808dc	fix: fix rare assertion error	2024-02-27 19:00:10 +00:00
Oliver Booth	71b1ff32c4	feat: add support for maintaining indentation on newline	2024-02-27 16:08:55 +00:00
Oliver Booth	5b236da2e3	style: add visual feedback for table hovering	2024-02-27 14:53:32 +00:00
Oliver Booth	8f09197de6	build: support nested directories for js bundling	2024-02-27 14:49:29 +00:00
Oliver Booth	8925f07f31	Merge branch 'main' into feature/admin	2024-02-27 13:42:09 +00:00
Oliver Booth	521d202824	build: skip dotnet restore and dotnet build These steps are executed as part of dotnet publish	2024-02-27 13:39:11 +00:00
Oliver Booth	b9de8205f6	chore: update dependencies .NET project: * AspNetCore.ReCaptcha 1.8.1 * MailKitSimplified.Sender 2.9.0 * Markdig 0.35.0 * Microsoft.AspNetCore.Components.Web 8.0.2 * Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation 8.0.2 * Microsoft.Extensions.FileProviders.Embedded 8.0.2 * Pomelo.EntityFrameworkCore.MySql 8.0.0 * Serilog.AspNetCore 8.0.1 * SmartFormat.NET 3.3.2 npm project: No front-facing dependencies updated; however some child packages were updated in the process of npm update.	2024-02-27 13:27:28 +00:00
Oliver Booth	783265e6d0	style: reword tagline to match what it really is	2024-02-27 13:11:05 +00:00
Oliver Booth	e7e4491002	style: use Titillium Web for index intro	2024-02-27 13:08:36 +00:00
Oliver Booth	f1f711fa1f	style: reduce in-your-face-ness of headshot photo	2024-02-27 13:01:10 +00:00