// source --> https://comune.torreannunziata.na.it/wp-content/plugins/smartpa-active-citizen/public/js/smartpa-active-citizen-public.js?ver=2.0.8 
(function( $ ) {
	'use strict';

	const { __, _x, _n, _nx } = wp.i18n;
	const envSuffix = !activeCitizen.env || activeCitizen.env == 'prod' ? '' : '-' + activeCitizen.env;
	
	$(function() {
		const accessToken = sessionStorage.getItem('access_token');
		if (accessToken) {
			retrieveProfileBaseInfo(accessToken, envSuffix);
		} else {
			$('.it-header-slim-right-zone').find('#headerPlaceholder').html(getHeaderAnon());
		}
	});

	document.addEventListener('ngAccessTokenSet', function () {
		const accessToken = sessionStorage.getItem('access_token');
		if (accessToken) {
			retrieveProfileBaseInfo(accessToken, envSuffix);
		} else {
			$('.it-header-slim-right-zone').find('#headerPlaceholder').html(getHeaderAnon());
		}
	});

	document.addEventListener('ngAppIsStable', function () {
		$("#loadingHeader").fadeOut(350, function() {
			$(this).remove();
		});
	});

})( jQuery );

function retrieveProfileBaseInfo(accessToken, envSuffix = '') {
	const apiUrl = `https://api${envSuffix}.smartpa.cloud/security/v1/profile/profile_base_info`;
	const headers = { 'Authorization': 'Bearer ' + accessToken };

	$.ajax({
		url: apiUrl,
		headers: headers,
		method: 'GET',
		success: function(response) {
			const $dropdownMenu = $('.it-header-slim-right-zone').find('#headerPlaceholder').html(getHeaderLogged(response.firstName, response.lastName));
			const url = window.location.href;
			if (url.includes('cittadino-attivo')) {
				$dropdownMenu.click(function() {
					$(this).find('.btn-dropdown.dropdown-toggle').toggleClass('show');
					$(this).find('.dropdown-menu').toggleClass('show').attr('style', function(_, attr) {
						return !$(this).hasClass('show') ? '' : 'position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate(0px, 36px);';
					});
				});
			}
		},
		error: function(jqXHR, textStatus, errorThrown) {
			console.error('Si è verificato un errore:', errorThrown);
		}
	});
}

function getHeaderLogged(firstName, lastName) {
	const hostWithProtocol = window.location.protocol + '//' + window.location.host;

	return `
	<div class="it-user-wrapper nav-item dropdown">
		<button class="btn btn-dropdown dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
			${lastName} ${firstName}
			<svg class="icon-expand icon icon-sm icon-white">
				<use xlink:href="#it-expand"></use>
			</svg>
		</button>
		<div class="dropdown-menu">
			<div class="row">
				<div class="col-12">
					<div class="link-list-wrapper">
						<ul class="link-list">
							<li>
								<a class="list-item" href="${hostWithProtocol}/cittadino-attivo/#/prenotazioni"><span>Prenotazione appuntamento</span></a>
							</li>
							<li>
								<a class="list-item" href="${hostWithProtocol}/cittadino-attivo/#/segnalazioni"><span>Segnalazione disservizio</span></a>
							</li>
							<li>
								<a class="list-item" href="${hostWithProtocol}/cittadino-attivo/#/richieste"><span>Richiesta assistenza</span></a>
							</li>
							<li>
								<a class="list-item" href="${hostWithProtocol}/cittadino-attivo/#/area-personale"><span>Area personale</span></a>
							</li>
							<li>
								<a class="list-item" href="${hostWithProtocol}/cittadino-attivo/#/profilo"><span>Profilo</span></a>
							</li>
							<li>
								<span class="divider"></span>
							</li>
							<li>
								<a class="list-item" href="${hostWithProtocol}/cittadino-attivo/#/logout"><span>Esci</span></a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	`;
}

function getHeaderAnon() {
	return `
	<button type="button" class="btn btn-primary btn-icon btn-full" aria-label="Accedi" data-bs-toggle="modal" data-bs-target="#access-modal">
		<span class="rounded-icon" aria-hidden="true">
			<svg class="icon icon-primary">
				<use xlink:href="#it-user"></use>
			</svg>
		</span>
		<span class="mr-2 d-none d-lg-block">Accedi all'area personale</span>
	</button>
	`;
};