init commit

scripts.js

@@ -0,0 +1,42 @@
+// Function to open video in modal and autoplay
+function openVideo(src, title, description) {
+    const videoPlayer = document.getElementById("videoPlayer");
+    videoPlayer.src = src;
+    videoPlayer.autoplay = true; // Enable autoplay
+    videoPlayer.loop = true; // Enable looping
+    videoPlayer.play(); // Start playing
+
+    document.getElementById("videoModalTitle").innerText = title;
+    document.getElementById("videoModalDescription").innerHTML = description;
+}
+
+// Stop video when modal is closed
+document.getElementById("videoModal").addEventListener("hidden.bs.modal", function () {
+    const videoPlayer = document.getElementById("videoPlayer");
+    videoPlayer.pause(); // Stop playback
+    videoPlayer.currentTime = 0; // Reset to beginning
+});
+
+// Function to dynamically generate video cards
+function generateVideoCards(videos) {
+    const videoContainer = document.getElementById("video-container");
+
+    videos.forEach(video => {
+        const col = document.createElement("div");
+        col.classList.add("col-md-4", "mb-4");
+
+        col.innerHTML = `
+            <div class="card video-card" data-bs-toggle="modal" data-bs-target="#videoModal" 
+                 onclick="openVideo('${video.src}', '${video.title}', '${video.description}')">
+                <video class="card-img-top" autoplay loop muted>
+                    <source src="${video.src}" type="video/mp4">
+                </video>
+                <div class="card-body">
+                    <h5 class="card-title">${video.title}</h5>
+                    <p class="card-text">${video.description}</p>
+                </div>
+            </div>
+        `;
+        videoContainer.appendChild(col);
+    });
+}