// Course data for 2025-2026 const coursesData = [ // Q1 2025 { "_id": { "$oid": "6913bb88e6a18803422e7b82" }, "Course": "MDB100: MongoDB Database and Security", "Confirmed?": "Pending", "Start Date": "8-Dec-25", "End Date": "8-Dec-25", "Time Zone": "US CST", "Time Slot": "All Day (9:00 AM - 5:00 PM)", "Region": "AMER", "Language": "English", "Instructor": "Ann Duong", "Session": "US CST | 2025 Dec 08 | English (MDB100)", "Registration Code": "ca5d29d0-1924-44b2-bf0d-ee6eb2ed631f", "raw_start_date": "8-Dec-2025", "raw_end_date": "8-Dec-2025", "start_timestamp": { "$date": "2025-12-08T00:00:00.000Z" }, "end_timestamp": { "$date": "2025-12-08T00:00:00.000Z" } }, { "_id": { "$oid": "6913bb88e6a18803422e7b83" }, "Fiscal Q": "FY26 Q4", "Course": "MDB100: MongoDB Database and Security", "Confirmed?": "Pending", "Start Date": "8-Dec-25", "End Date": "8-Dec-25", "Time Zone": "SG SGT", "Time Slot": "All Day (9:00 AM - 5:00 PM)", "Region": "APAC", "Language": "English", "Instructor": "Jirachai Chansivanon", "RR Link (Held)": "https://mongodb.my.salesforce.com/aDQUe0000002tGXOAY", "Assignment Link": "", "Session": "SG SGT | 2025 Dec 08 | English (MDB100)", "Registration Code": "56f03773-aa3f-4246-bc38-e0e50d9b67ec", "raw_start_date": "8-Dec-2025", "raw_end_date": "8-Dec-2025", "start_timestamp": { "$date": "2025-12-08T00:00:00.000Z" }, "end_timestamp": { "$date": "2025-12-08T00:00:00.000Z" } }, { "_id": { "$oid": "6913bb88e6a18803422e7b84" }, "Fiscal Q": "FY26 Q4", "Course": "MDB100: MongoDB Database and Security", "Confirmed?": "Pending", "Start Date": "8-Dec-25", "End Date": "8-Dec-25", "Time Zone": "UK GMT", "Time Slot": "All Day (9:00 AM - 5:00 PM)", "Region": "EMEA", "Language": "English", "Instructor": "Joe Nyirenda", "RR Link (Held)": "https://mongodb.my.salesforce.com/aDQUe0000002tI9OAI", "Assignment Link": "", "Session": "UK GMT | 2025 Dec 08 | English (MDB100)", "Registration Code": "915b651a-fd73-4b6c-8b20-f8a815c85006", "raw_start_date": "8-Dec-2025", "raw_end_date": "8-Dec-2025", "start_timestamp": { "$date": "2025-12-08T00:00:00.000Z" }, "end_timestamp": { "$date": "2025-12-08T00:00:00.000Z" } }, { "_id": { "$oid": "6913bb88e6a18803422e7b85" }, "Fiscal Q": "FY26 Q4", "Course": "MDB200: MongoDB Optimization and Performance", "Confirmed?": "Pending", "Start Date": "9-Dec-25", "End Date": "9-Dec-25", "Time Zone": "US CST", "Time Slot": "All Day (9:00 AM - 5:00 PM)", "Region": "AMER", "Language": "English", "Instructor": "Ann Duong", "RR Link (Held)": "https://mongodb.my.salesforce.com/aDQUe0000002tLNOAY", "Assignment Link": "", "Session": "US CST | 2025 Dec 09 | English (MDB200)", "Registration Code": "1d098b3b-229c-47c3-a22c-68dfd5f1ad2b", "raw_start_date": "9-Dec-2025", "raw_end_date": "9-Dec-2025", "start_timestamp": { "$date": "2025-12-09T00:00:00.000Z" }, "end_timestamp": { "$date": "2025-12-09T00:00:00.000Z" } }, { "_id": { "$oid": "6913bb88e6a18803422e7b86" }, "Fiscal Q": "FY26 Q4", "Course": "MDB200: MongoDB Optimization and Performance", "Confirmed?": "Pending", "Start Date": "9-Dec-25", "End Date": "9-Dec-25", "Time Zone": "SG SGT", "Time Slot": "All Day (9:00 AM - 5:00 PM)", "Region": "APAC", "Language": "English", "Instructor": "Jirachai Chansivanon", "RR Link (Held)": "https://mongodb.my.salesforce.com/aDQUe0000002tMzOAI", "Assignment Link": "", "Session": "SG SGT | 2025 Dec 09 | English (MDB200)", "Registration Code": "1df5cf37-e329-434f-a955-cd7866d40fbe", "raw_start_date": "9-Dec-2025", "raw_end_date": "9-Dec-2025", "start_timestamp": { "$date": "2025-12-09T00:00:00.000Z" }, "end_timestamp": { "$date": "2025-12-09T00:00:00.000Z" } }, { "_id": { "$oid": "6913bb88e6a18803422e7b87" }, "Fiscal Q": "FY26 Q4", "Course": "MDB200: MongoDB Optimization and Performance", "Confirmed?": "Pending", "Start Date": "9-Dec-25", "End Date": "9-Dec-25", "Time Zone": "UK GMT", "Time Slot": "All Day (9:00 AM - 5:00 PM)", "Region": "EMEA", "Language": "English", "Instructor": "Joe Nyirenda", "RR Link (Held)": "https://mongodb.my.salesforce.com/aDQUe0000002tObOAI", "Assignment Link": "", "Session": "UK GMT | 2025 Dec 09 | English (MDB200)", "Registration Code": "87d323f0-d3cc-4e20-966d-f27deea2e0c6", "raw_start_date": "9-Dec-2025", "raw_end_date": "9-Dec-2025", "start_timestamp": { "$date": "2025-12-09T00:00:00.000Z" }, "end_timestamp": { "$date": "2025-12-09T00:00:00.000Z" } }, // Q2 2025 { "Course": "MDB200: MongoDB Optimization", "Start Date": "02-Apr-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "John Smith", "Location": "Online" }, { "Course": "DEV500: Data Modeling", "Start Date": "16-Apr-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Sarah Johnson", "Location": "Online" }, { "Course": "OFS400: Ops Manager Admin", "Start Date": "07-May-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Michael Brown", "Location": "Online" }, { "Course": "DA620: Languages Drivers", "Start Date": "21-May-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Emily Davis", "Location": "Online" }, { "Course": "OA630: Self-Hosted Security", "Start Date": "04-Jun-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Robert Wilson", "Location": "Online" }, // Q3 2025 { "Course": "MDB300: Production Readiness", "Start Date": "09-Jul-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "John Smith", "Location": "Online" }, { "Course": "DS110: Atlas Search", "Start Date": "23-Jul-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Sarah Johnson", "Location": "Online" }, { "Course": "OFA500: Atlas API", "Start Date": "06-Aug-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Michael Brown", "Location": "Online" }, { "Course": "DA630: Distributed Systems", "Start Date": "20-Aug-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Emily Davis", "Location": "Online" }, { "Course": "OA640: Atlas Security", "Start Date": "03-Sep-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Robert Wilson", "Location": "Online" }, // Q4 2025 { "Course": "DS120: Atlas Data Lake", "Start Date": "08-Oct-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "John Smith", "Location": "Online" }, { "Course": "DA640: App Optimization", "Start Date": "22-Oct-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Sarah Johnson", "Location": "Online" }, { "Course": "OFS500: Ops Manager API", "Start Date": "05-Nov-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Michael Brown", "Location": "Online" }, { "Course": "DA650: Advanced Aggregation", "Start Date": "19-Nov-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Emily Davis", "Location": "Online" }, { "Course": "DS130: CSFLE", "Start Date": "03-Dec-25", "Time": "09:00 AM - 05:00 PM", "Instructor": "Robert Wilson", "Location": "Online" }, // Q1 2026 { "Course": "MDB100: MongoDB Database and Security", "Start Date": "14-Jan-26", "Time": "09:00 AM - 05:00 PM", "Instructor": "John Smith", "Location": "Online" }, { "Course": "DEV400: MongoDB Developer Extension", "Start Date": "28-Jan-26", "Time": "09:00 AM - 05:00 PM", "Instructor": "Sarah Johnson", "Location": "Online" }, { "Course": "DA660: AI Integration", "Start Date": "11-Feb-26", "Time": "09:00 AM - 05:00 PM", "Instructor": "Michael Brown", "Location": "Online" }, { "Course": "DA670: Vector Search", "Start Date": "25-Feb-26", "Time": "09:00 AM - 05:00 PM", "Instructor": "Emily Davis", "Location": "Online" }, { "Course": "OA620: Ops Manager Sizing", "Start Date": "11-Mar-26", "Time": "09:00 AM - 05:00 PM", "Instructor": "Robert Wilson", "Location": "Online" } ]; // Calendar functionality let currentMonth = new Date().getMonth(); let currentYear = new Date().getFullYear(); const calendar = new Calendar('#calendar', { defaultView: 'week', template: { time(event) { const { start, end, title } = event; return `${formatTime(start)}~${formatTime(end)} ${title}`; }, allday(event) { return `${event.title}`; }, }, calendars: [ { id: 'cal1', name: 'Personal', backgroundColor: '#03bd9e', }, { id: 'cal2', name: 'Work', backgroundColor: '#00a9ff', }, ], }); function renderCalendar() { const firstDay = new Date(currentYear, currentMonth, 1); const lastDay = new Date(currentYear, currentMonth + 1, 0); const daysInMonth = lastDay.getDate(); let startingDay = firstDay.getDay(); // Adjust to make Monday (1) the first day of week instead of Sunday (0) startingDay = startingDay === 0 ? 6 : startingDay - 1; // Update month display const monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; document.getElementById('current-month-display').textContent = `${monthNames[currentMonth]} ${currentYear}`; // Clear previous calendar const calendarDays = document.getElementById('calendar-days'); calendarDays.innerHTML = ''; // Add empty cells for days before the first day of month for (let i = 0; i < startingDay; i++) { const cell = document.createElement('div'); cell.className = 'bg-white h-24 p-1'; calendarDays.appendChild(cell); } // Add days of month for (let day = 1; day <= daysInMonth; day++) { const cell = document.createElement('div'); cell.className = 'bg-white h-24 p-1 overflow-auto'; const date = new Date(currentYear, currentMonth, day); const dateStr = date.toLocaleDateString('en-US', { day: '2-digit', month: 'short', year: 'numeric' }); // Add day number const dayNumber = document.createElement('div'); dayNumber.className = 'font-semibold text-sm mb-1'; dayNumber.textContent = day; cell.appendChild(dayNumber); // Add courses for this day const coursesToday = coursesData.filter(course => { const courseDate = new Date(course['Start Date']); return courseDate.getDate() === day && courseDate.getMonth() === currentMonth && courseDate.getFullYear() === currentYear; }); coursesToday.forEach(course => { const courseEl = document.createElement('div'); courseEl.className = 'text-xs p-1 mb-1 rounded bg-blue-50 border-l-4 border-blue-500 truncate'; courseEl.title = `${course.Course}\n${course.Time}\n${course.Instructor}`; courseEl.textContent = course.Course; cell.appendChild(courseEl); }); calendarDays.appendChild(cell); } } // Close dropdowns when clicking outside document.addEventListener('click', function(event) { if (!event.target.matches('.dropdown-btn')) { const dropdowns = document.querySelectorAll('.dropdown-content'); dropdowns.forEach(dropdown => { if (dropdown.classList.contains('show')) { dropdown.classList.remove('show'); } }); } }); // Initialize the page document.addEventListener('DOMContentLoaded', () => { // Set initial view to current month const now = new Date(); currentMonth = now.getMonth(); currentYear = now.getFullYear(); renderCalendar(); renderUpcomingDates(); // Month navigation document.getElementById('prev-month').addEventListener('click', () => { currentMonth--; if (currentMonth < 0) { currentMonth = 11; currentYear--; } renderCalendar(); feather.replace(); }); document.getElementById('next-month').addEventListener('click', () => { currentMonth++; if (currentMonth > 11) { currentMonth = 0; currentYear++; } renderCalendar(); feather.replace(); }); }); // Helper function to parse date strings function parseDate(dateStr) { const parts = dateStr.split('-'); const day = parseInt(parts[0]); const monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; const month = monthNames.indexOf(parts[1]); const year = parseInt(parts[2]) + 2000; return new Date(year, month, day); } // Group courses by month function groupCoursesByMonth(courses) { const now = new Date(); const currentMonth = now.getMonth(); const currentYear = now.getFullYear(); const grouped = { current: [], next: [], following: [] }; courses.forEach(course => { const courseDate = parseDate(course['Start Date']); const courseMonth = courseDate.getMonth(); const courseYear = courseDate.getFullYear(); if (courseYear === currentYear || courseYear === currentYear + 1) { if (courseMonth === currentMonth && courseYear === currentYear) { grouped.current.push(course); } else if ( (courseMonth === currentMonth + 1 && courseYear === currentYear) || (currentMonth === 11 && courseMonth === 0 && courseYear === currentYear + 1) ) { grouped.next.push(course); } else if ( (courseMonth === currentMonth + 2 && courseYear === currentYear) || (currentMonth === 10 && courseMonth === 0 && courseYear === currentYear + 1) || (currentMonth === 11 && courseMonth === 1 && courseYear === currentYear + 1) ) { grouped.following.push(course); } } }); return grouped; } // Render courses to the DOM function renderCourses(courses, containerId) { const container = document.getElementById(containerId); container.innerHTML = ''; if (courses.length === 0) { container.innerHTML = '

