design.estate/dees-domtools
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(core): update

Browse Source
This commit is contained in:
Philipp Kunz 2020-05-27 21:15:38 +00:00
parent fb36c641a9
commit 0ed59e850e
10 changed files with 73 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
package-lock.json generated
View File

@ -1072,14 +1072,14 @@
}
},
"@pushrocks/lik": {
"version": "4.0.10",
"resolved": "https://verdaccio.lossless.one/@pushrocks%2flik/-/lik-4.0.10.tgz",
"integrity": "sha512-qlVVIWo/Ysp/cyUyHi2mgtFyT0E9xXLCpewBAb7TrwnuRKrSMrmE4YsqPsGOhBxqziSEOPaXZmWaMLwKqjvQiQ==",
"version": "4.0.12",
"resolved": "https://verdaccio.lossless.one/@pushrocks%2flik/-/lik-4.0.12.tgz",
"integrity": "sha512-ffd3bJL+kMuhXDulO5VC5OqgfhZR3I4HoVN7IBLlN1z6Dco6j4NFrp+/GKDoPssFPNQY4okv+N4Hm2T/7t+4CQ==",
"requires": {
"@pushrocks/smartdelay": "^2.0.9",
"@pushrocks/smartmatch": "^1.0.7",
"@pushrocks/smartpromise": "^3.0.6",
"@pushrocks/smartrx": "^2.0.12",
"@pushrocks/smartrx": "^2.0.15",
"@pushrocks/smarttime": "^3.0.18",
"@pushrocks/smartunique": "^3.0.3",
"@types/minimatch": "^3.0.3",
@ -1095,11 +1095,11 @@
}
},
"@pushrocks/smartrx": {
"version": "2.0.12",
"resolved": "https://verdaccio.lossless.one/@pushrocks%2fsmartrx/-/smartrx-2.0.12.tgz",
"integrity": "sha512-1iH5cn3Hvb8cnPlmeBL3oOZ/hkvuEQcQ6dykFeDMJkJQ0zrT5iSkzq8EA4fCmIe12aeMkL+38TOC79CCySb0Hg==",
"version": "2.0.15",
"resolved": "https://verdaccio.lossless.one/@pushrocks%2fsmartrx/-/smartrx-2.0.15.tgz",
"integrity": "sha512-bvxyO19sUgWj7S/WflVO7QVYggTUXoM4rCYn+Akid844CC5zoSzIRx9Egm2xeMD6y4WbBbFWpHr67L7nEYxGWQ==",
"requires": {
"@pushrocks/lik": "^4.0.8",
"@pushrocks/lik": "^4.0.11",
"@pushrocks/smartpromise": "^3.0.6",
"rxjs": "^6.5.5"
}
@ -1383,14 +1383,27 @@
}
},
"@pushrocks/smartstate": {
"version": "1.0.15",
"resolved": "https://verdaccio.lossless.one/@pushrocks%2fsmartstate/-/smartstate-1.0.15.tgz",
"integrity": "sha512-LuqA8othfyd6Ne/DaFt42K/mS7MUa9twbsFboOuXSUi/S6DNWy7Z62EHIsftrVHtgrenBeF+JZaJ8lLCVMHcng==",
"version": "1.0.16",
"resolved": "https://verdaccio.lossless.one/@pushrocks%2fsmartstate/-/smartstate-1.0.16.tgz",
"integrity": "sha512-RUdeKuM2N5S3su9WEX2XoSE0VV12vMyR4vh4h2gV+uS4Syu4H13ntoN2MQfGh63JHkviICELZ0u+XqRtNvAO4g==",
"requires": {
"@pushrocks/lik": "^4.0.0",
"@pushrocks/lik": "^4.0.12",
"@pushrocks/smartpromise": "^3.0.6",
"@pushrocks/smartrx": "^2.0.15",
"rxjs": "^6.5.5"
},
"dependencies": {
"@pushrocks/smartrx": {
"version": "2.0.15",
"resolved": "https://verdaccio.lossless.one/@pushrocks%2fsmartrx/-/smartrx-2.0.15.tgz",
"integrity": "sha512-bvxyO19sUgWj7S/WflVO7QVYggTUXoM4rCYn+Akid844CC5zoSzIRx9Egm2xeMD6y4WbBbFWpHr67L7nEYxGWQ==",
"requires": {
"@pushrocks/lik": "^4.0.11",
"@pushrocks/smartpromise": "^3.0.6",
"rxjs": "^6.5.5"
}
}
}
},
"@pushrocks/smarttime": {
"version": "3.0.15",

4
package.json
View File

@ -22,9 +22,9 @@
"tslint-config-prettier": "^1.15.0"
},
"dependencies": {
"@pushrocks/lik": "^4.0.10",
"@pushrocks/lik": "^4.0.12",
"@pushrocks/smartpromise": "^3.0.6",
"@pushrocks/smartstate": "^1.0.15",
"@pushrocks/smartstate": "^1.0.16",
"lit-element": "^2.3.1"
},
"files": [

33
ts/domtools.breakpoints.ts
View File

@ -1,24 +1,29 @@
import { DomTools } from './domtools.classes.domtools';
export const desktop = 1240;
export const tablet = 700;
export const phablet = 500;
export const phone = 340;
export type TEnvironment = 'native' | 'desktop' | 'tablet' | 'phablet' | 'phone';
export type TViewport = 'native' | 'desktop' | 'tablet' | 'phablet' | 'phone';
let environment: TEnvironment = 'native';
export const setEnvironment = envArg => {
environment = envArg;
export const getEnvironment = async (): Promise<TViewport> => {
const domToolsInstance = await DomTools.setupDomTools();
return domToolsInstance.domToolsStatePart.getState().virtualViewport;
};
export const cssForTablet = (contentArg) => {
if (environment === 'native' || environment === 'desktop') {
export const cssForTablet = async contentArg => {
if ((await getEnvironment()) === 'native' || (await getEnvironment()) === 'desktop') {
return `
@media (max-width: ${tablet}px) {
${contentArg}
}
`;
} else if (environment === 'tablet' || environment === 'phablet' || environment === 'phone') {
} else if (
(await getEnvironment()) === 'tablet' ||
(await getEnvironment()) === 'phablet' ||
(await getEnvironment()) === 'phone'
) {
return `
@media (min-width: 0px) {
${contentArg}
@ -27,14 +32,14 @@ export const cssForTablet = (contentArg) => {
}
};
export const cssForPhablet = (contentArg) => {
if (environment === 'native' || environment === 'desktop') {
export const cssForPhablet = async contentArg => {
if ((await getEnvironment()) === 'native' || (await getEnvironment()) === 'desktop') {
return `
@media (max-width: ${phablet}px) {
${contentArg}
}
`;
} else if (environment === 'phablet' || environment === 'phone') {
} else if ((await getEnvironment()) === 'phablet' || (await getEnvironment()) === 'phone') {
return `
@media (min-width: 0px) {
${contentArg}
@ -43,14 +48,14 @@ export const cssForPhablet = (contentArg) => {
}
};
export const cssForPhone = (contentArg) => {
if (environment === 'native' || environment === 'desktop') {
export const cssForPhone = async contentArg => {
if ((await getEnvironment()) === 'native' || (await getEnvironment()) === 'desktop') {
return `
@media (max-width: ${phone}px) {
${contentArg}
}
`;
} else if (environment === 'phone') {
} else if ((await getEnvironment()) === 'phone') {
return `
@media (min-width: 0px) {
${contentArg}

20
ts/domtools.classes.domtools.ts
View File

@ -1,6 +1,11 @@
import * as plugins from './domtools.plugins';
import { Stringmap } from '@pushrocks/lik/dist_ts/lik.stringmap';
import { FastMap } from '@pushrocks/lik/dist_ts/lik.fastmap';
import { TViewport } from './domtools.breakpoints';
export interface IDomToolsState {
virtualViewport: TViewport;
}
export class DomTools {
public static async setupDomTools() {
@ -26,6 +31,7 @@ export class DomTools {
}
public smartstate = new plugins.smartstate.Smartstate();
public domToolsStatePart = this.smartstate.getStatePart<IDomToolsState>('domtools');
public domToolsReady = plugins.smartpromise.defer();
public domReady = plugins.smartpromise.defer();
@ -37,9 +43,11 @@ export class DomTools {
bodyElement: HTMLElement;
} = {
headElement: null,
bodyElement: null,
bodyElement: null
};
constructor() {}
public async setGlobalStyles(stylesText: string) {
await this.domReady.promise;
const styleElement = document.createElement('style');
@ -64,11 +72,15 @@ export class DomTools {
this.runOnceResultMap.addToMap(identifierArg, result);
this.runOnceTrackerStringMap.removeString(runningId);
}
return await this.runOnceTrackerStringMap.registerUntilTrue(stringMap => {
return await this.runOnceTrackerStringMap.registerUntilTrue(
stringMap => {
return !stringMap.includes(runningId);
}, () => {
},
() => {
return this.runOnceResultMap.getByKey(identifierArg);
});
}
);
}
setVirtualViewport() {}
}

3
ts/domtools.css.ts
View File

@ -1,7 +1,8 @@
export const cssGridColumns = (amountOfColumnsArg: number, gapSizeArg: number) => {
let returnString = ``;
for (let i = 0; i < amountOfColumnsArg; i++) {
returnString += ` calc((100%/${amountOfColumnsArg}) - (${gapSizeArg * (amountOfColumnsArg - 1)}px/${amountOfColumnsArg}))`;
returnString += ` calc((100%/${amountOfColumnsArg}) - (${gapSizeArg *
(amountOfColumnsArg - 1)}px/${amountOfColumnsArg}))`;
}
return returnString;
};

2
ts/domtools.elementbasic.ts
View File

@ -1,7 +1,6 @@
import * as plugins from './domtools.plugins';
import { DomTools } from './domtools.classes.domtools';
import { html } from 'lit-element';
export const styles = html`
<style>
@ -12,7 +11,6 @@ export const styles = html`
</style>
`;
/**
* a basic setup for elements
* makes sure everything is in check

5
ts/domtools.plugins.ts
View File

@ -2,7 +2,4 @@
import * as smartpromise from '@pushrocks/smartpromise';
import * as smartstate from '@pushrocks/smartstate';
export {
smartpromise,
smartstate
};
export { smartpromise, smartstate };

6
ts/index.ts
View File

@ -4,8 +4,4 @@ import * as elementBasic from './domtools.elementbasic';
import * as breakpoints from './domtools.breakpoints';
import * as css from './domtools.css';
export {
css,
breakpoints,
elementBasic
};
export { css, breakpoints, elementBasic };