https://www.goldenisles.com/includes/public/managed/v_c8155e17_8a2…/common/virtuals/js/shared_footer.js

1// This file will be run in the footer on every page.
2// It should be used for content that relates
3// to your site as a whole, it should not be used for
4// plugin-specific js
5
6require(["jquery", "site_gtm", "plugins_common_custom_ui_watcher", "sv_load!plugins_dynamic_content", "sv_site", "domReady!"], function($, gtm, UIWatcher, dynamic, site) {
7	gtm.update();
8
9	// SEM tracking
10	var uiEvents = new UIWatcher({}, $, document);
11	uiEvents.on("change-page", handlePageChange);
12	uiEvents.on("view-change", handleFilterChange);
13	uiEvents.on("sort-change", handleFilterChange);
14	uiEvents.on("value-change", handleFilterChange);
15	uiEvents.on("toggle-show-more", handleShowMoreToggle);
16	uiEvents.on("scroll-into-view", handleScrollIntoView);
17	uiEvents.on("item-click", handleItemClick);
18	uiEvents.on("map-pin-click", handleMapPinClick);
19	uiEvents.on("tripbuilder", handleTripbuilder);
20	uiEvents.on("qv-tripbuilder", handleTripbuilder);
21	uiEvents.on("quick-view", handleQuickview);
22
23	// tracking handlers
24	function handleTripbuilder(payload){
25		var event = payload.eventContext,
26			widget = payload.widgetContext;
27		var eventCatName = widget.name;
28		switch (event.detailType) {
29				case "listings":
30					eventCatName = "Listings";
31					break;
32				case "events":
33					eventCatName = "Events";
34					break;
35				case "offers":
36					eventCatName = "Coupons";
37					break;
38				default:
39					eventCatName = widget.name;
40		}
41		var data = {
42			eventCategory: eventCatName,
43			eventAction: event.name +" - "+ event.value,
44			eventLabel: event.refTitle,
45			ot: event.type,
46			ltxt: event.displayText,
47			nonInteraction: false
48		}
49		if (data.eventCategory && data.eventAction && data.eventLabel)
50			gtm.sendEvents({tClient: data});
51	}
52	
53	function handleQuickview(payload){
54		var event = payload.eventContext,
55			widget = payload.widgetContext;
56		var eventCatName = widget.name;
57		switch (event.detailType) {
58				case "listings":
59					eventCatName = "Listings";
60					break;
61				case "events":
62					eventCatName = "Events";
63					break;
64				case "offers":
65					eventCatName = "Coupons";
66					break;
67				default:
68					eventCatName = widget.name;
69		}
70		var data = {
71			eventCategory: eventCatName,
72			eventAction: event.linkTo,
73			eventLabel: event.refTitle,
74			ot: event.type,
75			ltxt: event.displayText,
76			nonInteraction: false
77		}
78		if (data.eventCategory && data.eventAction && data.eventLabel)
79			gtm.sendEvents({tClient: data});
80	}
81
82	function handleScrollIntoView(payload){
83		var event = payload.eventContext,
84			widget = payload.widgetContext;
85		var data = {
86			eventCategory: widget.name,
87			eventAction: event.name,
88			eventLabel: "Widget - "+widget.name,
89			nonInteraction: true
90		}
91		if (data.eventCategory && data.eventAction && data.eventLabel)
92			gtm.sendEvents({tClient: data});
93	}
94
95	function handleShowMoreToggle(payload){
96		var event = payload.eventContext,
97			widget = payload.widgetContext;
98		var data = {
99			eventCategory: widget.name,
100			eventAction: event.name,
101			eventLabel: event.displayText+" | "+event.refTitle,
102			nonInteraction: false
103		}
104		let ga4Data = {
105			eventName: "filter",
106			filterType: event.displayText+" | "+event.refTitle,
107			itemType: event.itemType
108		}
109		if (data.eventCategory && data.eventAction && data.eventLabel)
110			gtm.sendEvents({tClient: data});
111		if (ga4Data.eventName && ga4Data.filterType && ga4Data.itemType)
112			gtm.sendEvents({tClient_ga4: ga4Data});
113	}
114
115	function handlePageChange(payload){
116		var event = payload.eventContext,
117			widget = payload.widgetContext;
118		var data = {
119			eventCategory: widget.name,
120			eventAction: event.name,
121			eventLabel: event.refTitle+" | "+event.displayText,
122			nonInteraction: false
123		}
124		let ga4Data = {
125			eventName: "filter",
126			filterType: event.refTitle+" | "+event.displayText,
127			itemType: event.itemType
128		}
129		if (data.eventCategory && data.eventAction && data.eventLabel)
130			gtm.sendEvents({tClient: data});
131		if (ga4Data.eventName && ga4Data.filterType && ga4Data.itemType)
132			gtm.sendEvents({tClient_ga4: ga4Data});
133	}
134

135	function handleItemClick(payload){
136		var event = payload.eventContext,
137			widget = payload.widgetContext;
138		var data = {
139			eventCategory: widget.name,
140			eventAction: event.linkTo,
141			eventLabel: event.refTitle,
142			ot: event.type,
143			ltxt: event.displayText,
144			nonInteraction: false
145		}
146		/* alter action for once there */
147		if (event.recId !== undefined && event.recId.toString().indexOf("ot") > -1) {
148			data.eventAction = "OnceThere";
149		}
150		if (data.eventCategory && data.eventAction && data.eventLabel)
151			gtm.sendEvents({tClient: data});
152		let crmCatSubcat = event?.crmc;
153		if(event?.v_crmc){
154			crmCatSubcat = event.v_crmc;
155		} else if (crmCatSubcat && event.crmsc) {
156			crmCatSubcat += " | " + event.crmsc;
157		}
158		if (event?.name === "Quick View") {
159			var ga4Data = {
160				eventName: "filter",
161				filterType: "Open Quick View",
162				itemType: event.itemType,
163				itemName: event.itemName ?? event.refTitle,
164			}
165			if (ga4Data.eventName && ga4Data.filterType && ga4Data.itemType)
166				gtm.sendEvents({tClient_ga4: ga4Data});
167		} else {
168			var ga4Data = {
169				eventName: event.eventName,
170				itemType: event.itemType,
171				itemName: event.itemName ?? event.refTitle,
172				linkObject: event.linkObject,
173				crmCatSubcat: crmCatSubcat
174			}
175			if (ga4Data.eventName && ga4Data.itemType && ga4Data.itemName && ga4Data.linkObject)
176				gtm.sendEvents({tClient_ga4: ga4Data});
177		}
178	}
179
180	function handleMapPinClick(payload){
181		var event = payload.eventContext,
182			widget = payload.widgetContext;
183		var data = {
184			eventCategory: widget.name,
185			eventAction: event.name,
186			eventLabel: event.refTitle,
187			ot: event.type,
188			nonInteraction: false
189		}
190		if (data.eventCategory && data.eventAction && data.eventLabel)
191			gtm.sendEvents({tClient: data});
192	}
193 
194	function handleFilterChange (payload) {
195		var event = payload.eventContext,
196			widget = payload.widgetContext;
197		var data = {
198			eventCategory: widget.name,
199			eventAction: "Filter Change",
200			eventLabel: event.refTitle+" | "+event.displayText,
201			nonInteraction: false
202		}
203		let ga4Data = {
204			eventName: "filter",
205			filterType: event.refTitle+" | "+event.displayText,
206			itemType: event.itemType
207		}
208		if (data.eventCategory && data.eventAction && data.eventLabel)
209			gtm.sendEvents({tClient: data});
210		if (ga4Data.eventName && ga4Data.filterType && ga4Data.itemType)
211			gtm.sendEvents({tClient_ga4: ga4Data});
212	}
213	// end SEM tracking
214
215	// Init quickview textboxes
216	if (site.siteConfig.custom[site.site].quickview.active) {
217		const textBoxes = document.querySelectorAll('[data-qv-enabled-textbox]');
218	
219		if (textBoxes.length) {
220			require(['plugins_common_custom_quickview_textbox'], function (qv) {
221				qv.init();
222			});
223		}
224	}
225});
226
227// Lazy-load FontAwesome
228(function() {
229	var css = document.createElement('link');
230	css.href = 'https://use.fontawesome.com/releases/v5.14.0/css/all.css';
231	css.rel = 'stylesheet';
232	css.type = 'text/css';
233	document.getElementsByTagName('head')[0].appendChild(css);
234})();
235
236// Lazy-load js for widgets that have the [data-js] attribute on their root node
237(function() {
238	function initDataJs(searchScope, selector = '[data-js]' ){
239		require(['plugins_common_custom_lazyload'], function(lazyload) {
240			var widgetsToLoad = [];
241			let scope = searchScope ? searchScope : document;
242			var els = scope.querySelectorAll(selector);
243
244			for (var i = 0; i < els.length; i++) {
245				widgetsToLoad.push(els[i]);
246			}
247			
248			lazyload.lazy(widgetsToLoad, function(entry, io) {
249				var target = entry.target;
250				var jsFile = target.dataset.js;
251				var guid = target.dataset.guid;
252
253				require([jsFile], function(widget) {
254					widget.init(guid);
255					io.unobserve(target);
256				});
257			});
258		});
259	};
260
261	initDataJs();
262
263	let eventToSelectorMap = {
264		// each event needs a slightly different selector
265		"dynamicContentLoaded": "[data-dynamic-chosen] [data-js]",
266		"abContentLoaded": "[data-ab-chosen] [data-js]"
267	}
268	
269	Object.entries(eventToSelectorMap).forEach( event => {
270		const [eventName, selector] = event;
271		window.addEventListener(eventName, e => {
272			const collections = document.querySelector(`[data-guid="${e}"]`);
273			initDataJs(collections, selector);
274		});
275	});
276})();
277
278// Wrap core_textbox iframes to prevent horizontal overflow
279(function() {
280	const textBoxes = document.querySelectorAll('[data-sv-core-textbox]');
281	if (textBoxes.length) {
282		require(['plugins_common_custom_utils'], function(utils) {

283			textBoxes.forEach(utils.wrapIframes);
284		});
285	}
286})();
287
288// Remove critical styles from head after all CSS files have loaded
289// This prevents a situation where the critical styles cause an override of the CSS in files
290const criticalStyles = document.querySelector('[data-critical-styles]');
291if (criticalStyles) {
292	window.addEventListener('load', e => criticalStyles.remove());
293}
294
295if (window.innerWidth >= 640) {
296	let mb = document.querySelector('.contentRender_name_plugins_collections_template_custom_dtn_mobile_banner');
297	mb.remove();
298}