@node-projects/web-component-designer 0.0.79 → 0.0.80
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.github/FUNDING.yml +1 -0
- package/dist/elements/helper/PathDataPolyfill.js +1 -1
- package/dist/elements/widgets/codeView/code-view-ace.js +1 -1
- package/dist/elements/widgets/designerView/extensions/PathExtension.d.ts +3 -1
- package/dist/elements/widgets/designerView/extensions/PathExtension.js +59 -5
- package/dist/elements/widgets/designerView/tools/DrawEllipsisTool.js +1 -0
- package/dist/elements/widgets/designerView/tools/DrawLineTool.js +1 -0
- package/dist/elements/widgets/designerView/tools/DrawPathTool.d.ts +0 -1
- package/dist/elements/widgets/designerView/tools/DrawPathTool.js +12 -8
- package/dist/elements/widgets/designerView/tools/DrawRectTool.js +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/package.json +1 -1
- package/dist/elements/services/htmlWriterService/FormatingHtmlWriterService copy.d.ts +0 -22
- package/dist/elements/services/htmlWriterService/FormatingHtmlWriterService copy.js +0 -125
- package/dist/elements/services/htmlWriterService/HtmlWriterService copy.d.ts +0 -22
- package/dist/elements/services/htmlWriterService/HtmlWriterService copy.js +0 -118
- package/dist/elements/services/htmlWriterService/LitElementWriterService.d.ts +0 -14
- package/dist/elements/services/htmlWriterService/LitElementWriterService.js +0 -123
- package/dist/elements/services/htmlWriterService/SimpleHtmlWriterService copy.d.ts +0 -22
- package/dist/elements/services/htmlWriterService/SimpleHtmlWriterService copy.js +0 -125
- package/dist/elements/services/initializationService/IIntializationService copy.d.ts +0 -4
- package/dist/elements/services/initializationService/IIntializationService copy.js +0 -1
- package/dist/elements/services/manifestLoaders/WebcomponentManifestParserService.d.ts +0 -26
- package/dist/elements/services/manifestLoaders/WebcomponentManifestParserService.js +0 -69
- package/dist/elements/services/webcomponentManifestParserService/WebcomponentManifestParserService.1.d.ts +0 -0
- package/dist/elements/services/webcomponentManifestParserService/WebcomponentManifestParserService.1.js +0 -1
- package/dist/elements/services/webcomponentManifestParserService/webcomponentManifestParserService.d.ts +0 -26
- package/dist/elements/services/webcomponentManifestParserService/webcomponentManifestParserService.js +0 -69
package/.github/FUNDING.yml
CHANGED
|
@@ -857,7 +857,7 @@ if (!SVGPathElement.prototype.getPathData || !SVGPathElement.prototype.setPathDa
|
|
|
857
857
|
})();
|
|
858
858
|
}
|
|
859
859
|
export function straightenLine(p1, p2) {
|
|
860
|
-
let newP
|
|
860
|
+
let newP;
|
|
861
861
|
let alpha = calculateAlpha(p1, p2);
|
|
862
862
|
let normLength;
|
|
863
863
|
if ((alpha >= 337.5 && alpha < 360 || alpha >= 0 && alpha < 22.5)) { // 0
|
|
@@ -95,7 +95,7 @@ export class CodeViewAce extends BaseCustomWebComponentLazyAppend {
|
|
|
95
95
|
this._aceEditor = ace.edit(this._editor, {
|
|
96
96
|
theme: "ace/theme/chrome",
|
|
97
97
|
mode: "ace/mode/html",
|
|
98
|
-
value: "
|
|
98
|
+
value: "",
|
|
99
99
|
autoScrollEditorIntoView: true,
|
|
100
100
|
fontSize: "14px",
|
|
101
101
|
showPrintMargin: false,
|
|
@@ -2,6 +2,7 @@ import { IDesignItem } from "../../../item/IDesignItem";
|
|
|
2
2
|
import { IDesignerCanvas } from "../IDesignerCanvas";
|
|
3
3
|
import { AbstractExtension } from "./AbstractExtension";
|
|
4
4
|
import "../../../helper/PathDataPolyfill";
|
|
5
|
+
import { IPoint } from "../../../../interfaces/IPoint";
|
|
5
6
|
import { IExtensionManager } from "./IExtensionManger";
|
|
6
7
|
import { PathData } from "../../../helper/PathDataPolyfill";
|
|
7
8
|
export declare class PathExtension extends AbstractExtension {
|
|
@@ -14,9 +15,10 @@ export declare class PathExtension extends AbstractExtension {
|
|
|
14
15
|
constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
|
|
15
16
|
extend(): void;
|
|
16
17
|
pointerEvent(event: PointerEvent, circle: SVGCircleElement, p: PathData, index: number): void;
|
|
17
|
-
_drawPath(path: PathData[], index: number):
|
|
18
|
+
_drawPath(path: PathData[], index: number): string;
|
|
18
19
|
_drawPathCircle(x: number, y: number, p: PathData, index: number): void;
|
|
19
20
|
_drawPathLine(x1: number, y1: number, x2: number, y2: number): void;
|
|
21
|
+
_drawHelpLine(pStart: IPoint, pEnd: IPoint): void;
|
|
20
22
|
refresh(): void;
|
|
21
23
|
dispose(): void;
|
|
22
24
|
}
|
|
@@ -83,9 +83,27 @@ export class PathExtension extends AbstractExtension {
|
|
|
83
83
|
const cy = event.y - this._lastPos.y + this._circlePos.y;
|
|
84
84
|
const dx = cx - this._circlePos.x;
|
|
85
85
|
const dy = cy - this._circlePos.y;
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
86
|
+
if (event.shiftKey) {
|
|
87
|
+
if (Math.abs(dx) >= Math.abs(dy)) {
|
|
88
|
+
p.values[index] = this._originalPathPoint.x + dx;
|
|
89
|
+
circle.setAttribute("cx", (this._circlePos.x + dx).toString());
|
|
90
|
+
p.values[index + 1] = this._originalPathPoint.y;
|
|
91
|
+
circle.setAttribute("cy", (this._circlePos.y).toString());
|
|
92
|
+
}
|
|
93
|
+
else {
|
|
94
|
+
p.values[index] = this._originalPathPoint.x;
|
|
95
|
+
circle.setAttribute("cx", (this._circlePos.x).toString());
|
|
96
|
+
p.values[index + 1] = this._originalPathPoint.y + dy;
|
|
97
|
+
circle.setAttribute("cy", (this._circlePos.y + dy).toString());
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
else {
|
|
101
|
+
p.values[index] = this._originalPathPoint.x + dx;
|
|
102
|
+
p.values[index + 1] = this._originalPathPoint.y + dy;
|
|
103
|
+
circle.setAttribute("cx", (this._circlePos.x + dx).toString());
|
|
104
|
+
circle.setAttribute("cy", (this._circlePos.y + dy).toString());
|
|
105
|
+
}
|
|
106
|
+
this.extendedItem.element.setAttribute("d", this._drawPath(this._pathdata, index));
|
|
89
107
|
}
|
|
90
108
|
break;
|
|
91
109
|
case EventNames.PointerUp:
|
|
@@ -93,15 +111,42 @@ export class PathExtension extends AbstractExtension {
|
|
|
93
111
|
this._startPos = null;
|
|
94
112
|
this._circlePos = null;
|
|
95
113
|
this._lastPos = null;
|
|
114
|
+
this.extendedItem.setAttribute('d', this._drawPath(this._pathdata, index));
|
|
96
115
|
break;
|
|
97
116
|
}
|
|
98
117
|
}
|
|
99
118
|
_drawPath(path, index) {
|
|
100
119
|
let pathD = "";
|
|
101
120
|
for (let p of path) {
|
|
102
|
-
|
|
121
|
+
switch (p.type) {
|
|
122
|
+
case 'M':
|
|
123
|
+
pathD += p.type + p.values[0] + " " + p.values[1];
|
|
124
|
+
break;
|
|
125
|
+
case 'L':
|
|
126
|
+
pathD += p.type + p.values[0] + " " + p.values[1];
|
|
127
|
+
break;
|
|
128
|
+
case 'H':
|
|
129
|
+
break;
|
|
130
|
+
case 'V':
|
|
131
|
+
break;
|
|
132
|
+
case 'Z':
|
|
133
|
+
break;
|
|
134
|
+
case 'C':
|
|
135
|
+
case 'c':
|
|
136
|
+
pathD += p.type + p.values[0] + " " + p.values[1] + " " + p.values[2] + " " + p.values[3] + " " + p.values[4] + " " + p.values[5];
|
|
137
|
+
break;
|
|
138
|
+
case 'S':
|
|
139
|
+
break;
|
|
140
|
+
case 'Q':
|
|
141
|
+
break;
|
|
142
|
+
case 'T':
|
|
143
|
+
break;
|
|
144
|
+
case 'A':
|
|
145
|
+
break;
|
|
146
|
+
}
|
|
103
147
|
}
|
|
104
|
-
|
|
148
|
+
return pathD;
|
|
149
|
+
console.log(pathD);
|
|
105
150
|
}
|
|
106
151
|
_drawPathCircle(x, y, p, index) {
|
|
107
152
|
let circle = this._drawCircle(this._parentRect.x - this.designerCanvas.containerBoundingRect.x + x, this._parentRect.y - this.designerCanvas.containerBoundingRect.y + y, 3, 'svg-path');
|
|
@@ -112,6 +157,15 @@ export class PathExtension extends AbstractExtension {
|
|
|
112
157
|
_drawPathLine(x1, y1, x2, y2) {
|
|
113
158
|
this._drawLine(this._parentRect.x - this.designerCanvas.containerBoundingRect.x + x1, this._parentRect.y - this.designerCanvas.containerBoundingRect.y + y1, this._parentRect.x - this.designerCanvas.containerBoundingRect.x + x2, this._parentRect.y - this.designerCanvas.containerBoundingRect.y + y2, 'svg-path-line');
|
|
114
159
|
}
|
|
160
|
+
_drawHelpLine(pStart, pEnd) {
|
|
161
|
+
let line;
|
|
162
|
+
line.setAttribute("stroke", "yellow");
|
|
163
|
+
line.setAttribute("stroke-width", "2");
|
|
164
|
+
line.setAttribute("x1", pStart.x.toString());
|
|
165
|
+
line.setAttribute("y1", pStart.y.toString());
|
|
166
|
+
line.setAttribute("x2", pEnd.x.toString());
|
|
167
|
+
line.setAttribute("y2", pEnd.y.toString());
|
|
168
|
+
}
|
|
115
169
|
refresh() {
|
|
116
170
|
this._removeAllOverlays();
|
|
117
171
|
this.extend();
|
|
@@ -80,6 +80,7 @@ export class DrawEllipsisTool {
|
|
|
80
80
|
svg.style.position = 'absolute';
|
|
81
81
|
svg.style.width = (rect.width + 2 * offset) + 'px';
|
|
82
82
|
svg.style.height = (rect.height + 2 * offset) + 'px';
|
|
83
|
+
svg.style.overflow = 'visible';
|
|
83
84
|
this._path = null;
|
|
84
85
|
const di = DesignItem.createDesignItemFromInstance(svg, designerCanvas.serviceContainer, designerCanvas.instanceServiceContainer);
|
|
85
86
|
designerCanvas.instanceServiceContainer.undoService.execute(new InsertAction(designerCanvas.rootDesignItem, designerCanvas.rootDesignItem.childCount, di));
|
|
@@ -65,6 +65,7 @@ export class DrawLineTool {
|
|
|
65
65
|
svg.style.position = 'absolute';
|
|
66
66
|
svg.style.width = (rect.width + 2 * offset) + 'px';
|
|
67
67
|
svg.style.height = (rect.height + 2 * offset) + 'px';
|
|
68
|
+
svg.style.overflow = 'visible';
|
|
68
69
|
this._path = null;
|
|
69
70
|
const di = DesignItem.createDesignItemFromInstance(svg, designerCanvas.serviceContainer, designerCanvas.instanceServiceContainer);
|
|
70
71
|
designerCanvas.instanceServiceContainer.undoService.execute(new InsertAction(designerCanvas.rootDesignItem, designerCanvas.rootDesignItem.childCount, di));
|
|
@@ -12,8 +12,7 @@ export class DrawPathTool {
|
|
|
12
12
|
_dragMode = false;
|
|
13
13
|
_pointerMoved = false;
|
|
14
14
|
_eventStarted = false;
|
|
15
|
-
_lastPoint
|
|
16
|
-
_savedPoint = { x: 0, y: 0 };
|
|
15
|
+
_lastPoint;
|
|
17
16
|
_startPoint = { x: 0, y: 0 };
|
|
18
17
|
constructor() {
|
|
19
18
|
}
|
|
@@ -38,10 +37,12 @@ export class DrawPathTool {
|
|
|
38
37
|
designerCanvas.overlayLayer.addOverlay(this._path, OverlayLayer.Foregorund);
|
|
39
38
|
this._startPoint = currentPoint;
|
|
40
39
|
}
|
|
41
|
-
if (this._lastPoint.x === currentPoint.x && this._lastPoint.y === currentPoint.y && !this._samePoint) {
|
|
40
|
+
if (this._lastPoint != null && this._lastPoint.x === currentPoint.x && this._lastPoint.y === currentPoint.y && !this._samePoint) {
|
|
42
41
|
this._samePoint = true;
|
|
43
42
|
}
|
|
44
|
-
this._lastPoint
|
|
43
|
+
if (this._lastPoint == null) {
|
|
44
|
+
this._lastPoint = currentPoint;
|
|
45
|
+
}
|
|
45
46
|
break;
|
|
46
47
|
case EventNames.PointerMove:
|
|
47
48
|
if (this._eventStarted) {
|
|
@@ -57,8 +58,9 @@ export class DrawPathTool {
|
|
|
57
58
|
else { // shows line preview
|
|
58
59
|
if (this._path) {
|
|
59
60
|
let straightLine = currentPoint;
|
|
60
|
-
if (event.shiftKey)
|
|
61
|
-
straightLine = straightenLine(this.
|
|
61
|
+
if (event.shiftKey) {
|
|
62
|
+
straightLine = straightenLine(this._lastPoint, currentPoint);
|
|
63
|
+
}
|
|
62
64
|
this._path.setAttribute("d", this._pathD + "L" + straightLine.x + " " + straightLine.y);
|
|
63
65
|
}
|
|
64
66
|
}
|
|
@@ -71,15 +73,16 @@ export class DrawPathTool {
|
|
|
71
73
|
if (this._p2pMode && !this._samePoint && this._startPoint.x != currentPoint.x && this._startPoint.y != currentPoint.y) {
|
|
72
74
|
if (this._path) {
|
|
73
75
|
if (event.shiftKey) {
|
|
74
|
-
let straightLine = straightenLine(this.
|
|
76
|
+
let straightLine = straightenLine(this._lastPoint, currentPoint);
|
|
75
77
|
this._pathD += "L" + straightLine.x + " " + straightLine.y;
|
|
76
78
|
this._path.setAttribute("d", this._pathD);
|
|
79
|
+
this._lastPoint = straightLine;
|
|
77
80
|
}
|
|
78
81
|
else {
|
|
79
82
|
this._pathD += "L" + currentPoint.x + " " + currentPoint.y;
|
|
80
83
|
this._path.setAttribute("d", this._pathD);
|
|
84
|
+
this._lastPoint = currentPoint;
|
|
81
85
|
}
|
|
82
|
-
this._savedPoint = currentPoint;
|
|
83
86
|
}
|
|
84
87
|
}
|
|
85
88
|
if (this._samePoint && this._p2pMode || this._dragMode && !this._p2pMode) {
|
|
@@ -101,6 +104,7 @@ export class DrawPathTool {
|
|
|
101
104
|
svg.style.position = 'absolute';
|
|
102
105
|
svg.style.width = (rect.width + 2 * offset) + 'px';
|
|
103
106
|
svg.style.height = (rect.height + 2 * offset) + 'px';
|
|
107
|
+
svg.style.overflow = 'visible';
|
|
104
108
|
//designerView.rootDesignItem.element.appendChild(svg);
|
|
105
109
|
this._path = null;
|
|
106
110
|
this._pathD = null;
|
|
@@ -95,6 +95,7 @@ export class DrawRectTool {
|
|
|
95
95
|
svg.style.position = 'absolute';
|
|
96
96
|
svg.style.width = (rect.width + 2 * offset) + 'px';
|
|
97
97
|
svg.style.height = (rect.height + 2 * offset) + 'px';
|
|
98
|
+
svg.style.overflow = 'visible';
|
|
98
99
|
this._path = null;
|
|
99
100
|
const di = DesignItem.createDesignItemFromInstance(svg, designerCanvas.serviceContainer, designerCanvas.instanceServiceContainer);
|
|
100
101
|
designerCanvas.instanceServiceContainer.undoService.execute(new InsertAction(designerCanvas.rootDesignItem, designerCanvas.rootDesignItem.childCount, di));
|
package/dist/index.d.ts
CHANGED
|
@@ -179,3 +179,4 @@ export type { IPoint } from "./interfaces/IPoint.js";
|
|
|
179
179
|
export type { IRect } from "./interfaces/IRect.js";
|
|
180
180
|
export type { ISize } from "./interfaces/ISize.js";
|
|
181
181
|
export type { ICommandHandler } from "./interfaces/ICommandHandler.js";
|
|
182
|
+
export * from './Constants.js';
|
package/dist/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { IDesignItem } from '../../item/IDesignItem';
|
|
2
|
-
import { IHtmlWriterService } from './IHtmlWriterService';
|
|
3
|
-
import { IHtmlWriterOptions } from './IHtmlWriterOptions';
|
|
4
|
-
import { IndentedTextWriter } from '../../helper/IndentedTextWriter';
|
|
5
|
-
import { IStringPosition } from './IStringPosition';
|
|
6
|
-
declare enum ElementContainerType {
|
|
7
|
-
block = 0,
|
|
8
|
-
complex = 1
|
|
9
|
-
}
|
|
10
|
-
export declare class FormatingHtmlWriterService implements IHtmlWriterService {
|
|
11
|
-
private writeAttributes;
|
|
12
|
-
private writeStyles;
|
|
13
|
-
private _writeTextNode;
|
|
14
|
-
private _writeCommentNode;
|
|
15
|
-
private _writeElementNode;
|
|
16
|
-
private _writeDesignItemList;
|
|
17
|
-
private _writeNewlineAndIntend;
|
|
18
|
-
private _writeInternal;
|
|
19
|
-
getContainerType(element: HTMLElement): ElementContainerType;
|
|
20
|
-
write(indentedTextWriter: IndentedTextWriter, designItems: IDesignItem[], rootContainerKeepInline: boolean, options: IHtmlWriterOptions, designItemsAssignmentList?: Map<IDesignItem, IStringPosition>): void;
|
|
21
|
-
}
|
|
22
|
-
export {};
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
import { DomConverter } from '../../widgets/designerView/DomConverter';
|
|
2
|
-
import { CssCombiner } from '../../helper/CssCombiner';
|
|
3
|
-
import { NodeType } from '../../item/NodeType';
|
|
4
|
-
import { PropertiesHelper } from '../propertiesService/services/PropertiesHelper';
|
|
5
|
-
import { ElementDisplayType, getElementDisplaytype } from '../../helper/ElementHelper.js';
|
|
6
|
-
var ElementContainerType;
|
|
7
|
-
(function (ElementContainerType) {
|
|
8
|
-
ElementContainerType[ElementContainerType["block"] = 0] = "block";
|
|
9
|
-
ElementContainerType[ElementContainerType["complex"] = 1] = "complex";
|
|
10
|
-
})(ElementContainerType || (ElementContainerType = {}));
|
|
11
|
-
const defaultDisplayNoneContainerDisplayType = ElementContainerType.complex;
|
|
12
|
-
export class FormatingHtmlWriterService {
|
|
13
|
-
writeAttributes(writeContext, designItem) {
|
|
14
|
-
if (designItem.hasAttributes) {
|
|
15
|
-
for (const a of designItem.attributes) {
|
|
16
|
-
writeContext.indentedTextWriter.write(' ');
|
|
17
|
-
if (typeof a[1] === 'string') {
|
|
18
|
-
if (a[1] === "")
|
|
19
|
-
writeContext.indentedTextWriter.write(a[0]);
|
|
20
|
-
else
|
|
21
|
-
writeContext.indentedTextWriter.write(a[0] + '="' + DomConverter.normalizeAttributeValue(a[1]) + '"');
|
|
22
|
-
}
|
|
23
|
-
else if (!a[1])
|
|
24
|
-
writeContext.indentedTextWriter.write(a[0]);
|
|
25
|
-
else {
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
writeStyles(writeContext, designItem) {
|
|
31
|
-
if (designItem.hasStyles) {
|
|
32
|
-
writeContext.indentedTextWriter.write(' style="');
|
|
33
|
-
let styles = designItem.styles;
|
|
34
|
-
if (writeContext.options.compressCssToShorthandProperties)
|
|
35
|
-
styles = CssCombiner.combine(styles);
|
|
36
|
-
for (const s of styles) {
|
|
37
|
-
if (s[0]) {
|
|
38
|
-
writeContext.indentedTextWriter.write(PropertiesHelper.camelToDashCase(s[0]) + ':' + DomConverter.normalizeAttributeValue(s[1]) + ';');
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
writeContext.indentedTextWriter.write('"');
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
_writeTextNode(writeContext, designItem) {
|
|
45
|
-
writeContext.lastElementDisplayType = ElementDisplayType.inline;
|
|
46
|
-
let content = DomConverter.normalizeContentValue(designItem.content).trim();
|
|
47
|
-
if (content) {
|
|
48
|
-
writeContext.indentedTextWriter.write(content);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
_writeCommentNode(writeContext, designItem) {
|
|
52
|
-
writeContext.indentedTextWriter.write('<!--' + designItem.content + '-->');
|
|
53
|
-
}
|
|
54
|
-
_writeElementNode(writeContext, designItem) {
|
|
55
|
-
const currentElementDisplayType = getElementDisplaytype(designItem.element);
|
|
56
|
-
writeContext.lastElementDisplayType = currentElementDisplayType;
|
|
57
|
-
writeContext.indentedTextWriter.write('<' + designItem.name);
|
|
58
|
-
this.writeAttributes(writeContext, designItem);
|
|
59
|
-
this.writeStyles(writeContext, designItem);
|
|
60
|
-
writeContext.indentedTextWriter.write('>');
|
|
61
|
-
if (designItem.hasChildren) {
|
|
62
|
-
const children = designItem.children();
|
|
63
|
-
const contentSingleTextNode = designItem.childCount === 1 && designItem.firstChild.nodeType === NodeType.TextNode;
|
|
64
|
-
if (contentSingleTextNode) {
|
|
65
|
-
this._writeInternal(writeContext, designItem.firstChild);
|
|
66
|
-
}
|
|
67
|
-
else {
|
|
68
|
-
let previousContainerDisplayType = writeContext.containerDisplayType;
|
|
69
|
-
writeContext.containerDisplayType = this.getContainerType(designItem.element);
|
|
70
|
-
writeContext.indentedTextWriter.levelRaise();
|
|
71
|
-
this._writeDesignItemList(currentElementDisplayType, writeContext, children);
|
|
72
|
-
writeContext.indentedTextWriter.levelShrink();
|
|
73
|
-
writeContext.containerDisplayType = previousContainerDisplayType;
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
else if (designItem.hasContent) {
|
|
77
|
-
writeContext.indentedTextWriter.write(DomConverter.normalizeContentValue(designItem.content));
|
|
78
|
-
}
|
|
79
|
-
if (!DomConverter.IsSelfClosingElement(designItem.name)) {
|
|
80
|
-
//write newline & intend ???
|
|
81
|
-
writeContext.indentedTextWriter.write('</' + designItem.name + '>');
|
|
82
|
-
if (currentElementDisplayType !== ElementDisplayType.none) {
|
|
83
|
-
writeContext.lastElementDisplayType = currentElementDisplayType;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
_writeDesignItemList(currentElementDisplayType, writeContext, children) {
|
|
88
|
-
for (const c of children) {
|
|
89
|
-
if (writeContext.lastElementDisplayType == null) {
|
|
90
|
-
//first entry, do nothing
|
|
91
|
-
}
|
|
92
|
-
else if (writeContext.containerDisplayType === ElementContainerType.complex)
|
|
93
|
-
this._writeNewlineAndIntend(writeContext);
|
|
94
|
-
else if (writeContext.lastElementDisplayType !== ElementDisplayType.inline || currentElementDisplayType !== ElementDisplayType.inline)
|
|
95
|
-
this._writeNewlineAndIntend(writeContext);
|
|
96
|
-
this._writeInternal(writeContext, c);
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
_writeNewlineAndIntend(writeContext) {
|
|
100
|
-
writeContext.indentedTextWriter.writeNewline();
|
|
101
|
-
writeContext.indentedTextWriter.writeIndent();
|
|
102
|
-
}
|
|
103
|
-
_writeInternal(writeContext, designItem) {
|
|
104
|
-
const start = writeContext.indentedTextWriter.position;
|
|
105
|
-
if (designItem.nodeType === NodeType.TextNode)
|
|
106
|
-
this._writeTextNode(writeContext, designItem);
|
|
107
|
-
else if (designItem.nodeType === NodeType.Comment)
|
|
108
|
-
this._writeCommentNode(writeContext, designItem);
|
|
109
|
-
else if (designItem.nodeType === NodeType.Element)
|
|
110
|
-
this._writeElementNode(writeContext, designItem);
|
|
111
|
-
if (writeContext.designItemsAssignmentList) {
|
|
112
|
-
writeContext.designItemsAssignmentList.set(designItem, { start: start, length: writeContext.indentedTextWriter.position - start - 1 });
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
getContainerType(element) {
|
|
116
|
-
const display = window.getComputedStyle(element).display;
|
|
117
|
-
if (display === 'block' || display === "inline-block" || display == '')
|
|
118
|
-
return ElementContainerType.block;
|
|
119
|
-
return ElementContainerType.complex;
|
|
120
|
-
}
|
|
121
|
-
write(indentedTextWriter, designItems, rootContainerKeepInline, options, designItemsAssignmentList) {
|
|
122
|
-
const context = { indentedTextWriter, options, lastElementDisplayType: null, containerDisplayType: ElementContainerType.block, designItemsAssignmentList };
|
|
123
|
-
this._writeDesignItemList(ElementDisplayType.inline, context, designItems);
|
|
124
|
-
}
|
|
125
|
-
}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { IDesignItem } from '../../item/IDesignItem';
|
|
2
|
-
import { IHtmlWriterService } from './IHtmlWriterService';
|
|
3
|
-
import { IHtmlWriterOptions } from './IHtmlWriterOptions';
|
|
4
|
-
import { IndentedTextWriter } from '../../helper/IndentedTextWriter';
|
|
5
|
-
import { IStringPosition } from './IStringPosition';
|
|
6
|
-
declare enum ElementContainerType {
|
|
7
|
-
block = 0,
|
|
8
|
-
complex = 1
|
|
9
|
-
}
|
|
10
|
-
export declare class HtmlWriterService implements IHtmlWriterService {
|
|
11
|
-
private writeAttributes;
|
|
12
|
-
private writeStyles;
|
|
13
|
-
private _writeTextNode;
|
|
14
|
-
private _writeCommentNode;
|
|
15
|
-
private _writeElementNode;
|
|
16
|
-
private _writeDesignItemList;
|
|
17
|
-
private _writeNewlineAndIntend;
|
|
18
|
-
private _writeInternal;
|
|
19
|
-
getContainerType(element: HTMLElement): ElementContainerType;
|
|
20
|
-
write(indentedTextWriter: IndentedTextWriter, designItems: IDesignItem[], rootContainerKeepInline: boolean, options: IHtmlWriterOptions, designItemsAssignmentList?: Map<IDesignItem, IStringPosition>): void;
|
|
21
|
-
}
|
|
22
|
-
export {};
|
|
@@ -1,118 +0,0 @@
|
|
|
1
|
-
import { DomConverter } from '../../widgets/designerView/DomConverter';
|
|
2
|
-
import { CssCombiner } from '../../helper/CssCombiner';
|
|
3
|
-
import { NodeType } from '../../item/NodeType';
|
|
4
|
-
import { PropertiesHelper } from '../propertiesService/services/PropertiesHelper';
|
|
5
|
-
import { ElementDisplayType, getElementDisplaytype } from '../../helper/ElementHelper.js';
|
|
6
|
-
var ElementContainerType;
|
|
7
|
-
(function (ElementContainerType) {
|
|
8
|
-
ElementContainerType[ElementContainerType["block"] = 0] = "block";
|
|
9
|
-
ElementContainerType[ElementContainerType["complex"] = 1] = "complex";
|
|
10
|
-
})(ElementContainerType || (ElementContainerType = {}));
|
|
11
|
-
export class HtmlWriterService {
|
|
12
|
-
writeAttributes(writeContext, designItem) {
|
|
13
|
-
if (designItem.hasAttributes) {
|
|
14
|
-
for (const a of designItem.attributes) {
|
|
15
|
-
writeContext.indentedTextWriter.write(' ');
|
|
16
|
-
if (typeof a[1] === 'string') {
|
|
17
|
-
if (a[1] === "")
|
|
18
|
-
writeContext.indentedTextWriter.write(a[0]);
|
|
19
|
-
else
|
|
20
|
-
writeContext.indentedTextWriter.write(a[0] + '="' + DomConverter.normalizeAttributeValue(a[1]) + '"');
|
|
21
|
-
}
|
|
22
|
-
else if (!a[1])
|
|
23
|
-
writeContext.indentedTextWriter.write(a[0]);
|
|
24
|
-
else {
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
writeStyles(writeContext, designItem) {
|
|
30
|
-
if (designItem.hasStyles) {
|
|
31
|
-
writeContext.indentedTextWriter.write(' style="');
|
|
32
|
-
let styles = designItem.styles;
|
|
33
|
-
if (writeContext.options.compressCssToShorthandProperties)
|
|
34
|
-
styles = CssCombiner.combine(styles);
|
|
35
|
-
for (const s of styles) {
|
|
36
|
-
if (s[0]) {
|
|
37
|
-
writeContext.indentedTextWriter.write(PropertiesHelper.camelToDashCase(s[0]) + ':' + DomConverter.normalizeAttributeValue(s[1]) + ';');
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
writeContext.indentedTextWriter.write('"');
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
_writeTextNode(writeContext, designItem) {
|
|
44
|
-
writeContext.lastElementDisplayType = ElementDisplayType.inline;
|
|
45
|
-
let content = DomConverter.normalizeContentValue(designItem.content).trim();
|
|
46
|
-
if (content) {
|
|
47
|
-
writeContext.indentedTextWriter.write(content);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
_writeCommentNode(writeContext, designItem) {
|
|
51
|
-
writeContext.indentedTextWriter.write('<!--' + designItem.content + '-->');
|
|
52
|
-
}
|
|
53
|
-
_writeElementNode(writeContext, designItem) {
|
|
54
|
-
const currentElementDisplayType = getElementDisplaytype(designItem.element);
|
|
55
|
-
writeContext.lastElementDisplayType = currentElementDisplayType;
|
|
56
|
-
writeContext.indentedTextWriter.write('<' + designItem.name);
|
|
57
|
-
this.writeAttributes(writeContext, designItem);
|
|
58
|
-
this.writeStyles(writeContext, designItem);
|
|
59
|
-
writeContext.indentedTextWriter.write('>');
|
|
60
|
-
if (designItem.hasChildren) {
|
|
61
|
-
const children = designItem.children();
|
|
62
|
-
const contentSingleTextNode = designItem.childCount === 1 && designItem.firstChild.nodeType === NodeType.TextNode;
|
|
63
|
-
if (contentSingleTextNode) {
|
|
64
|
-
this._writeInternal(writeContext, designItem.firstChild);
|
|
65
|
-
}
|
|
66
|
-
else {
|
|
67
|
-
let previousContainerDisplayType = writeContext.containerDisplayType;
|
|
68
|
-
writeContext.containerDisplayType = this.getContainerType(designItem.element);
|
|
69
|
-
writeContext.indentedTextWriter.levelRaise();
|
|
70
|
-
this._writeDesignItemList(currentElementDisplayType, writeContext, children);
|
|
71
|
-
writeContext.indentedTextWriter.levelShrink();
|
|
72
|
-
writeContext.containerDisplayType = previousContainerDisplayType;
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
else if (designItem.hasContent) {
|
|
76
|
-
writeContext.indentedTextWriter.write(DomConverter.normalizeContentValue(designItem.content));
|
|
77
|
-
}
|
|
78
|
-
if (!DomConverter.IsSelfClosingElement(designItem.name))
|
|
79
|
-
writeContext.indentedTextWriter.write('</' + designItem.name + '>');
|
|
80
|
-
//if (writeContext.writerState === WriterState.block)
|
|
81
|
-
//this._writeNewlineAndIntend(writeContext);
|
|
82
|
-
}
|
|
83
|
-
_writeDesignItemList(currentElementDisplayType, writeContext, children) {
|
|
84
|
-
for (const c of children) {
|
|
85
|
-
if (writeContext.containerDisplayType === ElementContainerType.complex)
|
|
86
|
-
this._writeNewlineAndIntend(writeContext);
|
|
87
|
-
else if (writeContext.lastElementDisplayType !== ElementDisplayType.inline || currentElementDisplayType !== ElementDisplayType.inline)
|
|
88
|
-
this._writeNewlineAndIntend(writeContext);
|
|
89
|
-
this._writeInternal(writeContext, c);
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
_writeNewlineAndIntend(writeContext) {
|
|
93
|
-
writeContext.indentedTextWriter.writeNewline();
|
|
94
|
-
writeContext.indentedTextWriter.writeIndent();
|
|
95
|
-
}
|
|
96
|
-
_writeInternal(writeContext, designItem) {
|
|
97
|
-
const start = writeContext.indentedTextWriter.position;
|
|
98
|
-
if (designItem.nodeType === NodeType.TextNode)
|
|
99
|
-
this._writeTextNode(writeContext, designItem);
|
|
100
|
-
else if (designItem.nodeType === NodeType.Comment)
|
|
101
|
-
this._writeCommentNode(writeContext, designItem);
|
|
102
|
-
else if (designItem.nodeType === NodeType.Element)
|
|
103
|
-
this._writeElementNode(writeContext, designItem);
|
|
104
|
-
if (writeContext.designItemsAssignmentList) {
|
|
105
|
-
writeContext.designItemsAssignmentList.set(designItem, { start: start, length: writeContext.indentedTextWriter.position - start - 1 });
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
getContainerType(element) {
|
|
109
|
-
const display = window.getComputedStyle(element).display;
|
|
110
|
-
if (display === 'block' || display === "inline-block" || display == '')
|
|
111
|
-
return ElementContainerType.block;
|
|
112
|
-
return ElementContainerType.complex;
|
|
113
|
-
}
|
|
114
|
-
write(indentedTextWriter, designItems, rootContainerKeepInline, options, designItemsAssignmentList) {
|
|
115
|
-
const context = { indentedTextWriter, options, lastElementDisplayType: ElementDisplayType.none, containerDisplayType: ElementContainerType.block, designItemsAssignmentList };
|
|
116
|
-
this._writeDesignItemList(ElementDisplayType.inline, context, designItems);
|
|
117
|
-
}
|
|
118
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { IDesignItem } from '../../item/IDesignItem';
|
|
2
|
-
import { IHtmlWriterService } from './IHtmlWriterService';
|
|
3
|
-
import { IHtmlWriterOptions } from './IHtmlWriterOptions';
|
|
4
|
-
import { IndentedTextWriter } from '../../helper/IndentedTextWriter';
|
|
5
|
-
import { IStringPosition } from './IStringPosition';
|
|
6
|
-
export declare class LitTsElementWriterService implements IHtmlWriterService {
|
|
7
|
-
static head: string;
|
|
8
|
-
static footer: string;
|
|
9
|
-
canWrite(designItem: IDesignItem): boolean;
|
|
10
|
-
private _conditionalyWriteIndent;
|
|
11
|
-
private _conditionalyWriteNewline;
|
|
12
|
-
write(indentedTextWriter: IndentedTextWriter, designItem: IDesignItem, options: IHtmlWriterOptions, designItemsAssignmentList?: Map<IDesignItem, IStringPosition>): void;
|
|
13
|
-
private writeTextNode;
|
|
14
|
-
}
|
|
@@ -1,123 +0,0 @@
|
|
|
1
|
-
import { DomConverter } from '../../widgets/designerView/DomConverter';
|
|
2
|
-
import { CssCombiner } from '../../helper/CssCombiner';
|
|
3
|
-
import { NodeType } from '../../item/NodeType';
|
|
4
|
-
import { PropertiesHelper } from '../propertiesService/services/PropertiesHelper';
|
|
5
|
-
import { isInline } from '../../helper/ElementHelper.js';
|
|
6
|
-
//todo :
|
|
7
|
-
//write style...
|
|
8
|
-
//needs InternalBindinsgStorrageService -> keeps bindings
|
|
9
|
-
export class LitTsElementWriterService {
|
|
10
|
-
static head = `import { LitElement, html } from "lit-element";
|
|
11
|
-
|
|
12
|
-
class $$className extends LitElement {
|
|
13
|
-
render() {
|
|
14
|
-
return html\``;
|
|
15
|
-
static footer = `\`;
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
export default $$className;
|
|
20
|
-
|
|
21
|
-
declare global {
|
|
22
|
-
interface HTMLElementTagNameMap {
|
|
23
|
-
'$$elementName': $$className;
|
|
24
|
-
}
|
|
25
|
-
}`;
|
|
26
|
-
canWrite(designItem) {
|
|
27
|
-
return true;
|
|
28
|
-
}
|
|
29
|
-
_conditionalyWriteIndent(indentedTextWriter, designItem) {
|
|
30
|
-
if ((designItem.element instanceof HTMLElement && !isInline(designItem.element)) ||
|
|
31
|
-
(designItem.element.previousElementSibling instanceof HTMLElement && !isInline(designItem.element.previousElementSibling)))
|
|
32
|
-
indentedTextWriter.writeIndent();
|
|
33
|
-
}
|
|
34
|
-
_conditionalyWriteNewline(indentedTextWriter, designItem) {
|
|
35
|
-
if ((designItem.element instanceof HTMLElement && !isInline(designItem.element)) ||
|
|
36
|
-
(designItem.element.nextElementSibling instanceof HTMLElement && !isInline(designItem.element.nextElementSibling)))
|
|
37
|
-
indentedTextWriter.writeNewline();
|
|
38
|
-
}
|
|
39
|
-
write(indentedTextWriter, designItem, options, designItemsAssignmentList) {
|
|
40
|
-
let start = indentedTextWriter.position;
|
|
41
|
-
if (designItem.nodeType == NodeType.TextNode) {
|
|
42
|
-
this._conditionalyWriteIndent(indentedTextWriter, designItem);
|
|
43
|
-
this.writeTextNode(indentedTextWriter, designItem, true);
|
|
44
|
-
}
|
|
45
|
-
else if (designItem.nodeType == NodeType.Comment) {
|
|
46
|
-
this._conditionalyWriteIndent(indentedTextWriter, designItem);
|
|
47
|
-
indentedTextWriter.write('<!--' + designItem.content + '-->');
|
|
48
|
-
this._conditionalyWriteNewline(indentedTextWriter, designItem);
|
|
49
|
-
}
|
|
50
|
-
else {
|
|
51
|
-
this._conditionalyWriteIndent(indentedTextWriter, designItem);
|
|
52
|
-
indentedTextWriter.write('<' + designItem.name);
|
|
53
|
-
if (designItem.hasAttributes) {
|
|
54
|
-
for (const a of designItem.attributes) {
|
|
55
|
-
indentedTextWriter.write(' ');
|
|
56
|
-
if (typeof a[1] === 'string') {
|
|
57
|
-
if (a[1] === "")
|
|
58
|
-
indentedTextWriter.write(a[0]);
|
|
59
|
-
else
|
|
60
|
-
indentedTextWriter.write(a[0] + '="' + DomConverter.normalizeAttributeValue(a[1]) + '"');
|
|
61
|
-
}
|
|
62
|
-
else if (!a[1])
|
|
63
|
-
indentedTextWriter.write(a[0]);
|
|
64
|
-
else {
|
|
65
|
-
//TODO: writing of bindings
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
if (designItem.hasStyles) {
|
|
70
|
-
indentedTextWriter.write(' style="');
|
|
71
|
-
let styles = designItem.styles;
|
|
72
|
-
if (options.compressCssToShorthandProperties)
|
|
73
|
-
styles = CssCombiner.combine(styles);
|
|
74
|
-
for (const s of styles) {
|
|
75
|
-
if (s[0]) {
|
|
76
|
-
indentedTextWriter.write(PropertiesHelper.camelToDashCase(s[0]) + ':' + DomConverter.normalizeAttributeValue(s[1]) + ';');
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
indentedTextWriter.write('"');
|
|
80
|
-
}
|
|
81
|
-
indentedTextWriter.write('>');
|
|
82
|
-
if (designItem.hasChildren) {
|
|
83
|
-
const children = designItem.children();
|
|
84
|
-
const singleTextNode = designItem.childCount === 1 && designItem.firstChild.nodeType === NodeType.TextNode;
|
|
85
|
-
if (singleTextNode) {
|
|
86
|
-
this.writeTextNode(indentedTextWriter, designItem, false);
|
|
87
|
-
}
|
|
88
|
-
else {
|
|
89
|
-
indentedTextWriter.writeNewline();
|
|
90
|
-
indentedTextWriter.levelRaise();
|
|
91
|
-
for (const c of children) {
|
|
92
|
-
c.serviceContainer.forSomeServicesTillResult('htmlWriterService', (s) => {
|
|
93
|
-
if (s.canWrite(c)) {
|
|
94
|
-
s.write(indentedTextWriter, c, options, designItemsAssignmentList);
|
|
95
|
-
}
|
|
96
|
-
});
|
|
97
|
-
}
|
|
98
|
-
indentedTextWriter.levelShrink();
|
|
99
|
-
indentedTextWriter.writeIndent();
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
else if (designItem.hasContent) {
|
|
103
|
-
indentedTextWriter.write(DomConverter.normalizeContentValue(designItem.content));
|
|
104
|
-
}
|
|
105
|
-
if (!DomConverter.IsSelfClosingElement(designItem.name))
|
|
106
|
-
indentedTextWriter.write('</' + designItem.name + '>');
|
|
107
|
-
this._conditionalyWriteNewline(indentedTextWriter, designItem);
|
|
108
|
-
}
|
|
109
|
-
if (designItemsAssignmentList) {
|
|
110
|
-
designItemsAssignmentList.set(designItem, { start: start, length: indentedTextWriter.position - start - 1 });
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
writeTextNode(indentedTextWriter, designItem, indentAndNewline) {
|
|
114
|
-
let content = DomConverter.normalizeContentValue(designItem.content).trim();
|
|
115
|
-
if (content) {
|
|
116
|
-
if (indentAndNewline)
|
|
117
|
-
this._conditionalyWriteIndent(indentedTextWriter, designItem);
|
|
118
|
-
indentedTextWriter.write(content);
|
|
119
|
-
if (indentAndNewline)
|
|
120
|
-
this._conditionalyWriteNewline(indentedTextWriter, designItem);
|
|
121
|
-
}
|
|
122
|
-
}
|
|
123
|
-
}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { IDesignItem } from '../../item/IDesignItem';
|
|
2
|
-
import { IHtmlWriterService } from './IHtmlWriterService';
|
|
3
|
-
import { IHtmlWriterOptions } from './IHtmlWriterOptions';
|
|
4
|
-
import { IndentedTextWriter } from '../../helper/IndentedTextWriter';
|
|
5
|
-
import { IStringPosition } from './IStringPosition';
|
|
6
|
-
declare enum ElementContainerType {
|
|
7
|
-
block = 0,
|
|
8
|
-
complex = 1
|
|
9
|
-
}
|
|
10
|
-
export declare class FormatingHtmlWriterService implements IHtmlWriterService {
|
|
11
|
-
private writeAttributes;
|
|
12
|
-
private writeStyles;
|
|
13
|
-
private _writeTextNode;
|
|
14
|
-
private _writeCommentNode;
|
|
15
|
-
private _writeElementNode;
|
|
16
|
-
private _writeDesignItemList;
|
|
17
|
-
private _writeNewlineAndIntend;
|
|
18
|
-
private _writeInternal;
|
|
19
|
-
getContainerType(element: HTMLElement): ElementContainerType;
|
|
20
|
-
write(indentedTextWriter: IndentedTextWriter, designItems: IDesignItem[], rootContainerKeepInline: boolean, options: IHtmlWriterOptions, designItemsAssignmentList?: Map<IDesignItem, IStringPosition>): void;
|
|
21
|
-
}
|
|
22
|
-
export {};
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
import { DomConverter } from '../../widgets/designerView/DomConverter';
|
|
2
|
-
import { CssCombiner } from '../../helper/CssCombiner';
|
|
3
|
-
import { NodeType } from '../../item/NodeType';
|
|
4
|
-
import { PropertiesHelper } from '../propertiesService/services/PropertiesHelper';
|
|
5
|
-
import { ElementDisplayType, getElementDisplaytype } from '../../helper/ElementHelper.js';
|
|
6
|
-
var ElementContainerType;
|
|
7
|
-
(function (ElementContainerType) {
|
|
8
|
-
ElementContainerType[ElementContainerType["block"] = 0] = "block";
|
|
9
|
-
ElementContainerType[ElementContainerType["complex"] = 1] = "complex";
|
|
10
|
-
})(ElementContainerType || (ElementContainerType = {}));
|
|
11
|
-
const defaultDisplayNoneContainerDisplayType = ElementContainerType.complex;
|
|
12
|
-
export class FormatingHtmlWriterService {
|
|
13
|
-
writeAttributes(writeContext, designItem) {
|
|
14
|
-
if (designItem.hasAttributes) {
|
|
15
|
-
for (const a of designItem.attributes) {
|
|
16
|
-
writeContext.indentedTextWriter.write(' ');
|
|
17
|
-
if (typeof a[1] === 'string') {
|
|
18
|
-
if (a[1] === "")
|
|
19
|
-
writeContext.indentedTextWriter.write(a[0]);
|
|
20
|
-
else
|
|
21
|
-
writeContext.indentedTextWriter.write(a[0] + '="' + DomConverter.normalizeAttributeValue(a[1]) + '"');
|
|
22
|
-
}
|
|
23
|
-
else if (!a[1])
|
|
24
|
-
writeContext.indentedTextWriter.write(a[0]);
|
|
25
|
-
else {
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
writeStyles(writeContext, designItem) {
|
|
31
|
-
if (designItem.hasStyles) {
|
|
32
|
-
writeContext.indentedTextWriter.write(' style="');
|
|
33
|
-
let styles = designItem.styles;
|
|
34
|
-
if (writeContext.options.compressCssToShorthandProperties)
|
|
35
|
-
styles = CssCombiner.combine(styles);
|
|
36
|
-
for (const s of styles) {
|
|
37
|
-
if (s[0]) {
|
|
38
|
-
writeContext.indentedTextWriter.write(PropertiesHelper.camelToDashCase(s[0]) + ':' + DomConverter.normalizeAttributeValue(s[1]) + ';');
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
writeContext.indentedTextWriter.write('"');
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
_writeTextNode(writeContext, designItem) {
|
|
45
|
-
writeContext.lastElementDisplayType = ElementDisplayType.inline;
|
|
46
|
-
let content = DomConverter.normalizeContentValue(designItem.content).trim();
|
|
47
|
-
if (content) {
|
|
48
|
-
writeContext.indentedTextWriter.write(content);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
_writeCommentNode(writeContext, designItem) {
|
|
52
|
-
writeContext.indentedTextWriter.write('<!--' + designItem.content + '-->');
|
|
53
|
-
}
|
|
54
|
-
_writeElementNode(writeContext, designItem) {
|
|
55
|
-
const currentElementDisplayType = getElementDisplaytype(designItem.element);
|
|
56
|
-
writeContext.lastElementDisplayType = currentElementDisplayType;
|
|
57
|
-
writeContext.indentedTextWriter.write('<' + designItem.name);
|
|
58
|
-
this.writeAttributes(writeContext, designItem);
|
|
59
|
-
this.writeStyles(writeContext, designItem);
|
|
60
|
-
writeContext.indentedTextWriter.write('>');
|
|
61
|
-
if (designItem.hasChildren) {
|
|
62
|
-
const children = designItem.children();
|
|
63
|
-
const contentSingleTextNode = designItem.childCount === 1 && designItem.firstChild.nodeType === NodeType.TextNode;
|
|
64
|
-
if (contentSingleTextNode) {
|
|
65
|
-
this._writeInternal(writeContext, designItem.firstChild);
|
|
66
|
-
}
|
|
67
|
-
else {
|
|
68
|
-
let previousContainerDisplayType = writeContext.containerDisplayType;
|
|
69
|
-
writeContext.containerDisplayType = this.getContainerType(designItem.element);
|
|
70
|
-
writeContext.indentedTextWriter.levelRaise();
|
|
71
|
-
this._writeDesignItemList(currentElementDisplayType, writeContext, children);
|
|
72
|
-
writeContext.indentedTextWriter.levelShrink();
|
|
73
|
-
writeContext.containerDisplayType = previousContainerDisplayType;
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
else if (designItem.hasContent) {
|
|
77
|
-
writeContext.indentedTextWriter.write(DomConverter.normalizeContentValue(designItem.content));
|
|
78
|
-
}
|
|
79
|
-
if (!DomConverter.IsSelfClosingElement(designItem.name)) {
|
|
80
|
-
//write newline & intend ???
|
|
81
|
-
writeContext.indentedTextWriter.write('</' + designItem.name + '>');
|
|
82
|
-
if (currentElementDisplayType !== ElementDisplayType.none) {
|
|
83
|
-
writeContext.lastElementDisplayType = currentElementDisplayType;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
_writeDesignItemList(currentElementDisplayType, writeContext, children) {
|
|
88
|
-
for (const c of children) {
|
|
89
|
-
if (writeContext.lastElementDisplayType == null) {
|
|
90
|
-
//first entry, do nothing
|
|
91
|
-
}
|
|
92
|
-
else if (writeContext.containerDisplayType === ElementContainerType.complex)
|
|
93
|
-
this._writeNewlineAndIntend(writeContext);
|
|
94
|
-
else if (writeContext.lastElementDisplayType !== ElementDisplayType.inline || currentElementDisplayType !== ElementDisplayType.inline)
|
|
95
|
-
this._writeNewlineAndIntend(writeContext);
|
|
96
|
-
this._writeInternal(writeContext, c);
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
_writeNewlineAndIntend(writeContext) {
|
|
100
|
-
writeContext.indentedTextWriter.writeNewline();
|
|
101
|
-
writeContext.indentedTextWriter.writeIndent();
|
|
102
|
-
}
|
|
103
|
-
_writeInternal(writeContext, designItem) {
|
|
104
|
-
const start = writeContext.indentedTextWriter.position;
|
|
105
|
-
if (designItem.nodeType === NodeType.TextNode)
|
|
106
|
-
this._writeTextNode(writeContext, designItem);
|
|
107
|
-
else if (designItem.nodeType === NodeType.Comment)
|
|
108
|
-
this._writeCommentNode(writeContext, designItem);
|
|
109
|
-
else if (designItem.nodeType === NodeType.Element)
|
|
110
|
-
this._writeElementNode(writeContext, designItem);
|
|
111
|
-
if (writeContext.designItemsAssignmentList) {
|
|
112
|
-
writeContext.designItemsAssignmentList.set(designItem, { start: start, length: writeContext.indentedTextWriter.position - start - 1 });
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
getContainerType(element) {
|
|
116
|
-
const display = window.getComputedStyle(element).display;
|
|
117
|
-
if (display === 'block' || display === "inline-block" || display == '')
|
|
118
|
-
return ElementContainerType.block;
|
|
119
|
-
return ElementContainerType.complex;
|
|
120
|
-
}
|
|
121
|
-
write(indentedTextWriter, designItems, rootContainerKeepInline, options, designItemsAssignmentList) {
|
|
122
|
-
const context = { indentedTextWriter, options, lastElementDisplayType: null, containerDisplayType: ElementContainerType.block, designItemsAssignmentList };
|
|
123
|
-
this._writeDesignItemList(ElementDisplayType.inline, context, designItems);
|
|
124
|
-
}
|
|
125
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { IDesignItem } from "../../..";
|
|
2
|
-
import { BindingTarget } from "../../item/BindingTarget";
|
|
3
|
-
import { IElementDefinition } from "../elementsService/IElementDefinition";
|
|
4
|
-
import { IElementsService } from "../elementsService/IElementsService";
|
|
5
|
-
import { IPropertiesService } from "../propertiesService/IPropertiesService";
|
|
6
|
-
import { IProperty } from "../propertiesService/IProperty";
|
|
7
|
-
import { ValueType } from "../propertiesService/ValueType";
|
|
8
|
-
export declare class WebcomponentManifestParserService implements IElementsService, IPropertiesService {
|
|
9
|
-
private _name;
|
|
10
|
-
get name(): string;
|
|
11
|
-
private _packageData;
|
|
12
|
-
private _elementList;
|
|
13
|
-
private _resolveStored;
|
|
14
|
-
private _rejectStored;
|
|
15
|
-
constructor(name: string, file: string);
|
|
16
|
-
getElements(): Promise<IElementDefinition[]>;
|
|
17
|
-
isHandledElement(designItem: IDesignItem): boolean;
|
|
18
|
-
getProperties(designItem: IDesignItem): IProperty[];
|
|
19
|
-
getProperty(designItem: IDesignItem, name: string): IProperty;
|
|
20
|
-
getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
|
|
21
|
-
setValue(designItems: IDesignItem[], property: IProperty, value: any): void;
|
|
22
|
-
clearValue(designItems: IDesignItem[], property: IProperty): void;
|
|
23
|
-
isSet(designItems: IDesignItem[], property: IProperty): ValueType;
|
|
24
|
-
getValue(designItems: IDesignItem[], property: IProperty): void;
|
|
25
|
-
getUnsetValue(designItems: IDesignItem[], property: IProperty): void;
|
|
26
|
-
}
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
export class WebcomponentManifestParserService {
|
|
2
|
-
_name;
|
|
3
|
-
get name() { return this._name; }
|
|
4
|
-
_packageData;
|
|
5
|
-
_elementList;
|
|
6
|
-
_resolveStored;
|
|
7
|
-
_rejectStored;
|
|
8
|
-
constructor(name, file) {
|
|
9
|
-
this._name = name;
|
|
10
|
-
import(file, { assert: { type: 'json' } }).then(module => {
|
|
11
|
-
this._packageData = module.default;
|
|
12
|
-
this._elementList = [];
|
|
13
|
-
for (let m of this._packageData.modules) {
|
|
14
|
-
for (let e of m.exports) {
|
|
15
|
-
if (e.kind == 'custom-element-definition') {
|
|
16
|
-
this._elementList.push({ tag: e.name });
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
if (this._resolveStored) {
|
|
20
|
-
this._resolveStored.forEach(x => x(this._elementList));
|
|
21
|
-
this._resolveStored = null;
|
|
22
|
-
this._rejectStored = null;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
}).catch(err => {
|
|
26
|
-
if (this._rejectStored) {
|
|
27
|
-
this._rejectStored.forEach(x => x(err));
|
|
28
|
-
this._resolveStored = null;
|
|
29
|
-
this._rejectStored = null;
|
|
30
|
-
}
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
async getElements() {
|
|
34
|
-
if (this._packageData)
|
|
35
|
-
return Promise.resolve(this._elementList);
|
|
36
|
-
if (!this._resolveStored) {
|
|
37
|
-
this._resolveStored = [];
|
|
38
|
-
this._rejectStored = [];
|
|
39
|
-
}
|
|
40
|
-
return new Promise((resolve, reject) => { this._resolveStored.push(resolve); this._rejectStored.push(reject); });
|
|
41
|
-
}
|
|
42
|
-
isHandledElement(designItem) {
|
|
43
|
-
throw new Error("Method not implemented.");
|
|
44
|
-
}
|
|
45
|
-
getProperties(designItem) {
|
|
46
|
-
throw new Error("Method not implemented.");
|
|
47
|
-
}
|
|
48
|
-
getProperty(designItem, name) {
|
|
49
|
-
throw new Error("Method not implemented.");
|
|
50
|
-
}
|
|
51
|
-
getPropertyTarget(designItem, property) {
|
|
52
|
-
throw new Error("Method not implemented.");
|
|
53
|
-
}
|
|
54
|
-
setValue(designItems, property, value) {
|
|
55
|
-
throw new Error("Method not implemented.");
|
|
56
|
-
}
|
|
57
|
-
clearValue(designItems, property) {
|
|
58
|
-
throw new Error("Method not implemented.");
|
|
59
|
-
}
|
|
60
|
-
isSet(designItems, property) {
|
|
61
|
-
throw new Error("Method not implemented.");
|
|
62
|
-
}
|
|
63
|
-
getValue(designItems, property) {
|
|
64
|
-
throw new Error("Method not implemented.");
|
|
65
|
-
}
|
|
66
|
-
getUnsetValue(designItems, property) {
|
|
67
|
-
throw new Error("Method not implemented.");
|
|
68
|
-
}
|
|
69
|
-
}
|
|
File without changes
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { IDesignItem } from "../../..";
|
|
2
|
-
import { BindingTarget } from "../../item/BindingTarget";
|
|
3
|
-
import { IElementDefinition } from "../elementsService/IElementDefinition";
|
|
4
|
-
import { IElementsService } from "../elementsService/IElementsService";
|
|
5
|
-
import { IPropertiesService } from "../propertiesService/IPropertiesService";
|
|
6
|
-
import { IProperty } from "../propertiesService/IProperty";
|
|
7
|
-
import { ValueType } from "../propertiesService/ValueType";
|
|
8
|
-
export declare class WebcomponentManifestParserService implements IElementsService, IPropertiesService {
|
|
9
|
-
private _name;
|
|
10
|
-
get name(): string;
|
|
11
|
-
private _packageData;
|
|
12
|
-
private _elementList;
|
|
13
|
-
private _resolveStored;
|
|
14
|
-
private _rejectStored;
|
|
15
|
-
constructor(name: string, file: string);
|
|
16
|
-
getElements(): Promise<IElementDefinition[]>;
|
|
17
|
-
isHandledElement(designItem: IDesignItem): boolean;
|
|
18
|
-
getProperties(designItem: IDesignItem): IProperty[];
|
|
19
|
-
getProperty(designItem: IDesignItem, name: string): IProperty;
|
|
20
|
-
getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
|
|
21
|
-
setValue(designItems: IDesignItem[], property: IProperty, value: any): void;
|
|
22
|
-
clearValue(designItems: IDesignItem[], property: IProperty): void;
|
|
23
|
-
isSet(designItems: IDesignItem[], property: IProperty): ValueType;
|
|
24
|
-
getValue(designItems: IDesignItem[], property: IProperty): void;
|
|
25
|
-
getUnsetValue(designItems: IDesignItem[], property: IProperty): void;
|
|
26
|
-
}
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
export class WebcomponentManifestParserService {
|
|
2
|
-
_name;
|
|
3
|
-
get name() { return this._name; }
|
|
4
|
-
_packageData;
|
|
5
|
-
_elementList;
|
|
6
|
-
_resolveStored;
|
|
7
|
-
_rejectStored;
|
|
8
|
-
constructor(name, file) {
|
|
9
|
-
this._name = name;
|
|
10
|
-
import(file, { assert: { type: 'json' } }).then(module => {
|
|
11
|
-
this._packageData = module.default;
|
|
12
|
-
this._elementList = [];
|
|
13
|
-
for (let m of this._packageData.modules) {
|
|
14
|
-
for (let e of m.exports) {
|
|
15
|
-
if (e.kind == 'custom-element-definition') {
|
|
16
|
-
this._elementList.push({ tag: e.name });
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
if (this._resolveStored) {
|
|
20
|
-
this._resolveStored.forEach(x => x(this._elementList));
|
|
21
|
-
this._resolveStored = null;
|
|
22
|
-
this._rejectStored = null;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
}).catch(err => {
|
|
26
|
-
if (this._rejectStored) {
|
|
27
|
-
this._rejectStored.forEach(x => x(err));
|
|
28
|
-
this._resolveStored = null;
|
|
29
|
-
this._rejectStored = null;
|
|
30
|
-
}
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
async getElements() {
|
|
34
|
-
if (this._packageData)
|
|
35
|
-
return Promise.resolve(this._elementList);
|
|
36
|
-
if (!this._resolveStored) {
|
|
37
|
-
this._resolveStored = [];
|
|
38
|
-
this._rejectStored = [];
|
|
39
|
-
}
|
|
40
|
-
return new Promise((resolve, reject) => { this._resolveStored.push(resolve); this._rejectStored.push(reject); });
|
|
41
|
-
}
|
|
42
|
-
isHandledElement(designItem) {
|
|
43
|
-
throw new Error("Method not implemented.");
|
|
44
|
-
}
|
|
45
|
-
getProperties(designItem) {
|
|
46
|
-
throw new Error("Method not implemented.");
|
|
47
|
-
}
|
|
48
|
-
getProperty(designItem, name) {
|
|
49
|
-
throw new Error("Method not implemented.");
|
|
50
|
-
}
|
|
51
|
-
getPropertyTarget(designItem, property) {
|
|
52
|
-
throw new Error("Method not implemented.");
|
|
53
|
-
}
|
|
54
|
-
setValue(designItems, property, value) {
|
|
55
|
-
throw new Error("Method not implemented.");
|
|
56
|
-
}
|
|
57
|
-
clearValue(designItems, property) {
|
|
58
|
-
throw new Error("Method not implemented.");
|
|
59
|
-
}
|
|
60
|
-
isSet(designItems, property) {
|
|
61
|
-
throw new Error("Method not implemented.");
|
|
62
|
-
}
|
|
63
|
-
getValue(designItems, property) {
|
|
64
|
-
throw new Error("Method not implemented.");
|
|
65
|
-
}
|
|
66
|
-
getUnsetValue(designItems, property) {
|
|
67
|
-
throw new Error("Method not implemented.");
|
|
68
|
-
}
|
|
69
|
-
}
|