Merge pull request #32 from tharindu-dm/nov24merge

Nov24merge
tharindu-dm · Nov 30, 2024 · 9369bcd · 9369bcd
2 parents f896264 + 56ea088
commit 9369bcd
Show file tree

Hide file tree

Showing 6 changed files with 192 additions and 49 deletions.
diff --git a/app/config/database.php b/app/config/database.php
@@ -28,7 +28,7 @@ private function loadEnv($filePath)
         }
     }
 
-    private function connect() //connecting to azure sql server
+    /*private function connect() //connecting to azure sql server
     {
         // Load the .env file using the method
         $this->loadEnv(__DIR__ . '/.env');
@@ -45,9 +45,9 @@ private function connect() //connecting to azure sql server
         } catch (PDOException $e) {
             die("Connection failed: " . $e->getMessage());
         }
-    }
+    }*/
 
-    /*private function connect()
+    private function connect()
      {
          // Load the .env file using the method
          $this->loadEnv(__DIR__ . '/.env');
@@ -67,7 +67,7 @@ private function connect() //connecting to azure sql server
              die("Connection failed: " . $e->getMessage());
          }
      }
- */
+
 
     public function query($query, $data = []) //using sql prepared statement to avoid sql injections
     {

diff --git a/app/views/Institute/InstituteDashboard.php b/app/views/Institute/InstituteDashboard.php
@@ -53,7 +53,7 @@
         </aside>
         <main class="main-content">
             <header class="header">
-                <h1>Welcome to Freewrite, Institution Name</h1>
+                <h1>Welcome to Freewrite,  </h1>
                 <p>Manage your institution's Freewrite experience</p>
             </header>
             <section class="dashboard-overview">

diff --git a/app/views/publisher/creatingnewcompetition.php b/app/views/publisher/creatingnewcompetition.php
@@ -153,13 +153,12 @@
     }
 
     .error-message {
-      background-color: #ffebee;
-      color: #c62828;
-      padding: 1rem;
-      margin-bottom: 1rem;
-      border-radius: 8px;
-      border: 1px solid #ef9a9a;
-    }
+    color: #dc3545;
+    font-size: 0.875rem;
+    margin-top: -1rem;
+    margin-bottom: 1rem;
+    display: none;
+}
   </style>
 </head>
 
@@ -205,43 +204,184 @@
       <?php endif; ?>
 
 
-      <form action="/Free-Write/public/Competition/CreateCompetition" method="POST">
-        <input type="hidden" name="compID" value="<?= htmlspecialchars($competitionDetails['competitionID']) ?>">
-        <label for="title">Competition Name</label>
-        <input type="text" id="title" name="title" placeholder="Enter competition name" required />
-
-        <label for="description">Competition Description</label>
-        <textarea id="description" name="description" placeholder="Describe your competition" required></textarea>
+      <form action="/Free-Write/public/Competition/CreateCompetition" method="POST" onsubmit="return validateForm()">
+    <input type="hidden" name="compID" value="<?= htmlspecialchars($competitionDetails['competitionID']) ?>">
+
+    <label for="title">Competition Name</label>
+    <input type="text" maxlength="45" id="title" name="title" placeholder="Enter competition name" required />
+    <div id="title_error" class="error-message"></div>
+
+    <label for="description">Competition Description</label>
+    <textarea id="description" maxlength="255" name="description" placeholder="Describe your competition" required></textarea>
+    <div id="description_error" class="error-message"></div>
+
+    <label for="rules">Rules</label>
+    <input type="text" id="rules" maxlength="25" name="rules" placeholder="Enter competition rules" required />
+    <div id="rules_error" class="error-message"></div>
+
+    <label for="category">Category</label>
+    <input type="text" id="category" maxlength="45" name="category" placeholder="Enter category" required />
+    <div id="category_error" class="error-message"></div>
+
+    <label for="prizes">Prize Amount</label>
+    <input type="number" id="prizes" name="prizes" placeholder="Enter prize amount" required min="0" step="0.01" />
+
+    <label for="start_date">Start Date</label>
+    <input type="date" id="start_date" name="start_date" required />
+    <div id="start_date_error" class="error-message"></div>
+
+    <label for="end_date">End Date</label>
+    <input type="date" id="end_date" name="end_date" required />
+    <div id="end_date_error" class="error-message"></div>
+
+    <!-- <div class="optional-section">
+        <h3>Add Competition Image</h3>
+        <p>JPG or PNG, 2MB max</p>
+        <input type="file" name="competition_image" accept="image/jpeg,image/png" />
+    </div> -->
+
+    <button type="submit" class="submit-btn">Create Competition</button>
+    <button type="button" class="cancel-btn" onclick="location.href='/Free-Write/public/Competition/'">Cancel</button>
+</form>
+    </div>
+  </main>
+  <?php require_once "../app/views/layout/footer.php"; ?>
 
