mirror of
https://github.com/JonasunderscoreJones/blog.jonasjones.dev.git
synced 2025-10-23 18:59:19 +02:00
added features to dashboard
This commit is contained in:
parent
50983fc0cd
commit
1b094fa7b5
3 changed files with 705 additions and 137 deletions
|
@ -1,5 +1,98 @@
|
|||
<script>
|
||||
async function handleSubmit(event) {
|
||||
import { onMount } from 'svelte';
|
||||
import { writable } from 'svelte/store';
|
||||
|
||||
const posts = writable([]);
|
||||
const selectedPost = writable({});
|
||||
|
||||
let postId = "";
|
||||
let title = "";
|
||||
let author = "";
|
||||
let date = "";
|
||||
let description = "";
|
||||
let content = "";
|
||||
let password = "";
|
||||
let now = false;
|
||||
|
||||
onMount(async () => {
|
||||
try {
|
||||
const response = await fetch('https://cdn.jonasjones.dev/blog/index.json');
|
||||
const data = await response.json();
|
||||
posts.set(data);
|
||||
} catch (error) {
|
||||
console.error('Error fetching posts:', error);
|
||||
}
|
||||
});
|
||||
|
||||
$: if (postId) {
|
||||
posts.subscribe(async posts => {
|
||||
const post = posts.find(p => p.id === postId);
|
||||
if (post) {
|
||||
selectedPost.set(post);
|
||||
title = post.title;
|
||||
author = post.author;
|
||||
date = new Date(post.date).toISOString().split('T')[0];
|
||||
description = post.description;
|
||||
content = await fetchPostContent(post);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
async function fetchPostContent(post) {
|
||||
const year = new Date(post.date).getFullYear();
|
||||
const month = String(new Date(post.date).getMonth() + 1).padStart(2, '0');
|
||||
const day = String(new Date(post.date).getDate()).padStart(2, '0');
|
||||
const contentUrl = `https://cdn.jonasjones.dev/blog/posts/${year}/${month}/${day}/${post.id}.md`;
|
||||
|
||||
try {
|
||||
const response = await fetch(contentUrl);
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok ' + response.statusText);
|
||||
}
|
||||
let content = await response.text();
|
||||
return await content.replace(/^\[.*?\]: .*$(?:\r?\n)?/gm, '');
|
||||
} catch (error) {
|
||||
console.error('Error fetching post content:', error);
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
async function handleSubmitUpdate(event) {
|
||||
event.preventDefault();
|
||||
|
||||
const formData = new URLSearchParams();
|
||||
formData.append('id', postId);
|
||||
formData.append('title', title);
|
||||
formData.append('author', author);
|
||||
formData.append('date', now ? new Date().toISOString().split('T')[0] : date);
|
||||
formData.append('description', description);
|
||||
formData.append('content', content);
|
||||
|
||||
try {
|
||||
const response = await fetch('https://rss.jonasjones.dev/blog/new_post', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'x-Custom-Auth-Key': password
|
||||
},
|
||||
body: formData
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok ' + response.statusText);
|
||||
}
|
||||
|
||||
const result = await response.json();
|
||||
console.log('Success:', result);
|
||||
alert('Post updated successfully!');
|
||||
} catch (error) {
|
||||
console.error('Error:', error);
|
||||
alert('Error updating post');
|
||||
}
|
||||
location.reload();
|
||||
}
|
||||
|
||||
|
||||
async function handleSubmitNew(event) {
|
||||
event.preventDefault();
|
||||
|
||||
const form = event.target;
|
||||
|
@ -35,13 +128,53 @@
|
|||
console.error('Error:', error);
|
||||
alert('Error submitting post');
|
||||
}
|
||||
location.reload();
|
||||
}
|
||||
|
||||
async function handleSubmitDelete(event) {
|
||||
event.preventDefault();
|
||||
|
||||
const formData = new URLSearchParams();
|
||||
formData.append('id', postId);
|
||||
|
||||
try {
|
||||
const response = await fetch('https://rss.jonasjones.dev/blog/delete_post', {
|
||||
method: 'DELETE',
|
||||
headers: {
|
||||
'x-Custom-Auth-Key': password
|
||||
},
|
||||
body: formData
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok ' + response.statusText);
|
||||
}
|
||||
|
||||
const result = await response.json();
|
||||
console.log('Success:', result);
|
||||
alert('Post deleted successfully!');
|
||||
// Reset form fields after deletion
|
||||
postId = "";
|
||||
title = "";
|
||||
author = "";
|
||||
date = "";
|
||||
description = "";
|
||||
content = "";
|
||||
password = "";
|
||||
now = false;
|
||||
posts.update(currentPosts => currentPosts.filter(post => post.id !== postId));
|
||||
} catch (error) {
|
||||
console.error('Error:', error);
|
||||
alert('Error deleting post');
|
||||
}
|
||||
location.reload();
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<h1>New Post</h1>
|
||||
|
||||
<form id="new-post-form" on:submit={handleSubmit}>
|
||||
<form id="new-post-form" on:submit={handleSubmitNew}>
|
||||
<label for="id">ID:</label>
|
||||
<input type="text" id="id" name="id" required><br><br>
|
||||
|
||||
|
@ -69,4 +202,53 @@
|
|||
<button type="submit">Post</button>
|
||||
</form>
|
||||
|
||||
//TODO: fix access control allow origin on actual response in worker. OPTIONS request is already fixed
|
||||
<h1>Update Post</h1>
|
||||
|
||||
<form on:submit={handleSubmitUpdate}>
|
||||
<label for="post-id">Post ID:</label>
|
||||
<select id="post-id" bind:value={postId} required>
|
||||
<option value="">Select a post ID</option>
|
||||
{#each $posts as post}
|
||||
<option value={post.id}>{post.id}</option>
|
||||
{/each}
|
||||
</select><br><br>
|
||||
|
||||
<label for="title">Title:</label>
|
||||
<input type="text" id="title" bind:value={title} required><br><br>
|
||||
|
||||
<label for="author">Author:</label>
|
||||
<input type="text" id="author" bind:value={author} required><br><br>
|
||||
|
||||
<label for="date">Date:</label>
|
||||
<input type="date" id="date" bind:value={date}><br><br>
|
||||
|
||||
<label for="now">Use current date:</label>
|
||||
<input type="checkbox" id="now" bind:checked={now}><br><br>
|
||||
|
||||
<label for="description">Description:</label>
|
||||
<textarea id="description" bind:value={description} required></textarea><br><br>
|
||||
|
||||
<label for="content">Content:</label>
|
||||
<textarea id="content" bind:value={content} required></textarea><br><br>
|
||||
|
||||
<label for="password">Password:</label>
|
||||
<input type="password" id="password" bind:value={password} required><br><br>
|
||||
|
||||
<button type="submit">Update Post</button>
|
||||
</form>
|
||||
|
||||
<h2>Delete Post</h2>
|
||||
<form on:submit={handleSubmitDelete}>
|
||||
<label for="delete-post-id">Post ID:</label>
|
||||
<select id="delete-post-id" bind:value={postId} required>
|
||||
<option value="">Select a post ID</option>
|
||||
{#each $posts as post}
|
||||
<option value={post.id}>{post.id}</option>
|
||||
{/each}
|
||||
</select><br><br>
|
||||
|
||||
<label for="delete-password">Password:</label>
|
||||
<input type="password" id="delete-password" bind:value={password} required><br><br>
|
||||
|
||||
<button type="submit">Delete Post</button>
|
||||
</form>
|
Loading…
Add table
Add a link
Reference in a new issue