Content Manager: Added Documentation, Implemented functional approach to the HTML table generation and refactored API codes, Using DOM purifier to prevent XSS

This commit is contained in:
2024-11-29 01:40:44 +09:00
parent 234b93d711
commit 3ddcf5fa5e
45 changed files with 16953 additions and 70 deletions

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Content Manager - new gallery image</title>
<script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
<style>
form fieldset {
display: grid;
@@ -48,4 +48,4 @@
window.location.href = "/index.html";
});
</script>
</body>
</body>

View File

@@ -5,8 +5,11 @@
<title>Content Manager - new news</title>
<link rel="stylesheet" href="/styles/markdown.css">
<link rel="stylesheet" href="/styles/color-pallet.css">
<script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script type="module">
import DOMPurify from "https://cdn.jsdelivr.net/npm/isomorphic-dompurify/+esm"
</script>
<style>
form fieldset {
display: grid;
@@ -75,11 +78,13 @@
const submitButton = document.getElementById('submit-button');
articleEditor.addEventListener('input', () => {
markdownPreview.innerHTML = marked.parse(articleEditor.value);
const cleanHTML = DOMPurify.sanitize(marked.parse(articleEditor.value));
markdownPreview.innerHTML = cleanHTML;
});
cardContentInput.addEventListener('input', () => {
cardContentPreview.innerHTML = marked.parse(cardContentInput.value);
const cleanHTML = DOMPurify.sanitize(marked.parse(cardContentInput.value));
cardContentPreview.innerHTML = cleanHTML;
});
submitButton.addEventListener('click', () => {
@@ -87,4 +92,4 @@
});
</script>
</body>
</html>
</html>

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Content Manager - update gallery image</title>
<script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<style>
form fieldset {
@@ -64,4 +64,4 @@
window.location.href = "/index.html";
});
</script>
</body>
</body>

View File

@@ -5,9 +5,12 @@
<title>Content Manager - update news</title>
<link rel="stylesheet" href="/styles/markdown.css">
<link rel="stylesheet" href="/styles/color-pallet.css">
<script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script type="module">
import DOMPurify from "https://cdn.jsdelivr.net/npm/isomorphic-dompurify/+esm"
</script>
<style>
form fieldset {
display: grid;
@@ -101,11 +104,13 @@
.catch((err) => {console.error(err)});
articleEditor.addEventListener('input', () => {
markdownPreview.innerHTML = marked.parse(articleEditor.value);
const cleanHTML = DOMPurify.sanitize(marked.parse(articleEditor.value));
markdownPreview.innerHTML = cleanHTML;
});
cardContentInput.addEventListener('input', () => {
cardContentPreview.innerHTML = marked.parse(cardContentInput.value);
const cleanHTML = DOMPurify.sanitize(marked.parse(cardContentInput.value));
cardContentPreview.innerHTML = cleanHTML;
});
submitButton.addEventListener('click', () => {
@@ -113,4 +118,4 @@
});
</script>
</body>
</html>
</html>