fix(core): update

This commit is contained in:
2020-05-25 15:57:47 +00:00
parent e3939865aa
commit 710e99a69a
8 changed files with 223 additions and 140 deletions

View File

@ -1,5 +1,61 @@
export class DeesDomTools {
public static createDomTools = () => {
globalThis.deesDomTools = new DeesDomTools();
import * as plugins from './domtools.plugins';
import { Stringmap, FastMap } from '@pushrocks/lik';
export class DomTools {
public static async setupDomTools() {
let domToolsInstance: DomTools;
if (!globalThis.deesDomTools) {
globalThis.deesDomTools = new DomTools();
domToolsInstance = globalThis.deesDomTools;
// lets make sure the dom is ready
const readyStateChangedFunc = () => {
if (document.readyState === 'interactive' || document.readyState === 'complete') {
domToolsInstance.headElement = document.querySelector('head');
domToolsInstance.bodyElement = document.querySelector('body');
domToolsInstance.domReady.resolve();
}
};
document.addEventListener('readystatechange', readyStateChangedFunc);
domToolsInstance.domToolsReady.resolve();
} else {
domToolsInstance = globalThis.deesDomTools;
}
await domToolsInstance.domToolsReady.promise;
return domToolsInstance;
}
public domToolsReady = plugins.smartpromise.defer();
public domReady = plugins.smartpromise.defer();
public globalStylesReady = plugins.smartpromise.defer();
// elements
public headElement: HTMLElement;
public bodyElement: HTMLElement;
public async setGlobalStyles(stylesText: string) {
await this.domReady.promise;
const styleElement = document.createElement('style');
styleElement.type = 'text/css';
styleElement.appendChild(document.createTextNode(stylesText));
this.headElement.appendChild(styleElement);
}
private runOnceTrackerStringMap = new Stringmap();
private runOnceResultMap = new FastMap();
public async runOnce<T>(identifierArg: string, funcArg: () => Promise<T>) {
const runningId = `${identifierArg}+runningCheck`;
if(!this.runOnceTrackerStringMap.checkString(identifierArg)) {
this.runOnceTrackerStringMap.addString(identifierArg);
this.runOnceTrackerStringMap.addString(runningId);
const result = await funcArg();
this.runOnceResultMap.addToMap(identifierArg, result);
this.runOnceTrackerStringMap.removeString(runningId);
}
return await this.runOnceTrackerStringMap.registerUntilTrue(stringMap => {
return !stringMap.includes(runningId);
}, () => {
return this.runOnceResultMap.getByKey(identifierArg);
});
}
}

View File

@ -0,0 +1,47 @@
import * as plugins from './domtools.plugins';
import { DomTools } from './domtools.classes.domtools';
import { html } from 'lit-element';
export const styles = html`
<style>
* {
font-family: 'Roboto', sans-serif;
box-sizing: border-box;
}
</style>
`;
/**
* a basic setup for elements
* makes sure everything is in check
*/
export const setup = async () => {
const domTools = await DomTools.setupDomTools();
domTools.runOnce('elementBasicSetup', async () => {
// bodyStyles
domTools.setGlobalStyles(`
body {
margin: 0px;
font-family: 'Roboto', sans-serif;
box-sizing: border-box;
}
`);
// material font
domTools.setGlobalStyles(`
@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');
}
`);
// Roboto Font
domTools.setGlobalStyles(`
@import url('https://fonts.googleapis.com/css?family=Roboto');
`);
});
};

View File

@ -1,69 +0,0 @@
import { defer } from '@pushrocks/smartpromise';
const createStyleElement = (headElement: HTMLElement, styleText: string) => {
const styleElement = document.createElement('style');
styleElement.type = 'text/css';
styleElement.appendChild(document.createTextNode(styleText));
headElement.appendChild(styleElement);
};
/**
* 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();
const readyStateChangedFunc = () => {
if (document.readyState === 'interactive' || document.readyState === 'complete') {
console.log('elementBasicSetup: element basic setup complete')
documentReady.resolve();
} else {
console.log('elementBasicSetup: document not yet ready');
}
};
document.addEventListener('readystatechange', readyStateChangedFunc);
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');
// bodyStyles
const bodyStyles = `
body {
margin: 0px;
font-family: 'Roboto', sans-serif;
box-sizing: border-box;
}
`;
createStyleElement(head, bodyStyles);
// material font
const materialFontStyles = `
@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');
}
`;
createStyleElement(head, materialFontStyles);
// Roboto Font
const robotoFontCss = `
@import url('https://fonts.googleapis.com/css?family=Roboto');
`;
createStyleElement(head, robotoFontCss);
globalThis.deesCssToolsReady.resolve();
}
};

View File

@ -1,9 +0,0 @@
import { html } from 'lit-element';
export const elementBasicStyles = html`
<style>
* {
font-family: 'Roboto', sans-serif;
box-sizing: border-box;
}
</style>
`;

8
ts/domtools.plugins.ts Normal file
View File

@ -0,0 +1,8 @@
// pushrocks scope
import * as smartpromise from '@pushrocks/smartpromise';
import * as smartstate from '@pushrocks/smartstate';
export {
smartpromise,
smartstate
};

View File

@ -1,15 +1,9 @@
export * from './domtools.colors';
import * as elementBasicSetup from './domtools.elementbasicsetup';
import * as elementBasicStyles from './domtools.elementbasicstyles';
import * as elementBasic from './domtools.elementbasic';
import * as breakpoints from './domtools.breakpoints';
import * as css from './domtools.css';
const elementBasic = {
setup: elementBasicSetup.elementBasicSetup,
styles: elementBasicStyles.elementBasicStyles
};
export {
css,
breakpoints,