Initial version of timeline

This commit is contained in:
2024-11-10 03:14:08 -08:00
parent 9740585b42
commit 533b45a6f4
5 changed files with 228 additions and 10 deletions

View File

@@ -49,7 +49,8 @@
const modal = document.querySelector(`#${target}`);
if (modal) {
btn.addEventListener("click", (e) => {
toggle_modal(modal, true);
if (e.target.tagName !== 'A')
toggle_modal(modal, true);
});
}
});
@@ -77,10 +78,36 @@
document.addEventListener("keydown", (e) => {
if (e.key === "Escape") {
var modal_id = body.getAttribute("modal");
if(modal_id) toggle_modal(document.querySelector(`#${modal_id}`), false);
if (modal_id) toggle_modal(document.querySelector(`#${modal_id}`), false);
}
});
// timelines
// ----------------------------------------
const updateTimeline = (timeline) => {
const day_target = timeline.getAttribute("data-day-target");
timeline.querySelectorAll(".day-events:not(.hidden)").forEach((day_events) => { day_events.classList.toggle("hidden", true); });
timeline.querySelector(`[data-day-title="${day_target}"]`).classList.toggle("hidden", false);
timeline.querySelectorAll(`.day_listing.active`).forEach((listing) => {
listing.classList.toggle("inactive", true);
listing.classList.toggle("active", false);
});
var new_active = timeline.querySelector(`.day_listing[data-day-target="${day_target}"]`);
new_active.classList.toggle("active", true);
new_active.classList.toggle("inactive", false);
};
document.querySelectorAll(".timeline_grid_container").forEach((timeline) => {
const days = timeline.querySelector(".day-listing-container");
days.addEventListener("click", (e) => {
const day_target = e.target.getAttribute("data-day-target");
if (day_target) {
timeline.setAttribute("data-day-target", day_target);
updateTimeline(timeline);
}
});
});
// Swipers
// ----------------------------------------
const swipers = document.querySelectorAll(".swiper-slider");