logo
Welcome to our new AbleCommerce forums. As a guest, you may view the information here. To post to this forum, you must have a registered account with us, either as a new user evaluating AbleCommerce or an existing user of the application. For all questions related to the older version of Gold and earlier, please go to forums.ablecommerce.com. Please use your AbleCommerce username and password to Login. Forums Registration.

Notification

Icon
Error

Options
Go to last post Go to first unread
jdepoy24549696  
#1 Posted : Wednesday, October 2, 2019 9:48:25 AM(UTC)
jdepoy24549696

Rank: Newbie

Groups: Authorized User, Developers
Joined: 4/17/2019(UTC)
Posts: 7

I was seeing errors in Chrome coming from SmoothScroll.js:
"Unable to preventDefault inside passive event listener due to target being treated as passive."

I fixed by updating SmoothScroll.js from this post:
https://github.com/peach...nepage-scroll/issues/346

Code:
// updated (jld) 10/2/19 from https://github.com/peachananr/onepage-scroll/issues/346
// chrome was showing error "Unable to preventDefault inside passive event listener due to target being treated as passive."
! function ($) {

    var defaults = {
        sectionContainer: "section",
        easing: "ease",
        animationTime: 1000,
        pagination: true,
        updateURL: false,
        keyboard: true,
        beforeMove: null,
        afterMove: null,
        loop: false,
        responsiveFallback: false,
        preventScroll: false
    };



    $.fn.swipeEvents = function() {
        return this.each(function() {

            var startX,
                startY,
                $this = $(this);

            $this.bind('touchstart', touchstart);

            function touchstart(event) {
                var touches = event.originalEvent.touches;
                if (touches && touches.length) {
                    startX = touches[0].pageX;
                    startY = touches[0].pageY;
                    $this.unbind('touchmove', touchmove);
                    $this.bind('touchmove', touchmove);
                }
            }

            function touchmove(event) {
                var touches = event.originalEvent.touches;
                if (touches && touches.length) {
                    var deltaX = startX - touches[0].pageX;
                    var deltaY = startY - touches[0].pageY;

                    if (deltaX >= 50) {
                        $this.trigger("swipeLeft");
                    }
                    if (deltaX <= -50) {
                        $this.trigger("swipeRight");
                    }
                    if (deltaY >= 50) {
                        $this.trigger("swipeUp");
                    }
                    if (deltaY <= -50) {
                        $this.trigger("swipeDown");
                    }
                    if (Math.abs(deltaX) >= 50 || Math.abs(deltaY) >= 50) {
                        $this.unbind('touchmove', touchmove);
                    }
                }
            }

        });
    };


    $.fn.onepage_scroll = function(options) {
        var settings = $.extend({}, defaults, options),
            el = $(this),
            sections = $(settings.sectionContainer)
        total = sections.length,
        status = "off",
        topPos = 0,
        lastAnimation = 0,
        quietPeriod = 500,
        paginationList = "";

        $.fn.transformPage = function(settings, pos, index) {
            if (document.all && !window.atob) {
                $(this).animate({
                    top: pos + '%'
                }, settings.animationTime, function() {
                    if (typeof settings.afterMove == 'function') settings.afterMove(index);
                });
            } else {
                $(this).css({
                    "-webkit-transform": "translate3d(0, " + pos + "%, 0)",
                    "-webkit-transition": "all " + settings.animationTime + "ms " + settings.easing,
                    "-moz-transform": "translate3d(0, " + pos + "%, 0)",
                    "-moz-transition": "all " + settings.animationTime + "ms " + settings.easing,
                    "-ms-transform": "translate3d(0, " + pos + "%, 0)",
                    "-ms-transition": "all " + settings.animationTime + "ms " + settings.easing,
                    "transform": "translate3d(0, " + pos + "%, 0)",
                    "transition": "all " + settings.animationTime + "ms " + settings.easing
                });

                $(this).one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function(e) {
                    if (typeof settings.afterMove == 'function') settings.afterMove(index);
                });
            }
        };

        $.fn.moveDown = function() {
            var el = $(this)
            index = $(settings.sectionContainer + ".active").data("index");
            current = $(settings.sectionContainer + "[data-index='" + index + "']");
            next = $(settings.sectionContainer + "[data-index='" + (index + 1) + "']");
            if (next.length < 1) {
                if (settings.loop == true) {
                    pos = 0;
                    next = $(settings.sectionContainer + "[data-index='1']");
                } else {
                    return
                }

            } else {
                pos = (index * 100) * -1;
            }
            if (typeof settings.beforeMove == 'function') settings.beforeMove(current.data("index"));
            current.removeClass("active")
            next.addClass("active");
            if (settings.pagination == true) {
                $(".onepage-pagination li a" + "[data-index='" + index + "']").removeClass("active");
                $(".onepage-pagination li a" + "[data-index='" + next.data("index") + "']").addClass("active");
            }

            $("body")[0].className = $("body")[0].className.replace(/\bviewing-page-\d.*?\b/g, '');
            $("body").addClass("viewing-page-" + next.data("index"))

            if (history.replaceState && settings.updateURL == true) {
                var href = window.location.href.substr(0, window.location.href.indexOf('#')) + "#" + (index + 1);
                history.pushState({}, document.title, href);
            }
            el.transformPage(settings, pos, index);
        }

        $.fn.moveUp = function() {
            var el = $(this)
            index = $(settings.sectionContainer + ".active").data("index");
            current = $(settings.sectionContainer + "[data-index='" + index + "']");
            next = $(settings.sectionContainer + "[data-index='" + (index - 1) + "']");

            if (next.length < 1) {
                if (settings.loop == true) {
                    pos = ((total - 1) * 100) * -1;
                    next = $(settings.sectionContainer + "[data-index='" + total + "']");
                } else {
                    return
                }
            } else {
                pos = ((next.data("index") - 1) * 100) * -1;
            }
            if (typeof settings.beforeMove == 'function') settings.beforeMove(current.data("index"));
            current.removeClass("active")
            next.addClass("active")
            if (settings.pagination == true) {
                $(".onepage-pagination li a" + "[data-index='" + index + "']").removeClass("active");
                $(".onepage-pagination li a" + "[data-index='" + next.data("index") + "']").addClass("active");
            }
            $("body")[0].className = $("body")[0].className.replace(/\bviewing-page-\d.*?\b/g, '');
            $("body").addClass("viewing-page-" + next.data("index"))

            if (history.replaceState && settings.updateURL == true) {
                var href = window.location.href.substr(0, window.location.href.indexOf('#')) + "#" + (index - 1);
                history.pushState({}, document.title, href);
            }
            el.transformPage(settings, pos, index);
        }

        $.fn.moveTo = function(page_index) {
            current = $(settings.sectionContainer + ".active")
            next = $(settings.sectionContainer + "[data-index='" + (page_index) + "']");
            if (next.length > 0) {
                if (typeof settings.beforeMove == 'function') settings.beforeMove(current.data("index"));
                current.removeClass("active")
                next.addClass("active")
                $(".onepage-pagination li a" + ".active").removeClass("active");
                $(".onepage-pagination li a" + "[data-index='" + (page_index) + "']").addClass("active");
                $("body")[0].className = $("body")[0].className.replace(/\bviewing-page-\d.*?\b/g, '');
                $("body").addClass("viewing-page-" + next.data("index"))

                pos = ((page_index - 1) * 100) * -1;
                el.transformPage(settings, pos, page_index);
                if (settings.updateURL == false) return false;
            }
        }

        function responsive() {
            if ($(window).width() < settings.responsiveFallback) {
                $("body").addClass("disabled-onepage-scroll");
                $(document).unbind('mousewheel DOMMouseScroll');
                el.swipeEvents().unbind("swipeDown swipeUp");
            } else {
                if ($("body").hasClass("disabled-onepage-scroll")) {
                    $("body").removeClass("disabled-onepage-scroll");
                    $("html, body, .wrapper").animate({
                        scrollTop: 0
                    }, "fast");
                }
                
                el.swipeEvents().bind("swipeDown", function(event) {
                    if (!$("body").hasClass("disabled-onepage-scroll")) event.preventDefault();
                    el.moveUp();
                }).bind("swipeUp", function(event) {
                    if (!$("body").hasClass("disabled-onepage-scroll")) event.preventDefault();
                    el.moveDown();
                });
                

                if (!settings.preventScroll) {
                    $(document).bind('mousewheel DOMMouseScroll', function(event) {
                        event.preventDefault(), { passive: false };
                        var delta = event.originalEvent.wheelDelta || -event.originalEvent.detail;
                        init_scroll(event, delta);
                    });
                }
            }
        }


        function init_scroll(event, delta) {
            deltaOfInterest = delta;
            var timeNow = new Date().getTime();
       
            if (timeNow - lastAnimation < quietPeriod + settings.animationTime) {
                document.addEventListener('mousewheel DOMMouseScroll', { passive: false });
                return;
            }

            if (deltaOfInterest < 0) {
                el.moveDown()
            } else {
                el.moveUp()
            }
            lastAnimation = timeNow;
        }



        el.addClass("onepage-wrapper").css("position", "relative");
        $.each(sections, function(i) {
            $(this).css({
                position: "absolute",
                top: topPos + "%"
            }).addClass("section").attr("data-index", i + 1);
            topPos = topPos + 100;
            if (settings.pagination == true) {
                paginationList += "<li><a data-index='" + (i + 1) + "' href='#" + (i + 1) + "'></a></li>"
            }
        });

        el.swipeEvents().bind("swipeDown", function(event) {
            if (!$("body").hasClass("disabled-onepage-scroll")) event.preventDefault();
            el.moveUp();
        }).bind("swipeUp", function(event) {
            if (!$("body").hasClass("disabled-onepage-scroll")) event.preventDefault();
            el.moveDown();
        });

        // Create Pagination and Display Them
        if (settings.pagination == true) {
            $("<ul class='onepage-pagination'>" + paginationList + "</ul>").prependTo("body");
            posTop = (el.find(".onepage-pagination").height() / 2) * -1;
            el.find(".onepage-pagination").css("margin-top", posTop);
        }

        if (window.location.hash != "" && window.location.hash != "#1") {
            init_index = window.location.hash.replace("#", "")
            $(settings.sectionContainer + "[data-index='" + init_index + "']").addClass("active")
            $("body").addClass("viewing-page-" + init_index)
            if (settings.pagination == true) $(".onepage-pagination li a" + "[data-index='" + init_index + "']").addClass("active");

            next = $(settings.sectionContainer + "[data-index='" + (init_index) + "']");
            if (next) {
                next.addClass("active")
                if (settings.pagination == true) $(".onepage-pagination li a" + "[data-index='" + (init_index) + "']").addClass("active");
                $("body")[0].className = $("body")[0].className.replace(/\bviewing-page-\d.*?\b/g, '');
                $("body").addClass("viewing-page-" + next.data("index"))
                if (history.replaceState && settings.updateURL == true) {
                    var href = window.location.href.substr(0, window.location.href.indexOf('#')) + "#" + (init_index);
                    history.pushState({}, document.title, href);
                }
            }
            pos = ((init_index - 1) * 100) * -1;
            el.transformPage(settings, pos, init_index);

        } else {
            $(settings.sectionContainer + "[data-index='1']").addClass("active")
            $("body").addClass("viewing-page-1")
            if (settings.pagination == true) $(".onepage-pagination li a" + "[data-index='1']").addClass("active");
        }
        if (settings.pagination == true) {
            $(".onepage-pagination li a").click(function() {
                var page_index = $(this).data("index");
                if (!$(this).hasClass("active")) {
                    current = $(settings.sectionContainer + ".active")
                    next = $(settings.sectionContainer + "[data-index='" + (page_index) + "']");
                    if (next) {
                        current.removeClass("active")
                        next.addClass("active")
                        $(".onepage-pagination li a" + ".active").removeClass("active");
                        $(".onepage-pagination li a" + "[data-index='" + (page_index) + "']").addClass("active");
                        $("body")[0].className = $("body")[0].className.replace(/\bviewing-page-\d.*?\b/g, '');
                        $("body").addClass("viewing-page-" + next.data("index"))
                    }
                    pos = ((page_index - 1) * 100) * -1;
                    el.transformPage(settings, pos, page_index);
                }
                if (settings.updateURL == false) return false;
            });
        }

        if (!settings.preventScroll) {
            $(document).bind('mousewheel DOMMouseScroll', function(event) {
                document.addEventListener('mousewheel DOMMouseScroll', { passive: false });
          
                var delta = event.originalEvent.wheelDelta || -event.originalEvent.detail;
                if (!$("body").hasClass("disabled-onepage-scroll")) init_scroll(event, delta);
            });
            
        }
       
        
        
        if (settings.responsiveFallback != false) {
            $(window).resize(function() {
                responsive();
            });

            responsive();
        }

        if (settings.keyboard == true) {
            $(document).keydown(function(e) {
                var tag = e.target.tagName.toLowerCase();

                if (!$("body").hasClass("disabled-onepage-scroll")) {
                    switch (e.which) {
                        case 38:
                            if (tag != 'input' && tag != 'textarea') el.moveUp()
                            break;
                        case 40:
                            if (tag != 'input' && tag != 'textarea') el.moveDown()
                            break;
                        default:
                            return;
                    }
                }

                e.preventDefault();
            });
        }
        return false;
    }


}(window.jQuery);
    
    
$( document ).ready(function() {
    $(".elementor-7").onepage_scroll({
        sectionContainer: "section",
        easing: "ease-out",                                                    
        animationTime: 1250,             
        pagination: true,
        updateURL: false,    
        loop: false,                                       
        responsiveFallback: false,                                                                 
        direction: "vertical",
        
    });
}); 

