Initial version of timeline
This commit is contained in:
@@ -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");
|
||||
|
||||
Reference in New Issue
Block a user