META-INF.resources.view_calendar_menus.jspf Maven / Gradle / Ivy

Go to download
<%--
/**
 * SPDX-FileCopyrightText: (c) 2000 Liferay, Inc. https://liferay.com
 * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
 */
--%>


	var calendarContainer = Liferay.component(
		'calendarContainer'
	);

	var remoteServices = Liferay.component('remoteServices');

	window.calendarListsMenu = new Liferay.SimpleMenu({
		align: {
			points: [A.WidgetPositionAlign.TL, A.WidgetPositionAlign.BL],
		},
		constrain: true,
		items: [
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					var calendarResourceId = instance.calendarResourceId;

					if (calendarResourceId) {
						Liferay.Util.openWindow({
							dialog: {
								after: {
									destroy: function (event) {
										remoteServices.getResourceCalendars(
											calendarResourceId,
											(calendars) => {
												var calendarList =
													window
														.calendarLists[
														calendarResourceId
													];

												calendarList.set(
													'calendars',
													calendars
												);

												syncCalendarsMap();

												scheduler.load();
											}
										);
									},
								},
								destroyOnHide: true,
								modal: true,
							},
							refreshWindow: window,
							title: '',

							
								
								
							

							uri: Liferay.CalendarUtil.fillURLParameters(
								decodeURIComponent('<%= editCalendarURL %>'),
								{
									calendarResourceId: calendarResourceId,
								}
							),
						});
					}
				},
				id: 'add',
			},
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					var calendarResourceId = instance.calendarResourceId;

					if (calendarResourceId) {
						
							
							
							
						

						window.location.href =
							Liferay.CalendarUtil.fillURLParameters(
								decodeURIComponent('<%= calendarsURL %>'),
								{
									calendarResourceId: calendarResourceId,
								}
							);
					}
				},
				id: 'manage',
			},
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					

					Liferay.Util.openWindow({
						dialog: {
							destroyOnHide: true,
							modal: true,
						},
						dialogIframe: {
							bodyCssClass: 'dialog-with-footer',
						},
						refreshWindow: window,
						title: '',
						uri: decodeURIComponent('<%= permissionsURL %>'),
					});
				},
				id: 'permissions',
			},
		],
		on: {
			visibleChange: function (event) {
				var instance = this;

				var hiddenItems = [];

				if (
					!(
						instance.calendarResourceId ===
						'<%= groupCalendarResource.getCalendarResourceId() %>'
					) ||
					!<%= CalendarPortletPermission.contains(permissionChecker, scopeGroupId, ActionKeys.PERMISSIONS) %>
				) {
					hiddenItems.push('permissions');
				}

				instance.set('hiddenItems', hiddenItems);
			},
		},
		visible: false,
		width: 290,
		zIndex: 500,
	}).render();

	window.calendarsMenu = {
		id: 'calendarsMenu',
		items: [
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					var calendarList = instance.get('host');

					var activeCalendar = calendarList.activeItem;

					
						
						
						
					

					Liferay.Util.openWindow({
						dialog: {
							after: {
								destroy: function (event) {
									scheduler.load();
								},
							},
							destroyOnHide: true,
							modal: true,
						},
						refreshWindow: window,
						title: '',
						uri: Liferay.CalendarUtil.fillURLParameters(
							decodeURIComponent('<%= addCalendarBookingURL %>'),
							{
								calendarId: activeCalendar.get('calendarId'),
							}
						),
					});
				},
				id: 'addEvent',
			},
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					var calendarList = instance.get('host');

					calendarList.remove(calendarList.activeItem);

					refreshVisibleCalendarRenderingRules();

					instance.set('visible', false);
				},
				id: 'hide',
			},
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					var calendarList = instance.get('host');

					var activeCalendar = calendarList.activeItem;

					Liferay.Util.openWindow({
						dialog: {
							after: {
								destroy: function (event) {
									remoteServices.getCalendar(
										activeCalendar.get('calendarId'),
										(calendar) => {
											var activeCalendarId =
												activeCalendar.get('calendarId');

											var calendars = calendarList
												.get('calendars')
												.map((item) => {
													if (
														activeCalendarId ===
														item.get('calendarId')
													) {
														item = calendar;
													}

													return item;
												});

											calendarList.set(
												'calendars',
												calendars
											);

											syncCalendarsMap();

											scheduler.load();
										}
									);
								},
							},
							destroyOnHide: true,
							modal: true,
						},
						refreshWindow: window,
						title: '',

						
							
							
						

						uri: Liferay.CalendarUtil.fillURLParameters(
							decodeURIComponent('<%= editCalendarURL %>'),
							{
								calendarId: activeCalendar.get('calendarId'),
								calendarResourceId:
									activeCalendar.get('calendarResourceId'),
							}
						),
					});
				},
				id: 'settings',
			},
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					var calendarList = instance.get('host');

					var activeCalendar = calendarList.activeItem;

					Liferay.Util.openWindow({
						dialog: {
							after: {
								destroy: function (event) {
									scheduler.load();
								},
							},
							destroyOnHide: true,
							modal: true,
						},
						dialogIframe: {
							bodyCssClass: 'dialog-with-footer',
						},
						refreshWindow: window,
						title: '',

						

						uri: Liferay.CalendarUtil.fillURLParameters(
							decodeURIComponent('<%= permissionsURL %>'),
							{
								modelResourceDescription:
									activeCalendar.get('name'),
								resourceGroupId: activeCalendar.get('groupId'),
								resourcePrimKey: activeCalendar.get('calendarId'),
							}
						),
					});
				},
				id: 'permissions',
			},
			{
				caption: '',
				fn: function (event) {
					var instance = this;

					var calendarList = instance.get('host');

					var activeCalendar = calendarList.activeItem;

					Liferay.Util.openConfirmModal({
						message:
							'',
						onConfirm: (isConfirmed) => {
							if (isConfirmed) {
								var remoteServices = Liferay.component(
									'remoteServices'
								);

								remoteServices.deleteCalendar(
									activeCalendar.get('calendarId'),
									() => {
										remoteServices.getResourceCalendars(
											activeCalendar.get(
												'calendarResourceId'
											),
											(calendars) => {
												calendarList.set(
													'calendars',
													calendars
												);

												syncCalendarsMap();

												scheduler.load();

												Liferay.CalendarMessageUtil.showAlert(
													'alert',
													''
												);
											}
										);
									}
								);
							}
						},
					});
				},
				id: 'delete',
			},

			
				{
					caption: '',
					fn: function (event) {
						var instance = this;

						var calendarList = instance.get('host');

						var activeCalendar = calendarList.activeItem;

						
							
						

						var url = Liferay.CalendarUtil.fillURLParameters(
							decodeURIComponent('<%= calendarRSSURL %>'),
							{
								calendarId: activeCalendar.get('calendarId'),
							}
						);

						window.open(url, '_blank');

						instance.set('visible', false);
					},
					id: 'subscribe',
				},
			

			{
				caption: '-',
				id: 'separator1',
			},
			{
				caption:
					'" class="calendar-portlet-color-picker">',
				id: 'colorPicker',
				onKeyDown: (event) => {
					if (
						event.keyCode === A.Event.KeyMap.SPACE ||
						event.keyCode === A.Event.KeyMap.ENTER
					) {
						event.preventDefault();

						window.colorPicker.focus(
							event.currentTarget
						);
					}
				},
			},
		],
		on: {
			visibleChange: function (event) {
				var instance = this;

				var calendarList = instance.get('host');

				var calendar = calendarList.activeItem;

				if (calendar && event.newVal) {
					var permissions = calendar.get('permissions');

					var hiddenItems = [];

					if (
						calendarList !==
						window.otherCalendarList
					) {
						hiddenItems.push('hide');
					}

					var defaultCalendar = calendar.get('defaultCalendar');

					if (permissions.DELETE === false || defaultCalendar === true) {
						hiddenItems.push('delete');
					}

					if (permissions.MANAGE_BOOKINGS === false) {
						hiddenItems.push('addEvent');
					}

					if (permissions.PERMISSIONS === false) {
						hiddenItems.push('permissions');
					}

					if (permissions.UPDATE === false) {
						hiddenItems.push('settings');
						hiddenItems.push('separator1');
						hiddenItems.push('colorPicker');
					}

					instance.set('hiddenItems', hiddenItems);

					colorPicker.set('host', instance);

					colorPicker.setAttrs({
						color: calendar.get('color'),
						visible: true,
					});

					var colorPickerContainer = instance
						.get('boundingBox')
						.one('.calendar-portlet-color-picker');

					colorPickerContainer.append(
						window.colorPicker.get('boundingBox')
					);
				}
			},
		},
		width: 225,
	};

	window.colorPicker = new Liferay.SimpleColorPicker({
		on: {
			colorChange: function (event) {
				var instance = this;

				var simpleMenu = instance.get('host');

				if (simpleMenu) {
					var calendarList = simpleMenu.get('host');

					calendarList.activeItem.set('color', event.newVal, {
						silent: true,
					});
				}
			},
		},
		visible: false,
	}).render();

	A.one('#calendarListContainer').delegate(
		'click',
		(event) => {
			calendarListContainerEventHandler(event);
		},
		'.calendar-resource-arrow'
	);

	A.one('#calendarListContainer').delegate(
		'keyup',
		(event) => {
			if (event.keyCode === 13) {
				calendarListContainerEventHandler(event);
			}
		},
		'.calendar-resource-arrow'
	);

	window.calendarListContainerEventHandler = function (
		event
	) {
		var currentTarget = event.currentTarget;

		window.calendarListsMenu.calendarResourceId =
			currentTarget.getAttribute('data-calendarResourceId');

		window.calendarListsMenu.setAttrs({
			alignNode: currentTarget,
			toggler: currentTarget,
			visible: !window.calendarListsMenu.get('visible'),
		});
	};

	window.toggler = new A.TogglerDelegate({
		animated: true,
		container: '#calendarListContainer',
		content: '.calendar-portlet-calendar-list',
		header: '.calendar-portlet-list-header',
	});

	
		var addOtherCalendarInput = A.one('#addOtherCalendar');

		

		calendarContainer.createCalendarsAutoComplete(
			'<%= calendarResourcesURL %>',
			addOtherCalendarInput,
			(event) => {
				if (window.event.keyCode === 13 || window.event.type === 'click') {
					window.otherCalendarList.add(event.result.raw);

					refreshVisibleCalendarRenderingRules();

					addOtherCalendarInput.val('');
				}
			}
		);

		addOtherCalendarInput.removeAttribute('aria-expanded');
	

	var columnToggler = document.getElementById(
		'columnToggler'
	);

	if (columnToggler) {
		columnToggler.addEventListener('click', (event) => {
			var columnTogglerIconId = 'columnTogglerIcon';
			var columnGrid = document.getElementById(
				'columnGrid'
			);
			var columnOptions = document.getElementById(
				'columnOptions'
			);
			var columnTogglerIcon = document.getElementById(
				'columnTogglerIcon'
			);

			Liferay.Util.Session.set(
				'com.liferay.calendar.web_columnOptionsVisible',
				columnOptions.classList.contains('hide')
			);

			columnGrid.classList.toggle('col-md-9');
			columnGrid.classList.toggle('col-md-12');

			columnOptions.classList.toggle('hide');

			var newIcon = A.Node.create(
				Liferay.Util.getLexiconIconTpl(
					columnTogglerIcon.classList.contains('lexicon-icon-caret-left')
						? 'caret-right'
						: 'caret-left'
				)
			);

			newIcon.attr('id', columnTogglerIconId);

			columnTogglerIcon.replaceWith(newIcon._node);
		});
	}

	window.refreshMiniCalendarSelectedDates = function () {
		miniCalendar._clearSelection();

		var activeView = scheduler.get('activeView');
		var viewDate = scheduler.get('viewDate');

		if (!activeView) {
			return;
		}

		var viewName = activeView.get('name');

		var total = 1;

		if (viewName == 'month') {
			total = A.Date.daysInMonth(viewDate);
		}
		else if (viewName == 'week') {
			total = 7;
		}

		var selectedDates = Liferay.CalendarUtil.getDatesList(viewDate, total);

		miniCalendar.selectDates(selectedDates);

		var todayDate = scheduler.get('todayDate');

		if (
			selectedDates.length > 0 &&
			DateMath.between(todayDate, selectedDates[0], selectedDates[total - 1])
		) {
			viewDate = todayDate;
		}

		miniCalendar.set('date', viewDate);
	};

	var DateMath = A.DataType.DateMath;

	window.refreshVisibleCalendarRenderingRules = function () {
		var miniCalendarStartDate = DateMath.subtract(
			DateMath.toMidnight(
				window.miniCalendar.get('date')
			),
			DateMath.WEEK,
			1
		);

		var miniCalendarEndDate = DateMath.add(
			DateMath.add(
				window.miniCalendar.get('date'),
				DateMath.MONTH,
				1
			),
			DateMath.WEEK,
			1
		);

		miniCalendarEndDate.setHours(23, 59, 59, 999);

		remoteServices.getCalendarRenderingRules(
			A.Object.keys(calendarContainer.get('visibleCalendars')),
			Liferay.CalendarUtil.toUTC(miniCalendarStartDate),
			Liferay.CalendarUtil.toUTC(miniCalendarEndDate),
			'busy',
			(rulesDefinition) => {
				var selectedDates =
					miniCalendar._getSelectedDatesList();

				window.miniCalendar.set('customRenderer', {
					filterFunction: function (date, node, rules) {
						node.addClass('lfr-busy-day');

						DateMath.toMidnight(date);

						var selected =
							selectedDates.length > 0 &&
							A.Date.isInRange(
								date,
								selectedDates[0],
								selectedDates[selectedDates.length - 1]
							);

						if (A.DataType.DateMath.isToday(date)) {
							node.addClass('lfr-current-day');
						}

						node.toggleClass('yui3-calendar-day-selected', selected);
					},
					rules: rulesDefinition,
				});

				miniCalendar.selectDates(selectedDates);
			}
		);
	};

	window.miniCalendar = new A.Calendar({
		'after': {
			dateChange: refreshVisibleCalendarRenderingRules,
			dateClick: function (event) {
				scheduler.setAttrs({
					date: event.date,
				});
			},
			keydown: function (event) {
				var instance = this;

				var domEvent = event.domEvent;

				if (
					domEvent.keyCode === 13 &&
					domEvent.target.hasClass('yui3-calendar-day-selected')
				) {
					scheduler.setAttrs({
						date: instance._getSelectedDatesList()[0],
					});
				}
			},
		},
		'date': new Date(<%= String.valueOf(date) %>),
		'headerRenderer':
			'<%= HtmlUtil.escapeJS(LanguageUtil.get(request, "b-y")) %>',
		'locale': '<%= themeDisplay.getLocale() %>',
		'strings.first_weekday': <%= weekStartsOn %>,
	}).render('#miniCalendarContainer');

	scheduler.after(
		['*:add', '*:change', '*:load', '*:remove', '*:reset'],
		A.debounce(refreshVisibleCalendarRenderingRules, 100)
	);

	scheduler.after(
		['activeViewChange', 'dateChange'],
		refreshMiniCalendarSelectedDates
	);

	refreshVisibleCalendarRenderingRules();
	refreshMiniCalendarSelectedDates();