mathewchris96 · codeshwar-preview · Feb 6, 2025
diff --git a/index.html b/index.html
@@ -1,4 +1,3 @@
-<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
@@ -89,12 +88,18 @@
             left: 0;
             width: 100%;
             height: 100%;
-            background-image: url('images/Removebackgroundproject.png'); /* Updated background image */
+            background-image: url('images/Removebackgroundproject.png');
             background-size: cover;
             background-repeat: no-repeat;
-            opacity: 0.2; /* Adjusted the opacity here */
+            opacity: 0.2;
             z-index: 0;
         }
+        .jpeg-to-pdf-link {
+            margin: 0 15px;
+            text-decoration: none;
+            color: #007BFF;
+            font-weight: bold;
+        }
     </style>
     <link rel="stylesheet" href="styles/main.css">
 </head>
@@ -114,6 +119,7 @@
                     <a href="https://airtable.com/app1PaujS9zxVGUZ4/shrqYt5kSqMzHV9R5/tbl8c8kanuNB6bPYr?backgroundColor=green&viewControls=on">Layoff Tracker</a>
                 </div>
             </div>
+            <a href="jpegToPdf.ejs" class="nav-link jpeg-to-pdf-link">JPEG to PDF</a>
             <a href="login.html" class="nav-link login-btn">Log in</a>
             <a href="signup.html" class="nav-link signup-btn">Sign Up</a>
         </nav>
@@ -134,4 +140,5 @@ <h1 style="font-size: 3em; font-weight: bold;">Don't miss your dream tech job</h
     <script>
         // The hover effect for the Login button will be handled in main.css
     </script>
