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',
});
}
}