Skip to content

Commit 336210c

Browse files
committed
fix asset paths
1 parent a6d66df commit 336210c

File tree

11 files changed

+43
-39
lines changed

11 files changed

+43
-39
lines changed
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
let imporUrl = new URL((import.meta.url));
2+
export var assetsPath = imporUrl.origin + imporUrl.pathname.split('/').slice(0, -1).join('/') + '/../assets/';

packages/web-component-designer-widgets-wunderbaum/src/widgets/WunderbaumOptions.ts

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { css } from "@node-projects/base-custom-webcomponent";
22
import { WunderbaumOptions } from "wb_options";
3+
import { assetsPath } from "../Constants.js";
34

45
export const defaultStyle = css`
56
i.wb-icon > span.wb-badge {
@@ -26,12 +27,12 @@ export const defaultOptions: WunderbaumOptions = {
2627
scrollIntoViewOnExpandClick: false,
2728
//@ts-ignore
2829
iconMap: {
29-
expanderCollapsed: new URL("../../assets/images/expander.svg", import.meta.url).toString(),
30-
expanderExpanded: new URL("../../assets/images/expanderClose.svg", import.meta.url).toString(),
31-
folder: new URL("../../assets/images/folder.svg", import.meta.url).toString(),
32-
folderLazy: new URL("../../assets/images/folder.svg", import.meta.url).toString(),
33-
folderOpen: new URL("../../assets/images/folder.svg", import.meta.url).toString(),
34-
doc: new URL("../../assets/images/file.svg", import.meta.url).toString(),
30+
expanderCollapsed: assetsPath + 'images/expander.svg',
31+
expanderExpanded: assetsPath + 'images/expanderClose.svg',
32+
folder: assetsPath + 'images/folder.svg',
33+
folderLazy: assetsPath + 'images/folder.svg',
34+
folderOpen: assetsPath + 'images/folder.svg',
35+
doc: assetsPath + 'images/file.svg',
3536
},
3637
quicksearch: true,
3738
checkbox: false,
@@ -44,5 +45,5 @@ export const defaultOptions: WunderbaumOptions = {
4445
return null;
4546
}
4647
return { badge: node.children.length };
47-
}
48+
}
4849
}

packages/web-component-designer-widgets-wunderbaum/src/widgets/treeView/ExpandCollapseContextMenu.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { ContextmenuInitiator, IContextMenuExtension, IContextMenuItem, IDesignItem, IDesignerCanvas } from "@node-projects/web-component-designer";
22
import { TreeViewExtended } from "./treeViewExtended.js";
3+
import { assetsPath } from "../../Constants.js";
34

45
export class ExpandCollapseContextMenu implements IContextMenuExtension {
56

@@ -13,12 +14,12 @@ export class ExpandCollapseContextMenu implements IContextMenuExtension {
1314
public provideContextMenuItems(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem, initiator: ContextmenuInitiator, provider: TreeViewExtended): IContextMenuItem[] {
1415
return [
1516
{
16-
title: 'collapse children', icon: `<img src="${new URL('../../../assets/icons/collapse.svg', import.meta.url)}">`, action: () => {
17+
title: 'collapse children', icon: `<img src="${assetsPath + 'icons/collapse.svg'}">`, action: () => {
1718
provider.collapseChildren(designItem)
1819
}
1920
},
2021
{
21-
title: 'expand children', icon: `<img src="${new URL('../../../assets/icons/expand.svg', import.meta.url)}">`, action: () => {
22+
title: 'expand children', icon: `<img src="${assetsPath + 'icons/expand.svg'}">`, action: () => {
2223
provider.expandChildren(designItem)
2324
}
2425
},

packages/web-component-designer/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"description": "A WYSIWYG designer webcomponent for html components",
33
"name": "@node-projects/web-component-designer",
4-
"version": "0.1.271",
4+
"version": "0.1.272",
55
"type": "module",
66
"main": "./dist/index.js",
77
"author": "jochen.kuehner@gmx.de",

packages/web-component-designer/src/basepath.ts

Lines changed: 0 additions & 1 deletion
This file was deleted.

packages/web-component-designer/src/elements/widgets/designerView/extensions/contextMenu/AlignItemsContextMenu.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { IDesignItem } from '../../../../item/IDesignItem.js';
44
import { NodeType } from '../../../../item/NodeType.js';
55
import { IDesignerCanvas } from '../../IDesignerCanvas.js';
66
import { ContextmenuInitiator, IContextMenuExtension } from './IContextMenuExtension.js';
7-
import basePath from '../../../../../basepath.js'
7+
import { assetsPath } from '../../../../../Constants.js';
88

99
export class AlignItemsContextMenu implements IContextMenuExtension {
1010

@@ -17,14 +17,14 @@ export class AlignItemsContextMenu implements IContextMenuExtension {
1717

1818
public provideContextMenuItems(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem): IContextMenuItem[] {
1919
return [
20-
{ title: 'align left', icon: `<img src="${new URL('../assets/icons/alignHorizontalLeft.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeLeft }); } },
21-
{ title: 'align center', icon: `<img src="${new URL('../assets/icons/alignHorizontalCenter.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeCenter }); } },
22-
{ title: 'align right', icon: `<img src="${new URL('../assets/icons/alignHorizontalRight.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeRight }); } },
23-
{ title: 'distribute horizontal', icon: `<img src="${new URL('../assets/icons/horizontalDistribute.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.distributeHorizontal }); } },
24-
{ title: 'align top', icon: `<img src="${new URL('../assets/icons/alignVerticalTop.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeTop }); } },
25-
{ title: 'align middle', icon: `<img src="${new URL('../assets/icons/alignVerticalCenter.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeMiddle }); } },
26-
{ title: 'align bottom', icon: `<img src="${new URL('../assets/icons/alignVerticalBottom.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeBottom }); } },
27-
{ title: 'distribute vertical', icon: `<img src="${new URL('../assets/icons/verticalDistribute.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.distributeVertical }); } },
20+
{ title: 'align left', icon: `<img src="${assetsPath + 'icons/alignHorizontalLeft.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeLeft }); } },
21+
{ title: 'align center', icon: `<img src="${assetsPath + 'icons/alignHorizontalCenter.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeCenter }); } },
22+
{ title: 'align right', icon: `<img src="${assetsPath + 'icons/alignHorizontalRight.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeRight }); } },
23+
{ title: 'distribute horizontal', icon: `<img src="${assetsPath + 'icons/horizontalDistribute.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.distributeHorizontal }); } },
24+
{ title: 'align top', icon: `<img src="${assetsPath + 'icons/alignVerticalTop.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeTop }); } },
25+
{ title: 'align middle', icon: `<img src="${assetsPath + 'icons/alignVerticalCenter.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeMiddle }); } },
26+
{ title: 'align bottom', icon: `<img src="${assetsPath + 'icons/alignVerticalBottom.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.arrangeBottom }); } },
27+
{ title: 'distribute vertical', icon: `<img src="${assetsPath + 'icons/verticalDistribute.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.distributeVertical }); } },
2828
]
2929
}
3030
}

packages/web-component-designer/src/elements/widgets/designerView/extensions/contextMenu/CopyPasteContextMenu.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { IContextMenuItem } from '../../../../helper/contextMenu/IContextMenuIte
33
import { IDesignItem } from '../../../../item/IDesignItem.js';
44
import { IDesignerCanvas } from '../../IDesignerCanvas.js';
55
import { ContextmenuInitiator, IContextMenuExtension } from './IContextMenuExtension.js';
6-
import basePath from '../../../../../basepath.js'
6+
import { assetsPath } from '../../../../../Constants.js';
77

88
export class CopyPasteContextMenu implements IContextMenuExtension {
99
public shouldProvideContextmenu(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem, initiator: ContextmenuInitiator) {
@@ -12,10 +12,10 @@ export class CopyPasteContextMenu implements IContextMenuExtension {
1212

1313
public provideContextMenuItems(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem): IContextMenuItem[] {
1414
return [
15-
{ title: 'copy', icon: `<img src="${new URL('../assets/icons/copy.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.copy }); }, shortCut: 'Ctrl + C', disabled: designItem === null },
16-
{ title: 'cut', icon: `<img src="${new URL('../assets/icons/cut.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.cut }); }, shortCut: 'Ctrl + X', disabled: designItem === null },
17-
{ title: 'paste', icon: `<img src="${new URL('../assets/icons/paste.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.paste }); }, shortCut: 'Ctrl + V' },
18-
{ title: 'delete', icon: `<img src="${new URL('../assets/icons/delete.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.delete }); }, shortCut: 'Del', disabled: designItem === null },
15+
{ title: 'copy', icon: `<img src="${assetsPath + 'icons/copy.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.copy }); }, shortCut: 'Ctrl + C', disabled: designItem === null },
16+
{ title: 'cut', icon: `<img src="${assetsPath + 'icons/cut.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.cut }); }, shortCut: 'Ctrl + X', disabled: designItem === null },
17+
{ title: 'paste', icon: `<img src="${assetsPath + 'icons/paste.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.paste }); }, shortCut: 'Ctrl + V' },
18+
{ title: 'delete', icon: `<img src="${assetsPath + 'icons/delete.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.delete }); }, shortCut: 'Del', disabled: designItem === null },
1919
]
2020
}
2121
}

packages/web-component-designer/src/elements/widgets/designerView/extensions/contextMenu/JumpToElementContextMenu.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1+
import { assetsPath } from '../../../../../Constants.js';
12
import { IContextMenuItem } from '../../../../helper/contextMenu/IContextMenuItem.js';
23
import { IDesignItem } from '../../../../item/IDesignItem.js';
34
import { IDesignerCanvas } from '../../IDesignerCanvas.js';
45
import { ContextmenuInitiator, IContextMenuExtension } from './IContextMenuExtension.js';
5-
import basePath from '../../../../../basepath.js';
66

77
export class JumpToElementContextMenu implements IContextMenuExtension {
88

@@ -13,10 +13,10 @@ export class JumpToElementContextMenu implements IContextMenuExtension {
1313
public provideContextMenuItems(event: MouseEvent, designerCanvas: IDesignerCanvas, designItem: IDesignItem): IContextMenuItem[] {
1414
return [
1515
{
16-
title: 'jump to', icon: `<img src="${new URL('../assets/icons/jump.svg', basePath)}">`, action: () => {
16+
title: 'jump to', icon: `<img src="${assetsPath + 'icons/jump.svg'}">`, action: () => {
1717
const coord = designerCanvas.getNormalizedElementCoordinates(designItem.element);
18-
19-
designerCanvas.zoomPoint({x: coord.x + coord.width / 2, y: coord.y + coord.height / 2 }, designerCanvas.zoomFactor);
18+
19+
designerCanvas.zoomPoint({ x: coord.x + coord.width / 2, y: coord.y + coord.height / 2 }, designerCanvas.zoomFactor);
2020
}
2121
},
2222
]

packages/web-component-designer/src/elements/widgets/designerView/extensions/contextMenu/RotateLeftAndRightContextMenu.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { IDesignItem } from '../../../../item/IDesignItem.js';
44
import { NodeType } from '../../../../item/NodeType.js';
55
import { IDesignerCanvas } from '../../IDesignerCanvas.js';
66
import { ContextmenuInitiator, IContextMenuExtension } from './IContextMenuExtension.js';
7-
import basePath from '../../../../../basepath.js';
7+
import { assetsPath } from '../../../../../Constants.js';
88

99
export class RotateLeftAndRight implements IContextMenuExtension {
1010

@@ -14,8 +14,8 @@ export class RotateLeftAndRight implements IContextMenuExtension {
1414

1515
public provideContextMenuItems(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem): IContextMenuItem[] {
1616
return [
17-
{ title: 'rotate right', icon: `<img src="${new URL('../assets/icons/rotateRight.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.rotateClockwise }); }, shortCut: 'Ctrl + R' },
18-
{ title: 'rotate left', icon: `<img src="${new URL('../assets/icons/rotateLeft.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.rotateCounterClockwise }); }, shortCut: 'Ctrl + Shift + R' }
17+
{ title: 'rotate right', icon: `<img src="${assetsPath + 'icons/rotateRight.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.rotateClockwise }); }, shortCut: 'Ctrl + R' },
18+
{ title: 'rotate left', icon: `<img src="${assetsPath + 'icons/rotateLeft.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.rotateCounterClockwise }); }, shortCut: 'Ctrl + Shift + R' }
1919
]
2020
}
2121
}

packages/web-component-designer/src/elements/widgets/designerView/extensions/contextMenu/ZMoveContextMenu.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,20 @@ import { IDesignItem } from '../../../../item/IDesignItem.js';
44
import { NodeType } from '../../../../item/NodeType.js';
55
import { IDesignerCanvas } from '../../IDesignerCanvas.js';
66
import { ContextmenuInitiator, IContextMenuExtension } from './IContextMenuExtension.js';
7-
import basePath from '../../../../../basepath.js';
7+
import { assetsPath } from '../../../../../Constants.js';
88

9-
export class ZMoveContextMenu implements IContextMenuExtension{
9+
export class ZMoveContextMenu implements IContextMenuExtension {
1010

1111
public shouldProvideContextmenu(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem, initiator: ContextmenuInitiator) {
1212
return !designItem?.isRootItem && designItem?.nodeType == NodeType.Element;
1313
}
1414

1515
public provideContextMenuItems(event: MouseEvent, designerView: IDesignerCanvas, designItem: IDesignItem): IContextMenuItem[] {
1616
return [
17-
{ title: 'to front', icon: `<img style="rotate: 90deg" src="${new URL('../assets/icons/moveFirst.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.moveToFront }); } },
18-
{ title: 'move forward', icon: `<img style="rotate: 90deg" src="${new URL('../assets/icons/moveLeft.svg', basePath)}">`,action: () => { designerView.executeCommand({ type: CommandType.moveForward }); } },
19-
{ title: 'move backward',icon: `<img style="rotate: 270deg" src="${new URL('../assets/icons/moveLeft.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.moveBackward }); } },
20-
{ title: 'to back',icon: `<img style="rotate: 270deg" src="${new URL('../assets/icons/moveFirst.svg', basePath)}">`, action: () => { designerView.executeCommand({ type: CommandType.moveToBack }); } },
17+
{ title: 'to front', icon: `<img style="rotate: 90deg" src="${assetsPath + 'icons/moveFirst.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.moveToFront }); } },
18+
{ title: 'move forward', icon: `<img style="rotate: 90deg" src="${assetsPath + 'icons/moveLeft.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.moveForward }); } },
19+
{ title: 'move backward', icon: `<img style="rotate: 270deg" src="${assetsPath + 'icons/moveLeft.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.moveBackward }); } },
20+
{ title: 'to back', icon: `<img style="rotate: 270deg" src="${assetsPath + 'icons/moveFirst.svg'}">`, action: () => { designerView.executeCommand({ type: CommandType.moveToBack }); } },
2121
]
2222
}
2323
}

0 commit comments

Comments
 (0)