Source: initiators/ui/banner.js

import Cookie from 'js-cookie';
import DomService from '../domService';
import EventManager from '../eventManager';

/**
 * @memberof Initiators/UI
 * @constructor UiBanner
 * @param {Object} args - all arguments
 * @example
 * const uiBanner = new UiBanner({});
 */
export default class UiBanner {
    args = null;

    constructor(args) {
      this.args = args;
      this.bannerAnimationBlocks = DomService.get('.PlasmaPromotion--animationJs');
      this.bannerCloseButton = DomService.get('.PlasmaPromotion__closeButtonJs');
      this.bannerWrapper = DomService.get('.PlasmaPromotion__wrapperJs');
      this.bannerButton = DomService.get('.PlasmaPromotion__actionButtonJs');
    }

    /**
     * @method UiBanner#run
     * @memberof Initiators/UI
     * @description run banner function
     * @param {Object} tagManager manager for dataLayer variable
     * @example
     * const uiBanner = new UiBanner({});
     * uiBanner.run();
     */
    run = (tagManager) => {
      const bannerFlag = Cookie.get(`promotionBanner_${this.args.id}_closed`);
      const popupFlag = Cookie.get(`promotionPopup_${this.args.id}_closed`);
      this.tagManager = tagManager;

      if (this.args.startDate !== 'none' && this.args.currentDateS >= this.args.endDateS) return;
      if (this.args.startDate !== 'none' && this.args.currentDateS < this.args.startDateS) return;
      if (parseInt(bannerFlag, 10) === 1) return;
      if (DomService.get(`#${this.args.popupId}`) !== null && parseInt(popupFlag, 10) !== 1) return;
      if (this.args.isSticky) {
        DomService.addClass(this.bannerWrapper, ['PlasmaPromotion__wrapperSticky']);
      }
      DomService.addClass(this.bannerWrapper, ['PlasmaPromotion__wrapperSticky']);
      let link = this.bannerButton;
      if (this.args.isLink || document.documentElement.clientWidth < 1024) {
        const elementA = document.createElement('a');
        elementA.setAttribute('href', this.args.href);
        elementA.className = 'PlasmaPromotion__wrapperLinkJs PlasmaPromotion__wrapperLink';
        elementA.setAttribute('target', this.args.targetBlank ? '_blank' : '');
        DomService.prepend(this.bannerWrapper, elementA);
        link = DomService.get('.PlasmaPromotion__wrapperLinkJs');
      } else {
        DomService.attr(this.bannerButton, 'href', this.args.href);
        if (this.args.targetBlank) DomService.attr(this.bannerButton, 'target', '_blank');
      }

      if (link !== null) {
        link.addEventListener('click', this.tagManager.onClickBanner);
      }

      this.showBanner();
      const autoHideBanner = setInterval(() => {
        const time = new Date().getTime();
        if (this.args.endDateMs <= time && this.args.startDateMs >= time) {
          this.hideBanner();
          clearInterval(autoHideBanner);
        }
      }, 1000);
    };

    /**
     * @method UiBanner#showBanner
     * @memberof Initiators/UI
     * @description show banner function
     * @example
     * const uiBanner = new UiBanner({});
     * uiBanner.showBanner();
     */
    showBanner = () => {
      EventManager.dispatch({
        eventName: 'PlasmaBannerScripts.BeforeShowBanner',
      });
      DomService.removeClass(this.bannerAnimationBlocks, ['PlasmaPromotion--moveUp']);
      DomService.addClass(this.bannerAnimationBlocks, ['PlasmaPromotion--moveDown']);
      if (this.bannerCloseButton !== null) {
        this.bannerCloseButton.addEventListener('click', this.hideBanner.bind(this));
      }
      this.tagManager.onShowBanner();
      EventManager.dispatch({
        eventName: 'PlasmaBannerScripts.AfterShowBanner',
      });
    };

    /**
     * @method UiBanner#hideBanner
     * @memberof Initiators/UI
     * @description hide banner function
     * @example
     * const uiBanner = new UiBanner({});
     * uiBanner.hideBanner();
     */
    hideBanner = () => {
      EventManager.dispatch({
        eventName: 'PlasmaBannerScripts.BeforeHideBanner',
      });

      const expires = this.args.closeCookieLifeTime !== '-1'
        ? parseInt(this.args.closeCookieLifeTime, 10)
        : Math.ceil((this.args.endDateS - this.args.currentDateS) / 3600 / 24);
      Cookie.set(`promotionBanner_${this.args.id}_closed`, '1', {
        expires,
      });

      DomService.removeClass(this.bannerAnimationBlocks, ['PlasmaPromotion--moveDown']);
      DomService.addClass(this.bannerAnimationBlocks, ['PlasmaPromotion--moveUp']);
      EventManager.dispatch({
        eventName: 'PlasmaBannerScripts.AfterHideBanner',
      });
    }
}