{"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","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","mode","ContentSquare","stickyAtbSentToCs","trackArtificialPageview","location","pathname","disable","toggle","tablet","closest","transition","disabled","productStickyCta"],"mappings":"AAAA,SAASA,SAASC,GAEdC,KAAKD,YAAcA,EAGnBC,KAAKC,WAAa,SAAUC,GACxB,MACI,IACAF,KAAKD,YAAYG,GAAYC,KAC7B,KACAH,KAAKD,YAAYG,GAAYE,KAC7B,KAER,EAGAJ,KAAKK,WAAa,SAAUH,GACxB,OAAOI,OAAOD,WAAWL,KAAKC,WAAWC,GAC7C,EAGAF,KAAKO,QAAU,SAAUL,GACrB,OAAOI,OAAOD,WAAWL,KAAKC,WAAWC,IAAaK,OAC1D,EAGAP,KAAKQ,iBAAmB,SAAUN,GAC9B,OAAOA,CACX,EAGAF,KAAKS,iBAAmB,SAAUP,GAC9B,OAAOI,OAAOD,WAAWL,KAAKQ,iBAAiBN,GACnD,EAGAF,KAAKU,cAAgB,SAAUR,GAC3B,OAAOI,OAAOD,WAAWL,KAAKQ,iBAAiBN,IAAaK,OAChE,EAGAP,KAAKW,OAAS,SAAUC,GACpB,IAAIC,EAEJP,OAAOQ,iBAAiB,SAAU,WAC9BC,aAAaF,GACbA,EAAiBG,WAAW,WACD,mBAAZJ,GACPA,GAER,EAAG,IACP,EACJ,CACJ,CAGA,SAASK,mBACL,IAAIC,EAAOlB,KAEPmB,EAAW,IAAIrB,SAASsB,KAAKrB,aAC7BsB,EAAe,IAAIC,oBAEvBtB,KAAKuB,MAAQ,IACbvB,KAAKwB,SAAW,IAChBxB,KAAKyB,iBAAmB,GACxBzB,KAAK0B,OAAS,CACVC,SAAS,EACTC,SAAS,GAGb5B,KAAK6B,QAAU,WACX,IAAIC,EAAkB9B,KAAK2B,QAE3B3B,KAAK+B,MAAQC,SAASC,iBAAiB,mBACvCjC,KAAKkC,KAAOF,SAASG,cAAc,sCAC5BH,SAASG,cAAc,8CAC9BnC,KAAK2B,QAAUK,SAASG,cAAc,kCACtCnC,KAAKoC,gBAAkBJ,SAASG,cAAc,oBAC9CnC,KAAKqC,OAASL,SAASG,cAAc,0CAEjCL,GAAmBA,IAAoB9B,KAAK2B,UAC5C3B,KAAK0B,OAAOC,SAAU,EAE9B,EAEA3B,KAAKsC,KAAO,WACRtC,KAAK6B,UAEqB,IAAtB7B,KAAK+B,MAAMQ,SAI4B,SAAvClB,EAAamB,IAAI,mBACjBR,SAASC,iBAAiB,uDAAuDQ,QAAQ,SAASC,GAC9FxB,EAAKyB,YAAYD,EACrB,GAGJ1C,KAAK4C,cACL5C,KAAK6C,cACT,EAEA7C,KAAK4C,YAAc,WACf5C,KAAK8C,kBAELd,SAASlB,iBAAiB,SAAUd,KAAK8C,gBAAgBC,KAAK/C,MAClE,EAEAA,KAAK6C,YAAc,WACf1B,EAASd,WAAW,UAAU2C,YAAYhD,KAAK8C,gBAAgBC,KAAK/C,MACxE,EAEAA,KAAK8C,gBAAkB,WAGnB,GAFA9C,KAAK6B,UAEqB,IAAtB7B,KAAK+B,MAAMQ,QAAiBvC,KAAKkC,MAASlC,KAAK2B,QAAnD,CAIA,IAAIsB,GAAQ,EAMZ,IAJK9B,EAASZ,QAAQ,WAAac,EAAamB,IAAI,mBAA8D,OAAzCxC,KAAK+B,MAAM,GAAGmB,aAAa,YAChGD,GAAQ,GAGRA,EAAO,CACPjD,KAAKmD,mBAAqB,CACtBnB,SAASG,cAAc,WACvBH,SAASG,cAAc,YAG3B,IAAIiB,EAAM,EAEVpD,KAAKmD,mBAAmBV,QAAQ,SAASC,GACjCA,IACAU,GAAOV,EAAGW,aAElB,GAEID,EAAMpD,KAAKkC,KAAKoB,wBAAwBF,IAAMpD,KAAKkC,KAAKoB,wBAAwBC,OAChFvD,KAAKwD,SAASxD,KAAK2B,QAAS,WAE5B3B,KAAKyD,WAAWzD,KAAK2B,QAAS,UAEtC,MACI3B,KAAKyD,WAAWzD,KAAK2B,QAAS,WAGlC,IAAM+B,EAAa1B,SAASG,cAAc,iBAE1C,GAAIhB,EAASZ,QAAQ,UAAW,CACxBD,OAAOqD,YAAc3D,KAAK2B,QAAQQ,cAAc,kCAAkCyB,aAAe,EACjG5D,KAAK2B,QAAQkC,UAAUC,IAAI,4BAE3B9D,KAAK2B,QAAQkC,UAAUE,OAAO,4BAGlC,IAAMR,EAASvD,KAAK2B,QAAQQ,cAAc,kCAAkCyB,aAExEF,IACAA,EAAWM,MAAMC,cAAa,GAAAC,OAAMX,EAAM,MAElD,MACIvD,KAAKmE,kBAEDT,IACAA,EAAWM,MAAMC,cAAgB,KAjDzC,CAoDJ,EAMAjE,KAAKmE,gBAAkB,WACnB,IAAIC,EAAYpE,KAAK2B,SAAW3B,KAAK2B,QAAQQ,cAAc,kCACvDkC,EAASrC,SAASG,cAAc,WAEpC,GAAKiC,GAAcC,GAAWrE,KAAK0B,OAAOC,QAA1C,CAOA,IAAI2C,EAAenD,EAASZ,QAAQ,UAAY,EAAI,GAChDgE,EAAejE,OAAOkE,YAAcH,EAAOf,wBAAwBF,IAAMpD,KAAKyB,iBAG9E2C,EAAUJ,MAAMS,OADhBF,EAAeD,EACUC,EAAe,KAEf,EAR7B,MAJQH,IACAA,EAAUJ,MAAMS,OAAS,GAarC,EAEAzE,KAAK0E,OAAS,SAASC,GACnB3E,KAAK6B,UAEA7B,KAAKoC,iBAAoBpC,KAAKqC,SAI/BuC,SAASD,GAAS,EAClB3E,KAAKoC,gBAAgByB,UAAUC,IAAI,yBAEnC9D,KAAKoC,gBAAgByB,UAAUE,OAAO,yBAE1C/D,KAAKqC,OAAOwC,UAAYF,EAC5B,EAEA3E,KAAKwD,SAAW,SAASd,EAAIoC,GACrB9E,KAAK0B,OAAOoD,KAIhB9E,KAAK0B,OAAOoD,IAAQ,EAEpBpC,EAAGmB,UAAUC,IAAI,gCAEb1C,KAAK2D,gBAAkBzE,OAAO0E,oBAC9B5D,KAAK2D,cAAcE,wBAAwB3E,OAAO4E,SAASC,SAAW,yBACtE7E,OAAO0E,mBAAoB,GAG/BhE,WAAW,WACP0B,EAAGmB,UAAUC,IAAI,gCACjB9C,WAAW,WACP0B,EAAGmB,UAAUC,IAAI,+BACrB,EAAG5C,EAAKK,MACZ,EAAG,GACP,EAEAvB,KAAKyD,WAAa,SAASf,EAAIoC,GAC3B,GAAK9E,KAAK0B,OAAOoD,GAAjB,CAIA,IAAIV,EAAY1B,EAAGP,cAAc,kCAC7BiC,IACAA,EAAUJ,MAAMS,OAAS,IAG7B/B,EAAGmB,UAAUE,OAAO,gCAEpB/C,WAAW,WACP0B,EAAGmB,UAAUE,OAAO,gCACpB/C,WAAW,WACP0B,EAAGmB,UAAUE,OAAO,gCACpB7C,EAAKQ,OAAOoD,IAAQ,CACxB,EAAG5D,EAAKK,MACZ,EAAG,EAfH,CAgBJ,EAEAvB,KAAKoF,QAAU,SAAS1C,EAAIoC,EAAMO,EAAQC,GACtCD,EAAO5C,QAAQ,SAASC,GACW,OAA3BA,EAAG6C,QAAQ,aACXrE,EAAKyB,YAAYD,EAEzB,GACK4C,GACDtF,KAAKyD,WAAWf,EAAIoC,EAE5B,EAEA9E,KAAK2C,YAAc,SAASD,GACxBA,EAAGsB,MAAMwB,WAAa,OACtB9C,EAAG+C,UAAW,EACd/C,EAAGP,cAAc,QAAQ0C,UAAY,8BACzC,CACJ,CA5QA,IAAAa,iBAAA,IAAAzE,iBACAyE,iBAAApD","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.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        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.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"}