>>106820929
>>106820950
Fixi is easily extendable though, because it's so simple. You can even do it yourself; try that in React or HTMX...
For example, get infinite scroll by add this.
// fixi intersection events extension
document.addEventListener("fx:init", (evt) => {
let trigger = evt.target.getAttribute("fx-trigger")
if(trigger === "intersect") {
let obs = evt.target.__fixi_ob = new IntersectionObserver((entries)=>{
for(const entry of entries) {
if (entry.isIntersecting){
// done observing, remove
obs.unobserve(evt.target)
evt.target.__fixi_ob = null;
// trigger event
evt.target.dispatchEvent(new CustomEvent("intersect"))
return;
}
}
})
obs.observe(evt.target)
}
})
And here is active search.
// fixi event debouncing extension
document.addEventListener("fx:init", (evt)=>{
let target = evt.target
// if this element has the debounce extention
if (target.hasAttribute("ext-fx-debounce")){
// add a listener for the fx:inited event, when the __fixi property is available
target.addEventListener("fx:inited", ()=>{
// remove the default listener
target.removeEventListener(target.__fixi.evt, target.__fixi)
let debounceTime = parseInt(target.getAttribute("ext-fx-debounce"))
let timeout = null
// install a debounced version that delegates to the default listener
target.addEventListener(target.__fixi.evt, (evt)=>{
clearTimeout(timeout)
timeout = setTimeout(()=>target.__fixi(evt), debounceTime)
})
})
}
})
You can do this writing JS yourself, but you're going to have to write a lot more code.
