{"version":3,"sources":["product-sticky-cta.js"],"names":["Viewport","breakpoints","this","mediaQuery","breakpoint","type","size","matchMedia","window","matches","customMediaQuery","customMatchMedia","customMatches","resize","callback","windowResizing","addEventListener","clearTimeout","setTimeout","ProductStickyCta","self","viewport","Soho","localStorage","LocalStorageManager","delay","duration","footerDockOffset","canCheckPageScroll","active","trigger","success","refresh","previousTrigger","$form","document","querySelectorAll","$btn","querySelector","$countContainer","$count","init","length","get","forEach","el","disableItem","watchScroll","watchResize","checkPageScroll","bind","addListener","valid","getAttribute","additionalElements","top","offsetHeight","getBoundingClientRect","height","activate","deactivate","footerWrap","pageYOffset","clientHeight","classList","add","remove","style","paddingBottom","concat","dockAboveFooter","container","footer","bottomOffset","dockedBottom","innerHeight","bottom","update","count","parseInt","innerHTML","disableCheckPageScroll","enableCheckPageScroll","mode","ContentSquare","stickyAtbSentToCs","trackArtificialPageview","location","pathname","disable","toggle","tablet","closest","transition","disabled","productStickyCta"],"mappings":"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","file":"../../javascript/product-sticky-cta.js","sourcesContent":["function Viewport(breakpoints) {\n    // Get the breakpoint config\n    this.breakpoints = breakpoints;\n\n    // Constuct the breakpoint for the media query\n    this.mediaQuery = function (breakpoint) {\n        return (\n            '(' +\n            this.breakpoints[breakpoint].type +\n            ': ' +\n            this.breakpoints[breakpoint].size +\n            'px)'\n        );\n    };\n\n    // Check if the media query matches\n    this.matchMedia = function (breakpoint) {\n        return window.matchMedia(this.mediaQuery(breakpoint));\n    };\n\n    // Check if the media query matches\n    this.matches = function (breakpoint) {\n        return window.matchMedia(this.mediaQuery(breakpoint)).matches;\n    };\n\n    // Construct the custom media query\n    this.customMediaQuery = function (breakpoint) {\n        return breakpoint;\n    };\n\n    // Check if the custom media query matches\n    this.customMatchMedia = function (breakpoint) {\n        return window.matchMedia(this.customMediaQuery(breakpoint));\n    };\n\n    // Check if the custom media query matches\n    this.customMatches = function (breakpoint) {\n        return window.matchMedia(this.customMediaQuery(breakpoint)).matches;\n    };\n\n    // Watch for viewport resize\n    this.resize = function (callback) {\n        var windowResizing;\n\n        window.addEventListener('resize', function () {\n            clearTimeout(windowResizing);\n            windowResizing = setTimeout(function () {\n                if (typeof callback == 'function') {\n                    callback();\n                }\n            }, 100);\n        });\n    };\n}\n\n\nfunction ProductStickyCta() {\n    var self = this;\n\n    var viewport = new Viewport(Soho.breakpoints);\n    var localStorage = new LocalStorageManager();\n\n    this.delay = 300;\n    this.duration = 1000;\n    this.footerDockOffset = 20;\n    this.canCheckPageScroll = true;\n    this.active = {\n        trigger: false,\n        success: false\n    }\n\n    this.refresh = function() {\n        var previousTrigger = this.trigger;\n\n        this.$form = document.querySelectorAll('.js-basket-form');\n        this.$btn = document.querySelector('[data-product-sticky-cta-trigger]')\n            || document.querySelector('.js-basket-form button.product-detail__add');\n        this.trigger = document.querySelector('.js-product-sticky-cta-trigger');\n        this.$countContainer = document.querySelector('.js-basket-count');\n        this.$count = document.querySelector('.js-basket-count .header-action__count');\n\n        if (previousTrigger && previousTrigger !== this.trigger) {\n            this.active.trigger = false;\n        }\n    }\n\n    this.init = function() {\n        this.refresh();\n\n        if (this.$form.length === 0) {\n            return;\n        }\n\n        if (localStorage.get('waitlist-added') === 'true') {\n            document.querySelectorAll('.js-more-info-toggle[data-more-info-disable=\"true\"]').forEach(function(el) {\n                self.disableItem(el);\n            });\n        }\n\n        this.watchScroll();\n        this.watchResize();\n    }\n\n    this.watchScroll = function() {\n        this.checkPageScroll();\n\n        document.addEventListener('scroll', this.checkPageScroll.bind(this));\n    }\n\n    this.watchResize = function() {\n        viewport.matchMedia('tablet').addListener(this.checkPageScroll.bind(this));\n    }\n\n    this.checkPageScroll = function() {        \n        if (!this.canCheckPageScroll) {\n            return;\n        }\n\n        this.refresh();\n\n        if (this.$form.length === 0 || !this.$btn || !this.trigger) {\n            return;\n        }\n\n        var valid = true;\n\n        if (!viewport.matches('tablet') && localStorage.get('waitlist-added') && this.$form[0].getAttribute('action') === null) {\n            valid = false;\n        }\n        \n        if (valid) {\n            this.additionalElements = [\n                document.querySelector('.notice'),\n                document.querySelector('.header'),\n            ];\n\n            let top = 0;\n\n            this.additionalElements.forEach(function(el) {\n                if (el) {\n                    top += el.offsetHeight;\n                }\n            });\n\n            if (top > this.$btn.getBoundingClientRect().top + this.$btn.getBoundingClientRect().height) {\n                this.activate(this.trigger, 'trigger');\n            } else {\n                this.deactivate(this.trigger, 'trigger');\n            }\n        } else {\n            this.deactivate(this.trigger, 'trigger');\n        }\n\n        const footerWrap = document.querySelector('.footer__wrap');\n\n        if (viewport.matches('tablet')) {\n            if (window.pageYOffset > this.trigger.querySelector('.product-sticky-cta__container').clientHeight / 2) {\n                this.trigger.classList.add('product-sticky-cta--show');\n            } else {\n                this.trigger.classList.remove('product-sticky-cta--show');\n            }\n\n            const height = this.trigger.querySelector('.product-sticky-cta__container').clientHeight;\n\n            if (footerWrap) {\n                footerWrap.style.paddingBottom = `${height}px`;\n            }\n        } else {\n            this.dockAboveFooter();\n\n            if (footerWrap) {\n                footerWrap.style.paddingBottom = null;\n            }\n        }\n    }\n\n    /**\n     * Keep the sticky CTA above the footer by raising its fixed bottom\n     * once the bar would otherwise overlap the footer top.\n     */\n    this.dockAboveFooter = function() {\n        var container = this.trigger && this.trigger.querySelector('.product-sticky-cta__container');\n        var footer = document.querySelector('.footer');\n\n        if (!container || !footer || !this.active.trigger) {\n            if (container) {\n                container.style.bottom = '';\n            }\n            return;\n        }\n\n        var bottomOffset = viewport.matches('tablet') ? 0 : 10;\n        var dockedBottom = window.innerHeight - footer.getBoundingClientRect().top - this.footerDockOffset;\n\n        if (dockedBottom > bottomOffset) {\n            container.style.bottom = dockedBottom + 'px';\n        } else {\n            container.style.bottom = '';\n        }\n    }\n\n    this.update = function(count) {\n        this.refresh();\n\n        if (!this.$countContainer || !this.$count) {\n            return;\n        }\n\n        if (parseInt(count) > 0) {\n            this.$countContainer.classList.add('header-action--active');\n        } else {\n            this.$countContainer.classList.remove('header-action--active');\n        }\n        this.$count.innerHTML = count;\n    }\n\n    this.disableCheckPageScroll = function() {\n        this.canCheckPageScroll = false;\n    }\n\n    this.enableCheckPageScroll = function() {\n        this.canCheckPageScroll = true;\n    }\n\n    this.activate = function(el, mode) {\n        if (this.active[mode]) {\n            return\n        }\n\n        this.active[mode] = true;\n\n        el.classList.add('product-sticky-cta--active-a');\n\n        if (Soho.ContentSquare && !window.stickyAtbSentToCs) {\n            Soho.ContentSquare.trackArtificialPageview(window.location.pathname + '/sticky-add-to-basket')\n            window.stickyAtbSentToCs = true\n        }\n\n        setTimeout(function() {\n            el.classList.add('product-sticky-cta--active-b');\n            setTimeout(function() {\n                el.classList.add('product-sticky-cta--active-c');\n            }, self.delay);\n        }, 1);\n    }\n\n    this.deactivate = function(el, mode) {\n        if (!this.active[mode]) {\n            return\n        }\n\n        var container = el.querySelector('.product-sticky-cta__container');\n        if (container) {\n            container.style.bottom = '';\n        }\n\n        el.classList.remove('product-sticky-cta--active-c');\n\n        setTimeout(function() {\n            el.classList.remove('product-sticky-cta--active-b');\n            setTimeout(function() {\n                el.classList.remove('product-sticky-cta--active-a');\n                self.active[mode] = false;\n            }, self.delay);\n        }, 1);\n    }\n\n    this.disable = function(el, mode, toggle, tablet) {\n        toggle.forEach(function(el) {\n            if (el.closest('.banners') !== null) {\n                self.disableItem(el);\n            }\n        });\n        if (!tablet) {\n            this.deactivate(el, mode);\n        }\n    }\n\n    this.disableItem = function(el) {\n        el.style.transition = 'none';\n        el.disabled = true;\n        el.querySelector('span').innerHTML = 'You have joined the waitlist';\n    }\n}\n\n\nvar productStickyCta = new ProductStickyCta();\nproductStickyCta.init();\n"],"sourceRoot":"../../../../resources/javascript"}