dees-domtools/ts/csstools.elementbasicsetup.ts
2020-05-23 16:43:36 +00:00

50 lines
1.6 KiB
TypeScript

import { defer } from '@pushrocks/smartpromise';
/**
* a basic setup for elements
* makes sure everything is in check
*/
export const elementBasicSetup = async () => {
if (globalThis.deesCssToolsReady) {
await globalThis.deesCssToolsReady.promise;
} else {
// lets prevent double execution
globalThis.deesCssToolsReady = defer();
// lets make sure the dom is ready
const documentReady = defer();
document.onreadystatechange = () => {
if (document.readyState === 'interactive' || document.readyState === 'complete') {
console.log('elementBasicSetup: element basic setup complete')
documentReady.resolve();
} else {
console.log('elementBasicSetup: document not yet ready');
}
};
console.log('elementBasicSetup: waiting for document to be ready');
await documentReady.promise;
console.log('elementBasicSetup: document ready!');
// lets get started
const head = document.querySelector('head');
const body = document.querySelector('body');
// material font
const materialFontCss = `
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/materialicons/v42/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2) format('woff2');
}
`;
const styleElement = document.createElement('style');
styleElement.type = 'text/css';
styleElement.appendChild(document.createTextNode(materialFontCss));
head.appendChild(styleElement);
globalThis.deesCssToolsReady.resolve();
}
};