const URL = "https://wiai.stuve-bamberg.de/vc-customization/"
const LOGO_URL = "img/logos/"

const quickLinks = [
	{
		name_german: "Virtuelle Karte",
		name_english: "Virtual Map",
		url_german: "https://wiai.de/home",
		url_english: "https://wiai.de/home",
		background: "#00457d",
		color: "white",
    icon: "map-marked"
	},
	{
		name_german: "Teams",
		name_english: "Teams",
		url_german: "#",
		url_english: "#",
		background: "#6731b7",
		color: "transparent",
		logo: "microsoft-teams.jpg"
	}
]

window.addEventListener('load', init);
addStylesheetTags();
addScriptTags();

function init() {
	addQuickLinks();
}

/**
 * Add a link to all stylesheets.
 */
function addStylesheetTags() {
	[
    'eets-wiai.css',
    'lib/fontawesome/css/fontawesome.min.css',
    'lib/fontawesome/css/solid.min.css'
  ].forEach(function (link) {
	        let tag = document.createElement('link');
	        tag.rel = 'stylesheet';
	        tag.href = URL + link;
	        document.head.appendChild(tag);
	});
}

/**
 * Add a link to all scripts.
 */
function addScriptTags() {
	['lib/fontawesome/attribution.js'].forEach(function (link) {
		let tag = document.createElement('script');
		tag.src = URL + link;
		document.body.appendChild(tag);
	});
}

/**
 * Add quick link section.
 */
function addQuickLinks() {
	const firstSection = document.getElementById('section-0');
	const quickLinkContainer = document.createElement('div');
	quickLinkContainer.classList.add('wiai-quick-link-container');
	firstSection.prepend(quickLinkContainer);

	quickLinks.forEach(function(quickLink) {
		const element = document.createElement('a');
		element.href = quickLink.url_german
		element.classList.add('wiai-quick-link');
		element.style.setProperty('--bg-color', quickLink.background);
		element.style.setProperty('--color', quickLink.color);
		
    if (quickLink.logo) {
      element.style.setProperty('--bg-image', `url(${URL}${LOGO_URL}${quickLink.logo})`);
      element.innerText = quickLink.name_german;
    } else {
      element.innerHTML = `<i class="fa fa-${quickLink.icon}"/>`
    }
		
    element.title = `${quickLink.name_german} | ${quickLink.name_english}`;
		quickLinkContainer.appendChild(element);
	});
}