Wanna join the discussion?! Login to your AbleCommerce Forums forum account. Forums Registration.

katie_able_support  
#2 Posted : Wednesday, October 2, 2019 9:54:22 AM(UTC)
katie_able_support

Rank: Advanced Member

Groups: Developers, Registered, HelpDesk, System
Joined: 10/29/2018(UTC)
Posts: 72

Was thanked: 2 time(s) in 2 post(s)
Thank you for posting the fix!
katie_able_support  
#3 Posted : Friday, October 4, 2019 10:42:23 AM(UTC)
katie_able_support

Rank: Advanced Member

Groups: Developers, Registered, HelpDesk, System
Joined: 10/29/2018(UTC)
Posts: 72

Was thanked: 2 time(s) in 2 post(s)
I almost forgot to report the issue. Ref. AC9-1299 which will be fixed in the upcoming release.

Thanks again
Katie
katie_able_support  
#4 Posted : Tuesday, October 15, 2019 8:56:31 AM(UTC)
katie_able_support

Rank: Advanced Member

Groups: Developers, Registered, HelpDesk, System
Joined: 10/29/2018(UTC)
Posts: 72

Was thanked: 2 time(s) in 2 post(s)
Hi,

I wanted to update to let you know that we applied a different fix for this issue.

All it took was to update the plugin's script file with the latest version.

This will be available in the next version, which I hope will be next week.

Thanks
Katie
Users browsing this topic
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.