https://www.lelabofragrances.ca/js/functions-new.js

1;(function($, window, document, undefined) {
2	var $win = $(window);
3	var $doc = $(document);
4
5	$doc.ready(function() {
6		$('.order-summary-head .btn-view-cart').on('click', function (event) {
7		    var $this = $(this);
8		    var $count = $this.data('item-count');
9		    var $targetText = $this.find('span');
10
11		    $this.toggleClass('active');  
12
13		    if ($this.hasClass('active')) {
14		    	$targetText.text('Hide Cart (' + $count + ')')
15		    } else {
16		    	$targetText.text('View Cart (' + $count + ')')
17		    };
18		    
19		    $('.order-summary .order-summary-body').toggleClass('expanded');
20		    
21		    event.preventDefault();
22		});
23
24		$('.cart-item').on('click', '.disabled', function(event) {
25			event.preventDefault();
26		});
27
28		var isAutoSearching = false;
29		var isSearchUpdated = false;
30
31		function searchListener() {
32			var $target = $(this);
33			var val = $target.val().trim();
34			var flag = val === '';
35
36			if (isAutoSearching) {
37				isSearchUpdated = true;
38				return;
39			}
40
41			hideNewsletterSignup(true);
42			hideSearchSection(flag);
43
44			!flag && searchAutocomplete('.header-search-results', val);
45		}
46
47		var prevSearchFlag = true;
48
49		function clickOutOfHeader(event) {
50			var $header = $('.header');
51			var $target = $(event.target);
52
53			if ($header.find($target).length) {
54				return;
55			}
56
57			hideSearchSection(true);
58			hideNewsletterSignup(true);
59		}
60
61		function hideSearchSection(flag) {
62			var $body = $('body');
63			var $search = $('.search-new');
64			var $clearBtn = $search.find('.search-clear-btn');
65			var $searchSection = $('.header-search-wrapper');
66			var $bodyOverlay = $('.body-overlay');
67			var $menuNav = $('.nav');
68
69			$menuNav.toggleClass('search-open', !flag);
70			$clearBtn.add($searchSection).add($bodyOverlay).toggleClass('hidden', flag);
71			$search.toggleClass('open', !flag);
72
73			if (prevSearchFlag !== flag) {
74				$body[flag? 'off' : 'on']('click', clickOutOfHeader);
75			}
76
77			prevSearchFlag = flag;
78		}
79
80		var prevNewsletterFlag = true;
81
82		function hideNewsletterSignup(flag, location) {
83			var $body = $('body');
84			var $newsletterSection = $('.header-newsletter-wrapper');
85			var $bodyOverlay = $('.body-overlay');
86			var $form = $newsletterSection.find('.subscribe-form');
87
88			if(location != undefined && $form.find('.subscription-location').length != 0){
89				$form.find('.subscription-location').val(location);
90			}
91
92			$newsletterSection.add($bodyOverlay).toggleClass('hidden', flag);
93			!flag && $form.css('min-height', ($form.outerHeight() * 2 / 3) + 'px');
94
95			if (prevNewsletterFlag !== flag) {
96				$body[flag? 'off' : 'on']('click', clickOutOfHeader);
97			}
98
99			prevNewsletterFlag = flag;
100		}
101
102		function searchAutocomplete(topEl, term) {
103			isAutoSearching = true;
104			isSearchUpdated = false;
105
106			if (!$(topEl).length) {
107				isAutoSearching = false;
108				return;
109			}
110
111			$(topEl).find('ul.header-search-list').html('<li>...loading</li>');
112
113			var criteria = [];
114			
115			if (typeof js_site_var['termSubstitutions'][term] === 'string')
116				term = js_site_var['termSubstitutions'][term];
117			
118			$.each(searchTermConverter(term).query, function (key, value) {
119				criteria.push(key + ':' + value);
120			});
121
122			var query = criteria.join(' OR ');
123			$.ajax({
124				url: "/search/",
125				cache: false,
126				data: {
127					wt: 'json',
128					start: 0,
129					rows: 1000,
130					q: query
131				},
132				success: function (data) {
133					var showMax = 5;
134					data = $.parseJSON(data);
135					$(topEl).find('ul.header-search-list').html(data.response.numFound < 1? '<li>No results</li>' : '');
136					$.each(data.response.docs, function (index, element) {
137						if (index >= showMax) {
138							return false;
139						}
140
141						var url = element.page_name_s;
142						var label = element.product_name_t;
143
144						if (typeof element.attr_product_type != undefined) {
145							label = label + " " + element.attr_product_type;
146						}
147
148						$(topEl).find('ul.header-search-list').append('<li><a href="/' + url + '">' + label + '</a></li>');
149					});
150
151
152					if (data.response.numFound > showMax) {
153						$(topEl).find('ul.header-search-list').append('<li><a href="#" class="header-search-viewall-link">View All (' + data.response.numFound + ')</a></li>');
154						$(topEl).find('.header-search-viewall-link').on('click', function (event) {
155							event.preventDefault();
156							$('.search-new form').submit();
157						})
158					}
159
160					searchAutocompleteCallback(topEl);
161				},
162				error: function () {
163					$(topEl).find('ul.header-search-list').html('');
164					searchAutocompleteCallback(topEl);
165				}
166			});
167		}
168
169		function searchAutocompleteCallback(topEl) {
170			setTimeout(function() {
171				if (!isSearchUpdated) {
172					isAutoSearching = false;

173					return;
174				}
175
176				searchAutocomplete(topEl, $('.search-new .search-new-field').val());
177			}, 100);
178		}
179
180		$('.search-new-field').on('keydown', function(event) {
181			if (!(event.key === 'Enter' || event.keyCode === 13)) {
182				return;
183			}
184
185			event.preventDefault();
186
187			$(this).closest('.search-new').find('form').submit();
188		}).on('focusin input', searchListener).trigger('input');
189
190
191		$('.search-new-btn').on('click', function(event) {
192			event.preventDefault();
193
194			var $this 		= $(this),
195				$search 	= $this.closest('.search-new'),
196				$field 		= $search.find('.search-new-field');
197
198			if(!$search.hasClass('open')) {
199				$search.addClass('open');
200				$field.focus();
201			} else {
202				$search.find('form').submit();
203			}
204		});
205
206
207		$('.search-clear-btn').on('click', function(event) {
208			event.preventDefault();
209
210			var $target = $(this);
211			var $search = $target.closest('.search-new');
212			var $field = $search.find('.search-new-field');
213
214			$field.val('').focus();
215			$target.addClass('hidden');
216		});
217
218		$('.newsletter-signup').on('click', function(event) {
219			event.preventDefault();
220
221			var $newsletterSection = $('.header-newsletter-wrapper');
222
223			hideSearchSection(true);
224			hideNewsletterSignup(!$newsletterSection.hasClass('hidden'), $(this).data('location'));
225		});
226
227		$('.newsletter-popup-btn').on('click', function(event){
228			$('.newsletter-signup').click();
229			var $target = $('.header-wrapper');
230			$('html, body').stop().animate({
231				'scrollTop': $target.offset().top
232			}, 900);
233			return false;
234		});
235
236		$('.subscribe-form').on('click', '.form-close', function(event) {
237			event.preventDefault();
238
239			hideNewsletterSignup(true);
240		});
241
242		$('#acdcConfirmSubscribeButton').on('submit', function() {
243			return $('#acdcConfirmSubscribe').prop('checked');
244		});
245		
246		$('body').on('click', '.scroll-to', function(){	
247			event.preventDefault();
248
249			var target = this.hash,
250			$target = $(target);
251
252			$('html, body').stop().animate({
253			    'scrollTop': $target.offset().top
254			}, 900);
255		});
256
257
258		$('.acf-map').each(function(){
259			render_map( $(this) );
260		});
261
262		$('.search-trigger').on('click', function(event) {
263			event.preventDefault();
264
265			$(this).closest('.search-primary').toggleClass('open');
266		});
267
268		$(".userRegionSelect").dropdown();
269		$(".map-select").dropdown();
270
271		$('.modal-dismis').on('click', function(event) {
272			event.preventDefault();
273
274			$('.modal-pdp').removeClass('open');
275		});
276
277		$('.edit-personalization-popup-trigger').on('click', function(e) {
278			e.preventDefault();
279
280			modifyPersonalizationPopupTrigger(e.currentTarget, true);
281		});
282
283		$('.add-personalization-popup-trigger').on('click', function(e) {
284			e.preventDefault();
285
286			modifyPersonalizationPopupTrigger(e.currentTarget, false);
287		});
288
289		personalizationPopupListeners();
290	});
291})(jQuery, window, document);
292
293var personalizationPopupLabelFontSizes;
294var isPersonalizePopupLabelAndBoxScenario;
295
296var personalizationTypesMap = {
297	7: 'label',
298	8: 'box',
299	9: 'engraving'
300};
301
302var personalizationTypesMapFR = {
303	7: 'sur la bouteille',
304	8: 'sur la boîte',
305	9: 'la gravure sur les bouteilles'
306};
307
308var personalizationTypesArr = Object.entries(personalizationTypesMap)
309	.sort(function(entryA, entryB) {
310		var a = entryA[0];
311		var b = entryB[0];
312
313		return a - b;
314	});
315
316function initPersonalizationPopup(data, modifyFlag, editFlag) {
317	var $popup = $('#popup-personalize');
318	var $title = $popup.find('.popup-title');
319	var $subtitle = $popup.find('.popup-subtitle');
320	var $imageContainer = $popup.find('.personalize-image-container');
321	var $personalizeContainer = $popup.find('.personalize-container');
322	var $errorMsg = $popup.find('.personalize-popup-error-msg,.personalize-popup-plp-error-msg');
323	var $warningMsg = $popup.find('.personalize-popup-warning-msg,.personalize-popup-plp-warning-msg');
324	var $imageRow;
325	var personalization = data.personalization;
326	var personalizationMeta = data.personalizationMeta;
327	var notes = data.notes;
328	var activeKeys = data.activeKeys;
329	var activePersonalization = {};
330	var personalizationList = activeKeys
331		.map(function(key) {
332			if (personalization.hasOwnProperty(key)) {
333				return [key, personalization[key]];
334			}
335
336			return undefined;
337		})
338		.sort(function(entryA, entryB) {
339			var a = entryA[0];
340			var b = entryB[0];
341
342			return parseInt(a, 10) - parseInt(b, 10);
343		});
344
345	activeKeys.forEach(function(key) {
346		var value = personalization[key];
347
348		if (value) {
349			activePersonalization[key] = value;
350		}
351	});
352
353	personalizationPopupLabelFontSizes = [];
354	isPersonalizePopupLabelAndBoxScenario =
355		activePersonalization[7] && activePersonalization[8];
356
357	$popup.data('current-keys', Object.keys(personalization));
358	$popup.toggleClass('large', personalizationList.length > 1);
359
360	$imageContainer.html('');
361	$personalizeContainer
362		.find('.personalize').hide()
363		.find('input').val('').data('savedValue', '');
364	$errorMsg.addClass('hidden');
365	$warningMsg.addClass('hidden');
366
367	if (personalizationMeta) {
368		var headerHtml;
369		var bodyHtml;
370
371		if (personalizationMeta.header) {
372			headerHtml = personalizationMeta.header;
373		} else if (js_site_var['userLanguage'] === 'FR') {
374			headerHtml = 'Personnalisez Votre Création';
375		} else {
376			headerHtml = 'Personalize Your Creation';
377		}
378
379		if (personalizationMeta.body) {
380			bodyHtml = personalizationMeta.body;
381		} else if (js_site_var['userLanguage'] === 'FR') {
382			bodyHtml = 'Si vous choisissez de ne pas personnaliser votre étiquette, celle-ci indiquera « For: You ».';
383		} else {
384			bodyHtml = 'If you choose to skip personalization, your label will reflect “For: You.”';
385		}
386
387		$title.html(headerHtml);
388		$subtitle.html(bodyHtml);
389	}
390
391	$imageRow = $('<div class="personalize-image-row"></div>');
392
393	personalizationList.forEach(function(entry, i) {
394		var key = entry[0];
395		var val = entry[1];
396		var type = personalizationTypesMap[key];
397
398		var x = val.x;
399		var y = val.y;
400		var image = val.image;
401		var index = personalizationTypesArr.findIndex(function (entry) {
402			return entry[0] === key;
403		});
404		var value = notes && notes.length > index? notes[index] : '';
405
406		image = /^(https?:\/\/|\/)/i.test(image) ? image : js_site_var['sku_image_path'] + image;
407

408		var $col = $('<div class="personalize-image-col personalize-image-col--' + key + (i === 0? ' open' : '') + '"></div>');
409		var $wrapper = $('<div class="personalize-image-wrapper"></div>');
410		var $img = $('<img class="personalize-image" src="' + image + '" alt="" width="1200" height="1200" />');
411		var $label = $(
412			'<span '
413			+ 'class="personalize-image-label personalize-image-label-' + key + ' personalize-image-label--' + type +' hidden"'
414			+ ' data-key="' + key + '"'
415			+ '>' + value + '</span>'
416		);
417
418		$label.css({
419			left: x + '%',
420			top: y + '%'
421		});
422
423		personalizationPopupLabelFontSizes.push({
424			font: parseInt(val.fontSize, 10),
425			data: parseInt(key, 10)
426		});
427
428		$wrapper.append($img);
429		$wrapper.append($label);
430		$col.append($wrapper);
431		$imageRow.append($col);
432	});
433
434	function togglePersonalization(key, flag) {
435		var type = personalizationTypesMap[key];
436
437		if (typeof flag === 'undefined') {
438			flag = !!activePersonalization[key];
439		}
440
441		$personalizeContainer.find('.personalize-' + type).toggle(flag);
442		$imageContainer.find('.personalize-image-label-' + key).toggle(flag);
443	}
444
445	if (isPersonalizePopupLabelAndBoxScenario) {
446		$personalizeContainer.find('.personalize-label .form-label')
447			.text(js_site_var['userLanguage'] === 'FR' ?  'Pour:' : 'For:');
448
449		togglePersonalization(7, true);
450		togglePersonalization(8, false);
451	} else {
452		if (personalization[7]) {
453			$personalizeContainer.find('.personalize-label .form-label')
454				.text(js_site_var['userLanguage'] === 'FR' ?  'Personnalisation de Étiquette:' : 'Personalize label:');
455		}
456
457		togglePersonalization(7);
458		togglePersonalization(8);
459	}
460
461	togglePersonalization(9);
462
463	var generatePersonalizationTypeHtml;
464	var personalizeText;
465
466	if (js_site_var['userLanguage'] === 'FR') {
467		generatePersonalizationTypeHtml = function (key) {
468			return '<a href="#" class="personalize-image-text-type" data-key="' + key + '">' + personalizationTypesMapFR[key] + '</a>';
469		};
470	} else {
471		generatePersonalizationTypeHtml = function (key) {
472			return '<a href="#" class="personalize-image-text-type" data-key="' + key + '">' + personalizationTypesMap[key] + '</a>';
473		};
474	}
475
476	if (personalizationList.length > 1) {
477		personalizeText = personalizationList
478			.slice(0, personalizationList.length - 1)
479			.map(function (entry) {
480				var key = entry[0];
481
482				return generatePersonalizationTypeHtml(key);
483			}).join(',') + (js_site_var['userLanguage'] === 'FR' ? ' et ' : ' and ');
484	} else {
485		personalizeText = '';
486	}
487
488	personalizeText += generatePersonalizationTypeHtml(personalizationList[personalizationList.length - 1][0]);
489
490	var personalizationTextLabel = js_site_var['userLanguage'] === 'FR'
491		? 'La personnalisation'
492		: 'Personalization';
493
494	$imageContainer.append($imageRow);
495	$imageContainer.append(
496		'<div class="personalize-image-text">'
497		+ personalizationTextLabel + ': ' + personalizeText
498		+ '</div>'
499	);
500
501	if (!modifyFlag) {
502		$popup.find('.personalize-popup-atc-personalization-btn,.personalize-popup-atc-link')
503			.attr('data-sku-id', data.skuId).data('sku-id', data.skuId)
504			.attr('data-label', data.label).data('label', data.label)
505			.attr('data-price', data.price).data('price', data.price)
506			.attr('data-cat-name', data.catName).data('cat-name', data.catName)
507			.attr('data-product-category', data.productCategory).data('product-category', data.productCategory)
508			.attr('data-gtn', data.gtn).data('gtn', data.gtn)
509			.attr('data-name', data.name).data('name', data.name)
510			.attr('data-variant', data.variant).data('variant', data.variant)
511			.attr('data-product-id', data.productId).data('product-id', data.productId)
512			.attr('data-cat-name', data.cat-name).data('label', data.cat-name);
513	} else {
514
515		$popup.find('.personalize-popup-add-btn,.personalize-popup-edit-btn')
516			.attr('data-item-index', data.itemIndex).data('item-index', data.itemIndex)
517			.attr('data-cartitemids', data.cartitemids).data('cartitemids', data.cartitemids)
518			.data('notes', data.notes)
519			.attr('data-location', data.location);
520	}
521
522	$popup.find('.personalize-popup-action-atc-personalization,.personalize-popup-action-atc')
523		.toggle(!modifyFlag);
524	$popup.find('.personalize-popup-action-add')
525		.toggle(modifyFlag && !editFlag);
526	$popup.find('.personalize-popup-action-edit')
527		.toggle(modifyFlag && editFlag);
528	$popup.find('.personalize-popup-action-unchange')
529		.toggle(modifyFlag);
530
531	personalizationTypesArr
532		.forEach(function(entry, i) {
533			var key = entry[0];
534			var val = personalization[key];
535
536			if (!val) {
537				return;
538			}
539
540			var type = personalizationTypesMap[key];
541			var value = notes && notes.length > i? notes[i] : '';
542			var $field = $personalizeContainer.find('#field-popup-personalize-' + type);
543
544			$field
545				.val(value)
546				.data('savedValue', value)
547				.trigger('input');
548		});
549}
550
551function getPersonalizationPopupFormData() {
552	var $popup = $('#popup-personalize');
553	var currentKeys = $popup.data('current-keys');
554	var keySet = new Set(currentKeys);
555
556	return personalizationTypesArr.map(function(entry) {
557		var key = entry[0];
558		var type = entry[1];
559		var val;
560
561		if (!keySet.has(key)) {
562			return null;
563		}
564
565		if (isPersonalizePopupLabelAndBoxScenario && key === '8') {
566			val = $popup.find('#field-popup-personalize-label').val();
567		} else {
568			val = $popup.find('#field-popup-personalize-' + type).val();
569		}
570
571		return type === 'engraving' ? val.toUpperCase() : val;
572	});
573}
574
575function hasPersonalizationPopupFormBeenUpdated() {
576	var $popup = $('#popup-personalize');
577
578	return personalizationTypesArr.some(function(entry) {
579		var type = entry[1];
580		var $field = $popup.find('#field-popup-personalize-' + type);
581
582		return $field.val() !== $field.data('savedValue');
583	});
584}
585
586/* Behavior functions of personalization */
587function personalizationPopupListeners() {
588	var $popup = $('#popup-personalize');
589
590	function updateCallback() {
591		$popup.removeClass('visible');
592
593		handleCartUpdate();
594	}
595
596	$popup
597		.on('input', '#field-popup-personalize-box,#field-popup-personalize-label', function() {
598			sanitizePersonalizationLabelBoxField(this);
599		})
600		.on('input', '#field-popup-personalize-engraving', function() {
601			sanitizePersonalizationEngravingField(this);
602		})
603		.on('input', '.personalize input', function() {
604			var $field = $(this);
605			var key = $field.data('key');
606			var val = $field.val();
607			var $errorMsg = $popup.find('.personalize-popup-error-msg,.personalize-popup-plp-error-msg');
608			var $warningMsg = $popup.find('.personalize-popup-warning-msg,.personalize-popup-plp-warning-msg');
609
610			$popup
611				.find('.personalize-popup-atc-link,.personalize-popup-unchange-link')
612				.removeClass('clicked-once');
613			$errorMsg.addClass('hidden');
614			$warningMsg.addClass('hidden');
615
616			$('#popup-personalize .personalize-image-label-' + key).text(val);
617
618			// Engraving scenario is not part of the special scenario
619			if (isPersonalizePopupLabelAndBoxScenario && key != 9) {
620				$('#popup-personalize .personalize-image-label-8').text(val);
621				$('#popup-personalize #field-personalize-popup-box').val(val);
622			}
623
624			updateInputCount(this);
625		})
626		.on('focus', '.personalize input', function() {
627			personalizationPopupAllLabelsFontResize(personalizationPopupLabelFontSizes);
628		})
629		.on('click', '.personalize-image-text-type', function(e) {
630			e.preventDefault();
631
632			var $link = $(this);
633			var key = $link.data('key');
634
635			$popup.find('.personalize-image-col').removeClass('open');
636			$popup.find('.personalize-image-col--' + key).addClass('open');
637
638			personalizationPopupLabelFontResize(personalizationPopupLabelFontSizes, key);
639		})

640		.on('click', '.personalize-popup-atc-personalization-btn', function(e) {
641			e.preventDefault();
642
643			var $btn = $(this);
644			var $errorMsg = $('.personalize-popup-error-msg');
645			var $plpErrorMsg = $('.personalize-popup-plp-error-msg');
646			var $warningMsg = $('.personalize-popup-warning-msg');
647			var $plpWarningMsg = $('.personalize-popup-plp-warning-msg');
648			var personalizationFormData = getPersonalizationPopupFormData();
649			var hasPersonalization = personalizationFormData.some(function(value) {
650				return value;
651			});
652
653			$errorMsg.addClass('hidden');
654			$warningMsg.addClass('hidden');
655			$plpWarningMsg.addClass('hidden');
656
657			if (!hasPersonalization) {
658				$plpErrorMsg.removeClass('hidden');
659				return;
660			}
661
662			$plpErrorMsg.addClass('hidden');
663
664			linkAtc($btn, personalizationFormData, updateCallback);
665		})
666		.on('click', '.personalize-popup-add-btn', function(e) {
667			e.preventDefault();
668
669			var $btn = $(this);
670			var $errorMsg = $('.personalize-popup-error-msg');
671			var $plpErrorMsg = $('.personalize-popup-plp-error-msg');
672			var $warningMsg = $('.personalize-popup-warning-msg');
673			var $plpWarningMsg = $('.personalize-popup-plp-warning-msg');
674			var cartItemIds = $btn.data('cartitemids').replace(/[\[\]]/g,'').split(',');
675			var notes = $btn.data('notes');
676			var personalizationFormData = getPersonalizationPopupFormData();
677			var hasPersonalization = personalizationFormData.some(function(value) {
678				return value;
679			});
680
681			$plpErrorMsg.addClass('hidden');
682			$warningMsg.addClass('hidden');
683			$plpWarningMsg.addClass('hidden');
684
685			if (!hasPersonalization) {
686				$errorMsg.removeClass('hidden');
687				return;
688			}
689
690			$errorMsg.addClass('hidden');
691
692			updateCartPersonalization(cartItemIds, personalizationFormData, notes);
693
694			let location = $btn.data('location');
695			window.dataLayer.push({
696				event: 'Cart Personalization',
697				location: location, //mini-cart or cart
698			});
699
700			$popup.removeClass('visible');
701		})
702		.on('click', '.personalize-popup-edit-btn', function(e) {
703			e.preventDefault();
704
705			var $btn = $(this);
706			var cartItemIds = $btn.data('cartitemids').replace(/[\[\]]/g,'').split(',');
707			var notes = $btn.data('notes');
708			var personalizationFormData = getPersonalizationPopupFormData();
709
710			updateCartPersonalization(cartItemIds, personalizationFormData, notes);
711
712			$popup.removeClass('visible');
713		})
714		.on('click', '.personalize-popup-atc-link', function(e) {
715			e.preventDefault();
716
717			var $btn = $(this);
718			var $errorMsg = $('.personalize-popup-error-msg');
719			var $plpErrorMsg = $('.personalize-popup-plp-error-msg');
720			var $warningMsg = $('.personalize-popup-warning-msg');
721			var $plpWarningMsg = $('.personalize-popup-plp-warning-msg');
722			var personalizationFormData = getPersonalizationPopupFormData();
723			var hasPersonalization = personalizationFormData.some(function(value) {
724				return value;
725			});
726
727			$errorMsg.addClass('hidden');
728			$plpErrorMsg.addClass('hidden');
729			$warningMsg.addClass('hidden');
730
731			if (hasPersonalization && !$btn.hasClass('clicked-once')) {
732				$plpWarningMsg.removeClass('hidden');
733
734				$btn.addClass('clicked-once');
735				return;
736			}
737
738			$plpWarningMsg.addClass('hidden');
739
740			$btn.removeClass('clicked-once');
741
742			personalizationFormData = personalizationFormData.map(function (val) {
743				return typeof val === 'string' ? '' : val;
744			});
745
746			linkAtc($btn, personalizationFormData, updateCallback);
747		})
748		.on('click', '.personalize-popup-unchange-link', function(e) {
749			e.preventDefault();
750
751			var $btn = $(this);
752			var $errorMsg = $('.personalize-popup-error-msg');
753			var $plpErrorMsg = $('.personalize-popup-plp-error-msg');
754			var $warningMsg = $('.personalize-popup-warning-msg');
755			var $plpWarningMsg = $('.personalize-popup-plp-warning-msg');
756			var hasPersonalizationChanged = hasPersonalizationPopupFormBeenUpdated();
757
758			$errorMsg.addClass('hidden');
759			$plpErrorMsg.addClass('hidden');
760			$plpWarningMsg.addClass('hidden');
761
762			if (hasPersonalizationChanged && !$btn.hasClass('clicked-once')) {
763				$warningMsg.removeClass('hidden');
764
765				$btn.addClass('clicked-once');
766				return;
767			}
768
769			$warningMsg.addClass('hidden');
770
771			$btn.removeClass('clicked-once');
772
773			$popup.removeClass('visible');
774		})
775		.on('click', function (e) {
776			var $target = $(e.target);
777
778			if (!$target.is($popup)) {
779				return true;
780			}
781
782			var $link = $popup
783				.find('.personalize-popup-atc-link,.personalize-popup-unchange-link')
784				.filter(':visible').first();
785
786			$link.trigger('click');
787
788			return false;

789		});
790
791	$(window).on('resize', function() {
792		personalizationPopupAllLabelsFontResize(personalizationPopupLabelFontSizes);
793	});
794}
795
796/* For managing the various font size based on the window width */
797function personalizationPopupLabelFontResize(fontSizes, key) {
798	var $label = $('#popup-personalize .personalize-image-label-' + key);
799
800	var fontSize = fontSizes.find(function(item) {
801		return item.data === key;
802	});
803
804	var imgHeight = $label.closest('.personalize-image-wrapper').outerHeight();
805	imgHeight = imgHeight / 614;
806	var labelSize = fontSize.font * imgHeight;
807
808	$label.css('font-size', labelSize + 'px');
809}
810
811function personalizationPopupAllLabelsFontResize(fontSizes) {
812	$('#popup-personalize .personalize-image-label').each(function() {
813		var $label = $(this);
814		var key = $label.data('key');
815
816		personalizationPopupLabelFontResize(fontSizes, key);
817	});
818}
819
820function personalizationPopupTrigger(target, modifyFlag, editFlag) {
821	var $target = $(target);
822	var data = $target.data();
823	var personalization = data.personalization;
824
825	if (personalization && !$.isEmptyObject(personalization)) {
826		initPersonalizationPopup(data, modifyFlag, editFlag);
827
828		showPersonalizationPopup();
829		return true;
830	}
831
832	return false;
833}
834
835function addPersonalizationPopupTrigger(target) {
836	var $target = $(target);
837	var personalization = $target.data('personalization');
838
839	if (!personalization) {
840		try {
841			var itemIndex = $target.data('sku-id');
842			var data = JSON.parse($('.personalize-add-data-' + itemIndex).first().text());
843
844			$target.data($.extend({}, data, {
845				activeKeys: Object.keys(data.personalization)
846			}));
847		} catch (err) {
848			console.error(err);
849		}
850	}
851
852	return personalizationPopupTrigger($target, false);
853}
854
855function modifyPersonalizationPopupTrigger(target, editFlag) {
856	var $target = $(target);
857	var personalization = $target.data('personalization');
858
859	if (!personalization) {
860		try {
861			var itemIndex = $target.data('item-index');
862			var keys = $target.data('keys').toString().split(',');
863			var data = JSON.parse($('.personalize-modify-data-' + itemIndex).first().text());
864
865			$target.data($.extend({}, data, {
866				activeKeys: keys
867			}));
868		} catch (err) {
869			console.error(err);
870		}
871	}
872
873	return personalizationPopupTrigger($target, true, editFlag);
874}
875
876function sanitizePersonalizationEngravingField(field) {
877	var $field = $(field);
878	var regex = /[^A-Za-z0-9]/g;
879	var currentValue = $field.val();
880
881	if (regex.test(currentValue)) {
882		var newValue = currentValue.replace(regex, '');
883
884		$field.val(newValue);
885	}
886}
887
888function sanitizePersonalizationLabelBoxField(field) {
889	var $field = $(field);
890	var regex = /[\p{Emoji_Presentation}\p{Extended_Pictographic}\u{FE0E}\u{FE0F}]/gu;
891	var currentValue = $field.val();
892
893	if (regex.test(currentValue)) {
894		var newValue = currentValue.replace(regex, '');
895
896		$field.val(newValue);
897	}
898}
899
900function updateInputCount(field) {
901	var $field = $(field);
902	var $counterElement = $field.parent().siblings('.input-count');
903
904	if ($counterElement.length == 0) {
905		$counterElement = $field.parents('.form-bar').find('.input-count');
906	}
907
908	var maxChars = parseInt($counterElement.data('maxlength'));
909
910	$counterElement.html(maxChars - $field.val().length);
911}