42 lines
1.5 KiB
JavaScript
42 lines
1.5 KiB
JavaScript
let sessionsWrapper = document.querySelector('#session-items-wrapper');
|
|
let sessions = document.querySelectorAll('.session');
|
|
let currentSession = 0;
|
|
let isAnimatingSession = false;
|
|
|
|
function cycleSession(direction) {
|
|
if (isAnimatingSession) return;
|
|
|
|
const itemWidth = sessions[0].offsetWidth;
|
|
const oldIndex = currentSession;
|
|
currentSession = (currentSession + direction + sessions.length) % sessions.length;
|
|
|
|
const animationOffset = direction * itemWidth;
|
|
|
|
sessionsWrapper.style.transform = `translateX(${-oldIndex * itemWidth - animationOffset}px)`;
|
|
isAnimatingSession = true;
|
|
|
|
setTimeout(() => {
|
|
sessionsWrapper.style.transition = 'none';
|
|
sessionsWrapper.style.transform = `translateX(-${currentSession * itemWidth}px)`;
|
|
void sessionsWrapper.offsetHeight; // Trigger reflow
|
|
sessionsWrapper.style.transition = 'transform 0.3s ease-in-out';
|
|
isAnimatingSession = false;
|
|
}, 300);
|
|
}
|
|
|
|
function populateSessions() {
|
|
let sessionObjects = lightdm.sessions;
|
|
sessionsWrapper.innerHtml = "";
|
|
sessionObjects.forEach((s) => {
|
|
let newSession = document.createElement("div");
|
|
newSession.id = s.key;
|
|
newSession.className = "item session";
|
|
newSession.textContent = s.name;
|
|
usersWrapper.appendChild(newSession);
|
|
});
|
|
|
|
sessionsWrapper = document.querySelector('#session-items-wrapper');
|
|
sessions = document.querySelectorAll('.session');
|
|
currentSession = 0;
|
|
isAnimatingSession = false;
|
|
}
|