-        <label for="title">Rules</label>
-        <input type="text" id="rules" name="rules" placeholder="Enter competition rules" required />
+  <script>
+function countWords(str) {
+    return str.trim().split(/\s+/).filter(word => word.length > 0).length;
+}
+
+function validateForm() {
+    let isValid = true;
+    const errorMessages = {
+        title: document.getElementById('title_error'),
+        category: document.getElementById('category_error'),
+        description: document.getElementById('description_error'),
+        rules: document.getElementById('rules_error'),
+        startDate: document.getElementById('start_date_error'),
+        endDate: document.getElementById('end_date_error')
+    };
+
+    // Reset all error messages
+    Object.values(errorMessages).forEach(elem => {
+        if (elem) elem.style.display = 'none';
+    });
+
+    // Competition Name Validation
+    const title = document.getElementById('title').value;
+    if (/\d/.test(title)) {
+        errorMessages.title.textContent = 'Competition name cannot contain numbers';
+        errorMessages.title.style.display = 'block';
+        isValid = false;
+    }
 
-        <label for="category">Category</label>
-        <input type="text" id="category" name="category" placeholder="Enter category" required />
+    // Category Validation
+    const category = document.getElementById('category').value;
+    if (/\d/.test(category)) {
+        errorMessages.category.textContent = 'Category cannot contain numbers';
+        errorMessages.category.style.display = 'block';
+        isValid = false;
+    }
 
-        <label for="prizes">Prize Amount</label>
-        <input type="number" id="prizes" name="prizes" placeholder="Enter prize amount" required min="0" step="0.01" />
+    // Description Validation
+    const description = document.getElementById('description').value;
+    if (countWords(description) < 5) {
+        errorMessages.description.textContent = 'Description must be at least 10 words';
+        errorMessages.description.style.display = 'block';
+        isValid = false;
+    }
 
-        <label for="start_date">Start Date</label>
-        <input type="date" id="start_date" name="start_date" required />
+    // Rules Validation
+    const rules = document.getElementById('rules').value;
+    if (countWords(rules) < 5) {
+        errorMessages.rules.textContent = 'Rules must be at least 10 words';
+        errorMessages.rules.style.display = 'block';
+        isValid = false;
+    }
 
-        <label for="end_date">End Date</label>
-        <input type="date" id="end_date" name="end_date" required />
+    // Date Validations
+    const startDate = new Date(document.getElementById('start_date').value);
+    const endDate = new Date(document.getElementById('end_date').value);
+    const today = new Date();
+    today.setHours(0, 0, 0, 0);
 
-        <!--<div class="optional-section">
-          <h3>Add Competition Image</h3>
-          <p>JPG or PNG, 2MB max</p>
-          <input type="file" name="competition_image" accept="image/jpeg,image/png" />
-        </div>-->
+    if (startDate < today) {
+        errorMessages.startDate.textContent = 'Start date cannot be in the past';
+        errorMessages.startDate.style.display = 'block';
+        isValid = false;
+    }
 
-        <button type="submit" class="submit-btn">Create Competition</button>
-        <button type="button" class="cancel-btn"
-          onclick="location.href='/Free-Write/public/Competition/MyCompetitions'">Cancel</button>
-      </form>
-    </div>
-  </main>
-  <?php require_once "../app/views/layout/footer.php"; ?>
+    if (endDate <= startDate) {
+        errorMessages.endDate.textContent = 'End date must be at least one day after start date';
+        errorMessages.endDate.style.display = 'block';
+        isValid = false;
+    }
 
+    return isValid;
+}
+
+// Real-time validation for text inputs
+document.getElementById('title').addEventListener('input', function() {
+    const errorElem = document.getElementById('title_error');
+    if (/\d/.test(this.value)) {
+        errorElem.textContent = 'Competition name cannot contain numbers';
+        errorElem.style.display = 'block';
+    } else {
+        errorElem.style.display = 'none';
+    }
+});
+
+document.getElementById('category').addEventListener('input', function() {
+    const errorElem = document.getElementById('category_error');
+    if (/\d/.test(this.value)) {
+        errorElem.textContent = 'Category cannot contain numbers';
+        errorElem.style.display = 'block';
+    } else {
+        errorElem.style.display = 'none';
+    }
+});
+
+document.getElementById('description').addEventListener('input', function() {
+    const errorElem = document.getElementById('description_error');
+    if (countWords(this.value) < 5) {
+        errorElem.textContent = 'Description must be at least 10 words';
+        errorElem.style.display = 'block';
+    } else {
+        errorElem.style.display = 'none';
+    }
+});
+
+document.getElementById('rules').addEventListener('input', function() {
+    const errorElem = document.getElementById('rules_error');
+    if (countWords(this.value) < 5) {
+        errorElem.textContent = 'Rules must be at least 10 words';
+        errorElem.style.display = 'block';
+    } else {
+        errorElem.style.display = 'none';
+    }
+});
+
+// Set minimum date for start date (today)
+const today = new Date();
+const todayFormatted = today.toISOString().split('T')[0];
+document.getElementById('start_date').setAttribute('min', todayFormatted);
+
+// Update minimum date for end date when start date changes
+document.getElementById('start_date').addEventListener('change', function() {
+    const startDate = new Date(this.value);
+    const minEndDate = new Date(startDate);
+    minEndDate.setDate(startDate.getDate() + 1);
+    const minEndDateFormatted = minEndDate.toISOString().split('T')[0];
+
+    const endDateInput = document.getElementById('end_date');
+    endDateInput.setAttribute('min', minEndDateFormatted);
+
+    if (endDateInput.value && new Date(endDateInput.value) <= startDate) {
+        endDateInput.value = '';
+    }
+});
+</script>
 </body>
 
