async function main() {
window.addEventListener("load", function() {
document.querySelectorAll(".btn-thumbs-down").forEach((element) => {
element.addEventListener("click", (event) => {
location.reload();
});
});
document.querySelectorAll(".btn-thumbs-up").forEach((element) => {
element.addEventListener("click", (event) => {
location.reload();
});
});
});
async function fetchKnowledgeArticle() {
try {
const response = await Liferay.Util.fetch(`/o/c/p2s3knowledgearticles/33758895?nestedFields=embeddedTaxonomyCategory,p2s3KnowledgeArticleToP2S3Attachments`, {
headers: {
"Accept-Language": Liferay.ThemeDisplay.getBCP47LanguageId()
}
});
if (!response.ok) {
console.error('Request error:', response.statusText);
return;
}
return response.json();
}
catch (error) {
console.error('Error fetching data:', error);
}
}
function createNavMenuContainer() {
if (!knowledgeArticle?.content) {
return;
}
const pageNavMenu = document.querySelector('.page-nav-menu');
while (pageNavMenu.firstChild) {
pageNavMenu.removeChild(pageNavMenu.firstChild);
}
const knowledgeArticleContent = document.querySelector('.knowledge-article-content');
knowledgeArticleContent.innerHTML = knowledgeArticle.content;
const documentFragment = document.createDocumentFragment();
const h2Elements = knowledgeArticleContent.querySelectorAll('h2');
h2Elements.forEach((h2Element) => {
const textContent = h2Element.textContent.trim();
let id = h2Element.getAttribute('id');
if (!id) {
id = textContent.toLowerCase().replace(/\s+/g, '').replace(/[^\w\-] /g, '');
h2Element.setAttribute('id', id);
}
const anchorElement = document.createElement('a');
anchorElement.className = 'btn btn-nm btn-link px-0';
anchorElement.href = "#" + id;
anchorElement.textContent = textContent;
const divElement = document.createElement('div');
divElement.className = 'component-button text-break';
divElement.appendChild(anchorElement);
documentFragment.appendChild(divElement);
});
pageNavMenu.appendChild(documentFragment);
}
async function createAttachmentsContainter() {
const knowledgeArticleAttachments = knowledgeArticle?.p2s3KnowledgeArticleToP2S3Attachments;
if(!knowledgeArticleAttachments?.length) {
return;
}
const knowledgeArticleAttachmentsContainer = document.querySelector('.knowledge-article-attachments-container');
if (!knowledgeArticleAttachmentsContainer) {
return;
}
const documentFragment = document.createDocumentFragment();
knowledgeArticleAttachments.forEach((item) => {
const knowledgeArticleAttachmentTitleElement = document.createElement('p');
knowledgeArticleAttachmentTitleElement.textContent = item.name;
const downloadButtonElement = document.createElement('a');
downloadButtonElement.className = 'download-button';
downloadButtonElement.download = item.file?.name || 'file';
downloadButtonElement.href = item.file?.link?.href || '#';
downloadButtonElement.target = '_blank';
downloadButtonElement.textContent = 'Download';
const knowledgeArticleAttachmentCardElement = document.createElement('div');
knowledgeArticleAttachmentCardElement.appendChild(knowledgeArticleAttachmentTitleElement);
knowledgeArticleAttachmentCardElement.appendChild(downloadButtonElement);
knowledgeArticleAttachmentCardElement.className = 'attachment-card';
documentFragment.appendChild(knowledgeArticleAttachmentCardElement);
});
knowledgeArticleAttachmentsContainer.appendChild(documentFragment);
}
async function createTaxonomyCategoriesContainer() {
const taxonomyCategoryBriefs = knowledgeArticle?.taxonomyCategoryBriefs;
if (!taxonomyCategoryBriefs?.length) {
return;
}
const taxonomyCategoriesByTaxonomyVocabularyMap = new Map();
for (const taxonomyCategoryBrief of taxonomyCategoryBriefs) {
const {embeddedTaxonomyCategory, taxonomyCategoryId, taxonomyCategoryName} = taxonomyCategoryBrief;
const {parentTaxonomyVocabulary} = embeddedTaxonomyCategory;
const {externalReferenceCode: taxonomyVocabularyExternalReferenceCode, name: taxonomyVocabularyName} = parentTaxonomyVocabulary;
let taxonomyVocabulary = taxonomyCategoriesByTaxonomyVocabularyMap.get(taxonomyVocabularyName);
if (!taxonomyVocabulary) {
taxonomyVocabulary = {
externalReferenceCode: taxonomyVocabularyExternalReferenceCode,
key:taxonomyVocabularyName.toLowerCase(),
name: taxonomyVocabularyName,
taxonomyCategories: []
};
taxonomyCategoriesByTaxonomyVocabularyMap.set(taxonomyVocabularyName, taxonomyVocabulary);
}
taxonomyVocabulary.taxonomyCategories.push({
id: taxonomyCategoryId,
name: taxonomyCategoryName,
vocabulary: taxonomyVocabularyName.toLowerCase(),
});
}
const taxonomyCategoriesByTaxonomyVocabulary = Array.from(taxonomyCategoriesByTaxonomyVocabularyMap.values());
if(!taxonomyCategoriesByTaxonomyVocabulary?.length) {
return;
}
const bottomTaxonomyCategoriesExternalReferenceCode = ['CAPABILITY', 'FEATURE'];
const sideTaxonomyCategoriesExternalReferenceCode = ['APPLICABLE-VERSIONS', 'DEPLOYMENT-APPROACH'];
taxonomyCategoriesByTaxonomyVocabulary.forEach((item) => {
const taxonomyVocabularyTitleElement = document.createElement('h6');
taxonomyVocabularyTitleElement.textContent = item.name;
const sectionElement = document.createElement('section');
sectionElement.appendChild(taxonomyVocabularyTitleElement);
const categoryTagsElement = document.createElement('div');
categoryTagsElement.className = 'category-tags';
let spanClassName = 'category-tag-side';
let targetContainer = document.querySelector('.learn-category-section-side');
if(bottomTaxonomyCategoriesExternalReferenceCode.includes(item.externalReferenceCode)) {
spanClassName = 'category-tag-bottom';
targetContainer = document.querySelector('.learn-category-section-bottom');
}
item.taxonomyCategories.forEach(taxonomyCategory => {
const linkElement = document.createElement('a');
if (taxonomyCategory && spanClassName === 'category-tag-bottom') {
linkElement.href = '/search?' + taxonomyCategory.vocabulary + '=' + taxonomyCategory.id ;
}
linkElement.className = spanClassName;
linkElement.textContent = taxonomyCategory.name;
categoryTagsElement.appendChild(linkElement);
});
sectionElement.appendChild(categoryTagsElement);
if(targetContainer) {
targetContainer.appendChild(sectionElement);
}
});
}
async function createDisclaimerMessage() {
const defaultDisclaimer = document.querySelector('.disclaimer-default');
const howToDisclaimer = document.querySelector('.disclaimer-how-to');
if (knowledgeArticle?.knowledgeArticleType.key == 'howTo') {
howToDisclaimer.classList.remove('d-none');
}
else {
defaultDisclaimer.classList.remove('d-none');
}
}
const knowledgeArticle = await fetchKnowledgeArticle();
createAttachmentsContainter();
createDisclaimerMessage();
createNavMenuContainer();
createTaxonomyCategoriesContainer();
}
main();