Detect when js-cart-open is added/removed on the body

[haroldao]

Hey man.

I want to know if there is something to detect when this class is added to the body.

Here is what I try to achieve :
for drinknatz.com, when the mini-cart is opened, I want to pause my scroll scroll like I did with the menu drawer :)

[EvgeniyMukhamedjanov]

Hey )
Congrats with the new release!
About functionality - there is noting in LAC that you can use out of the box.
To achieve the functionality you can write your own handlers for addtocart event and on-icon-click event or you can use js mutation observer and watch the body attributes changes.
I think mutation observer is easier in your case

[haroldao]

Okay ty. I'll try something.

[EvgeniyMukhamedjanov]

Then the mutation observer is the best option.

[haroldao]

All good man ! 🍾 I succeeded.

Here's my code

function detectClassChange(el) {
    let observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.attributeName === 'class') {
                let className = mutation.target.className;
                if (className.includes('js-my-cart-open')) {
                    console.log('contains js-cart-open');
                    smoother.paused(true);

                } else{
                    console.log('does not contain js-cart-open');
                    smoother.paused(false);
                }
            }
        });
    });
    observer.observe(el, {
        attributes: true
    });
}

detectClassChange(document.body);

[EvgeniyMukhamedjanov]

Yeah this is what I meant :-)
Can I add your website on the LAC website as an another example? )

[haroldao]

Yeah this is what I meant :-) Can I add your website on the LAC website as an another example? )

Yeah for sure :)