-</html>
+</html>
diff --git a/app/views/publisher/editingcompetitionDetails.php b/app/views/publisher/editingcompetitionDetails.php
@@ -209,26 +209,24 @@
 
 
         <label for="title">Competition Name</label>
-        <input type="text" id="title" name="title" placeholder="Enter competition name"
+        <input type="text" id="title" name="title" maxlength="45" placeholder="Enter competition name"
           value="<?= htmlspecialchars($competitionDetails['title']) ?>" required />
 
         <label for="description">Competition Description</label>
-        <textarea id="description" name="description" placeholder="Describe your competition"
+        <textarea id="description" name="description" maxlength="255" placeholder="Describe your competition"
           required><?= htmlspecialchars($competitionDetails['description']) ?></textarea>
 
 
         <label for="category">Category</label>
-        <input type="text" id="category" name="category" placeholder="Enter category"
+        <input type="text" id="category" maxlength="45" name="category" placeholder="Enter category"
           value="<?= htmlspecialchars($competitionDetails['category']) ?>" required />
 
 
         <label for="rules">Rules</label>
-        <input type="text" id="rules" name="rules" placeholder="Enter competition rules"
+        <input type="text" id="rules" maxlength="25" name="rules" placeholder="Enter competition rules"
           value="<?= htmlspecialchars($competitionDetails['rules']) ?? '' ?>" required />
 
 
-
-
         <label for="prizes">Prize Amount</label>
         <input type="number" id="prizes" name="prizes" placeholder="Enter prize amount"
           value="<?= htmlspecialchars($competitionDetails['prizes']) ?>" required min="0" step="0.01" />

diff --git a/public/css/login.css b/public/css/login.css
@@ -5,7 +5,9 @@
 
 .creativity-section {
   flex: 1;
-  background: linear-gradient(135deg, #ffd700 0%, #ffaa00 100%);
+  /*background: linear-gradient(135deg, #ffd700 0%, #ffaa00 100%);*/
+  background-image: url('/Free-Write/public/images/designer-hero.webp');
+  background-size: cover;
   display: flex;
   align-items: center;
   justify-content: center;

diff --git a/public/js/competition/editingCompetitionDetails.js b/public/js/competition/editingCompetitionDetails.js
@@ -1,4 +1,7 @@
 document.addEventListener("DOMContentLoaded", function () {
+
+
+  ////////////////////////////////////
   const deleteCompBtn = document.getElementById("DeleteCompetition");
   const cancelDeleteBtn = document.getElementById("cancelDelete");
   const deleteOverlay = document.querySelector(".deleteOverlay-container");