← All changes | assets/js/modules/countdown-timer/countdown-timer.js +581 -85 1.7 → 2.3.2 View file →

		@@ -1,102 +1,598 @@
1	1	"use strict";
2	2
	3	+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
	4	+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
	5	+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
	6	+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
	7	+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
	8	+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
	9	+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
	10	+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
	11	+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
	12	+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
	13	+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
	14	+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
	15	+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
3	16	;
4	17	(function ($, window, document, undefined) {
5	18	'use strict';
6	19
7		- var countdownTimer, countdownTimerDate, countdownMinExpiration, countdownMaxExpiration;
8		- var countdownTimerId = 'merchant-countdown-timer';
9		- var countdownTimerCookie = 'merchant_countdown_timer_date';
10		- var countdownTimerCoolOffCookie = 'merchant_countdown_timer_cool_off_date';
11		- var setCookie = function setCookie(name, value, expirationDays) {
12		- var date = new Date();
13		- date.setTime(date.getTime() + expirationDays * 24 * 60 * 60 * 1000); // Calculate expiration date
	20	+ $(document).ready(function ($) {
	21	+ new CountDownTimer($);
	22	+ });
	23	+})(jQuery, window, document);
	24	+var defaultStyles = {
	25	+ classic: {
	26	+ labelsColor: '',
	27	+ digitsColor: '#444444',
	28	+ digitsBackground: '',
	29	+ borderColor: '',
	30	+ fontSizeDigits: 16,
	31	+ fontSizeLabels: 16
	32	+ },
	33	+ progress: {
	34	+ labelsColor: '',
	35	+ digitsColor: '#3858E9',
	36	+ digitsBackground: '#3858E9',
	37	+ borderColor: '',
	38	+ progressColor: '#3858E9',
	39	+ fontSizeDigits: 16,
	40	+ fontSizeLabels: 16
	41	+ },
	42	+ circles: {
	43	+ labelsColor: '#7C7C7C',
	44	+ digitsColor: '#000',
	45	+ digitsBackground: '#fff',
	46	+ borderColor: '#444444',
	47	+ progressColor: '#3858E9',
	48	+ fontSizeDigits: 22,
	49	+ fontSizeLabels: 10,
	50	+ width: 80,
	51	+ height: 80
	52	+ },
	53	+ squares: {
	54	+ labelsColor: '#180B40',
	55	+ digitsColor: '#000',
	56	+ digitsBackground: '#fff',
	57	+ borderColor: '#000000',
	58	+ fontSizeDigits: 28,
	59	+ fontSizeLabels: 12,
	60	+ width: 65,
	61	+ height: 65
	62	+ },
	63	+ minimalist: {
	64	+ labelsColor: '#7C7C7C',
	65	+ digitsColor: '#000000',
	66	+ digitsBackground: '#F6F7F7',
	67	+ borderColor: '',
	68	+ fontSizeDigits: 40,
	69	+ fontSizeLabels: 12,
	70	+ width: 80,
	71	+ height: 80
	72	+ },
	73	+ cards: {
	74	+ labelsColor: '#3858E9',
	75	+ digitsColor: '#3858E9',
	76	+ digitsBackground: '#E0E2EC',
	77	+ borderColor: '#000000',
	78	+ fontSizeDigits: 40,
	79	+ fontSizeLabels: 12,
	80	+ width: 80,
	81	+ height: 80
	82	+ },
	83	+ modern: {
	84	+ labelsColor: '#180B40',
	85	+ digitsColor: '#fff',
	86	+ digitsBackground: '#180B40',
	87	+ borderColor: '',
	88	+ fontSizeDigits: 36,
	89	+ fontSizeLabels: 12,
	90	+ width: 80,
	91	+ height: 95
	92	+ }
	93	+};
	94	+var CountDownTimer = /*#__PURE__*/function () {
	95	+ function CountDownTimer($) {
	96	+ var _merchant;
	97	+ _classCallCheck(this, CountDownTimer);
	98	+ this.countDownWrapper = $('.merchant-countdown-timer');
	99	+ this.countDownTimer = this.countDownWrapper.find('.merchant-countdown-timer-countdown');
	100	+ if (!this.countDownTimer.length) {
	101	+ return;
	102	+ }
	103	+ this.total;
	104	+ this.days;
	105	+ this.hours;
	106	+ this.minutes;
	107	+ this.seconds;
	108	+ this.currentTimeInitial = this.getCurrentTime();
	109	+ this.theme = this.countDownWrapper.attr('data-theme');
	110	+ this.timerType = this.countDownWrapper.attr('data-countdown-type');
	111	+ this.startDate = new Date(this.countDownWrapper.attr('data-start-date') || null);
	112	+ this.endDate = new Date(this.countDownWrapper.attr('data-end-date') || null);
	113	+ this.startTime = this.startDate.getTime();
	114	+ this.endTime = this.endDate.getTime();
	115	+ this.minExpiration = parseInt(this.countDownWrapper.attr('data-min-expiration'));
	116	+ this.maxExpiration = parseInt(this.countDownWrapper.attr('data-max-expiration'));
	117	+ this.offPeriod = parseInt(this.countDownWrapper.attr('data-off-period'));
	118	+ this.timerCookie = 'merchant_countdown_timer';
	119	+ this.timerOffPeriodCookie = 'merchant_countdown_timer_off_period';
	120	+ this.variationsDates = this.countDownWrapper.attr('data-variations-dates');
	121	+ this.variationsDates = this.variationsDates ? JSON.parse(this.variationsDates) : [];
	122	+ this.flipTimerKeys = {
	123	+ days: {
	124	+ value: '',
	125	+ currentValue: ''
	126	+ },
	127	+ hours: {
	128	+ value: '',
	129	+ currentValue: ''
	130	+ },
	131	+ minutes: {
	132	+ value: '',
	133	+ currentValue: ''
	134	+ },
	135	+ seconds: {
	136	+ value: '',
	137	+ currentValue: ''
	138	+ }
	139	+ };
14	140
15		- var expires = "expires=" + date.toUTCString();
16		- document.cookie = name + "=" + value + ";" + expires + ";path=/";
17		- };
18		- var getCookie = function getCookie(name) {
19		- var cookieArr = document.cookie.split(';');
20		- for (var i = 0; i < cookieArr.length; i++) {
21		- var cookiePair = cookieArr[i].split('=');
22		- var cookieName = cookiePair[0].trim();
23		- var cookieValue = cookiePair[1].trim();
24		- if (cookieName === name) {
25		- return decodeURIComponent(cookieValue);
	141	+ // Clear cookie page load on admin
	142	+ if ((_merchant = merchant) !== null && _merchant !== void 0 && _merchant.is_admin) {
	143	+ this.deleteCookie(this.timerCookie);
	144	+ this.deleteCookie(this.timerOffPeriodCookie);
	145	+ }
	146	+ this.init();
	147	+ }
	148	+ return _createClass(CountDownTimer, [{
	149	+ key: "init",
	150	+ value: function init() {
	151	+ this.buildTimerMarkup();
	152	+ this.setTimerData();
	153	+ this.startTimer();
	154	+ this.events();
	155	+ }
	156	+ }, {
	157	+ key: "events",
	158	+ value: function events() {
	159	+ this.updateVariationTimer();
	160	+ this.updateAdminPreview();
	161	+ }
	162	+ }, {
	163	+ key: "buildTimerMarkup",
	164	+ value: function buildTimerMarkup() {
	165	+ var countDownEl;
	166	+ if (['classic', 'progress'].includes(this.theme)) {
	167	+ countDownEl = "<span></span>";
	168	+ } else if (this.theme === 'circles') {
	169	+ countDownEl = "\n <div class=\"cd-days\">\n <svg class=\"cd-svg\">\n <circle class=\"circle-static\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n <circle class=\"circle-dynamic\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n </svg>\n <div>\n <span class=\"cd-value\">00</span>\n <span class=\"cd-label\">Days</span>\n </div>\n </div>\n <div class=\"cd-hours\">\n <svg class=\"cd-svg\">\n <circle class=\"circle-static\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n <circle class=\"circle-dynamic\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n </svg>\n <div>\n <span class=\"cd-value\">00</span>\n <span class=\"cd-label\">Hours</span>\n </div>\n </div>\n <div class=\"cd-minutes\">\n <svg class=\"cd-svg\">\n <circle class=\"circle-static\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n <circle class=\"circle-dynamic\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n </svg>\n <div>\n <span class=\"cd-value\">00</span>\n <span class=\"cd-label\">Minutes</span>\n </div>\n </div>\n <div class=\"cd-seconds\">\n <svg class=\"cd-svg\">\n <circle class=\"circle-static\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n <circle class=\"circle-dynamic\" r=\"47%\" cx=\"50%\" cy=\"50%\"></circle>\n </svg>\n <div>\n <span class=\"cd-value\">00</span>\n <span class=\"cd-label\">Seconds</span>\n </div>\n </div>\n ";
	170	+ } else if (this.theme === 'modern') {
	171	+ countDownEl = "\n <div class=\"cd-flip\">\n <div class=\"cd-flip-card cd-days\">\n <div class=\"cd-flip-card-wrapper\">\n <div class=\"cd-flip-card-inner\">\n <span class=\"cd-flip-card-top cd-value\">00</span>\n <span class=\"cd-flip-card-back\" data-time=\"00\">\n <span class=\"cd-flip-card-bottom\" data-time=\"00\"></span>\n </span>\n </div>\n </div>\n <span class=\"cd-flip-clock-label cd-label\">Days</span>\n </div>\n\n <div class=\"cd-flip-card cd-hours\">\n <div class=\"cd-flip-card-wrapper\">\n <div class=\"cd-flip-card-inner\">\n <span class=\"cd-flip-card-top cd-value\">00</span>\n <span class=\"cd-flip-card-back\" data-time=\"00\">\n <span class=\"cd-flip-card-bottom\" data-time=\"00\"></span>\n </span>\n </div>\n </div>\n <span class=\"cd-flip-clock-label cd-label\">Hours</span>\n </div>\n\n <div class=\"cd-flip-card cd-minutes\">\n <div class=\"cd-flip-card-wrapper\">\n <div class=\"cd-flip-card-inner\">\n <span class=\"cd-flip-card-top cd-value\">00</span>\n <span class=\"cd-flip-card-back\" data-time=\"00\">\n <span class=\"cd-flip-card-bottom\" data-time=\"00\"></span>\n </span>\n </div>\n </div>\n <span class=\"cd-flip-clock-label cd-label\">Minutes</span>\n </div>\n \n <div class=\"cd-flip-card cd-seconds\">\n <div class=\"cd-flip-card-wrapper\">\n <div class=\"cd-flip-card-inner\">\n <span class=\"cd-flip-card-top cd-value\">00</span>\n <span class=\"cd-flip-card-back\" data-time=\"00\">\n <span class=\"cd-flip-card-bottom\" data-time=\"00\"></span>\n </span>\n </div>\n </div>\n <span class=\"cd-flip-clock-label cd-label\">Seconds</span>\n </div>\n\n </div>\n ";
	172	+ } else {
	173	+ countDownEl = "\n <div class=\"cd-days\">\n <span class=\"cd-value\" data-time=\"00\">00</span>\n <span class=\"cd-label\">Days</span>\n </div>\n <div class=\"cd-hours\">\n <span class=\"cd-value\" data-time=\"00\">00</span>\n <span class=\"cd-label\" data-time=\"\">Hours</span>\n </div>\n <div class=\"cd-minutes\">\n <span class=\"cd-value\" data-time=\"00\">00</span>\n <span class=\"cd-label\">Minutes</span>\n </div>\n <div class=\"cd-seconds\">\n <span class=\"cd-value\" data-time=\"00\">00</span>\n <span class=\"cd-label\">Seconds</span>\n </div>\n ";
26	174	}
	175	+ this.countDownWrapper.find('.cd-progress').remove();
	176	+
	177	+ // Add the timer
	178	+ this.countDownTimer.html(countDownEl);
	179	+ if (this.theme === 'progress') {
	180	+ jQuery('<progress class="cd-progress" value="0" max="100"></progress>').insertBefore(this.countDownTimer);
	181	+ }
27	182	}
28		- return null;
29		- };
30		- var deleteCookie = function deleteCookie(name) {
31		- document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
32		- };
33		- var updateCountdown = function updateCountdown() {
34		- var now = new Date().getTime();
35		- var minExpirationTime = countdownMinExpiration.getTime();
36		- var maxExpirationTime = countdownMaxExpiration.getTime();
37		- if (now < minExpirationTime) {
38		- // The current time is before the minimum expiration deadline
39		- displayCountdown(maxExpirationTime - now);
40		- } else if (now > maxExpirationTime) {
41		- // The current time is after the maximum expiration deadline
42		- destroyCountDown();
43		- } else {
44		- // The current time is between the minimum and maximum expiration deadlines
45		- destroyCountDown();
	183	+ }, {
	184	+ key: "setTimerData",
	185	+ value: function setTimerData() {
	186	+ if (this.timerType === 'sale-dates') {
	187	+ this.endTime = this.endDate.getTime();
	188	+ } else if (this.timerType === 'evergreen') {
	189	+ // Get data from cookie
	190	+ var cookieTimer = this.getCookie(this.timerCookie);
	191	+ var cookieOffPeriod = this.getCookie(this.timerOffPeriodCookie);
	192	+ var randomTimeInSeconds = this.getRandomValueForCountDown(this.minExpiration, this.maxExpiration);
	193	+ var timeInMilliseconds = randomTimeInSeconds * 1000;
	194	+ var futureTime = this.getCurrentTime() + timeInMilliseconds;
	195	+ var futureDate = new Date(futureTime);
	196	+ var offPeriodMilliseconds = futureTime + this.offPeriod * 1000;
	197	+
	198	+ // If off-period found in cookie but not the timer, means countdown was finished and now it's off-period time.
	199	+ // So don't start the countdown now.
	200	+ var startCountDown = !(!cookieTimer && cookieOffPeriod);
	201	+
	202	+ // If no countdown started yet or off-period is finishes, start the countdown
	203	+ if (startCountDown) {
	204	+ if (!cookieTimer) {
	205	+ this.setCookie(this.timerCookie, futureDate, futureTime);
	206	+ this.setCookie(this.timerOffPeriodCookie, this.offPeriod, offPeriodMilliseconds);
	207	+ this.endTime = futureDate.getTime();
	208	+ } else {
	209	+ // If cookie found
	210	+ this.endTime = new Date(cookieTimer).getTime();
	211	+ if (!cookieOffPeriod) {
	212	+ this.setCookie(this.timerOffPeriodCookie, this.offPeriod, offPeriodMilliseconds);
	213	+ }
	214	+ }
	215	+ } else {
	216	+ this.endTime = 0;
	217	+ this.displayTimer(0);
	218	+ }
	219	+ }
46	220	}
47		- };
48		- var displayCountdown = function displayCountdown(timeLeft) {
49		- var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
50		- var hours = Math.floor(timeLeft % (1000 * 60 * 60 * 24) / (1000 * 60 * 60)).toString().padStart(2, '0');
51		- var minutes = Math.floor(timeLeft % (1000 * 60 * 60) / (1000 * 60)).toString().padStart(2, '0');
52		- var seconds = Math.floor(timeLeft % (1000 * 60) / 1000).toString().padStart(2, '0');
53		- document.getElementById(countdownTimerId).innerHTML = "".concat(days, " days ").concat(hours, ":").concat(minutes, ":").concat(seconds);
54		- if (timeLeft > 0) {
55		- setTimeout(updateCountdown, 1000);
	221	+ }, {
	222	+ key: "startTimer",
	223	+ value: function startTimer() {
	224	+ var remaining = this.getRemainingTime();
	225	+ if (remaining) {
	226	+ this.displayTimer(remaining, this.timerEnd);
	227	+ } else {
	228	+ this.timerEnd();
	229	+ }
	230	+ if (this.theme === 'circles') {
	231	+ this.progressCircles();
	232	+ } else if (this.theme === 'progress') {
	233	+ this.progressBar();
	234	+ }
56	235	}
57		- };
58		- var destroyCountDown = function destroyCountDown() {
59		- displayCountdown(0);
60		- deleteCookie(countdownTimerCookie);
61		- setCoolOffDate();
62		- countdownTimer.hide();
63		- };
64		- var setCoolOffDate = function setCoolOffDate() {
65		- if (!getCookie(countdownTimerCoolOffCookie)) {
66		- var coolOffDate = new Date();
67		- coolOffDate.setMinutes(coolOffDate.getMinutes() + parseInt(countdownTimer.attr('data-cop')));
68		- setCookie(countdownTimerCoolOffCookie, coolOffDate, 1);
	236	+ }, {
	237	+ key: "displayTimer",
	238	+ value: function displayTimer(timeLeftInMilliseconds, timerEndCallback) {
	239	+ timerEndCallback = timerEndCallback || function () {};
	240	+ var classicOrProgress = ['classic', 'progress'].includes(this.theme);
	241	+ this.days = Math.floor(timeLeftInMilliseconds / (1000 * 60 * 60 * 24));
	242	+ this.days = classicOrProgress ? this.days : this.days.toString().padStart(2, '0');
	243	+ this.hours = Math.floor(timeLeftInMilliseconds % (1000 * 60 * 60 * 24) / (1000 * 60 * 60)).toString().padStart(2, '0');
	244	+ this.minutes = Math.floor(timeLeftInMilliseconds % (1000 * 60 * 60) / (1000 * 60)).toString().padStart(2, '0');
	245	+ this.seconds = Math.floor(timeLeftInMilliseconds % (1000 * 60) / 1000).toString().padStart(2, '0');
	246	+ if (classicOrProgress) {
	247	+ this.countDownTimer.find('span').html("".concat(this.days, " <span>days ").concat(this.theme === 'progress' ? ' : ' : '', " </span> ").concat(this.hours, ":").concat(this.minutes, ":").concat(this.seconds));
	248	+ } else if (this.theme === 'modern') {
	249	+ this.flipTimer();
	250	+ } else {
	251	+ this.countDownTimer.find('.cd-days .cd-value').html(this.days).attr('data-time', this.days);
	252	+ this.countDownTimer.find('.cd-hours .cd-value').html(this.hours).attr('data-time', this.hours);
	253	+ this.countDownTimer.find('.cd-minutes .cd-value').html(this.minutes).attr('data-time', this.minutes);
	254	+ this.countDownTimer.find('.cd-seconds .cd-value').html(this.seconds).attr('data-time', this.seconds);
	255	+ }
	256	+ if (timeLeftInMilliseconds <= 0) {
	257	+ timerEndCallback.call(this);
	258	+ } else {
	259	+ this.countDownWrapper.show();
	260	+ setTimeout(this.startTimer.bind(this), 1000);
	261	+ }
69	262	}
70		- };
71		- $(document).ready(function () {
72		- countdownTimer = $('.merchant-countdown-timer');
73		- if (countdownTimer.length) {
74		- var maxExpirationHours = parseInt(countdownTimer.attr('data-max'));
75		- var minExpirationHours = maxExpirationHours - parseInt(countdownTimer.attr('data-min'));
76		- var startCountdown = true;
77		- if (getCookie(countdownTimerCoolOffCookie)) {
78		- var coolOffPeriodDate = new Date(getCookie(countdownTimerCoolOffCookie));
79		- var now = new Date().getTime();
80		- if (now > coolOffPeriodDate) {
81		- deleteCookie(countdownTimerCoolOffCookie);
82		- } else {
83		- startCountdown = false;
	263	+ }, {
	264	+ key: "timerEnd",
	265	+ value: function timerEnd() {
	266	+ var _merchant2;
	267	+ // Keep showing the timer on admin even if countdown finishes
	268	+ (_merchant2 = merchant) !== null && _merchant2 !== void 0 && _merchant2.is_admin ? this.countDownWrapper.show() : this.countDownWrapper.hide();
	269	+ this.displayTimer(0);
	270	+ this.deleteCookie(this.timerCookie);
	271	+ }
	272	+ }, {
	273	+ key: "updateVariationTimer",
	274	+ value: function updateVariationTimer() {
	275	+ if (this.timerType !== 'sale-dates') {
	276	+ return;
	277	+ }
	278	+ var $ = jQuery;
	279	+ var self = this;
	280	+ $('input[name="variation_id"]').on('change', function () {
	281	+ var currentVariationId = parseInt($(this).val());
	282	+ if (currentVariationId && self.variationsDates.length) {
	283	+ var currentVariation = self.variationsDates.find(function (date) {
	284	+ return parseInt(date === null || date === void 0 ? void 0 : date.id) === currentVariationId;
	285	+ });
	286	+ var _ref = currentVariation || {},
	287	+ start = _ref.start,
	288	+ end = _ref.end;
	289	+ var startDate = _typeof(start) === 'object' ? start === null || start === void 0 ? void 0 : start.date : start;
	290	+ var endDate = _typeof(end) === 'object' ? end === null || end === void 0 ? void 0 : end.date : end;
	291	+
	292	+ // Update global data
	293	+ self.startTime = startDate ? new Date(startDate).getTime() : 0;
	294	+ self.endTime = endDate ? new Date(endDate).getTime() : 0;
	295	+ self.displayTimer(0);
	296	+ self.startTimer();
84	297	}
	298	+ });
	299	+ }
	300	+ }, {
	301	+ key: "flipTimer",
	302	+ value: function flipTimer() {
	303	+ var self = this;
	304	+ var $flipCards = this.countDownTimer.find('.cd-flip-card');
	305	+ $flipCards.each(function () {
	306	+ var $card = jQuery(this);
	307	+ var flipKey = '';
	308	+ Object.keys(self.flipTimerKeys).forEach(function (unit) {
	309	+ if ($card.hasClass('cd-' + unit)) {
	310	+ flipKey = unit;
	311	+ return false;
	312	+ }
	313	+ });
	314	+ var currentValue = self.flipTimerKeys[flipKey].currentValue;
	315	+ var newVal = self[flipKey];
	316	+ if (newVal !== currentValue) {
	317	+ var top = $card.find('.cd-flip-card-top');
	318	+ var back = $card.find('.cd-flip-card-back');
	319	+ var backBottom = $card.find('.cd-flip-card-back .cd-flip-card-bottom');
	320	+ if (currentValue >= 0) {
	321	+ back.attr('data-time', currentValue);
	322	+ }
	323	+ self.flipTimerKeys[flipKey].currentValue = newVal;
	324	+ top.html(newVal);
	325	+ backBottom.attr('data-time', newVal);
	326	+ $card.removeClass('cd-flipped');
	327	+ void $card[0].offsetWidth;
	328	+ $card.addClass('cd-flipped');
	329	+ }
	330	+ });
	331	+ }
	332	+ }, {
	333	+ key: "getCurrentTime",
	334	+ value: function getCurrentTime() {
	335	+ var time = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
	336	+ var date = new Date();
	337	+ return time ? date.getTime() : date;
	338	+ }
	339	+ }, {
	340	+ key: "getRemainingTime",
	341	+ value: function getRemainingTime() {
	342	+ var currentTime = this.getCurrentTime();
	343	+ if (this.startTime > currentTime || this.endTime < currentTime) {
	344	+ return 0;
85	345	}
86		- if (startCountdown) {
87		- countdownTimer.show();
88		- if (!getCookie(countdownTimerCookie)) {
89		- countdownTimerDate = new Date();
90		- setCookie(countdownTimerCookie, countdownTimerDate, 9);
91		- } else {
92		- countdownTimerDate = new Date(getCookie(countdownTimerCookie));
	346	+ return Math.max(this.endTime - currentTime, 0);
	347	+ }
	348	+ }, {
	349	+ key: "progressBar",
	350	+ value: function progressBar() {
	351	+ var currentTime = this.getCurrentTime();
	352	+
	353	+ // Set start time to current time when page loads if not already defined.
	354	+ this.startTime = this.startTime || this.currentTimeInitial;
	355	+ this.total = this.endTime - this.startTime;
	356	+ var passedTime = currentTime - this.startTime;
	357	+ var passedTimePercent = passedTime / this.total * 100;
	358	+ var timeLeftPercent = 100 - passedTimePercent;
	359	+ var $progressBar = this.countDownWrapper.find('.cd-progress');
	360	+ if ($progressBar.length) {
	361	+ $progressBar.attr('value', Math.floor(timeLeftPercent));
	362	+ }
	363	+ }
	364	+ }, {
	365	+ key: "progressCircles",
	366	+ value: function progressCircles() {
	367	+ var circleWidth = parseInt(this.countDownWrapper.find('.merchant-countdown-timer-countdown').css('--merchant-digits-width'));
	368	+ var _seconds = 60;
	369	+
	370	+ // 3 times circleWidth fits `stroke-dasharray` properly
	371	+ var strokeDasharray = parseInt(circleWidth) * 3;
	372	+ var getStrokeOffset = function getStrokeOffset(remainingSeconds) {
	373	+ var step = strokeDasharray / 60;
	374	+ return (_seconds - parseInt(remainingSeconds)) * step;
	375	+ };
	376	+ this.countDownTimer.find('.circle-dynamic').css('stroke-dasharray', strokeDasharray);
	377	+ var elements = {
	378	+ days: {
	379	+ $el: this.countDownTimer.find('.cd-days .circle-dynamic'),
	380	+ offset: getStrokeOffset(this.days)
	381	+ },
	382	+ hours: {
	383	+ $el: this.countDownTimer.find('.cd-hours .circle-dynamic'),
	384	+ offset: getStrokeOffset(this.hours)
	385	+ },
	386	+ minutes: {
	387	+ $el: this.countDownTimer.find('.cd-minutes .circle-dynamic'),
	388	+ offset: getStrokeOffset(this.minutes)
	389	+ },
	390	+ seconds: {
	391	+ $el: this.countDownTimer.find('.cd-seconds .circle-dynamic'),
	392	+ offset: getStrokeOffset(this.seconds)
93	393	}
94		- countdownMaxExpiration = new Date(countdownTimerDate.getTime());
95		- countdownMaxExpiration.setHours(countdownMaxExpiration.getHours() + maxExpirationHours);
96		- countdownMinExpiration = new Date(countdownTimerDate.getTime());
97		- countdownMinExpiration.setHours(countdownMinExpiration.getHours() + minExpirationHours);
98		- updateCountdown();
	394	+ };
	395	+ for (var key in elements) {
	396	+ if (Object.hasOwnProperty.call(elements, key)) {
	397	+ var _ref2 = elements[key] || {},
	398	+ $el = _ref2.$el,
	399	+ offset = _ref2.offset;
	400	+ if ($el.length) {
	401	+ $el.css('stroke-dashoffset', offset);
	402	+ }
	403	+ }
99	404	}
100	405	}
101		- });
102		-})(jQuery, window, document);
	406	+ }, {
	407	+ key: "setCookie",
	408	+ value: function setCookie(name, value, expiration) {
	409	+ var date = new Date(expiration);
	410	+ var expires = "expires=".concat(date.toUTCString());
	411	+ document.cookie = "".concat(name, "=").concat(value, ";").concat(expires, ";path=/");
	412	+ }
	413	+ }, {
	414	+ key: "getCookie",
	415	+ value: function getCookie(name) {
	416	+ var cookies = document.cookie.split(';');
	417	+ var _iterator = _createForOfIteratorHelper(cookies),
	418	+ _step;
	419	+ try {
	420	+ for (_iterator.s(); !(_step = _iterator.n()).done;) {
	421	+ var cookie = _step.value;
	422	+ var _cookie$trim$split = cookie.trim().split('='),
	423	+ _cookie$trim$split2 = _slicedToArray(_cookie$trim$split, 2),
	424	+ cookieName = _cookie$trim$split2[0],
	425	+ cookieValue = _cookie$trim$split2[1];
	426	+ if (cookieName === name) {
	427	+ return decodeURIComponent(cookieValue);
	428	+ }
	429	+ }
	430	+ } catch (err) {
	431	+ _iterator.e(err);
	432	+ } finally {
	433	+ _iterator.f();
	434	+ }
	435	+ return null;
	436	+ }
	437	+ }, {
	438	+ key: "deleteCookie",
	439	+ value: function deleteCookie(name) {
	440	+ document.cookie = "".concat(name, "=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;");
	441	+ }
	442	+ }, {
	443	+ key: "getRandomValueForCountDown",
	444	+ value: function getRandomValueForCountDown(min, max) {
	445	+ return Math.floor(Math.random() * (max - min + 1)) + min;
	446	+ }
	447	+
	448	+ // Admin preview
	449	+ }, {
	450	+ key: "updateAdminPreview",
	451	+ value: function updateAdminPreview() {
	452	+ var self = this;
	453	+ var $ = jQuery;
	454	+
	455	+ // On save
	456	+ $(document).on('save.merchant', function (e, module) {
	457	+ if (module === 'countdown-timer') {
	458	+ self.deleteCookie(self.timerOffPeriodCookie);
	459	+ }
	460	+ });
	461	+
	462	+ // On timer type select
	463	+ $(document).on('change', '.merchant-field-end_date select', function () {
	464	+ self.timerType = $(this).val();
	465	+ self.deleteCookie(self.timerCookie);
	466	+ self.deleteCookie(self.timerOffPeriodCookie);
	467	+ self.init();
	468	+ });
	469	+
	470	+ // On theme select
	471	+ $(document).on('change', '.merchant-field-theme input', function () {
	472	+ self.theme = $('.merchant-field-theme input:checked').val();
	473	+ $('.merchant-field-theme input').each(function () {
	474	+ self.countDownWrapper.removeClass('merchant-countdown-timer-' + $(this).val());
	475	+ });
	476	+
	477	+ // Add the class and update attr corresponding to the currently selected theme
	478	+ self.countDownWrapper.attr('data-theme', self.theme).addClass('merchant-countdown-timer-' + self.theme);
	479	+
	480	+ // Re-build the timer
	481	+ self.buildTimerMarkup();
	482	+
	483	+ // Change to default styles
	484	+ self.updateStyles();
	485	+ });
	486	+
	487	+ // On date select
	488	+ $(document).on('change.merchant-datepicker', function (e, date, input) {
	489	+ if (!input) {
	490	+ return;
	491	+ }
	492	+ self.displayTimer(0);
	493	+ var name = input === null || input === void 0 ? void 0 : input.attr('name');
	494	+
	495	+ // Update timer data
	496	+ if (name === 'merchant[sale_start_date]') {
	497	+ self.startTime = new Date(date);
	498	+ }
	499	+ if (name === 'merchant[sale_end_date]') {
	500	+ self.endTime = new Date(date);
	501	+ }
	502	+
	503	+ // Hide
	504	+ self.countDownTimer.hide();
	505	+
	506	+ // Start timer
	507	+ self.startTimer();
	508	+
	509	+ // Show
	510	+ setTimeout(function () {
	511	+ return self.countDownTimer.show();
	512	+ }, 500);
	513	+ });
	514	+
	515	+ // On evergreen fields change
	516	+ var timer = null;
	517	+ $(document).on('input', '.merchant-countdown-evergreen-field input', function () {
	518	+ self.displayTimer(0);
	519	+ clearTimeout(timer);
	520	+ timer = setTimeout(function () {
	521	+ var minDays = 0;
	522	+ var maxDays = 0;
	523	+ var minHours = 2;
	524	+ var maxHours = 26;
	525	+ var minMinutes = 0;
	526	+ var maxMinutes = 0;
	527	+ self.deleteCookie(self.timerCookie);
	528	+ self.deleteCookie(self.timerOffPeriodCookie);
	529	+ $('.merchant-countdown-evergreen-field input').each(function () {
	530	+ var name = $(this).attr('name');
	531	+ var value = +$(this).val();
	532	+ switch (name) {
	533	+ case 'merchant[min_expiration_deadline_days]':
	534	+ minDays = value;
	535	+ break;
	536	+ case 'merchant[max_expiration_deadline_days]':
	537	+ maxDays = value;
	538	+ break;
	539	+ case 'merchant[min_expiration_deadline]':
	540	+ minHours = value;
	541	+ break;
	542	+ case 'merchant[max_expiration_deadline]':
	543	+ maxHours = value;
	544	+ break;
	545	+ case 'merchant[min_expiration_deadline_minutes]':
	546	+ minMinutes = value;
	547	+ break;
	548	+ case 'merchant[max_expiration_deadline_minutes]':
	549	+ maxMinutes = value;
	550	+ break;
	551	+ }
	552	+ });
	553	+ self.minExpiration = minDays * 24 * 60 * 60 + minHours * 60 * 60 + minMinutes * 60;
	554	+ self.maxExpiration = maxDays * 24 * 60 * 60 + maxHours * 60 * 60 + maxMinutes * 60;
	555	+ self.setTimerData();
	556	+ self.startTimer();
	557	+ }, 500);
	558	+ });
	559	+ $(document).on('input', '.merchant-field-cool_off_period input', function () {
	560	+ self.clearOffPeriodCookie = true;
	561	+ });
	562	+
	563	+ // On alignment change
	564	+ $(document).on('change', '.merchant-field-sale_ending_alignment select', function () {
	565	+ $(this).find('option').each(function () {
	566	+ self.countDownWrapper.removeClass('merchant-countdown-timer--' + $(this).val());
	567	+ });
	568	+ self.countDownWrapper.addClass('merchant-countdown-timer--' + $(this).val());
	569	+ });
	570	+ }
	571	+ }, {
	572	+ key: "updateStyles",
	573	+ value: function updateStyles() {
	574	+ var $ = jQuery;
	575	+ var properties = {
	576	+ 'digits_font_size': 'fontSizeDigits',
	577	+ 'labels_font_size': 'fontSizeLabels',
	578	+ 'labels_color': 'labelsColor',
	579	+ 'digits_color': 'digitsColor',
	580	+ 'digits_background': 'digitsBackground',
	581	+ 'progress_color': 'progressColor',
	582	+ 'digits_border': 'borderColor',
	583	+ 'digits_width': 'width',
	584	+ 'digits_height': 'height'
	585	+ };
	586	+ for (var _i = 0, _Object$entries = Object.entries(properties); _i < _Object$entries.length; _i++) {
	587	+ var _defaultStyles$this$t;
	588	+ var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
	589	+ inputName = _Object$entries$_i[0],
	590	+ propertyName = _Object$entries$_i[1];
	591	+ var value = (_defaultStyles$this$t = defaultStyles[this.theme]) === null || _defaultStyles$this$t === void 0 ? void 0 : _defaultStyles$this$t[propertyName];
	592	+ if (value) {
	593	+ $("input[name=\"merchant[".concat(inputName, "]\"]")).val(value).attr('value', value).trigger('input').trigger('change');
	594	+ }
	595	+ }
	596	+ }
	597	+ }]);
	598	+}();