From f6c545a9467436e190503536a7a7935083527435 Mon Sep 17 00:00:00 2001
From: LinuxSquare <linuxscripting.sh@gmail.com>
Date: Sat, 9 Mar 2024 14:34:31 +0100
Subject: [PATCH] jobs - add check if jobs are available

---
 layouts/shortcodes/jobs.html |  2 +-
 static/js/jobs.js            | 97 ++++++++++++++++++++----------------
 2 files changed, 54 insertions(+), 45 deletions(-)

diff --git a/layouts/shortcodes/jobs.html b/layouts/shortcodes/jobs.html
index facb146..4f1c7cf 100644
--- a/layouts/shortcodes/jobs.html
+++ b/layouts/shortcodes/jobs.html
@@ -21,7 +21,7 @@
             <label for="experience">Your experience in this is position *</label>
             <textarea class="rounded-md" name="experience" id="experience" cols="30" rows="5"></textarea>
             <label for="references">Your references *</label>
-            <textarea class="rounded-md" name="" id="" cols="30" rows="5"></textarea>
+            <textarea class="rounded-md" name="references" id="" cols="30" rows="5"></textarea>
           </div>
         </div>
         <div class="apply-section -docs">
diff --git a/static/js/jobs.js b/static/js/jobs.js
index 4ffbc0c..548923c 100644
--- a/static/js/jobs.js
+++ b/static/js/jobs.js
@@ -3,52 +3,61 @@ let jobsContainer = document.getElementById("jobsContainer")
 fetch('/json/jobs.json')
   .then((response) => response.json())
   .then((json) => {
-    json.forEach((job) => {
+    if(json.length <= 0) {
       const jobContainer = document.createElement("div");
       jobContainer.classList.add("flex-auto");
+      jobContainer.appendChild(document.createElement("h2")).innerHTML = "There are currently no open jobs to apply for"
+      jobContainer.appendChild(document.createElement("p")).innerHTML = "Please try again to a different time"
 
-      const jobTitle = document.createElement("h2");
-      jobTitle.innerHTML = job.title;
-      jobContainer.appendChild(jobTitle)
-      if(job.sub.length > 0) {
-        const jobIcons = document.createElement("div");
-        jobIcons.classList.add("flex", "flex-row", "text-2xl");
-        job.sub.forEach((icon) => {
-          let iconObject
-          switch(icon.source) {
-            case "mdi":
-              iconObject = document.createElement("span");
-              iconObject.classList.add("iconify");
-              iconObject.setAttribute("data-icon", "mdi-"+icon.icon+"");
-              break;
-              case "simpleicons":
+      jobsContainer.appendChild(jobContainer);
+    } else {
+      json.forEach((job) => {
+        const jobContainer = document.createElement("div");
+        jobContainer.classList.add("flex-auto");
+  
+        const jobTitle = document.createElement("h2");
+        jobTitle.innerHTML = job.title;
+        jobContainer.appendChild(jobTitle)
+        if(job.sub.length > 0) {
+          const jobIcons = document.createElement("div");
+          jobIcons.classList.add("flex", "flex-row", "text-2xl");
+          job.sub.forEach((icon) => {
+            let iconObject
+            switch(icon.source) {
+              case "mdi":
                 iconObject = document.createElement("span");
-                iconObject.classList.add("icon");
-                const iconImg = document.createElement("img");
-                iconImg.height = 20;
-                iconImg.width = 20;
-                iconImg.src = "https://cdn.jsdelivr.net/npm/simple-icons@v10/icons/"+icon.icon+".svg"
-                iconObject.appendChild(iconImg);
+                iconObject.classList.add("iconify");
+                iconObject.setAttribute("data-icon", "mdi-"+icon.icon+"");
                 break;
-          }
-          jobIcons.appendChild(iconObject);
-        });
-        jobContainer.appendChild(jobIcons);
-      }
-
-      const jobDescription = document.createElement("p");
-      jobDescription.innerHTML = job.description;
-      jobContainer.appendChild(jobDescription);
-
-      const applyButton = document.createElement("button");
-      applyButton.type = "button"
-      applyButton.classList.add("text-white", "bg-blue-700", "hover:bg-blue-800", "focus:outline-none", "focus:ring-4", "focus:ring-blue-300", "font-medium", "rounded-full", "text-sm", "px-5", "py-2.5", "text-center", "me-2", "mb-2", "dark:bg-blue-600", "dark:hover:bg-blue-700", "dark:focus:ring-blue-800", "max-w-2xs");
-      applyButton.addEventListener("click", () => {
-        openApplyForm(job.title)
-      })
-      applyButton.innerHTML = "Apply"
-      
-      jobsContainer.appendChild(jobContainer)
-      jobContainer.appendChild(applyButton)
-    });
-  });
+                case "simpleicons":
+                  iconObject = document.createElement("span");
+                  iconObject.classList.add("icon");
+                  const iconImg = document.createElement("img");
+                  iconImg.height = 20;
+                  iconImg.width = 20;
+                  iconImg.src = "https://cdn.jsdelivr.net/npm/simple-icons@v10/icons/"+icon.icon+".svg"
+                  iconObject.appendChild(iconImg);
+                  break;
+            }
+            jobIcons.appendChild(iconObject);
+          });
+          jobContainer.appendChild(jobIcons);
+        }
+  
+        const jobDescription = document.createElement("p");
+        jobDescription.innerHTML = job.description;
+        jobContainer.appendChild(jobDescription);
+  
+        const applyButton = document.createElement("button");
+        applyButton.type = "button"
+        applyButton.classList.add("text-white", "bg-blue-700", "hover:bg-blue-800", "focus:outline-none", "focus:ring-4", "focus:ring-blue-300", "font-medium", "rounded-full", "text-sm", "px-5", "py-2.5", "text-center", "me-2", "mb-2", "dark:bg-blue-600", "dark:hover:bg-blue-700", "dark:focus:ring-blue-800", "max-w-2xs");
+        applyButton.addEventListener("click", () => {
+          openApplyForm(job.title)
+        })
+        applyButton.innerHTML = "Apply"
+        
+        jobsContainer.appendChild(jobContainer)
+        jobsContainer.appendChild(applyButton)
+      });
+    }
+});