diff options
Diffstat (limited to 'Pages')
| -rw-r--r-- | Pages/Shared/_Layout.cshtml | 2 | ||||
| -rw-r--r-- | Pages/TagDefinitions.cshtml | 104 | ||||
| -rw-r--r-- | Pages/TagDefinitions.cshtml.cs | 16 | ||||
| -rw-r--r-- | Pages/TagDefinitions.cshtml.css | 16 | ||||
| -rw-r--r-- | Pages/ViewMedia.cshtml | 21 |
5 files changed, 155 insertions, 4 deletions
diff --git a/Pages/Shared/_Layout.cshtml b/Pages/Shared/_Layout.cshtml index be445cc..9cdb952 100644 --- a/Pages/Shared/_Layout.cshtml +++ b/Pages/Shared/_Layout.cshtml @@ -16,7 +16,7 @@ <body> <div id="navbar"> <a href="/">Home</a> - <a href="/tags">Tags</a> + <a href="/TagDefinitions">Tags</a> </div> <div id="content" style="overflow:@(ViewBag.ContentScroll ? "auto" : "hidden");margin:@(ViewBag.ContentMargin ?? "0");"> @RenderBody() diff --git a/Pages/TagDefinitions.cshtml b/Pages/TagDefinitions.cshtml new file mode 100644 index 0000000..a05f5d5 --- /dev/null +++ b/Pages/TagDefinitions.cshtml @@ -0,0 +1,104 @@ +@page +@model HyperBooru.Pages.TagDefinitionsModel +@{ + ViewBag.Title = "Tag Definitions"; +} + +<script type="text/javascript"> + async function createDefinition(e) { + var form = new FormData(); + + form.append('name', e.querySelector('#name').value); + form.append('namespace', e.querySelector('#namespace').value); + + var resp = await fetch('/api/tag/def', { + method: 'post', + body: form + }); + + if(!resp.ok) { + alert('Error creating tag definition!'); + showCreateDialog(false); + } else { + window.location.reload(); + } + } + + async function deleteTagDefinition() { + var dialog = document.getElementById('delete-dialog'); + + var resp = await fetch(`/api/tag/def/${dialog.dataset.guid}`, { + method: 'delete' + }); + + if(!resp.ok) { + alert('Error deleting tag definition!'); + showDeleteDialog(false); + } else { + window.location.reload() + } + } + + function showCreateDialog(visible) { + document.getElementById('create-dialog').classList.toggle('visible', visible); + } + + function showDeleteDialog(visible) { + var dialog = document.getElementById('delete-dialog'); + if(visible == false) { + dialog.classList.toggle('visible', false); + } else { + dialog.classList.toggle('visible', true); + dialog.dataset.guid = visible; + } + } +</script> + +<link rel="stylesheet" type="text/css" href="@(nameof(HyperBooru)).styles.css"/> + +<table id="tag-definitions" class="data-table"> + <tr> + <th>Guid</th> + <th>Source</th> + <th>Namespace</th> + <th>Name</th> + <th></th> + </tr> + @foreach(var tagDef in Model.TagDefinitions) { + <tr> + <td>@tagDef.Guid</td> + <td>@tagDef.Source</td> + <td>@tagDef.Namespace</td> + <td>@tagDef.Name</td> + <td><button onclick="showDeleteDialog('@tagDef.Guid')">Delete</button></td> + </tr> + } +</table> + +<div class="button-container"> + <button onclick="showCreateDialog(true)">Create</button> +</div> + +<div id="create-dialog" class="dialog"> + <p>Create a new tag definition</p> + <hr/> + <form onsubmit="createDefinition(this)"> + <label>Name</label> + <input id="name" type="text" required/> + <label>Namespace</label> + <input id="namespace" type="text"/> + <div class="button-container"> + <button class="secondary" onclick="showCreateDialog(false)">Cancel</button> + <button type="submit">Create</button> + </div> + </form> +</div> + +<div id="delete-dialog" class="dialog"> + <p>Are you sure you want to delete this tag definition?</p> + <hr/> + <div class="button-container"> + <button onclick="showDeleteDialog(false)" class="secondary">Cancel</button> + <button onclick="deleteTagDefinition()">Confirm</button> + </div> +</div> diff --git a/Pages/TagDefinitions.cshtml.cs b/Pages/TagDefinitions.cshtml.cs new file mode 100644 index 0000000..e2253d6 --- /dev/null +++ b/Pages/TagDefinitions.cshtml.cs @@ -0,0 +1,16 @@ +using Microsoft.AspNetCore.Mvc; +using Microsoft.AspNetCore.Mvc.RazorPages; + +namespace HyperBooru.Pages; + +public class TagDefinitionsModel : PageModel { + public IEnumerable<DbTagDefinition> TagDefinitions => + db.TagDefinitions; + + private HyperBooruDbContext db; + + public TagDefinitionsModel(HyperBooruDbContext db) => + this.db = db; + + public void OnGet() {} +} diff --git a/Pages/TagDefinitions.cshtml.css b/Pages/TagDefinitions.cshtml.css new file mode 100644 index 0000000..0a9e226 --- /dev/null +++ b/Pages/TagDefinitions.cshtml.css @@ -0,0 +1,16 @@ +form > input { + width: 100%; +} + +div.button-container { + display: flex; + justify-content: flex-end; +} + +table#tag-definitions td:first-child { + font-family: 'Lucida Console'; +} + +table#tag-definitions td > button { + margin-top: 0; +}
\ No newline at end of file diff --git a/Pages/ViewMedia.cshtml b/Pages/ViewMedia.cshtml index 0f433df..3d0ce4a 100644 --- a/Pages/ViewMedia.cshtml +++ b/Pages/ViewMedia.cshtml @@ -17,6 +17,10 @@ } } + function showDeleteDialog(visible) { + document.getElementById('delete-dialog').classList.toggle('visible', visible); + } + function selectPane(tab) { var tabs = Array.from(document.querySelectorAll('div#metadata-header > a')); @@ -76,7 +80,7 @@ } </table> <div class="button-container"> - <button onclick="deleteMedia()">Delete</button> + <button onclick="showDeleteDialog(true)">Delete</button> </div> </div> <div id="metadata-tags"> @@ -85,7 +89,18 @@ <th>Tag Name</th> </tr> </table> - <button>Add Tag</button> + <div class="button-container"> + <button>Add Tag</button> + </div> </div> </div> -</div>
\ No newline at end of file +</div> + +<div id="delete-dialog" class="dialog"> + <p>Delete this media?</p> + <hr/> + <div class="button-container"> + <button class="secondary" onclick="showDeleteDialog(false)">Cancel</button> + <button onclick="deleteMedia()">Confirm</button> + </div> +</div> |