rodude123/my-portfolio
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Used CKEditor for being able to edit the post body. Added the ability to make a post and send it to the backend. Formatted post on backend by moving images into respective directory with the post name and unique ID. Showed message if errored or succeeded.

Browse Source 
Signed-off-by: rodude123 <rodude123@gmail.com>
This commit is contained in:
Rohit Pai
2023-06-26 03:54:25 +01:00
parent 88c5cc9508
commit 61b8d3a987
174 changed files with 895 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/editor/editor.html
+55 -1
View File
@@ -6,13 +6,23 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/main.css">
<script src="https://kit.fontawesome.com/ed3c25598e.js" crossorigin="anonymous"></script>
<script src="js/CKEditor/ckeditor.js"></script>
</head>
<body>
<nav class="sideNav">
<a href="#" class="closeBtn" id="navClose">&times;</a>
<ul>
<li><a href="#" id="goToCV" class="active"><span>&lt;</span>CV<span>&gt;</span></a></li>
<li><a href="#" id="goToCV"><span>&lt;</span>CV<span>&gt;</span></a></li>
<li><a href="#" id="goToProjects"><span>&lt;</span>Projects<span>&gt;</span></a></li>
<li><a href="#" id="blog" class="active"><span>&lt;</span>Blog<span>&gt;</span> <i
class="fa fa-caret-right"></i></a></li>
<li class="dropdown">
<ul>
<li><a href="#" id="goToAddPost" class="active"><span>&lt;</span>Add Blog Post<span>&gt;</span></a>
</li>
<li><a href="#" id="goToEditPost"><span>&lt;</span>Edit Blog Post<span>&gt;</span></a></li>
</ul>
</li>
<li><a href="#" id="logout"><span>&lt;</span>Logout<span>&gt;</span></a></li>
</ul>
</nav>
@@ -151,6 +161,50 @@
</div>
</div>
</section>
<section id="addPost">
<h2>add post</h2>
<form action="" id="addPostForm" method="POST">
<div class="formControl">
<label for="postTitle">Title </label>
<input type="text" name="postTitle" id="postTitle" required>
</div>
<div class="formControl">
<label class="checkContainer" for="isFeatured">Is It The Featured Post
<input type="checkbox" id="isFeatured" name="isFeatured">
<span class="checkmark"></span>
</label>
</div>
<div class="formControl">
<label for="headerImg">Header Image</label>
<input type="file" name="headerImg" id="headerImg">
</div>
<div class="formControl">
<label for="postCategories">Categories</label>
<input type="text" name="postCategories" id="postCategories"
pattern='(?:,|\n|^)("(?:(?:"")*[^"]*)*"|[^",\n]*|(?:\n|$))' title="CSV format"
oninvalid="this.setCustomValidity('This field takes a CSV like format')"
oninput="this.setCustomValidity('')" required>
</div>
<div class="formControl" style="align-items: stretch;">
<label for="CKEditor">Post</label>
<div id="CKEditor">
</div>
</div>
<div class="error hidden" id="addPostError">
<button class="close" type="button">&times;</button>
<div></div>
</div>
<div class="success hidden" id="addPostSuccess">
<button class="close" type="button">&times;</button>
<div></div>
</div>
<input type="submit" value="Add new blog post" class="btn btnPrimary boxShadowIn boxShadowOut">
</form>
</section>
</main>
<script src="js/editor.js"></script>