https://www.royaloaks.net/html/js/events/event-reservation-dialog.js

1var EVENT_RESERVATION_DIALOG = EVENT_RESERVATION_DIALOG || (function() {
2	var _params = {guestRegistrationURL:'/web/pages/guest-registration' , shoppingCartURL:'/group/pages/shopping-cart'};
3	return {
4		init : function(params) {
5			_params = params;
6		},
7		getParams : function () {
8			return _params;
9		}
10	};
11}());
12
13if (window.addEventListener) {
14	window.addEventListener("message", listenMessage, false);
15} else {
16	window.attachEvent("onmessage", listenMessage);
17}
18
19function listenMessage(msg) {
20
21	var params = EVENT_RESERVATION_DIALOG.getParams();
22
23	if (msg && typeof msg != 'undefined' && msg.data && typeof msg.data != 'undefined' && typeof msg.data.indexOf != 'undefined') {
24
25		if (msg.data.indexOf('CLOSE_EVENTS_RESERVATION_WINDOW') > -1) {
26			closeCalEvent();
27		} else if (msg.data.indexOf('CONTENT_HEIGHT') > -1) {
28			if (isSmartDevice()) {
29				var height = parseInt(msg.data.replace('CONTENT_HEIGHT_', ''));
30				if (!isNaN(height)) {
31					setIframeMinHeight(height + 300);
32				}
33			}
34		} else if (params != null
35				&& msg.data.indexOf('REDIRECT_TO_GUEST_REGISTRATION') > -1) {
36			closeCalEvent();
37			location.href = params.guestRegistrationURL + '?moduleId=23&shoppingCartURL=' + params.shoppingCartURL;
38		} else if (params != null && (msg.data.indexOf('REDIRECT_TO_SHOPPING_CART') > -1 || msg.data.indexOf('REDIRECT_TO_TRANSACTION_SUMMARY') > -1)) {
39
40			try {
41				closeCalEvent();
42
43				if (isIE()) {
44					if (window.parent.opener != null && window.parent.opener.location.href) {
45						opener.location.href = params.shoppingCartURL;
46						 var win=window.open("","_top","","true");
47					     win.opener=true;
48					     win.close();
49					} else {
50						location.href = params.shoppingCartURL;
51					}
52				} else {
53					if (window.parent.opener != null && window.parent.opener.location.href) {
54						window.parent.close();
55						location.href = params.shoppingCartURL;
56					} else {
57						location.href = params.shoppingCartURL;
58					}
59				}
60			} catch (e) {
61				location.href = params.shoppingCartURL;
62			}
63		}
64	}
65}
66
67function isIE() {
68	var _isIE = navigator.userAgent.indexOf("MSIE ");
69	if (_isIE > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) {
70		return true;
71	}
72	return false;
73}
74
75var flag;
76var popupOpenedFrom;
77var POP_UP_OPENED_FROM_MEMBER_RESERVATION = 0;
78var POP_UP_OPENED_FROM_ACTIVITIES = 1;
79var POPUP_OPEN_FROM_CALENDAR = 2;
80var removeEventIdParams = false;
81
82function openCalEvent (url, openFrom) {
83	
84	if (flag) {
85		return;
86	}
87	flag = true;
88	
89	popupOpenedFrom = openFrom;
90	
91	var width = 100;
92	var height = 100;
93	var posTop = 0;
94	var posLeft = 0;
95	var title = 'Event Details';
96

97	if (!isSmartDevice()) {
98		width = 95;
99		height = 90;
100		posLeft = (100 - width) / 2;
101		posTop = (100 - height) / 2;
102	}
103
104	if (url.indexOf('removeParams=true') > -1) {
105		removeEventIdParams = true;
106	}
107	
108	var mask = document.createElement("div");
109	mask.setAttribute("id", "calEventModalMask");
110	mask.setAttribute("class", "yui3-widget-mask");
111	mask.setAttribute("style", "position:fixed;width:100%;height:100%;top:0px;left:0px;z-index:1201;display:block !important");
112
113	var modal = document.createElement("div");
114	modal.setAttribute("id", "calEventModal");
115	modal.setAttribute("class", "yui3-widget modal yui3-widget-positioned yui3-widget-stacked yui3-widget-modal yui3-dd-draggable yui3-resize modal-focused");
116	modal.setAttribute("style", "width:"+width+"%;left:"+posLeft+"%;top:"+posTop+"%;box-sizing:border-box;margin:0;height:"+height+"%;z-index:1201;");
117
118	var modalContent = document.createElement("div");
119	modalContent.setAttribute("class", "modal-content yui3-widget-stdmod yui3-widget-content-expanded");
120
121	var modalHeader = document.createElement("div");
122	modalHeader.setAttribute("id", "calEventModalHeader");
123	modalHeader.setAttribute("class", "yui3-widget-hd modal-header");
124
125	var closeBtnContainer = document.createElement("div");
126	closeBtnContainer.setAttribute("class", "toolbar-content yui3-widget component toolbar");
127	
128	var closeBtn = document.createElement("button");
129	closeBtn.setAttribute("id", "calEventModalCloseBtn");
130	closeBtn.setAttribute("type", "button");
131	closeBtn.setAttribute("class", "btn close");
132	closeBtn.setAttribute("style", "width:20px;margin-top:0;");
133	closeBtn.innerHTML = 'x';
134	closeBtn.addEventListener('click', closeCalEvent);
135	closeBtn.addEventListener('click', postScrollEvent);
136	closeBtnContainer.appendChild(closeBtn);
137
138	var modalTitle = document.createElement("h3");
139	modalTitle.innerHTML = title;
140	modalHeader.appendChild(closeBtnContainer);
141	modalHeader.appendChild(modalTitle);
142
143	var modalbody = document.createElement("div");
144	modalbody.setAttribute("id", "calEventModalBody");
145	modalbody.setAttribute("class", "yui3-widget-bd modal-body dialog-iframe-bd loadingmask-masked");
146	modalbody.setAttribute("style", "-webkit-overflow-scrolling:touch;overflow:auto !important;padding:0;max-height:none;");
147
148	var iframe = document.createElement("iframe");
149	iframe.setAttribute("id", "calEventIframe");
150	iframe.setAttribute("src", url);
151	var styleOfIframe = "border:none;height:100% !important;position:absolute;width:100% !important;left:0;top:0;";
152	

153	if(isSmartDevice()){
154		styleOfIframe = "border:none;height:90% !important;position:absolute;width:100% !important;left:0;top:0;";
155	}
156	
157	iframe.setAttribute("style", styleOfIframe);
158	iframe.setAttribute("onload", "this.scrollIntoView();");
159	iframe.addEventListener('load', function () {
160		var loadingmask = document.getElementById('calEventIframeLoadingMask');
161		if (loadingmask) {
162			loadingmask.className += ' overlaymask-hidden';
163		}
164		if (url.indexOf('SaveReservationSetup.do') == -1) {
165			setIframeContainerSize();	
166		}
167		
168	});
169
170	var loadingmask = document.createElement("div");
171	loadingmask.setAttribute("id", "calEventIframeLoadingMask");
172	loadingmask.setAttribute("class", "loadingmask yui3-widget component overlay overlaymask yui3-widget-positioned yui3-widget-stacked");
173	loadingmask.setAttribute("style", "position:absolute;left:0;top:0;height:100%;width:100%;z-index:1000;");
174
175	var loadingmaskContent = document.createElement("div");
176	loadingmaskContent.setAttribute("class", "loadingmask-content overlay-content overlaymask-content yui3-widget-stdmod yui3-widget-content-expanded");
177	loadingmaskContent.setAttribute("style", "opacity: 0.5;");
178	
179	var loadingmaskMessage = document.createElement("div");
180	loadingmaskMessage.setAttribute("class", "loadingmask-message");
181	loadingmaskMessage.setAttribute("style", "left:50%;top:50%;margin-left:-41px;margin-top:-14px;");
182	
183	var loadingmaskMessageContent = document.createElement("div");
184	loadingmaskMessageContent.setAttribute("class", "loadingmask-message-content");
185	loadingmaskMessageContent.innerHTML = 'Loading...';
186
187	loadingmask.appendChild(loadingmaskContent);
188	loadingmask.appendChild(loadingmaskMessage);
189	loadingmaskMessage.appendChild(loadingmaskMessageContent);
190
191	modalbody.appendChild(iframe);
192	modalbody.appendChild(loadingmask);
193
194	modalContent.appendChild(modalHeader);
195	modalContent.appendChild(modalbody);
196	modal.appendChild(modalContent);
197

198	if (isSmartDevice()) {
199		toggleAllElements(false);
200	}
201
202	document.body.insertBefore(modal, document.body.children.item(0));
203	document.body.insertBefore(mask, document.body.children.item(0));
204	if (url.indexOf('SaveReservationSetup.do') > -1) {
205		setIframeContainerSize();	
206	}
207
208	if (window.addEventListener) {
209		window.addEventListener("resize", setIframeContainerSize, false);
210	} else {
211		window.attachEvent("onresize", setIframeContainerSize);
212	}
213	disableScrollOfParentWindow();
214}
215
216var elementsStyleDisplay = new Array();
217
218function toggleAllElements(flag) {
219	for (var i = 0; i < document.body.children.length; i++) {
220		var elem = document.body.children.item(i);
221		var tagName = elem.tagName.toLowerCase();
222		if (tagName != 'script' && tagName != 'style' && tagName != 'link' && tagName != 'audio') {
223			if (flag) {
224				if (elementsStyleDisplay[i] && elementsStyleDisplay[i] != 'undefined') {
225					elem.style.display = elementsStyleDisplay[i];
226				}else {
227					elem.style.display = '';
228				}
229			} else {
230				if (elem.style.display && elem.style.display !='undefined') {
231					elementsStyleDisplay.push(elem.style.display);
232				} else {
233					elementsStyleDisplay.push('');
234				}
235				elem.style.display = 'none';
236			}
237		} else if( !flag ) {
238			elementsStyleDisplay.push('');
239		}
240	}
241}
242
243function setIframeMinHeight (height) {
244	var iframe = document.getElementById('calEventIframe');
245	if (iframe) {
246		iframe.style.minHeight = height + 'px';
247	}
248}
249function postScrollEvent() {
250	if (parent.document.getElementsByClassName('scroll-after-close-event').length > 0) {
251		var origin = parent.location.origin;
252		parent.postMessage('SCROLL_AFTER_CLOSE_EVENT', origin);
253	}
254}
255
256function closeCalEvent () {
257	flag = false;
258	var calEventModalMask = document.getElementById('calEventModalMask');
259	var calEventModal = document.getElementById('calEventModal');
260	if (calEventModalMask) {
261		document.body.removeChild(calEventModalMask);
262	}
263	if (calEventModal) {
264		document.body.removeChild(calEventModal);
265	}

266	if (isSmartDevice()) {
267		toggleAllElements(true);
268	}
269
270	if (popupOpenedFrom == POP_UP_OPENED_FROM_MEMBER_RESERVATION) {
271		rc_updateMemberReservations();
272	}
273
274	if (popupOpenedFrom == POP_UP_OPENED_FROM_ACTIVITIES) {
275		rc_updateSlotsOnEventReservation();
276	}
277	
278	if (popupOpenedFrom == POPUP_OPEN_FROM_CALENDAR && removeEventIdParams) {
279		window.location.href = location.href.split('?')[0];
280	}
281	enableScrollOfParentWindow();
282}
283
284window.onkeyup = function(e) {
285	if (document.getElementById('calEventModal')) {
286		if (e.keyCode === 27) {
287			closeCalEvent();
288		}
289	}
290}
291
292function setIframeContainerSize () {
293	if (isSmartDevice()) {
294		setIframeContainerSizeForSmartDevice();
295	}
296	else {
297		setIframeContainerSizeForDesktop();
298	}
299}
300
301function setIframeContainerSizeForDesktop () {
302	if (document.getElementById('calEventModalHeader')) {
303		var erModalBodyWidth = document.getElementById('calEventModalHeader').offsetWidth;
304		var erModalBodyHeight = document.getElementById('calEventModal').offsetHeight - 51;
305		document.getElementById('calEventModalBody').style.width = erModalBodyWidth + 'px';
306		document.getElementById('calEventModalBody').style.height = erModalBodyHeight + 'px';
307	}
308}
309
310function setIframeContainerSizeForSmartDevice () {
311	var width = Math.max(document.documentElement.clientWidth, window.innerWidth || 0) - 5;
312	var height = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
313	var calEventModalBody = document.getElementById('calEventModalBody');
314	if (calEventModalBody) {
315		calEventModalBody.style.width = width + 'px';
316		calEventModalBody.style.height = height + 'px';
317	}
318}
319
320function isSmartDevice () {
321	if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
322		return true;
323	}
324	return false
325}
326
327function disableScrollOfParentWindow(){
328	document.body.classList.add("modal-open");
329}
330
331function enableScrollOfParentWindow(){
332	document.body.classList.remove("modal-open");
333}