plasma-banner-scripts
Version:
<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
183 lines (155 loc) • 7.27 kB
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Source: initiators/ui/popup.js</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<div id="main">
<h1 class="page-title">Source: initiators/ui/popup.js</h1>
<section>
<article>
<pre class="prettyprint source linenums"><code>import Cookie from 'js-cookie';
import DomService from '../domService';
import EventManager from '../eventManager';
/**
* @memberof Initiators/UI
* @constructor UiPopup
* @param {Object} args - all arguments
* @example
* const uiPopup = new UiPopup({});
*/
export default class UiPopup {
args = null;
constructor(args) {
this.args = args;
this.popupCloseButton = DomService.get('.PlasmaPromotionPopup__closeButtonJs');
this.popupButton = DomService.get('.PlasmaPromotionPopup__actionButtonJs');
this.popupAnimationBlocks = DomService.get(`#${this.args.popupId}`);
this.popupWrapper = DomService.get('.PlasmaPromotionPopup__wrapperJs');
}
/**
* @method UiPopup#run
* @memberof Initiators/UI
* @description run popup function
* @param {Object} banner object
* @param {Object} tagManager object
* @example
* const uiPopup = new UiPopup({});
* uiPopup.run();
*/
run = (banner, tagManager) => {
const popupFlag = Cookie.get(`promotionPopup_${this.args.id}_closed`);
const bannerFlag = Cookie.get(`promotionBanner_${this.args.id}_closed`);
if (parseInt(bannerFlag, 10) === 1) return;
if (parseInt(popupFlag, 10) === 1) return;
if (this.args.startDate !== 'none' && this.args.currentDateS >= this.args.endDateS) return;
if (this.args.startDate !== 'none' && this.args.currentDateS < this.args.startDateS) return;
this.banner = banner;
this.tagManager = tagManager;
DomService.attr(this.popupButton, 'href', this.args.href);
this.showPopup();
const autoHideBanner = setInterval(() => {
const time = new Date().getTime();
if (this.args.endDateMs <= time && this.args.startDateMs >= time) {
this.hidePopup(false);
clearInterval(autoHideBanner);
}
}, 1000);
};
/**
* @method UiPopup#showBanner
* @memberof Initiators/UI
* @description show popup function
* @example
* const uiPopup = new UiPopup({});
* uiPopup.showPopup();
*/
showPopup = () => {
EventManager.dispatch({
eventName: 'PlasmaBannerScripts.BeforeShowPopup',
});
const that = this;
DomService.removeClass(this.popupAnimationBlocks, ['PlasmaPromotionPopup--hide']);
DomService.addClass(this.popupAnimationBlocks, ['PlasmaPromotionPopup--show']);
if (this.popupCloseButton !== null) {
this.popupCloseButton.addEventListener('click', that.hidePopup.bind(this, false));
}
document.addEventListener('click', this.outTarget.bind(this));
EventManager.dispatch({
eventName: 'PlasmaBannerScripts.AfterShowPopup',
});
};
/**
* @method UiPopup#hideBanner
* @memberof Initiators/UI
* @description hide popup function
* @param {boolean} outTarget object
* @example
* const uiPopup = new UiPopup({});
* uiPopup.hidePopup();
*/
hidePopup = (outTarget = false) => {
EventManager.dispatch({
eventName: 'PlasmaBannerScripts.BeforeHidePopup',
});
const expires = this.args.closeCookieLifeTime !== '-1'
? parseInt(this.args.closeCookieLifeTime, 10)
: Math.ceil((this.args.endDateS - this.args.currentDateS) / 3600 / 24);
Cookie.set(`promotionPopup_${this.args.id}_closed`, '1', {
expires,
});
DomService.removeClass(this.popupAnimationBlocks, ['PlasmaPromotionPopup--show']);
DomService.addClass(this.popupAnimationBlocks, ['PlasmaPromotionPopup--hide']);
if (this.popupAnimationBlocks !== null) {
this.popupAnimationBlocks.addEventListener('animationend', () => {
this.banner.run(this.tagManager);
if (outTarget) Cookie.remove(`promotionPopup_${this.args.id}_closed`);
this.popupAnimationBlocks.removeEventListener('animationend', () => {
});
});
}
document.removeEventListener('click', this.outTarget);
EventManager.dispatch({
eventName: 'PlasmaBannerScripts.AfterHidePopup',
});
};
/**
* @method UiPopup#outTarget
* @memberof Initiators/UI
* @description outTarget popup click function
* @param {Object} event jQuery Event
* @example
* const uiPopup = new UiPopup({});
* $(document).on('click', uiPopup.outTarget);
*/
outTarget(event) {
if (this.popupWrapper !== null
&& this.popupWrapper.contains(event.target)
&& DomService.hasClass(this.popupAnimationBlocks, 'PlasmaPromotionPopup--show')) {
this.hidePopup.call(this, true);
}
}
}
</code></pre>
</article>
</section>
</div>
<nav>
<h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="Initiators.Promotion.html">Promotion</a></li><li><a href="Initiators_Analytics.TagManager.html">TagManager</a></li><li><a href="Initiators_FlipClock.FlipClockInitiator.html">FlipClockInitiator</a></li><li><a href="Initiators_UI.UiBanner.html">UiBanner</a></li><li><a href="Initiators_UI.UiPopup.html">UiPopup</a></li><li><a href="Utils.Parameters.html">Parameters</a></li></ul><h3>Namespaces</h3><ul><li><a href="Initiators.html">Initiators</a></li><li><a href="Initiators_Analytics.html">Initiators/Analytics</a></li><li><a href="Initiators_FlipClock.html">Initiators/FlipClock</a></li><li><a href="Initiators_FlipClock_Faces.html">Initiators/FlipClock/Faces</a></li><li><a href="Initiators_FlipClock_Language.html">Initiators/FlipClock/Language</a></li><li><a href="Initiators_UI.html">Initiators/UI</a></li><li><a href="Main.html">Main</a></li><li><a href="Utils.html">Utils</a></li></ul><h3>Global</h3><ul><li><a href="global.html#addClass">addClass</a></li><li><a href="global.html#attr">attr</a></li><li><a href="global.html#data">data</a></li><li><a href="global.html#dispatch">dispatch</a></li><li><a href="global.html#get">get</a></li><li><a href="global.html#getAll">getAll</a></li><li><a href="global.html#hasClass">hasClass</a></li><li><a href="global.html#prepend">prepend</a></li><li><a href="global.html#removeAttribute">removeAttribute</a></li><li><a href="global.html#removeClass">removeClass</a></li></ul>
</nav>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.5</a> on Tue Jun 18 2019 11:40:32 GMT+0300 (Eastern European Summer Time)
</footer>
<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>