feature: improve page loading + intl collator
This commit is contained in:
Jean-Baptiste Pasquier
parent
7c0f237bd0
commit
a936a343b5
@ -3,8 +3,7 @@ import SlimSelect from 'https://cdn.skypack.dev/slim-select@1.23';
|
||||
|
||||
const HublStatus = widgetFactory(
|
||||
'hubl-status',
|
||||
`<label>
|
||||
<div>\${label}</div>
|
||||
`<label>\${label}</label>
|
||||
<select
|
||||
data-holder
|
||||
name="\${name}">
|
||||
@ -14,8 +13,7 @@ const HublStatus = widgetFactory(
|
||||
<option
|
||||
value="Private"
|
||||
\${value=="Private" ? 'selected' : ''} data-trans="hublStatus.private">Privé</option>
|
||||
</select>
|
||||
</label>`,
|
||||
</select>`,
|
||||
'',
|
||||
formWidget => {
|
||||
let select = formWidget.querySelector('select');
|
||||
|
||||
170
src/index.pug
170
src/index.pug
@ -38,92 +38,106 @@ html(lang="en")
|
||||
|
||||
script(src="index.js" defer)
|
||||
|
||||
body.notLoggedIn.bg-color-grey(style='visibility:hidden;')
|
||||
body.bg-color-grey
|
||||
if endpoints.get && endpoints.post
|
||||
.notLoggedIn(style='visibility:hidden;')
|
||||
sib-auth(style='display:none!important', auto-login)
|
||||
sib-auth-provider(
|
||||
data-authority=`${authority}`
|
||||
data-id=`${authorityName || "authority"}`
|
||||
data-client-name=`${clientName || "Hubl"}`
|
||||
)
|
||||
|
||||
include views/partials/notifications.pug
|
||||
include views/partials/widgets.pug
|
||||
include views/partials/notifications.pug
|
||||
include views/partials/widgets.pug
|
||||
|
||||
header#header.segment.full.padding-left-large.padding-right-large.sm-padding-right-xsmall.sm-padding-left-small.shadow-small.text-disable-selection.bg-color-white
|
||||
include views/partials/header.pug
|
||||
header#header.segment.full.padding-left-large.padding-right-large.sm-padding-right-xsmall.sm-padding-left-small.shadow-small.text-disable-selection.bg-color-white
|
||||
include views/partials/header.pug
|
||||
|
||||
nav#main__menu.scrollbar-nav.segment.bg-color-heading.text-top.quarter.text-disable-selection.jsLeftMenu
|
||||
include views/partials/menu-left.pug
|
||||
nav#main__menu.scrollbar-nav.segment.bg-color-heading.text-top.quarter.text-disable-selection.jsLeftMenu
|
||||
include views/partials/menu-left.pug
|
||||
|
||||
main#content.segment.three-quarter.sm-full.text-top
|
||||
main#content.segment.three-quarter.sm-full.text-top
|
||||
|
||||
if endpoints.get.dashboards
|
||||
#dashboard(hidden, data-view="dashboard").scrollbar-content
|
||||
include views/page-dashboard.pug
|
||||
if endpoints.get.dashboards
|
||||
#dashboard(hidden, data-view="dashboard").scrollbar-content
|
||||
include views/page-dashboard.pug
|
||||
|
||||
if publicDirectory && endpoints.get.users
|
||||
#members(hidden, data-view="members", no-render).scrollbar-content
|
||||
include views/page-directory.pug
|
||||
|
||||
if endpoints.get.projects
|
||||
#project(hidden, data-view="project").with-sidebar.whitespace-normal
|
||||
hubl-reactivity(bind-user nested-field='inbox' target-src="store://user.projects")
|
||||
hubl-reactivity(data-src=`${endpoints.post.projects}joinable/` target-src=`${endpoints.get.projects}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.projects}` target-src=`${endpoints.get.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.post.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.post.projects}joinable/`)
|
||||
hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}joinable/` target-src=`${endpoints.projects || endpoints.get.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.projects || endpoints.get.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.projects || endpoints.get.projects}joinable/`)
|
||||
include views/page-project.pug
|
||||
|
||||
if endpoints.get.circles
|
||||
#circle(hidden, data-view="circle").with-sidebar.whitespace-normal
|
||||
hubl-reactivity(bind-user nested-field='inbox' target-src="store://user.circles")
|
||||
hubl-reactivity(data-src=`${endpoints.post.circles}joinable/` target-src=`${endpoints.get.circles}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.circles}` target-src=`${endpoints.get.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.post.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.post.circles}joinable/`)
|
||||
hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}joinable/` target-src=`${endpoints.circles || endpoints.get.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.circles || endpoints.get.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.circles || endpoints.get.circles}joinable/`)
|
||||
include views/page-circle.pug
|
||||
|
||||
if endpoints.get.users
|
||||
#messages(hidden, data-view="messages", no-render).whitespace-normal
|
||||
hubl-reactivity(bind-user nested-field='inbox' target-src="store://user.contacts")
|
||||
include views/page-messages.pug
|
||||
|
||||
if endpoints.get.polls
|
||||
#polls(hidden, data-view="polls").with-sidebar
|
||||
include views/page-polls.pug
|
||||
|
||||
if endpoints.get.events
|
||||
#events(hidden, data-view="events")
|
||||
include views/page-events.pug
|
||||
|
||||
if endpoints.get.resources
|
||||
#resources(hidden, data-view="resources")
|
||||
include views/page-resources.pug
|
||||
|
||||
#admin
|
||||
include views/page-admin.pug
|
||||
|
||||
#about(hidden, data-view="about", no-render)
|
||||
include views/page-about.pug
|
||||
if publicDirectory && endpoints.get.users
|
||||
#members(hidden, data-view="members", no-render).scrollbar-content
|
||||
include views/page-directory.pug
|
||||
|
||||
if endpoints.get.skills && endpoints.post.uploads && endpoints.post.users
|
||||
#profile(hidden, data-view="profile", no-render).scrollbar-content
|
||||
include views/page-profile.pug
|
||||
|
||||
if endpoints.get.joboffers
|
||||
#job-offers(hidden, data-view="job-offers", no-render).scrollbar-content
|
||||
hubl-reactivity(data-src=`${endpoints.post.joboffers}current/` target-src=`${endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.joboffers}expired/` target-src=`${endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.joboffers}` target-src=`${endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.joboffers || endpoints.get.joboffers}current/` target-src=`${endpoints.joboffers || endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.joboffers || endpoints.get.joboffers}current/` target-src=`${endpoints.joboffers || endpoints.get.joboffers}expired/`)
|
||||
hubl-reactivity(data-src=`${endpoints.joboffers || endpoints.get.joboffers}expired/` target-src=`${endpoints.joboffers || endpoints.get.joboffers}`)
|
||||
hubl-reactivity(bind-user nested-field="joboffers" target-src=`${endpoints.joboffers || endpoints.get.joboffers}expired/`)
|
||||
hubl-reactivity(bind-user nested-field="joboffers" target-src=`${endpoints.joboffers || endpoints.get.joboffers}`)
|
||||
hubl-reactivity(bind-user nested-field="joboffers" target-src=`${endpoints.joboffers || endpoints.get.joboffers}current/`)
|
||||
include views/page-job-offers.pug
|
||||
|
||||
if endpoints.get.projects
|
||||
#project(hidden, data-view="project").with-sidebar.whitespace-normal
|
||||
hubl-reactivity(bind-user nested-field='inbox' target-src="store://user.projects")
|
||||
hubl-reactivity(data-src=`${endpoints.post.projects}joinable/` target-src=`${endpoints.get.projects}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.projects}` target-src=`${endpoints.get.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.post.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.post.projects}joinable/`)
|
||||
hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}joinable/` target-src=`${endpoints.projects || endpoints.get.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.projects || endpoints.get.projects}`)
|
||||
hubl-reactivity(bind-user nested-field="projects" target-src=`${endpoints.projects || endpoints.get.projects}joinable/`)
|
||||
include views/page-project.pug
|
||||
|
||||
if endpoints.get.circles
|
||||
#circle(hidden, data-view="circle").with-sidebar.whitespace-normal
|
||||
hubl-reactivity(bind-user nested-field='inbox' target-src="store://user.circles")
|
||||
hubl-reactivity(data-src=`${endpoints.post.circles}joinable/` target-src=`${endpoints.get.circles}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.circles}` target-src=`${endpoints.get.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.post.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.post.circles}joinable/`)
|
||||
hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}joinable/` target-src=`${endpoints.circles || endpoints.get.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.circles || endpoints.get.circles}`)
|
||||
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.circles || endpoints.get.circles}joinable/`)
|
||||
include views/page-circle.pug
|
||||
|
||||
if endpoints.get.users
|
||||
#messages(hidden, data-view="messages", no-render).whitespace-normal
|
||||
hubl-reactivity(bind-user nested-field='inbox' target-src="store://user.contacts")
|
||||
include views/page-messages.pug
|
||||
|
||||
if endpoints.get.polls
|
||||
#polls(hidden, data-view="polls").with-sidebar
|
||||
include views/page-polls.pug
|
||||
|
||||
if endpoints.get.events
|
||||
#events(hidden, data-view="events")
|
||||
include views/page-events.pug
|
||||
|
||||
if endpoints.get.resources
|
||||
#resources(hidden, data-view="resources")
|
||||
include views/page-resources.pug
|
||||
|
||||
#admin
|
||||
include views/page-admin.pug
|
||||
|
||||
#about(hidden, data-view="about", no-render)
|
||||
include views/page-about.pug
|
||||
|
||||
if endpoints.get.skills && endpoints.post.uploads && endpoints.post.users
|
||||
#profile(hidden, data-view="profile", no-render).scrollbar-content
|
||||
include views/page-profile.pug
|
||||
|
||||
if endpoints.get.joboffers
|
||||
#job-offers(hidden, data-view="job-offers", no-render).scrollbar-content
|
||||
hubl-reactivity(data-src=`${endpoints.post.joboffers}current/` target-src=`${endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.joboffers}expired/` target-src=`${endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.post.joboffers}` target-src=`${endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.joboffers || endpoints.get.joboffers}current/` target-src=`${endpoints.joboffers || endpoints.get.joboffers}`)
|
||||
hubl-reactivity(data-src=`${endpoints.joboffers || endpoints.get.joboffers}current/` target-src=`${endpoints.joboffers || endpoints.get.joboffers}expired/`)
|
||||
hubl-reactivity(data-src=`${endpoints.joboffers || endpoints.get.joboffers}expired/` target-src=`${endpoints.joboffers || endpoints.get.joboffers}`)
|
||||
hubl-reactivity(bind-user nested-field="joboffers" target-src=`${endpoints.joboffers || endpoints.get.joboffers}expired/`)
|
||||
hubl-reactivity(bind-user nested-field="joboffers" target-src=`${endpoints.joboffers || endpoints.get.joboffers}`)
|
||||
hubl-reactivity(bind-user nested-field="joboffers" target-src=`${endpoints.joboffers || endpoints.get.joboffers}current/`)
|
||||
include views/page-job-offers.pug
|
||||
|
||||
.loggedIn(style='position:absolute;top:calc(50% - 10px);left:calc(50% - 40px);')
|
||||
div.loader
|
||||
div
|
||||
div
|
||||
div
|
||||
div
|
||||
|
||||
if analytics
|
||||
each provider in analytics
|
||||
if provider.type && provider.url && provider.url
|
||||
|
||||
@ -187,13 +187,15 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||
|
||||
// Detect the lang & initialize, based on the browser or "language" item from localstorage
|
||||
jsI18n.detectLanguage();
|
||||
let timer;
|
||||
(new MutationObserver((mutations) => {
|
||||
mutations.forEach(mutation => {
|
||||
if(mutation.target.attributes["data-trans"] != null) {
|
||||
// Render the target of the mutation instantly
|
||||
jsI18n.processNode(mutation.target);
|
||||
// Then wait one arbitrary second to re-render the whole document in case a widget re-rendered
|
||||
setTimeout(() => jsI18n.processNode(document.querySelector('body')), 1000);
|
||||
clearTimeout(timer);
|
||||
timer = setTimeout(() => jsI18n.processNode(document.querySelector('body')), 500);
|
||||
}
|
||||
});
|
||||
}).observe(document.body, {
|
||||
|
||||
@ -7,6 +7,9 @@ document.addEventListener("DOMContentLoaded", function () {
|
||||
document
|
||||
.querySelectorAll(".notLoggedIn")
|
||||
.forEach(el => (el.style.visibility = "visible"));
|
||||
document
|
||||
.querySelectorAll(".loggedIn")
|
||||
.forEach(el => (el.style.display = "none"));
|
||||
}
|
||||
});
|
||||
});
|
||||
@ -127,7 +127,8 @@ div.segment.full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespac
|
||||
id="hubl_project_is_admin"
|
||||
fields="is_admin"
|
||||
value-is_admin='true'
|
||||
widget-is_admin='solid-form-hidden'
|
||||
widget-is_admin='solid-form-checkbox'
|
||||
hidden
|
||||
)
|
||||
|
||||
solid-widget(name='hubl-project-admins')
|
||||
|
||||
@ -122,12 +122,5 @@ div
|
||||
button.segment.padding-small.sm-padding-medium.sm-padding-left-xlarge.text-hover.text-bold.text-color-heading(role='log out' onclick="document.querySelector('sib-auth').logout();" data-trans='header.logOut')
|
||||
|
||||
button.segment.lg-hidden.icon-menu#toggleMainMenu
|
||||
|
||||
sib-auth(style='display:none!important', auto-login)
|
||||
sib-auth-provider(
|
||||
data-authority=`${authority}`
|
||||
data-id=`${authorityName || "authority"}`
|
||||
data-client-name=`${clientName || "Hubl"}`
|
||||
)
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user