{"version":3,"sources":["webpack:///product-tile-banner-32facbb20492ed310abf.js","webpack:///webpack/bootstrap 49e3f4ed5eed6f7b6fe0","webpack:///./components/product-tile-banner/product-tile-banner.js"],"names":["modules","__webpack_require__","moduleId","installedModules","exports","module","i","l","call","m","c","d","name","getter","o","Object","defineProperty","configurable","enumerable","get","n","__esModule","object","property","prototype","hasOwnProperty","p","s","386","387","_toConsumableArray","arr","Array","isArray","arr2","length","from","_classCallCheck","instance","Constructor","TypeError","_possibleConstructorReturn","self","ReferenceError","_inherits","subClass","superClass","create","constructor","value","writable","setPrototypeOf","__proto__","_createClass","defineProperties","target","props","descriptor","key","protoProps","staticProps","_get","receiver","Function","desc","getOwnPropertyDescriptor","undefined","parent","getPrototypeOf","_window$Liftoff","window","Liftoff","Component","DOMUtils","Utils","MAXIMUM_STAR_RATING","TEMPLATE","fill","join","register","_Component","ProductTileBanner","config","this","_this","assign","mergePropertiesWithDefaults","icon","iconStyles","appName","appNameStyles","starRating","starStyles","caption","captionStyles","cta","ctaStyles","component","componentStyles","switchElements","appInfoDuration","componentDuration","switchingDuration","initialDelay","appNameLineLimit","forceFullscreenWidth","transitionEndHandler","e","propertyName","currentTarget","animateNext","ready","startWhenReady","firstAnimationComplete","running","Math","min","max","_this2","loadPromises","filter","map","load","imageLoadPromise","loadImage","then","imgEl","iconImgEl","push","loaded","Promise","all","parentNode","_this3","el","strToElement","getBoundingClientRect","height","classList","add","captionEl","querySelector","style","concat","children","forEach","childEl","transitionDuration","appendChild","ctaContainer","layout","remove","setStarRating","resolve","imageIsRendered","appNameEl","visiblity","limitString","fontSize","parseInt","getComputedStyle","innerHTML","limitHeight","populatedHeight","scrollHeight","lineHeight","visbility","captionContainerEl","position","componentContainerEl","setComponentContainerSize","width","left","zIndex","addOneTimeListener","start","right","ctaContainerEl","forceReflow","filledStarEl","filledStarWidth","floor","_this4","switchingEls","querySelectorAll","enterEl","exitEl","contains","animationDelay","stop","animationTimeout","setTimeout","resize","addEventListener","_this5","clearTimeout","removeEventListener","transition","388"],"mappings":"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","file":"product-tile-banner-32facbb20492ed310abf.js","sourcesContent":["/******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId]) {\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/ \t\t}\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\ti: moduleId,\n/******/ \t\t\tl: false,\n/******/ \t\t\texports: {}\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.l = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// define getter function for harmony exports\n/******/ \t__webpack_require__.d = function(exports, name, getter) {\n/******/ \t\tif(!__webpack_require__.o(exports, name)) {\n/******/ \t\t\tObject.defineProperty(exports, name, {\n/******/ \t\t\t\tconfigurable: false,\n/******/ \t\t\t\tenumerable: true,\n/******/ \t\t\t\tget: getter\n/******/ \t\t\t});\n/******/ \t\t}\n/******/ \t};\n/******/\n/******/ \t// getDefaultExport function for compatibility with non-harmony modules\n/******/ \t__webpack_require__.n = function(module) {\n/******/ \t\tvar getter = module && module.__esModule ?\n/******/ \t\t\tfunction getDefault() { return module['default']; } :\n/******/ \t\t\tfunction getModuleExports() { return module; };\n/******/ \t\t__webpack_require__.d(getter, 'a', getter);\n/******/ \t\treturn getter;\n/******/ \t};\n/******/\n/******/ \t// Object.prototype.hasOwnProperty.call\n/******/ \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(__webpack_require__.s = 386);\n/******/ })\n/************************************************************************/\n/******/ ({\n\n/***/ 386:\n/***/ (function(module, exports, __webpack_require__) {\n\n__webpack_require__(387);\nmodule.exports = __webpack_require__(388);\n\n\n/***/ }),\n\n/***/ 387:\n/***/ (function(module, exports) {\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nvar _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if (\"value\" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };\n\nfunction _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nvar _window$Liftoff = window.Liftoff,\n    Component = _window$Liftoff.Component,\n    DOMUtils = _window$Liftoff.DOMUtils,\n    Utils = _window$Liftoff.Utils;\n\n\nvar MAXIMUM_STAR_RATING = 5;\nvar FILLED_STAR_CHAR = \"&#9733;\";\nvar EMPTY_STAR_CHAR = \"&#9734;\";\n\nvar TEMPLATE = \"\\n  <div class=\\\"product-tile-banner loading\\\">\\n    <div class=\\\"icon switch-with-component\\\"></div>\\n    <div class=\\\"text-container switch-with-component\\\">\\n      <div class=\\\"app-name\\\"></div>\\n      <div class=\\\"star-rating\\\">\\n        <div class=\\\"empty-stars\\\">\" + new Array(MAXIMUM_STAR_RATING).fill(EMPTY_STAR_CHAR).join(\"\") + \"</div>\\n        <div class=\\\"filled-stars\\\">\" + new Array(MAXIMUM_STAR_RATING).fill(FILLED_STAR_CHAR).join(\"\") + \"</div>\\n      </div>\\n      <div class=\\\"caption\\\"></div>\\n    </div>\\n    <div class=\\\"outer-cta-container switch-with-component\\\">\\n      <div class=\\\"cta-container\\\"></div>\\n    </div>\\n    <div class=\\\"component-container exited\\\"></div>\\n  </div>\\n\";\n\nComponent.register(\"product-tile-banner\", function (_Component) {\n  _inherits(ProductTileBanner, _Component);\n\n  function ProductTileBanner(config) {\n    _classCallCheck(this, ProductTileBanner);\n\n    var _this = _possibleConstructorReturn(this, (ProductTileBanner.__proto__ || Object.getPrototypeOf(ProductTileBanner)).call(this, config));\n\n    Object.assign(_this, Utils.mergePropertiesWithDefaults({\n      icon: null,\n      iconStyles: {},\n      appName: \"\",\n      appNameStyles: {},\n      starRating: null,\n      starStyles: {},\n      caption: null,\n      captionStyles: {},\n      cta: null,\n      ctaStyles: {},\n      component: null,\n      componentStyles: {},\n      switchElements: \"all\",\n      appInfoDuration: 1800,\n      componentDuration: 2000,\n      switchingDuration: 500,\n      initialDelay: 1800,\n      appNameLineLimit: null,\n      forceFullscreenWidth: false\n    }, config));\n    _this.transitionEndHandler = function (e) {\n      // We only want to listen to transition events coming from elements in this component (not any bubbling\n      // events from child components). Within this component, \"transform\" and \"visibility\" properties are\n      // both transitioned and both will independently produce transitionend events. But we only want to\n      // respond to one transition per element regardless of the number of properties transitioned.\n      if (e.propertyName !== \"transform\" || e.target !== e.currentTarget) return;\n      _this.animateNext();\n    };\n    _this.ready = false;\n    _this.startWhenReady = false;\n    _this.firstAnimationComplete = false;\n    _this.running = false;\n    if (_this.starRating != null) {\n      _this.starRating = Math.min(Math.max(0, _this.starRating), MAXIMUM_STAR_RATING);\n    }\n    return _this;\n  }\n\n  _createClass(ProductTileBanner, [{\n    key: \"load\",\n    value: function load() {\n      var _this2 = this;\n\n      var loadPromises = [this.component, this.caption, this.cta].filter(function (c) {\n        return c;\n      }).map(function (c) {\n        return c.load();\n      });\n      if (this.icon != null) {\n        var imageLoadPromise = Utils.loadImage(this.icon).then(function (imgEl) {\n          return _this2.iconImgEl = imgEl;\n        });\n        loadPromises.push(imageLoadPromise);\n      }\n\n      this.loaded = Promise.all(loadPromises);\n      return this.loaded;\n    }\n  }, {\n    key: \"layout\",\n    value: function layout(parentNode) {\n      var _this3 = this;\n\n      _get(ProductTileBanner.prototype.__proto__ || Object.getPrototypeOf(ProductTileBanner.prototype), \"layout\", this).call(this, parentNode);\n\n      this.el = DOMUtils.strToElement(TEMPLATE);\n      if (parentNode.getBoundingClientRect().height >= 80) {\n        this.el.classList.add(\"tablet\");\n      }\n\n      var captionEl = this.el.querySelector(\".caption\");\n      Object.assign(captionEl.style, this.captionStyles);\n      [].concat(_toConsumableArray(this.el.children)).forEach(function (childEl) {\n        childEl.style.transitionDuration = _this3.switchingDuration + \"ms\";\n      });\n\n      this.parentNode.appendChild(this.el);\n      this.loaded.then(function () {\n        if (_this3.cta != null) {\n          var ctaContainer = _this3.el.querySelector(\".cta-container\");\n          Object.assign(ctaContainer.style, _this3.ctaStyles);\n          _this3.cta.layout(ctaContainer);\n        } else {\n          _this3.el.querySelector(\".outer-cta-container\").remove();\n        }\n\n        if (_this3.starRating != null) {\n          _this3.setStarRating();\n          Object.assign(_this3.el.querySelector(\".star-rating\").style, _this3.starStyles);\n        } else {\n          _this3.el.querySelector(\".star-rating\").remove();\n        }\n\n        if (_this3.icon == null) {\n          return Promise.resolve();\n        }\n\n        _this3.el.querySelector(\".icon\").appendChild(_this3.iconImgEl);\n        Object.assign(_this3.iconImgEl.style, _this3.iconStyles);\n        return DOMUtils.imageIsRendered(_this3.iconImgEl);\n      }).then(function () {\n        var appNameEl = _this3.el.querySelector(\".app-name\");\n        Object.assign(appNameEl.style, _this3.appNameStyles);\n        if (_this3.appNameLineLimit != null) {\n          appNameEl.style.visiblity = \"hidden\";\n          // We fill the element with a number of line breaks equal to the line limit to determine the height of\n          // the element were the maximum number of lines to be used.\n          var limitString = Array(_this3.appNameLineLimit).fill(\"<br>\").join(\"\");\n          var conformsToLineLimit = function conformsToLineLimit() {\n            appNameEl.innerHTML = limitString;\n            var limitHeight = appNameEl.getBoundingClientRect().height;\n            appNameEl.innerHTML = _this3.appName;\n            var populatedHeight = appNameEl.getBoundingClientRect().height;\n            // If the user specified a height via CSS, then populatedHeight will always === limitHeight.\n            // In this case, we assume the user's intent is to make the text fit into the given height,\n            // so we also check `scrollHeight`.\n            return populatedHeight <= limitHeight && appNameEl.scrollHeight <= populatedHeight;\n          };\n          var fontSize = parseInt(window.getComputedStyle(appNameEl).fontSize);\n          while (!conformsToLineLimit() && fontSize > 0) {\n            fontSize -= 1;\n            Object.assign(appNameEl.style, {\n              fontSize: fontSize + \"px\",\n              lineHeight: fontSize * 1.1 + \"px\"\n            });\n          }\n          appNameEl.style.visbility = \"visible\";\n        }\n        appNameEl.innerHTML = _this3.appName;\n\n        if (_this3.caption != null) {\n          var captionContainerEl = _this3.el.querySelector(\".caption\");\n          // NOTE(Casey): On Safari, without position: absolute on the caption\n          // container during subcomponent layout, children with width: 100%,\n          // height: 100% will be sized relative to the nearest positioned\n          // ancestor, possibly resulting in a caption that extends beyond the\n          // bounds of the component container. We reset the position after layout\n          // to attain proper positioning relative to sibling elements.\n          captionContainerEl.style.position = \"absolute\";\n          _this3.caption.layout(_this3.el.querySelector(\".caption\"));\n          captionContainerEl.style.height = captionContainerEl.getBoundingClientRect().height + \"px\";\n          captionContainerEl.style.position = \"relative\";\n        } else {\n          _this3.el.querySelector(\".caption\").remove();\n        }\n      }).then(function () {\n        if (_this3.component != null) {\n          _this3.componentContainerEl = _this3.el.querySelector(\".component-container\");\n          Object.assign(_this3.componentContainerEl.style, _this3.componentStyles);\n          _this3.setComponentContainerSize();\n\n          // Force component to take full screen width\n          if (_this3.forceFullscreenWidth) {\n            _this3.componentContainerEl.style.width = \"100%\";\n            _this3.componentContainerEl.style.left = 0;\n\n            // Increase z-index value for icon and cta containers so that they\n            // appear as overlay on the component area\n            _this3.el.querySelector(\".outer-cta-container\").style.zIndex = 2;\n            _this3.el.querySelector(\".icon\").style.zIndex = 2;\n          }\n\n          _this3.component.layout(_this3.componentContainerEl);\n          DOMUtils.addOneTimeListener(_this3.el, \"transitionend\", function () {\n            _this3.firstAnimationComplete = true;\n          });\n        }\n\n        _this3.ready = true;\n        _this3.el.classList.remove(\"loading\");\n        if (_this3.startWhenReady) {\n          _this3.start();\n        }\n      });\n    }\n  }, {\n    key: \"setComponentContainerSize\",\n    value: function setComponentContainerSize() {\n      var left = 0;\n      var right = 0;\n      if (this.switchElements === \"all but cta\" && this.cta != null) {\n        var ctaContainerEl = this.el.querySelector(\".outer-cta-container\");\n        right = this.el.getBoundingClientRect().right - ctaContainerEl.getBoundingClientRect().left;\n        ctaContainerEl.classList.remove(\"switch-with-component\");\n      } else if (this.switchElements === \"all but icon\" && this.icon != null) {\n        DOMUtils.forceReflow(this.el.querySelector(\".icon\"));\n        left = this.el.querySelector(\".icon\").getBoundingClientRect().width;\n        this.el.querySelector(\".icon\").classList.remove(\"switch-with-component\");\n      }\n\n      Object.assign(this.componentContainerEl.style, {\n        right: right + \"px\",\n        left: left + \"px\"\n      });\n    }\n  }, {\n    key: \"setStarRating\",\n    value: function setStarRating() {\n      var filledStarEl = this.el.querySelector(\".filled-stars\");\n      var filledStarWidth = this.starRating / MAXIMUM_STAR_RATING * filledStarEl.getBoundingClientRect().width;\n      // Flooring and subtracting 0.5 was determined empirically to produce a visualization that worked well\n      // for all whole and half values.\n      filledStarWidth = Math.max(Math.floor(filledStarWidth - 0.5), 0);\n      filledStarEl.style.width = filledStarWidth + \"px\";\n    }\n  }, {\n    key: \"animateNext\",\n    value: function animateNext() {\n      var _this4 = this;\n\n      var switchingEls = [].concat(_toConsumableArray(this.el.querySelectorAll(\".switch-with-component\")));\n      var enterEl = function enterEl(el) {\n        el.classList.add(\"staged\");\n        el.classList.remove(\"exited\");\n        DOMUtils.forceReflow(el);\n        el.classList.remove(\"staged\");\n      };\n      var exitEl = function exitEl(el) {\n        return el.classList.add(\"exited\");\n      };\n\n      if (this.componentContainerEl.classList.contains(\"exited\")) {\n        // Animate component in.\n        var animationDelay = this.firstAnimationComplete ? this.appInfoDuration : this.initialDelay;\n        this.component.stop();\n        this.animationTimeout = setTimeout(function () {\n          switchingEls.forEach(exitEl);\n          enterEl(_this4.componentContainerEl);\n          _this4.component.start();\n        }, animationDelay);\n      } else {\n        // Animate app info in.\n        this.animationTimeout = setTimeout(function () {\n          switchingEls.forEach(enterEl);\n          exitEl(_this4.componentContainerEl);\n        }, this.componentDuration);\n      }\n    }\n  }, {\n    key: \"resize\",\n    value: function resize() {\n      if (this.component == null) return;\n      this.setComponentContainerSize();\n      this.component.resize();\n      this.setStarRating();\n    }\n  }, {\n    key: \"restart\",\n    value: function restart() {\n      this.stop();\n      this.firstAnimationComplete = false;\n      this.start();\n    }\n  }, {\n    key: \"start\",\n    value: function start() {\n      this.startWhenReady = true;\n      if (!this.ready || this.running) return;\n      if (this.cta != null) {\n        this.cta.start();\n      }\n      if (this.caption != null) {\n        this.caption.start();\n      }\n\n      if (this.component == null) return;\n      this.running = true;\n      this.componentContainerEl.addEventListener(\"transitionend\", this.transitionEndHandler);\n      this.animateNext();\n    }\n  }, {\n    key: \"stop\",\n    value: function stop() {\n      var _this5 = this;\n\n      this.startWhenReady = false;\n      if (!this.running) return;\n      if (this.cta != null) {\n        this.cta.stop();\n      }\n      if (this.caption != null) {\n        this.caption.stop();\n      }\n\n      if (this.component == null) return;\n      clearTimeout(this.animationTimeout);\n      this.componentContainerEl.removeEventListener(\"transitionend\", this.transitionEndHandler);\n      this.running = false;\n      [].concat(_toConsumableArray(this.el.children)).forEach(function (childEl) {\n        // Stop the current transition by setting transition: none, and then reset the style.\n        childEl.style.transition = \"none\";\n        DOMUtils.forceReflow(childEl);\n        // When the component stops, make sure the app info (rather than the component) is displayed.\n        childEl.classList.remove(\"staged\");\n        if (childEl === _this5.componentContainerEl) {\n          childEl.classList.add(\"exited\");\n        } else {\n          childEl.classList.remove(\"exited\");\n        }\n\n        DOMUtils.forceReflow(childEl);\n        childEl.style.transition = null;\n      });\n      this.component.stop();\n    }\n  }]);\n\n  return ProductTileBanner;\n}(Component));\n\n/***/ }),\n\n/***/ 388:\n/***/ (function(module, exports) {\n\n// removed by extract-text-webpack-plugin\n\n/***/ })\n\n/******/ });\n\n\n// WEBPACK FOOTER //\n// product-tile-banner-32facbb20492ed310abf.js"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 386);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 49e3f4ed5eed6f7b6fe0","const { Component, DOMUtils, Utils } = window.Liftoff;\n\nconst MAXIMUM_STAR_RATING = 5;\nconst FILLED_STAR_CHAR = \"&#9733;\";\nconst EMPTY_STAR_CHAR = \"&#9734;\";\n\nconst TEMPLATE = `\n  <div class=\"product-tile-banner loading\">\n    <div class=\"icon switch-with-component\"></div>\n    <div class=\"text-container switch-with-component\">\n      <div class=\"app-name\"></div>\n      <div class=\"star-rating\">\n        <div class=\"empty-stars\">${new Array(MAXIMUM_STAR_RATING)\n          .fill(EMPTY_STAR_CHAR)\n          .join(\"\")}</div>\n        <div class=\"filled-stars\">${new Array(MAXIMUM_STAR_RATING)\n          .fill(FILLED_STAR_CHAR)\n          .join(\"\")}</div>\n      </div>\n      <div class=\"caption\"></div>\n    </div>\n    <div class=\"outer-cta-container switch-with-component\">\n      <div class=\"cta-container\"></div>\n    </div>\n    <div class=\"component-container exited\"></div>\n  </div>\n`;\n\nComponent.register(\n  \"product-tile-banner\",\n  class ProductTileBanner extends Component {\n    constructor(config) {\n      super(config);\n      Object.assign(\n        this,\n        Utils.mergePropertiesWithDefaults(\n          {\n            icon: null,\n            iconStyles: {},\n            appName: \"\",\n            appNameStyles: {},\n            starRating: null,\n            starStyles: {},\n            caption: null,\n            captionStyles: {},\n            cta: null,\n            ctaStyles: {},\n            component: null,\n            componentStyles: {},\n            switchElements: \"all\",\n            appInfoDuration: 1800,\n            componentDuration: 2000,\n            switchingDuration: 500,\n            initialDelay: 1800,\n            appNameLineLimit: null,\n            forceFullscreenWidth: false,\n          },\n          config\n        )\n      );\n      this.transitionEndHandler = (e) => {\n        // We only want to listen to transition events coming from elements in this component (not any bubbling\n        // events from child components). Within this component, \"transform\" and \"visibility\" properties are\n        // both transitioned and both will independently produce transitionend events. But we only want to\n        // respond to one transition per element regardless of the number of properties transitioned.\n        if (e.propertyName !== \"transform\" || e.target !== e.currentTarget)\n          return;\n        this.animateNext();\n      };\n      this.ready = false;\n      this.startWhenReady = false;\n      this.firstAnimationComplete = false;\n      this.running = false;\n      if (this.starRating != null) {\n        this.starRating = Math.min(\n          Math.max(0, this.starRating),\n          MAXIMUM_STAR_RATING\n        );\n      }\n    }\n\n    load() {\n      const loadPromises = [this.component, this.caption, this.cta]\n        .filter((c) => c)\n        .map((c) => c.load());\n      if (this.icon != null) {\n        const imageLoadPromise = Utils.loadImage(this.icon).then(\n          (imgEl) => (this.iconImgEl = imgEl)\n        );\n        loadPromises.push(imageLoadPromise);\n      }\n\n      this.loaded = Promise.all(loadPromises);\n      return this.loaded;\n    }\n\n    layout(parentNode) {\n      super.layout(parentNode);\n\n      this.el = DOMUtils.strToElement(TEMPLATE);\n      if (parentNode.getBoundingClientRect().height >= 80) {\n        this.el.classList.add(\"tablet\");\n      }\n\n      const captionEl = this.el.querySelector(\".caption\");\n      Object.assign(captionEl.style, this.captionStyles);\n      [...this.el.children].forEach((childEl) => {\n        childEl.style.transitionDuration = `${this.switchingDuration}ms`;\n      });\n\n      this.parentNode.appendChild(this.el);\n      this.loaded\n        .then(() => {\n          if (this.cta != null) {\n            const ctaContainer = this.el.querySelector(\".cta-container\");\n            Object.assign(ctaContainer.style, this.ctaStyles);\n            this.cta.layout(ctaContainer);\n          } else {\n            this.el.querySelector(\".outer-cta-container\").remove();\n          }\n\n          if (this.starRating != null) {\n            this.setStarRating();\n            Object.assign(\n              this.el.querySelector(\".star-rating\").style,\n              this.starStyles\n            );\n          } else {\n            this.el.querySelector(\".star-rating\").remove();\n          }\n\n          if (this.icon == null) {\n            return Promise.resolve();\n          }\n\n          this.el.querySelector(\".icon\").appendChild(this.iconImgEl);\n          Object.assign(this.iconImgEl.style, this.iconStyles);\n          return DOMUtils.imageIsRendered(this.iconImgEl);\n        })\n        .then(() => {\n          const appNameEl = this.el.querySelector(\".app-name\");\n          Object.assign(appNameEl.style, this.appNameStyles);\n          if (this.appNameLineLimit != null) {\n            appNameEl.style.visiblity = \"hidden\";\n            // We fill the element with a number of line breaks equal to the line limit to determine the height of\n            // the element were the maximum number of lines to be used.\n            const limitString = Array(this.appNameLineLimit)\n              .fill(\"<br>\")\n              .join(\"\");\n            const conformsToLineLimit = () => {\n              appNameEl.innerHTML = limitString;\n              const limitHeight = appNameEl.getBoundingClientRect().height;\n              appNameEl.innerHTML = this.appName;\n              const populatedHeight = appNameEl.getBoundingClientRect().height;\n              // If the user specified a height via CSS, then populatedHeight will always === limitHeight.\n              // In this case, we assume the user's intent is to make the text fit into the given height,\n              // so we also check `scrollHeight`.\n              return (\n                populatedHeight <= limitHeight &&\n                appNameEl.scrollHeight <= populatedHeight\n              );\n            };\n            let fontSize = parseInt(\n              window.getComputedStyle(appNameEl).fontSize\n            );\n            while (!conformsToLineLimit() && fontSize > 0) {\n              fontSize -= 1;\n              Object.assign(appNameEl.style, {\n                fontSize: `${fontSize}px`,\n                lineHeight: `${fontSize * 1.1}px`,\n              });\n            }\n            appNameEl.style.visbility = \"visible\";\n          }\n          appNameEl.innerHTML = this.appName;\n\n          if (this.caption != null) {\n            const captionContainerEl = this.el.querySelector(\".caption\");\n            // NOTE(Casey): On Safari, without position: absolute on the caption\n            // container during subcomponent layout, children with width: 100%,\n            // height: 100% will be sized relative to the nearest positioned\n            // ancestor, possibly resulting in a caption that extends beyond the\n            // bounds of the component container. We reset the position after layout\n            // to attain proper positioning relative to sibling elements.\n            captionContainerEl.style.position = \"absolute\";\n            this.caption.layout(this.el.querySelector(\".caption\"));\n            captionContainerEl.style.height = `${\n              captionContainerEl.getBoundingClientRect().height\n            }px`;\n            captionContainerEl.style.position = \"relative\";\n          } else {\n            this.el.querySelector(\".caption\").remove();\n          }\n        })\n        .then(() => {\n          if (this.component != null) {\n            this.componentContainerEl = this.el.querySelector(\n              \".component-container\"\n            );\n            Object.assign(\n              this.componentContainerEl.style,\n              this.componentStyles\n            );\n            this.setComponentContainerSize();\n\n            // Force component to take full screen width\n            if (this.forceFullscreenWidth) {\n              this.componentContainerEl.style.width = \"100%\";\n              this.componentContainerEl.style.left = 0;\n\n              // Increase z-index value for icon and cta containers so that they\n              // appear as overlay on the component area\n              this.el.querySelector(\".outer-cta-container\").style.zIndex = 2;\n              this.el.querySelector(\".icon\").style.zIndex = 2;\n            }\n\n            this.component.layout(this.componentContainerEl);\n            DOMUtils.addOneTimeListener(this.el, \"transitionend\", () => {\n              this.firstAnimationComplete = true;\n            });\n          }\n\n          this.ready = true;\n          this.el.classList.remove(\"loading\");\n          if (this.startWhenReady) {\n            this.start();\n          }\n        });\n    }\n\n    setComponentContainerSize() {\n      let left = 0;\n      let right = 0;\n      if (this.switchElements === \"all but cta\" && this.cta != null) {\n        const ctaContainerEl = this.el.querySelector(\".outer-cta-container\");\n        right =\n          this.el.getBoundingClientRect().right -\n          ctaContainerEl.getBoundingClientRect().left;\n        ctaContainerEl.classList.remove(\"switch-with-component\");\n      } else if (this.switchElements === \"all but icon\" && this.icon != null) {\n        DOMUtils.forceReflow(this.el.querySelector(\".icon\"));\n        left = this.el.querySelector(\".icon\").getBoundingClientRect().width;\n        this.el\n          .querySelector(\".icon\")\n          .classList.remove(\"switch-with-component\");\n      }\n\n      Object.assign(this.componentContainerEl.style, {\n        right: `${right}px`,\n        left: `${left}px`,\n      });\n    }\n\n    setStarRating() {\n      const filledStarEl = this.el.querySelector(\".filled-stars\");\n      let filledStarWidth =\n        (this.starRating / MAXIMUM_STAR_RATING) *\n        filledStarEl.getBoundingClientRect().width;\n      // Flooring and subtracting 0.5 was determined empirically to produce a visualization that worked well\n      // for all whole and half values.\n      filledStarWidth = Math.max(Math.floor(filledStarWidth - 0.5), 0);\n      filledStarEl.style.width = `${filledStarWidth}px`;\n    }\n\n    animateNext() {\n      const switchingEls = [\n        ...this.el.querySelectorAll(\".switch-with-component\"),\n      ];\n      const enterEl = (el) => {\n        el.classList.add(\"staged\");\n        el.classList.remove(\"exited\");\n        DOMUtils.forceReflow(el);\n        el.classList.remove(\"staged\");\n      };\n      const exitEl = (el) => el.classList.add(\"exited\");\n\n      if (this.componentContainerEl.classList.contains(\"exited\")) {\n        // Animate component in.\n        const animationDelay = this.firstAnimationComplete\n          ? this.appInfoDuration\n          : this.initialDelay;\n        this.component.stop();\n        this.animationTimeout = setTimeout(() => {\n          switchingEls.forEach(exitEl);\n          enterEl(this.componentContainerEl);\n          this.component.start();\n        }, animationDelay);\n      } else {\n        // Animate app info in.\n        this.animationTimeout = setTimeout(() => {\n          switchingEls.forEach(enterEl);\n          exitEl(this.componentContainerEl);\n        }, this.componentDuration);\n      }\n    }\n\n    resize() {\n      if (this.component == null) return;\n      this.setComponentContainerSize();\n      this.component.resize();\n      this.setStarRating();\n    }\n\n    restart() {\n      this.stop();\n      this.firstAnimationComplete = false;\n      this.start();\n    }\n\n    start() {\n      this.startWhenReady = true;\n      if (!this.ready || this.running) return;\n      if (this.cta != null) {\n        this.cta.start();\n      }\n      if (this.caption != null) {\n        this.caption.start();\n      }\n\n      if (this.component == null) return;\n      this.running = true;\n      this.componentContainerEl.addEventListener(\n        \"transitionend\",\n        this.transitionEndHandler\n      );\n      this.animateNext();\n    }\n\n    stop() {\n      this.startWhenReady = false;\n      if (!this.running) return;\n      if (this.cta != null) {\n        this.cta.stop();\n      }\n      if (this.caption != null) {\n        this.caption.stop();\n      }\n\n      if (this.component == null) return;\n      clearTimeout(this.animationTimeout);\n      this.componentContainerEl.removeEventListener(\n        \"transitionend\",\n        this.transitionEndHandler\n      );\n      this.running = false;\n      [...this.el.children].forEach((childEl) => {\n        // Stop the current transition by setting transition: none, and then reset the style.\n        childEl.style.transition = \"none\";\n        DOMUtils.forceReflow(childEl);\n        // When the component stops, make sure the app info (rather than the component) is displayed.\n        childEl.classList.remove(\"staged\");\n        if (childEl === this.componentContainerEl) {\n          childEl.classList.add(\"exited\");\n        } else {\n          childEl.classList.remove(\"exited\");\n        }\n\n        DOMUtils.forceReflow(childEl);\n        childEl.style.transition = null;\n      });\n      this.component.stop();\n    }\n  }\n);\n\n\n\n// WEBPACK FOOTER //\n// ./components/product-tile-banner/product-tile-banner.js"],"sourceRoot":""}