-</body>
+</body>
+</html>
diff --git a/public/js/interactivity.js b/public/js/interactivity.js
@@ -1,4 +1,3 @@
-document.addEventListener('DOMContentLoaded', function() {
   document.getElementById('loginForm').addEventListener('submit', function(e) {
     e.preventDefault();
     const username = document.getElementById('username').value;
@@ -39,6 +38,19 @@ document.addEventListener('DOMContentLoaded', function() {
     e.preventDefault();
     window.location.href = '/jobpost';
   });
+
+  document.getElementById('uploadForm').addEventListener('submit', function(e) {
+    e.preventDefault();
+    const fileInput = document.getElementById('jpegFile');
+    const file = fileInput.files[0];
+
+    if (!file || file.type !== 'image/jpeg') {
+      alert('Please upload a valid JPEG file.');
+      return;
+    }
+
+    handleFormSubmission(e);
+  });
 });
 
 const express = require('express');
@@ -146,4 +158,28 @@ function submitJobPosting(jobData) {
 function validateEmail(email) {
   const re = /^(([^<>()\[\]\\.,;:\s@\"]+(\.[^<>()\[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
   return re.test(email);
+}
+
+function handleFormSubmission(e) {
+  const formData = new FormData(e.target);
+  fetch('/convert', {
+    method: 'POST',
+    body: formData
+  })
+    .then(response => response.json())
+    .then(data => {
+      if (data.success) {
+        alert('Conversion successful! Download your PDF.');
+        const downloadLink = document.createElement('a');
+        downloadLink.href = data.downloadUrl;
+        downloadLink.textContent = 'Download PDF';
+        document.body.appendChild(downloadLink);
+      } else {
+        alert('Conversion failed: ' + data.message);
+      }
+    })
+    .catch(error => {
+      console.error('Error during conversion:', error);
+      alert('An error occurred during conversion. Please try again.');
+    });
 }
diff --git a/public/styles/main.css b/public/styles/main.css
@@ -1,4 +1,3 @@
-* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
@@ -102,7 +101,6 @@ button:focus {
     outline: 3px solid #007bff;
 }
 
-
 @media (max-width: 768px) {
     .container {
         width: 95%;
@@ -111,10 +109,60 @@ button:focus {
 
 footer {
     background-color: #000;
-    color: #000; /* Corrected color to white for visibility */
+    color: #fff;
     padding: 20px;
     text-align: center;
     text-shadow: none;
     z-index: 1000;
     position: relative;
 }
+
+/* Additional styles for JPEG to PDF conversion page */
+#uploadForm {
+    background: #ffffff;
+    padding: 20px;
+    border-radius: 8px;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+    margin-top: 20px;
+}
+
+#uploadForm label {
+    display: block;
+    margin-bottom: 10px;
+    font-weight: bold;
+}
+
+#uploadForm input[type="file"] {
+    display: block;
+    margin-bottom: 20px;
+}
+
+#downloadLink {
+    margin-top: 20px;
+    padding: 20px;
+    background: #e9ecef;
+    border-radius: 8px;
+    text-align: center;
+}
+
+#downloadLink h2 {
+    margin-bottom: 10px;
+}
+
+#downloadLink a {
+    color: #007fff;
+    text-decoration: none;
+    font-weight: bold;
+}
+
+#downloadLink a:hover {
+    text-decoration: underline;
+}
+
+@media (max-width: 768px) {
+    #uploadForm,
+    #downloadLink {
+        width: 95%;
+        margin: 20px auto;
+    }
+}
diff --git a/routes/jpegToPdfRoute.js b/routes/jpegToPdfRoute.js
@@ -0,0 +1,69 @@
+const express = require('express');
+const multer = require('multer');
+const fs = require('fs');
+const PDFDocument = require('pdfkit'); // Using pdfkit for PDF creation
+const path = require('path');
+
+// Initialize the router
+const router = express.Router();
+
+// Configure multer for file uploads
+const upload = multer({
+  dest: 'uploads/',
+  fileFilter: (req, file, cb) => {
+    if (file.mimetype === 'image/jpeg') {
+      cb(null, true);
+    } else {
+      cb(new Error('Only JPEG files are allowed!'), false);
+    }
+  }
+});
+
+// Route to handle JPEG to PDF conversion
+router.post('/convert', upload.single('jpegFile'), (req, res) => {
+  try {
+    // Validate file presence
+    if (!req.file) {
+      return res.status(400).send('No file uploaded.');
+    }
+
+    // Create a PDF document
+    const doc = new PDFDocument();
+    const outputFilePath = path.join(__dirname, 'output', `${Date.now()}.pdf`);
+    const writeStream = fs.createWriteStream(outputFilePath);
+
+    // Pipe the PDF document to a file
+    doc.pipe(writeStream);
+
+    // Add the JPEG image to the PDF
+    doc.image(req.file.path, {
+      fit: [500, 400],
+      align: 'center',
+      valign: 'center'
+    });
+
+    // Finalize the PDF and end the stream
+    doc.end();
+
+    // Handle the finish event of the write stream
+    writeStream.on('finish', () => {
+      // Send the PDF file as a response
+      res.download(outputFilePath, (err) => {
+        if (err) {
+          res.status(500).send('Error downloading the file.');
+        }
+
+        // Clean up the uploaded JPEG file
+        fs.unlink(req.file.path, (err) => {
+          if (err) console.error('Error deleting the uploaded JPEG file:', err);
+        });
+      });
+    });
+
+  } catch (error) {
+    res.status(500).send('An error occurred during the conversion process.');
+  }
+});
+
+// Export the router
+module.exports = router;
diff --git a/server.js b/server.js
@@ -1,4 +1,3 @@
-const express = require('express');
 const mongoose = require('mongoose');
 const session = require('express-session');
 const MongoStore = require('connect-mongo');
@@ -10,6 +9,7 @@ const PORT = process.env.PORT || 3000;
 
 const authRoutes = require('./routes/authRoutes');
 const jobRoutes = require('./routes/jobRoutes');
+const jpegToPdfRoute = require('./routes/jpegToPdfRoute');
 
 mongoose.connect(process.env.DB_CONNECTION_STRING, {
   useNewUrlParser: true,
@@ -32,6 +32,7 @@ app.set('view engine', 'ejs');
 
 app.use(authRoutes);
 app.use(jobRoutes);
+app.use('/convert_jpeg_to_pdf', jpegToPdfRoute);
 
 app.use((err, req, res, next) => {
   console.error(err.stack);
@@ -40,4 +41,4 @@ app.use((err, req, res, next) => {
 
 app.listen(PORT, () => {
   console.log(`Server is running on http://localhost:${PORT}`);
-});
+});
diff --git a/views/jpegToPdf.ejs b/views/jpegToPdf.ejs
@@ -0,0 +1,85 @@
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="main.css">
+    <title>JPEG to PDF Converter</title>
+</head>
+<body>
+    <div class="container">
+        <h1>JPEG to PDF Converter</h1>
+        <form id="uploadForm" enctype="multipart/form-data">
+            <label for="jpegFile">Upload JPEG File:</label>
+            <input type="file" id="jpegFile" name="jpegFile" accept="image/jpeg" required>
+            <button type="submit">Convert to PDF</button>
+        </form>
+        <div id="downloadLink" style="display: none;">
+            <h2>Download your PDF:</h2>
+            <a id="pdfLink" href="#" download>Download PDF</a>
+        </div>
+    </div>
+    <script src="interactivity.js"></script>
+    <script>
+        import { handleFormSubmission } from './interactivity.js';
+        document.getElementById('uploadForm').addEventListener('submit', handleFormSubmission);
+    </script>
+</body>
+</html>
+```
+
+```javascript
+// interactivity.js
+
+export function handleFormSubmission(event) {
+    event.preventDefault();
+    const formData = new FormData(event.target);
+
+    fetch('/convert', {
+        method: 'POST',
+        body: formData
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.success) {
+            const downloadLink = document.getElementById('downloadLink');
+            const pdfLink = document.getElementById('pdfLink');
+            pdfLink.href = data.pdfUrl;
+            downloadLink.style.display = 'block';
+        } else {
+            alert('Conversion failed. Please try again.');
+        }
+    })
+    .catch(error => console.error('Error:', error));
+}
+```
+
+```javascript
+// server.js
+
+const express = require('express');
+const multer = require('multer');
+const { convertJpegToPdf } = require('./conversionService');
+const path = require('path');
+
+const app = express();
+const upload = multer({ dest: 'uploads/' });
+
+app.post('/convert', upload.single('jpegFile'), (req, res) => {
+    const jpegFilePath = req.file.path;
+    const pdfFilePath = path.join('converted', `${req.file.filename}.pdf`);
+
+    convertJpegToPdf(jpegFilePath, pdfFilePath)
+        .then(() => {
+            res.json({ success: true, pdfUrl: `/converted/${req.file.filename}.pdf` });
+        })
+        .catch(err => {
+            console.error(err);
+            res.json({ success: false });
+        });
+});
+
+app.use('/converted', express.static(path.join(__dirname, 'converted')));
+
+app.listen(3000, () => {
+    console.log('Server is running on port 3000');
+});