167 lines
6.2 KiB
JavaScript
167 lines
6.2 KiB
JavaScript
function recursiveAdaptWidgets(prefix, element, user) {
|
|
//- This function is a workaround for the currently unworking populate
|
|
//- Feel free to see examples on page-circles-
|
|
|
|
element.querySelectorAll('[' + prefix + '-user-id]').forEach((el) => {
|
|
el.setAttribute(el.getAttribute(prefix + '-user-id'), user['@id']);
|
|
});
|
|
|
|
if (element != document) {
|
|
|
|
//- Allow to bind-user on selected attribute
|
|
if (element.getAttribute(prefix + '-user-id')) {
|
|
element.setAttribute(element.getAttribute(prefix + '-user-id'), user['@id']);
|
|
}
|
|
|
|
//- Allow to set data-src to a children sib-form
|
|
if (element.getAttribute(prefix + '-bind-resources')) {
|
|
let form = element.querySelector(element.getAttribute(prefix + '-bind-resources') + " sib-form");
|
|
if (form) {
|
|
form.setAttribute('data-src', element.component.resourceId.replace('members/', ''));
|
|
}
|
|
}
|
|
|
|
//- Allow to put user on a targetted search field
|
|
if (element.getAttribute(prefix + '-bind-user2input')) {
|
|
element.querySelector(element.getAttribute(prefix + '-bind-user2input')).value = user['@id'];
|
|
}
|
|
|
|
//- In case your sib-display use a multiple, you have to target sub-sib-display auto-generated
|
|
if (element.getAttribute(prefix + '-widgets-multiple') !== null) {
|
|
element.querySelectorAll('div > sib-display').forEach((el) => {
|
|
el.setAttribute(prefix + '-widgets', "");
|
|
});
|
|
}
|
|
}
|
|
|
|
//- This function is hooked every time a sib-something with prefix+"-widgets" is populated
|
|
element.querySelectorAll('[' + prefix + '-widgets]').forEach((elementChild) => {
|
|
elementChild.addEventListener('populate', () => {
|
|
recursiveAdaptWidgets(prefix, elementChild, user);
|
|
});
|
|
});
|
|
}
|
|
|
|
// auxiliary function closes the user profile menu
|
|
function closeUserControls() {
|
|
let userControls = document.querySelector('#user-controls');
|
|
if (userControls) userControls.removeAttribute("open");
|
|
}
|
|
|
|
function closeLeftMenu() {
|
|
let leftMenu = document.querySelector('#main__menu');
|
|
if (leftMenu) leftMenu.removeAttribute("open");
|
|
}
|
|
|
|
function closeRightMenu() {
|
|
let rightMenu = document.querySelectorAll('.jsRightMenu');
|
|
if(Array.from(rightMenu).filter(el=>el.hasAttribute('open')).length > 0) {
|
|
Array.from(document.querySelectorAll('.views-container')).forEach(vC => vC.classList.toggle('sidebar-is-closed'));
|
|
Array.from(rightMenu).forEach(el => el.removeAttribute('open'));
|
|
}
|
|
}
|
|
|
|
function openRightMenu() {
|
|
let rightMenu = document.querySelectorAll('.jsRightMenu');
|
|
Array.from(rightMenu).forEach(el => el.setAttribute('open', ''));
|
|
Array.from(document.querySelectorAll('.views-container')).forEach(vC => vC.classList.toggle('sidebar-is-closed'));
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function (event) {
|
|
const menuWrappers = Array.from(document.querySelectorAll('.menu-wrapper'));
|
|
|
|
//- View change event
|
|
window.addEventListener('navigate', (event) => {
|
|
closeLeftMenu();
|
|
closeUserControls();
|
|
});
|
|
|
|
//- Toggle sub-menus
|
|
menuWrappers.forEach(menuWrapper => {
|
|
const menu = menuWrapper.querySelector('.menu');
|
|
menu.addEventListener('click', e => {
|
|
menuWrapper.classList.toggle('is-closed');
|
|
});
|
|
});
|
|
|
|
//- Watch every sib-forms & update data-src of linked sib-display
|
|
document.querySelectorAll('sib-form').forEach(function (el) {
|
|
el.addEventListener("save", function (event) {
|
|
//clear cache on this resource
|
|
//NOTE: this is required because the cache is not refreshed after POSTing changes on the resource
|
|
if (el.component.resource != null) el.component.resource.clearCache();
|
|
|
|
// if of the edited resource || id of the container of the created resource
|
|
const resourceId = event.detail.resource['@id'] || el.dataset.src;
|
|
|
|
//update all displays which use this resource
|
|
Array.from(document.querySelectorAll('sib-display'))
|
|
.filter(sibDisplay => sibDisplay.component.resourceId == resourceId) // keep only elements with resource == edited resource
|
|
.forEach(e => e.dataset.src = e.dataset.src); // and update them
|
|
});
|
|
});
|
|
|
|
document.querySelector('sib-auth').getUser().then(user => {
|
|
if (user !== null) {
|
|
document.querySelectorAll('.notLoggedIn').forEach(el => el.style.visibility = 'visible');
|
|
// Hide login button if already logged
|
|
document.querySelector('button[role="log in"]').setAttribute('style', 'display:none !important');
|
|
// Set current user id on set-user-id of sib-display
|
|
recursiveAdaptWidgets("hd-inherit", document, user);
|
|
for (leaveBtn of document.querySelectorAll('admin-circle-leave > sib-ac-checker:not([hidden])')) {
|
|
leaveBtn.parentNode.parentNode.parentNode.nextElementSibling.setAttribute('style', 'display:none !important'); // Hide Join button
|
|
}
|
|
}
|
|
}).catch(error => console.log(error));
|
|
|
|
// Document -> close menu
|
|
document.addEventListener("click", event => {
|
|
if (!event.target.closest('#user-controls')) {
|
|
closeUserControls();
|
|
}
|
|
if (!event.target.closest('#main__menu') && event.target.id != "toggleMainMenu") {
|
|
closeLeftMenu();
|
|
}
|
|
if (!event.target.className.includes('jsMobileSidebarOpenButton') && !event.target.className.includes('jsOffsiteToggle')) {
|
|
closeRightMenu();
|
|
}
|
|
});
|
|
|
|
document.querySelector('#toggleMainMenu').addEventListener('click', event => {
|
|
let leftMenu = document.querySelector('#main__menu');
|
|
if (leftMenu.hasAttribute('open')) {
|
|
closeLeftMenu();
|
|
} else {
|
|
leftMenu.setAttribute('open', '');
|
|
}
|
|
});
|
|
|
|
Array.from(document.querySelectorAll('.jsMobileSidebarOpenButton')).forEach(el => {
|
|
el.addEventListener('click', event => {
|
|
openRightMenu();
|
|
});
|
|
});
|
|
|
|
const rightMenus = Array.from(document.querySelectorAll('nav.jsRightMenu'));
|
|
rightMenus.forEach(rightMenu => {
|
|
const btnRightMenu = rightMenu.querySelector("li.jsOffsiteToggle");
|
|
btnRightMenu.addEventListener('click', e => {
|
|
if (rightMenu.hasAttribute('open')) {
|
|
closeRightMenu();
|
|
} else {
|
|
openRightMenu();
|
|
}
|
|
})
|
|
});
|
|
|
|
// listen for keypress
|
|
document.onkeydown = (e) => {
|
|
e = e || window.event;
|
|
if (e.key === "Escape" || e.key === "Esc") {
|
|
closeUserControls();
|
|
closeLeftMenu();
|
|
closeRightMenu();
|
|
}
|
|
};
|
|
|
|
}); |