|
|
|
@ -102,7 +102,7 @@ export class WccDashboard extends LitElement {
|
|
|
|
|
if (typeof this.selectedItem === 'function') {
|
|
|
|
|
return this.selectedItem();
|
|
|
|
|
} else {
|
|
|
|
|
console.error('The selected item looks strange:')
|
|
|
|
|
console.error('The selected item looks strange:');
|
|
|
|
|
console.log(this.selectedItem);
|
|
|
|
|
}
|
|
|
|
|
} else if (this.selectedType === 'element' && this.selectedItem) {
|
|
|
|
@ -138,22 +138,25 @@ export class WccDashboard extends LitElement {
|
|
|
|
|
|
|
|
|
|
public async firstUpdated() {
|
|
|
|
|
this.domtools = await plugins.deesDomtools.DomTools.setupDomTools();
|
|
|
|
|
this.domtools.router.on('/wcctools-route/:itemType/:itemName/:viewport/:theme', async (routeInfo) => {
|
|
|
|
|
this.selectedType = routeInfo.params.itemType as TElementType;
|
|
|
|
|
this.selectedItemName = routeInfo.params.itemName;
|
|
|
|
|
this.selectedViewport = routeInfo.params.viewport as TViewport;
|
|
|
|
|
this.selectedTheme = routeInfo.params.theme as TTheme;
|
|
|
|
|
if (routeInfo.params.itemType === 'element') {
|
|
|
|
|
this.selectedItem = this.elements[routeInfo.params.itemName];
|
|
|
|
|
} else if (routeInfo.params.itemType === 'page') {
|
|
|
|
|
this.selectedItem = this.pages[routeInfo.params.itemName];
|
|
|
|
|
this.domtools.router.on(
|
|
|
|
|
'/wcctools-route/:itemType/:itemName/:viewport/:theme',
|
|
|
|
|
async (routeInfo) => {
|
|
|
|
|
this.selectedType = routeInfo.params.itemType as TElementType;
|
|
|
|
|
this.selectedItemName = routeInfo.params.itemName;
|
|
|
|
|
this.selectedViewport = routeInfo.params.viewport as TViewport;
|
|
|
|
|
this.selectedTheme = routeInfo.params.theme as TTheme;
|
|
|
|
|
if (routeInfo.params.itemType === 'element') {
|
|
|
|
|
this.selectedItem = this.elements[routeInfo.params.itemName];
|
|
|
|
|
} else if (routeInfo.params.itemType === 'page') {
|
|
|
|
|
this.selectedItem = this.pages[routeInfo.params.itemName];
|
|
|
|
|
}
|
|
|
|
|
const domtoolsInstance = await plugins.deesDomtools.elementBasic.setup();
|
|
|
|
|
domtoolsInstance.setVirtualViewport(routeInfo.params.viewport as TViewport);
|
|
|
|
|
this.selectedTheme === 'bright'
|
|
|
|
|
? domtoolsInstance.themeManager.goBright()
|
|
|
|
|
: domtoolsInstance.themeManager.goDark();
|
|
|
|
|
}
|
|
|
|
|
const domtoolsInstance = await plugins.deesDomtools.elementBasic.setup();
|
|
|
|
|
domtoolsInstance.setVirtualViewport(routeInfo.params.viewport as TViewport);
|
|
|
|
|
this.selectedTheme === 'bright' ?
|
|
|
|
|
domtoolsInstance.themeManager.goBright() :
|
|
|
|
|
domtoolsInstance.themeManager.goDark();
|
|
|
|
|
});
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private updating = false;
|
|
|
|
@ -178,9 +181,7 @@ export class WccDashboard extends LitElement {
|
|
|
|
|
|
|
|
|
|
public buildUrl() {
|
|
|
|
|
this.domtools.router.pushUrl(
|
|
|
|
|
`/wcctools-route/${this.selectedType}/${this.selectedItemName}/${this.selectedViewport}/${
|
|
|
|
|
this.selectedTheme
|
|
|
|
|
}`
|
|
|
|
|
`/wcctools-route/${this.selectedType}/${this.selectedItemName}/${this.selectedViewport}/${this.selectedTheme}`
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|