Compare commits

..

5 Commits

Author SHA1 Message Date
Jürgen Mummert e8fd218c74 Remove view transitions and restore hidden-only event filtering 2026-04-05 13:58:54 +02:00
Jürgen Mummert 5f652530ed Scope view transitions to event list and prevent page shift 2026-04-05 13:55:44 +02:00
Jürgen Mummert 11b927b91f Fix event filter transition jank and restore layout animation 2026-04-05 13:46:00 +02:00
Jürgen Mummert e1a426bde4 Handle skipped view transition promises in event filter 2026-04-05 13:40:57 +02:00
Jürgen Mummert 8a422aa4ee Add view transitions for event filter layout animation 2026-04-05 13:36:58 +02:00
@@ -114,8 +114,6 @@
const stateStorageKey = 'event-filter-state'; const stateStorageKey = 'event-filter-state';
const stateQueryKey = 'event_filter'; const stateQueryKey = 'event_filter';
const animationMs = 220;
let hideTimers = new WeakMap();
let currentFilter = { type: 'all', value: '' }; let currentFilter = { type: 'all', value: '' };
let suppressedChangeEvents = 0; let suppressedChangeEvents = 0;
@@ -242,34 +240,12 @@
} }
}; };
const clearHideTimer = (eventItem) => {
const timer = hideTimers.get(eventItem);
if (timer) {
window.clearTimeout(timer);
hideTimers.delete(eventItem);
}
};
const showEvent = (eventItem) => { const showEvent = (eventItem) => {
clearHideTimer(eventItem);
eventItem.hidden = false; eventItem.hidden = false;
requestAnimationFrame(() => {
eventItem.classList.remove('is-filtered-out');
});
}; };
const hideEvent = (eventItem) => { const hideEvent = (eventItem) => {
clearHideTimer(eventItem); eventItem.hidden = true;
eventItem.classList.add('is-filtered-out');
const timer = window.setTimeout(() => {
eventItem.hidden = true;
hideTimers.delete(eventItem);
}, animationMs);
hideTimers.set(eventItem, timer);
}; };
const setActiveControl = ({ type, value }) => { const setActiveControl = ({ type, value }) => {
@@ -332,7 +308,7 @@
return; return;
} }
const visibleCount = events.filter((eventItem) => !eventItem.hidden).length; const visibleCount = events.filter((eventItem) => matches(eventItem, filterState)).length;
let filterText = 'alle'; let filterText = 'alle';
if (filterState.type === 'tag' && tagSelect) { if (filterState.type === 'tag' && tagSelect) {