No courses scheduled for this period.

'; return; } courses.forEach(course => { const card = document.createElement('custom-course-card'); card.setAttribute('title', course.Course); card.setAttribute('date', parseDate(course['Start Date']).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })); card.setAttribute('time', course.Time); card.setAttribute('location', course.Location); card.setAttribute('link', '#'); container.appendChild(card); }); } // Render upcoming dates list function renderUpcomingDates() { const upcomingDatesList = document.getElementById('upcoming-dates-list'); upcomingDatesList.innerHTML = ''; // Sort courses by date const sortedCourses = [...coursesData].sort((a, b) => { return new Date(a['Start Date']) - new Date(b['Start Date']); }); // Get next 10 upcoming courses const now = new Date(); const upcomingCourses = sortedCourses.filter(course => { return new Date(course['Start Date']) >= now; }).slice(0, 10); if (upcomingCourses.length === 0) { upcomingDatesList.innerHTML = '

No upcoming courses scheduled.

'; return; } upcomingCourses.forEach(course => { const date = new Date(course['Start Date']); const dateItem = document.createElement('div'); dateItem.className = 'flex items-start border-b border-gray-100 pb-4 last:border-0 last:pb-0'; dateItem.innerHTML = `
${date.toLocaleDateString('en-US', { month: 'short' })}
${date.getDate()}

