minor: Implement core 0.10

This commit is contained in:
Jean-Baptiste Pasquier
2020-06-18 20:02:54 +02:00
parent 772c65dfe1
commit 2ae8db7429
61 changed files with 439 additions and 534 deletions

View File

@ -1,158 +0,0 @@
//auxiliary function clears cache & refreshes sib-displays for a given resource ID
function refreshSibDisplays(resourceId, clearCache = true) {
let cacheCleared = false;
Array.from(document.querySelectorAll("sib-display"))
.filter(sibDisplay => sibDisplay.component?sibDisplay.component.resourceId == resourceId:false) // keep only elements with resource == edited resource
.forEach(async (e) => {
//clear cache if we were unable to before
if ((clearCache && !cacheCleared) && e.component.resource != null) {
await e.component.resource.clearCache();
cacheCleared = true;
}
e.dataset.src = e.dataset.src;
}); // and update them
}
async function updateSources(resource) {
let res = resource.split('/');
res.splice(3, 0, 'sources');
let cacheCleared = false;
if (event.target.component.resource != null) {
await event.target.component.resource.clearCache();
cacheCleared = true;
}
refreshSibDisplays(res.join('/'),cacheCleared);
}
async function resToChildrens(resource) {
resource = resource.getResourceData();
if (resource["http://happy-dev.fr/owl/#user"]) {
refreshSibDisplays(resource["http://happy-dev.fr/owl/#user"]["@id"]);
}
if (resource["http://happy-dev.fr/owl/#project"]) {
refreshSibDisplays(resource["http://happy-dev.fr/owl/#project"]["@id"] + "members/");
}
if (resource["http://happy-dev.fr/owl/#circle"]) {
refreshSibDisplays(resource["http://happy-dev.fr/owl/#circle"]["@id"] + "members/");
}
}
//auxiliary function updates displays using a given resource
//NOTE: this is a temporary workaround and should be replaced by a reactive storage
//https://git.startinblox.com/framework/sib-core/issues/524
async function refreshResource(event) {
// if of the edited resource || id of the container of the created resource
const resourceId = event.detail.resource["@id"] || event.target.dataset.src;
updateSources(resourceId, event);
[...new Set(Array.from(document.querySelectorAll('[data-src="' + resourceId + '"]')).map(e=>e.component?e.component.resource:null).filter(e=>e!=null))].forEach(resToChildrens);
[...new Set(Array.from(document.querySelectorAll('[data-src="' + resourceId.replace('circle-members','circles').split('/').slice(0, 4).join('/') + '/"]')).map(e=>e.component?e.component.resource:null).filter(e=>e!=null))].forEach(resToChildrens);
[...new Set(Array.from(document.querySelectorAll('[nested-field="' + resourceId.split('/').slice(3, 4).join('').replace('circle-members','circles') + '"]')).map(e=>e.component?e.component.resource:null).filter(e=>e!=null))].forEach(resToChildrens);
//special cases updating users/X/circles for the left-side-menu (leaving or joining circle)
let user = await document.querySelector('sib-auth').getUser();
if(resourceId.includes('circle') && user != null) {
let userId = user['@id'];
refreshSibDisplays(userId + "circles/");
refreshSibDisplays(resourceId.replace('circle-members','circles').split('/').slice(0, 3).join('/') + '/circles/joinable/');
refreshSibDisplays(resourceId.replace('circle-members','circles').split('/').slice(0, 3).join('/') + '/sources/circlesjoinable/');
}
if(resourceId.includes('users')) {
refreshSibDisplays(resourceId.split('/').slice(0, 3).join('/') + '/users/');
refreshSibDisplays(resourceId.split('/').slice(0, 3).join('/') + '/sources/users/');
refreshSibDisplays(resourceId + 'profile/');
refreshSibDisplays(resourceId + 'account/');
refreshSibDisplays(resourceId + 'chatProfile/');
refreshSibDisplays(resourceId + 'skills/');
refreshSibDisplays(resourceId + 'account/');
}
//clear cache on this resource
//NOTE: this is required because the cache is not refreshed after POSTing changes on the resource
let cacheCleared = false;
if (event.target.component.resource != null) {
await event.target.component.resource.clearCache();
cacheCleared = true;
}
//update all displays which use this resource
refreshSibDisplays(resourceId, cacheCleared);
}
//auxiliary function performs a redirect
//NOTE: currently a sib-display is required to dispatch the requestNavigation event
function performRedirect(route) {
document.dispatchEvent(
new CustomEvent("requestNavigation", {
bubbles: true,
detail: { route: route }
})
);
}
//auxiliary function redirects after leaving a project/circle
//NOTE: this is a temporary workaround until the following issues are resolved:
//https://git.startinblox.com/framework/sib-core/issues/476
//https://git.startinblox.com/framework/sib-core/issues/546
async function checkForPostLeaveRedirect(event) {
//a redirect will only be required if I left in the information page of the resource
if(!window.location.href.includes('-information')) {
return;
}
//first need to get a sib-display with this resource id (to have access to the target Proxy, containing model fields)
const resourceId = event.detail.resource['@id'] || event.target.dataset.src;
let target = document.querySelector('[data-src="' + resourceId + '"]');
let resource = target.component.resource.getResourceData();
//no redirect is required for public circles
let targetCircleId = resource["http://happy-dev.fr/owl/#circle"];
if(targetCircleId != undefined) {
let targetCircle = document.querySelector('[data-src="' + targetCircleId["@id"] + '"]');
let targetCircleResource = targetCircle.component.resource.getResourceData();
if(targetCircleResource['http://happy-dev.fr/owl/#status'] == 'Public') {
return;
}
}
//a redirect will only be required if I've deleted myself
let targetUser = resource['http://happy-dev.fr/owl/#user'];
if(targetUser != undefined) {
//compare with current user
let user = await document.querySelector('sib-auth').getUser();
if(targetUser['@id'] != user['@id'] && targetUser['@id'] != undefined) {
return;
}
}
//perform the redirect
if(resourceId.includes('circle')) {
performRedirect('circle-left');
} else if(resourceId.includes('project')) {
performRedirect('project-left');
}
}
document.addEventListener("DOMContentLoaded", function(event) {
const menuWrappers = Array.from(document.querySelectorAll(".menu-wrapper"));
//- 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.querySelector("body").addEventListener("save", event => {
refreshResource(event);
});
document.querySelector("body").addEventListener("resourceDeleted", event => {
//I might need to be redirected from this page
checkForPostLeaveRedirect(event).then(refreshResource(event));
});
});

