IMPR: Allow to preload content

This commit is contained in:
Tony Air 2024-06-22 22:59:50 +02:00
parent c78ef9f435
commit ee74df7f3f
3 changed files with 43 additions and 28 deletions

View File

@ -1,28 +1,29 @@
/* eslint-disable global-require */ import '@a2nt/mithril-ui/src/js/ui'
import Events from '@a2nt/ss-bootstrap-ui-webpack-boilerplate-react/src/js/_events'
import '@a2nt/mithril-ui/src/js/ui';
import Events from '@a2nt/ss-bootstrap-ui-webpack-boilerplate-react/src/js/_events';
const m = require("mithril") // eslint-disable-line const m = require("mithril") // eslint-disable-line
const MainContentContainer = document.getElementById('MainContent');
const MainContent = document.createElement('div'); window.addEventListener('prefetch-loaded', () => {
if (!MainContentContainer.dataset.legacy) { const MainContentContainer = document.getElementById('MainContent')
MainContent.classList.add('page--container');
MainContentContainer.append(MainContent);
const page = require('@a2nt/mithril-ui/src/js/ui/page/tpl'); const MainContent = document.createElement('div')
m.mount(MainContent, page); if (!MainContentContainer.dataset['legacy']) {
} else { MainContent.classList.add('page--container')
// legacy fallback MainContentContainer.append(MainContent)
const spinner = document.getElementById('PageLoading');
if (spinner) {
window.addEventListener(`${Events.LOADED}`, () => {
spinner.classList.add('d-none');
});
window.addEventListener(`${Events.AJAX}`, () => { const page = require('@a2nt/mithril-ui/src/js/ui/page/tpl')
spinner.classList.add('d-none'); m.mount(MainContent, page)
}); } else {
// legacy fallback
const spinner = document.getElementById('PageLoading')
if (spinner) {
window.addEventListener(`${Events.LOADED}`, () => {
spinner.classList.add('d-none')
})
window.addEventListener(`${Events.AJAX}`, () => {
spinner.classList.add('d-none')
})
}
} }
} })

View File

@ -11,6 +11,7 @@ use SilverStripe\CMS\Model\SiteTree;
use SilverStripe\Control\Controller; use SilverStripe\Control\Controller;
use SilverStripe\Control\Director; use SilverStripe\Control\Director;
use SilverStripe\View\SSViewer; use SilverStripe\View\SSViewer;
use A2nt\CMSNiceties\Templates\DeferredRequirements;
/** /**
* Class \PageController * Class \PageController
@ -28,12 +29,25 @@ class PageController extends ContentController
protected function init() protected function init()
{ {
DeferredRequirements::addPreloadFont([
'https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2',
'https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjx4wXiWtFCc.woff2',
'https://fonts.gstatic.com/s/lato/v24/S6u8w4BMUTPHjxsAXC-qNiXg7Q.woff2',
'https://use.fontawesome.com/releases/v6.5.2/webfonts/fa-solid-900.woff2',
'https://use.fontawesome.com/releases/v6.5.2/webfonts/fa-regular-400.woff2',
'https://use.fontawesome.com/releases/v6.5.2/webfonts/fa-brands-400.woff2',
]);
DeferredRequirements::addPreloadCSS(
'https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400;1,700&family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&display=swap'
);
HTTPCacheControlMiddleware::singleton() HTTPCacheControlMiddleware::singleton()
->enableCache(true) ->enableCache(true)
// 1 minute // 1 minute
->setMaxAge(60); ->setMaxAge(60);
return parent::init(); parent::init();
} }
public function ElementalArea() public function ElementalArea()

View File

@ -35,11 +35,11 @@
], ],
"dependencies": { "dependencies": {
"@a2nt/meta-lightbox-js": "^4.2.8", "@a2nt/meta-lightbox-js": "^4.2.8",
"@a2nt/mithril-ui": "^1.1.9", "@a2nt/mithril-ui": "^1.2.2",
"@a2nt/ss-bootstrap-ui-webpack-boilerplate-react": "^5.3.9", "@a2nt/ss-bootstrap-ui-webpack-boilerplate-react": "^5.3.9",
"@angular/common": "^18.0.3", "@angular/common": "^18.0.4",
"@angular/core": "^18.0.3", "@angular/core": "^18.0.4",
"@apollo/client": "^3.10.5", "@apollo/client": "^3.10.6",
"@glidejs/glide": "^3.6.1", "@glidejs/glide": "^3.6.1",
"@popperjs/core": "^2.11.8", "@popperjs/core": "^2.11.8",
"@turf/clone": "^6.5.0", "@turf/clone": "^6.5.0",
@ -60,7 +60,7 @@
"eslint-scope": "^8.0.1", "eslint-scope": "^8.0.1",
"fast-deep-equal": "^3.1.3", "fast-deep-equal": "^3.1.3",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"graphql": "^16.8.2", "graphql": "^16.9.0",
"hammerjs": "^2.0.8", "hammerjs": "^2.0.8",
"inputmask": "^5.0.9", "inputmask": "^5.0.9",
"kdbush": "^4.0.2", "kdbush": "^4.0.2",