Oliver Booth
28c7f7ce78
This change significantly impacts the organisation and structure of the markdown editor, starting to utilise Blazor (SignalR) to perform operations such as saving, removing the need for an API controller. Much of the TypeScript source has been more coherently decoupled, for example UI vs business logic is now independent.
49 lines
1.9 KiB
Plaintext
49 lines
1.9 KiB
Plaintext
@page "/admin/blog-posts/edit/{id}"
|
|
@using Markdig
|
|
@using OliverBooth.Data.Blog
|
|
@model OliverBooth.Pages.Admin.EditBlogPost
|
|
@inject MarkdownPipeline MarkdownPipeline
|
|
|
|
@{
|
|
Layout = "Shared/_AdminLayout";
|
|
ViewData["Title"] = "Edit Post";
|
|
IBlogPost post = Model.BlogPost;
|
|
}
|
|
|
|
<component type="typeof(MarkdownEditor)" render-mode="Server"/>
|
|
|
|
<input type="hidden" data-blog-pid="@post.Id">
|
|
|
|
<div class="d-flex flex-column" style="height: calc(100vh - 35px)">
|
|
<div class="mb-3">
|
|
<button id="save-button" class="btn btn-primary"><i class="fa-solid fa-floppy-disk fa-fw"></i> Save <span class="text-muted">(Ctrl+S)</span></button>
|
|
<a href="/blog/@post.Published.ToString(@"yyyy\/MM\/dd")/@post.Slug" target="_blank" class="btn btn-info"><i class="fa-solid fa-magnifying-glass"></i> Preview</a>
|
|
</div>
|
|
|
|
<table class="table">
|
|
<tr>
|
|
<th>Post ID</th>
|
|
<td>
|
|
<input class="form-control" type="text" value="@post.Id" disabled="disabled">
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<th>Title</th>
|
|
<td>
|
|
<input class="form-control" id="post-title" type="text" value="@post.Title">
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<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" 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)">
|
|
<article id="article-preview" style="background: #333; max-width: 700px; margin: 20px auto; padding: 20px;">
|
|
@Html.Raw(Markdown.ToHtml(post.Body, MarkdownPipeline))
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</div> |