View File

@ -12,7 +12,7 @@ async function updateBadges(element) {
}
// update badges
unreadNotifications.forEach((notifNumber, objectId) => {
const badge = document.querySelector(`sib-fix-badge[data-src="${objectId}"]`);
const badge = document.querySelector(`solid-fix-badge[data-src="${objectId}"]`);
if (badge) {
badge.innerText = notifNumber || '';
badge.style.display = notifNumber ? 'block' : 'none';
@ -29,7 +29,7 @@ document.addEventListener("DOMContentLoaded", function (event) {
clearInterval(checkNotificationMenuExist);
notifsMenu.addEventListener('populate', (event) => {
const checkExist = setInterval(function () { // wait for left menus to exist
const subMenus = document.querySelectorAll('.sub-menu > sib-display > div');
const subMenus = document.querySelectorAll('.sub-menu > solid-display > div');
if (subMenus.length >= 2) {
updateBadges(event.target);
clearInterval(checkExist);
@ -53,7 +53,7 @@ document.addEventListener("DOMContentLoaded", function (event) {
// on read notification
window.addEventListener('read', (event) => {
if (event.detail && event.detail.resource && event.detail.resource['@id']) {
const badge = document.querySelector(`sib-fix-badge[data-src="${event.detail.resource['@id']}"]`);
const badge = document.querySelector(`solid-fix-badge[data-src="${event.detail.resource['@id']}"]`);
if (badge) badge.style.display = "none";
}
});

View File

@ -8,7 +8,7 @@ document.addEventListener("DOMContentLoaded", function (event) {
window.addEventListener('read', (event) => {
if (event.detail && event.detail.resource && event.detail.resource['@id']) {
const badge = document.querySelector(`sib-fix-badge[data-src="${event.detail.resource['@id']}"]`);
const badge = document.querySelector(`solid-fix-badge[data-src="${event.detail.resource['@id']}"]`);
if (badge) badge.parentElement.parentElement.classList.remove('unread');
}
});

View File

@ -8,10 +8,10 @@ function applyAdapt(prefix, sibDisplay, user) {
);
}
//- Allow to set data-src to a children sib-form
//- Allow to set data-src to a children solid-form
if (sibDisplay.getAttribute(prefix + "-bind-resources")) {
let form = sibDisplay.querySelector(
sibDisplay.getAttribute(prefix + "-bind-resources") + " sib-form"
sibDisplay.getAttribute(prefix + "-bind-resources") + " solid-form"
);
if (form) {
form.setAttribute(
@ -38,7 +38,7 @@ function recursiveAdaptWidgets(prefix, element, user) {
el.setAttribute(el.getAttribute(prefix + "-user-id"), user["@id"]);
});
applyAdapt(prefix, element, user);
document.querySelectorAll('sib-display, sib-form').forEach(sibDisplay => {
document.querySelectorAll('solid-display, solid-form').forEach(sibDisplay => {
applyAdapt(prefix, sibDisplay, user);
});
});
@ -50,12 +50,12 @@ document.addEventListener("DOMContentLoaded", function (event) {
.getUser()
.then(user => {
if (user !== null) {
document.querySelectorAll('sib-display, sib-form').forEach(element => {
// Set current user id on set-user-id of sib-display
document.querySelectorAll('solid-display, solid-form').forEach(element => {
// Set current user id on set-user-id of solid-display
recursiveAdaptWidgets("hubl-inherit", element, user);
});
for (leaveBtn of document.querySelectorAll(
"admin-circle-leave > sib-ac-checker:not([hidden])"
"admin-circle-leave > solid-ac-checker:not([hidden])"
)) {
// Hide Join button
leaveBtn.parentNode.parentNode.parentNode.nextElementSibling.setAttribute(