{"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","$form","document","querySelectorAll","$btn","querySelector","trigger","$countContainer","$count","delay","duration","active","success","init","length","get","forEach","el","disableItem","watchScroll","watchResize","checkPageScroll","bind","addListener","valid","getAttribute","additionalElements","top","offsetHeight","getBoundingClientRect","height","activate","deactivate","pageYOffset","clientHeight","classList","add","remove","update","count","parseInt","innerHTML","mode","ContentSquare","stickyAtbSentToCs","trackArtificialPageview","location","pathname","disable","toggle","tablet","closest","style","transition","disabled","productStickyCta"],"mappings":"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","file":"../../javascript/product-sticky-cta.js","sourcesContent":["function Viewport(breakpoints) {\n\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 '(' + this.breakpoints[breakpoint].type + ': ' + this.breakpoints[breakpoint].size + 'px)';\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.$form = document.querySelectorAll('.js-basket-form');\n    this.$btn = 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    this.delay = 300;\n    this.duration = 1000;\n    this.active = {\n        trigger: false,\n        success: false\n    }\n\n    this.init = function() {\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        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        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    }\n\n    this.update = function(count) {\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        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"}