@plasma-platform/clock-timer
Version:
Counter for promotions
162 lines (160 loc) • 8.45 kB
JavaScript
;Object.defineProperty(exports,'__esModule',{value:true});var runtime_es=require('./runtime.es-3e5eb61d.js');function template(locals) {var pug_html = "", pug_interp;var pug_debug_filename, pug_debug_line;try {var pug_debug_sources = {};
;var locals_for_with = (locals || {});(function (styles, time, timerId, timerName) {
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer], [true]), false, true)) + "\u003E";
// iterate time
;(function(){
var $$obj = time;
if ('number' == typeof $$obj.length) {
for (var id = 0, $$l = $$obj.length; id < $$l; id++) {
var val = $$obj[id];
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__fragment], [true]), false, true)) + "\u003E";
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__valueWrapper], [true]), false, true)) + "\u003E";
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__clockFaceTop], [true]), false, true)) + "\u003E\u003C\u002Fdiv\u003E";
pug_html = pug_html + "\u003Cspan" + (runtime_es.p.attr("class", runtime_es.p.classes([`${styles.TMClockTimer__value} ${timerName + '_' + id + '_' + timerId}`], [true]), false, true)) + "\u003E";
pug_html = pug_html + (runtime_es.p.escape(null == (pug_interp = val) ? "" : pug_interp)) + "\u003C\u002Fspan\u003E";
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__clockFaceBottom], [true]), false, true)) + "\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E";
}
} else {
var $$l = 0;
for (var id in $$obj) {
$$l++;
var val = $$obj[id];
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__fragment], [true]), false, true)) + "\u003E";
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__valueWrapper], [true]), false, true)) + "\u003E";
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__clockFaceTop], [true]), false, true)) + "\u003E\u003C\u002Fdiv\u003E";
pug_html = pug_html + "\u003Cspan" + (runtime_es.p.attr("class", runtime_es.p.classes([`${styles.TMClockTimer__value} ${timerName + '_' + id + '_' + timerId}`], [true]), false, true)) + "\u003E";
pug_html = pug_html + (runtime_es.p.escape(null == (pug_interp = val) ? "" : pug_interp)) + "\u003C\u002Fspan\u003E";
pug_html = pug_html + "\u003Cdiv" + (runtime_es.p.attr("class", runtime_es.p.classes([styles.TMClockTimer__clockFaceBottom], [true]), false, true)) + "\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E";
}
}
}).call(this);
pug_html = pug_html + "\u003C\u002Fdiv\u003E";}.call(this,"styles" in locals_for_with?locals_for_with.styles:typeof styles!=="undefined"?styles:undefined,"time" in locals_for_with?locals_for_with.time:typeof time!=="undefined"?time:undefined,"timerId" in locals_for_with?locals_for_with.timerId:typeof timerId!=="undefined"?timerId:undefined,"timerName" in locals_for_with?locals_for_with.timerName:typeof timerName!=="undefined"?timerName:undefined));} catch (err) {runtime_es.p.rethrow(err, pug_debug_filename, pug_debug_line, pug_debug_sources[pug_debug_filename]);}return pug_html;}var styles$1 = {"PlasmaPromotion__timerWrapper":"CNT2B_PlasmaPromotion__timerWrapper__lEHpO","TMClockTimer":"CNT2B_TMClockTimer__SUMT9","TMClockTimer__fragment":"CNT2B_TMClockTimer__fragment__ogC0x","TMClockTimer__valueWrapper":"CNT2B_TMClockTimer__valueWrapper__D4ZPG","TMClockTimer__clockFaceTop":"CNT2B_TMClockTimer__clockFaceTop__yiPt6","TMClockTimer__clockFaceBottom":"CNT2B_TMClockTimer__clockFaceBottom__2ARdz","TMClockTimer__value":"CNT2B_TMClockTimer__value__zAyUA","TMClockTimer__label":"CNT2B_TMClockTimer__label__tnHcY","TMFadeIn":"CNT2B_TMFadeIn__BBsJK","TMFadeOut":"CNT2B_TMFadeOut__-pVYv","TMFadeInScaleIn":"CNT2B_TMFadeInScaleIn__2zTlh","TMFadeOutScaleOut":"CNT2B_TMFadeOutScaleOut__czWzR","TMShake":"CNT2B_TMShake__YOuCe"};/**
* @namespace ClockTimer
* @description Creates CNT2B promotion timer
* @class
* @exports
*/
class CNT2B {
/**
* @method constructor
* @memberOf ClockTimer
* @description CNT2B instance constructor
* @public
*/
constructor(_wrapper) {
/**
* Init
* @description Initializes the timer
* @param {Object} args
* @param {string} args.locale - timer locale
* @param {number} [args.count] - Quantity of ticks for 'counter' timerFace type.
* @param {string} args.timerFace - Timer type (daily | hourly | counter). 'daily' by default
* @param {string} args.timerName - Unique name for the timer
* @param {number} [args.startTimeStamp] - Timer start date
* @param {number} args.endTimeStamp - Timer end date
* @param {string} args.direction - Timer count direction ('decrement' | 'increment') // TODO: implement direction behaviour
*/
runtime_es._(this, "init", args => {
if (!this.timerWrapper) {
return false;
}
const currentDate = Date.now();
const {
timerFace,
timerName,
endTimeStamp,
startTimeStamp,
count
} = args;
if (!endTimeStamp || currentDate > endTimeStamp || currentDate < startTimeStamp) {
return false;
}
const timerId = Math.floor(Date.now() * Math.random());
const timer = new runtime_es.T({
callbacks: {
beforeStart: timeBeforeStart => {
this.timerName = timerName;
this.time = timeBeforeStart.count;
this.html = template({
timerFace: timerFace || 'counter',
time: this.time,
timerId,
styles: styles$1,
timerName
});
},
afterStart: () => {
this.timerWrapper.forEach(wrapper => {
runtime_es.a.renderHtml(wrapper, this.html);
});
},
beforeTick: () => {},
afterTick: timeAfterTick => {
const newTime = timeAfterTick.count;
const changedTime = this.getChangedValues(newTime);
this.time = timeAfterTick.count;
this.updateTimer(changedTime, timerId);
}
},
endTimeStamp,
startTimeStamp,
count,
timerFace
});
// stopTimer function to be passed to class instance
this.stopTimer = timer.stop;
timer.start();
return true;
});
/**
* Update Timer
* @description updates timer value(s)
* @param {Object} changedTime - timer changed values
* @param {number} timerId - generated id to distinguish which timer to update
* @returns {boolean}
*/
runtime_es._(this, "updateTimer", (changedTime, timerId) => {
if (Object.keys(changedTime).length) {
const keys = Object.keys(changedTime);
const values = Object.values(changedTime);
const elements = keys.map(idx => {
return runtime_es.a.getAll(".".concat(this.timerName, "_").concat(idx, "_").concat(timerId));
});
if (elements && elements.length) {
for (let i = 0; i <= elements.length; i += 1) {
if (elements[i] && elements[i].length) {
for (let j = 0; j <= elements[i].length; j += 1) {
if (elements[i][j] && elements[i][j] instanceof HTMLElement) {
elements[i][j].innerText = values[i];
}
}
}
}
}
}
return false;
});
/**
* Get changed values
* @description Compares new and old date and decides which values to change
* @param {Array} newTime - new time arrat
* @param {number} id - timer id
* @returns {Object} - Values to be changed
*/
runtime_es._(this, "getChangedValues", newTime => {
const oldTime = [...this.time];
const changedTime = {};
oldTime.forEach((val, idx) => {
if (oldTime[idx] !== newTime[idx]) {
changedTime[idx] = newTime[idx];
}
});
return changedTime;
});
this.timerWrapper = runtime_es.a.getAll(_wrapper);
this.html = '';
this.time = [];
this.timerName = '';
this.stopTimer = null;
}
}exports.default=CNT2B;