replies and html sanitation

README.md

@@ -12,7 +12,7 @@ Keep an eye out for these upcoming features that will soon be available on nexde
 - [x] Video viewer
 - [x] Upload video form
 - [x] Comments
-- [ ] Replies
+- [X] Replies
 - [ ] Reactions (Upvote, Downvote, Report)
 - [ ] Custom video player (Captions, Video quality)
 - [ ] Video search

components/commentHandler.js

@@ -2,19 +2,21 @@ const multer = require('multer');
 const path = require('path');
 const fs = require('fs');
 const url = require('url');
-const {makeid} = require('./idGenerator')
+const { makeid } = require('./idGenerator')
+const sanitizeHtml = require('sanitize-html')
 
 function commentHandler(app, __dirname) {
     app.get('/comment', (req, res) => {
         try {
             const uniqueVideoID = req.query.vidlink;
-            const theComment = req.query.text;
-            const theWriter = req.query.username;
+            const theComment = sanitizeHtml(req.query.text);
+            const theWriter = sanitizeHtml(req.query.username);
             const uniqueCommentID = makeid(16)
 
             const metadata = {
                 user: theWriter,
                 text: theComment,
+                replies: []
             };
 
             const metadataPath = path.join(__dirname, 'uploads', uniqueVideoID, 'comment', `${uniqueCommentID}.json`);
@@ -27,6 +29,35 @@ function commentHandler(app, __dirname) {
         }
     });
 
+    app.get('/reply', (req, res) => {
+        try {
+            const uniqueVideoID = req.query.vidlink;
+            const uniqueCommentID = req.query.commentid;
+            const theComment = sanitizeHtml(req.query.text);
+            const theWriter = sanitizeHtml(req.query.username);
+
+            const metadata = {
+                user: theWriter,
+                text: theComment
+            };
+
+            const commentFilePath = path.join(__dirname, 'uploads', uniqueVideoID, 'comment', `${uniqueCommentID}`);
+            fs.readFile((commentFilePath), (err, data) => {
+                const commentData = JSON.parse(data);
+                if (!commentData.replies) {
+                    commentData.replies = []
+                }
+                commentData.replies.push(metadata);
+                fs.writeFileSync(commentFilePath, JSON.stringify(commentData, null, 2));
+
+                res.json({ message: 'Reply sent successfully!' });
+            })
+        } catch (error) {
+            console.error(error)
+            res.json({ message: 'Internal Server Error' });
+        }
+    });
+
     app.get('/comments', async (req, res) => {
         const fs = require('fs').promises;
         const regularfs = require('fs');

components/uploadHandler.js

@@ -3,6 +3,7 @@ const path = require('path');
 const fs = require('fs');
 const url = require('url');
 const {makeid} = require('./idGenerator')
+const sanitizeHtml = require('sanitize-html')
 
 function handleUpload(app, __dirname) {
     const storage = multer.diskStorage({
@@ -24,8 +25,8 @@ function handleUpload(app, __dirname) {
         const uniqueFolder = req.file.destination.split(path.sep).pop();
 
         const metadata = {
-            title: req.body.title || 'Untitled',
-            description: req.body.description || '',
+            title: sanitizeHtml(req.body.title) || 'Untitled',
+            description: sanitizeHtml(req.body.description) || '',
             filename: req.file.originalname,
             path: `/uploads/${uniqueFolder}/${req.file.originalname}`,
         };

package.json

@@ -11,6 +11,7 @@
   "license": "AGPL-3.0",
   "dependencies": {
     "express": "^4.18.2",
-    "multer": "^1.4.5-lts.1"
+    "multer": "^1.4.5-lts.1",
+    "sanitize-html": "^2.11.0"
   }
 }

pages/submit.html

@@ -16,11 +16,11 @@
 </style>
 
 <form action="/upload" method="post" enctype="multipart/form-data">
-    <input type="file" name="video" id="video" accept="video/*" required>
+    <input type="file" name="video" id="video" accept="video/mp4" required>
     <br>
     <input type="text" name="title" id="title" placeholder="title" required>
     <br>
     <textarea name="description" id="description" placeholder="description" rows="4"></textarea>
     <br>
-    <button type="submit" onclick="this.innerText = 'Uploading Video...'">Upload Video</button>
+    <button type="submit" onclick="this.innerHTML = 'Uploading Video...'">Upload Video</button>
 </form>