reloadItems() wihout animation

[klevison]

Every time that I'm calling reloadItems() isotope scrolls page to top.

1) Is it the correct behavior? 2) If Yes.. is there a way call reloadItems() method without scroll to top?

[thesublimeobject]

@klevison — Do you have an example? I'd be happy to help, but per the contributing guidelines a working example and what you've tried would be very helpful so that I can better assist you. Thanks!

[klevison]

The real example: https://livestats.com.br/

If you scroll down (when have a multiples cards) you will see that every 15 seconds it call realoadItems and scroll to top

[klevison]

I'm using phoenix framework js interpolation (https://hexdocs.pm/phoenix_live_view/js-interop.html). So basically my code is:

app.js

Hooks.MasonryHook = {

    updated() {
        const iso = new Isotope('.masonry');
        iso.reloadItems();
    },

    mounted() {
        const masonryOptions = {
            itemSelector: '.card-items-col',
            percentPosition: true,
        }
        const elem = document.querySelector('.masonry');
        new Isotope(elem, masonryOptions);
    }

}

index.html.heex

<div class="container py-5" id="container-11">
    <div class="row masonry" id="masonry" phx-hook="MasonryHook">
        <%= for match <- @matches do %>
            <.live_component module={PainelesportivoWeb.AllMatchesCardComponent} id={"#{match["id"]}"} match={match} />
        <% end %>
    </div>
</div>

Its mounted perfectly, but when updated (every 15 seconds) it updated all cards and scrolls to top.

[thesublimeobject]

@klevison — I'm honestly not 100% sure why this would be happening off the top of my head. Have you tried anything specific to fix it yet? The issue is that, because you're wrapping everything around that library, it's hard for me to be sure whether it's Isotope or something else that is doing this. It could be the change in the height of the page though? It's a bit hard for me to test this given the constraints, but also, about half the time I'm waiting the 15s nothing is happening.