${course.Course}

${course.Time} • ${course.Location}

Instructor: ${course.Instructor}

`; upcomingDatesList.appendChild(dateItem); }); } // Filter courses based on selected filters function filterCourses() { const language = document.querySelector('select:nth-of-type(1)').value; const region = document.querySelector('select:nth-of-type(2)').value; const timezone = document.querySelector('select:nth-of-type(3)').value; const course = document.querySelector('select:nth-of-type(4)').value; // Filter logic would go here console.log('Filtering by:', {language, region, timezone, course}); // In a real implementation, you would filter the coursesData array // and update the displayed courses } // Initialize the page function init() { // Add event listeners to filter selects document.querySelectorAll('.filter-select').forEach(select => { select.addEventListener('change', filterCourses); }); const groupedCourses = groupCoursesByMonth(coursesData); renderCourses(groupedCourses.current, 'current-month-courses'); renderCourses(groupedCourses.next, 'next-month-courses'); renderCourses(groupedCourses.following, 'following-month-courses'); // Update month selector labels with actual month names const now = new Date(); const monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; const buttons = document.querySelectorAll('.month-btn'); buttons[0].textContent = monthNames[now.getMonth()]; buttons[1].textContent = monthNames[(now.getMonth() + 1) % 12]; buttons[2].textContent = monthNames[(now.getMonth() + 2) % 12]; // Add enrol button functionality document.getElementById('enrol-mdb100').addEventListener('click', () => { const courseId = document.getElementById('mdb100-select').value; window.open(`https://learn.mongodb.com/courses/mdb100-mongodb-database-and-security?courseId=${courseId}`, '_blank'); }); } init();