Skip to content

Commit fffcfb8

Browse files
CoderAllanCoderAllan
committed
Styling is now applied correctly for style without a defined category
1 parent a9f4651 commit fffcfb8

File tree

2 files changed

+82
-81
lines changed

2 files changed

+82
-81
lines changed

‎src/dgmlParser.ts‎

Lines changed: 49 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -49,9 +49,9 @@ export class DgmlParser {
4949
directedGraph.styles = this.convertXmlToStyles(xmlNode.children);
5050
}
5151
});
52+
this.addStylingToCategories(directedGraph);
5253
this.addCategoryStylingToNodes(directedGraph);
5354
this.addCategoryStylingToLinks(directedGraph);
54-
this.addStylingToCategories(directedGraph);
5555
}
5656
return directedGraph;
5757
}
@@ -331,56 +331,58 @@ export class DgmlParser {
331331
style.condition.expression !== undefined &&
332332
style.setters !== undefined &&
333333
style.setters.length > 0) {
334-
const regex = /HasCategory\(['"](\w+)['"]\)+/ig;
334+
const regex = /HasCategory\(['"](.+)['"]\)+/ig;
335335
const match = regex.exec(style.condition.expression);
336336
if (match) {
337337
const categoryName = match[1];
338-
const category = directedGraph.categories.find(category => category.id.toLowerCase() === categoryName.toLowerCase());
339-
if (category) {
340-
style.setters.forEach(setter => {
341-
if (setter.property !== undefined) {
342-
if (setter.property.toLowerCase() === 'stroke') {
343-
category.stroke = setter.value;
344-
}
345-
if (setter.property.toLowerCase() === 'strokethickness') {
346-
category.strokeThickness = setter.value;
347-
}
348-
if (setter.property.toLowerCase() === 'strokedasharray') {
349-
category.strokeDashArray = setter.value;
350-
}
351-
if (setter.property.toLowerCase() === 'strokedasharray') {
352-
category.strokeDashArray = setter.value;
353-
}
354-
if (setter.property.toLowerCase() === 'fontfamily') {
355-
category.fontFamily = setter.value;
356-
}
357-
if (setter.property.toLowerCase() === 'fontsize') {
358-
category.fontSize = +setter.value;
359-
}
360-
if (setter.property.toLowerCase() === 'fontstyle') {
361-
category.fontStyle = setter.value;
362-
}
363-
if (setter.property.toLowerCase() === 'fontweight') {
364-
category.fontWeight = setter.value;
365-
}
366-
if (setter.property.toLowerCase() === 'background') {
367-
category.background = setter.value;
368-
}
369-
if (setter.property.toLowerCase() === 'horizontalalignment') {
370-
category.horizontalAlignment = setter.value;
371-
}
372-
if (setter.property.toLowerCase() === 'verticalalignment') {
373-
category.verticalAlignment = setter.value;
374-
}
375-
if (setter.property.toLowerCase() === 'minwidth') {
376-
category.minWidth = +setter.value;
377-
}
378-
if (setter.property.toLowerCase() === 'maxwidth') {
379-
category.maxWidth = +setter.value;
380-
}
381-
}
382-
});
338+
let category = directedGraph.categories.find(category => category.id.toLowerCase() === categoryName.toLowerCase());
339+
if (!category) {
340+
category = { id: categoryName };
341+
directedGraph.categories.push(category);
383342
}
343+
style.setters.forEach(setter => {
344+
if (category && setter.property !== undefined) {
345+
if (setter.property.toLowerCase() === 'stroke') {
346+
category.stroke = setter.value;
347+
}
348+
if (setter.property.toLowerCase() === 'strokethickness') {
349+
category.strokeThickness = setter.value;
350+
}
351+
if (setter.property.toLowerCase() === 'strokedasharray') {
352+
category.strokeDashArray = setter.value;
353+
}
354+
if (setter.property.toLowerCase() === 'strokedasharray') {
355+
category.strokeDashArray = setter.value;
356+
}
357+
if (setter.property.toLowerCase() === 'fontfamily') {
358+
category.fontFamily = setter.value;
359+
}
360+
if (setter.property.toLowerCase() === 'fontsize') {
361+
category.fontSize = +setter.value;
362+
}
363+
if (setter.property.toLowerCase() === 'fontstyle') {
364+
category.fontStyle = setter.value;
365+
}
366+
if (setter.property.toLowerCase() === 'fontweight') {
367+
category.fontWeight = setter.value;
368+
}
369+
if (setter.property.toLowerCase() === 'background') {
370+
category.background = setter.value;
371+
}
372+
if (setter.property.toLowerCase() === 'horizontalalignment') {
373+
category.horizontalAlignment = setter.value;
374+
}
375+
if (setter.property.toLowerCase() === 'verticalalignment') {
376+
category.verticalAlignment = setter.value;
377+
}
378+
if (setter.property.toLowerCase() === 'minwidth') {
379+
category.minWidth = +setter.value;
380+
}
381+
if (setter.property.toLowerCase() === 'maxwidth') {
382+
category.maxWidth = +setter.value;
383+
}
384+
}
385+
});
384386
}
385387
}
386388
});

‎src/model/ICategory.ts‎

Lines changed: 33 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,39 @@
11
// https://schemas.microsoft.com/vs/2009/dgml/dgml.xsd
22
export interface ICategory {
33
id: string;
4-
basedOn: string;
5-
canLinkedNodesBeDataDriven: string;
6-
canBeDataDriven: string;
7-
defaultAction: string;
8-
incomingActionLabel: string;
9-
isProviderRoot: boolean;
10-
isContainment: boolean;
11-
isTag: boolean;
12-
navigationActionLabel: string;
13-
outgoingActionLabel: string;
14-
sourceCategory: string;
15-
targetCategory: string;
16-
details: string;
17-
inboundName: string;
18-
outboundName: string;
4+
basedOn?: string;
5+
canLinkedNodesBeDataDriven?: string;
6+
canBeDataDriven?: string;
7+
defaultAction?: string;
8+
incomingActionLabel?: string;
9+
isProviderRoot?: boolean;
10+
isContainment?: boolean;
11+
isTag?: boolean;
12+
navigationActionLabel?: string;
13+
outgoingActionLabel?: string;
14+
sourceCategory?: string;
15+
targetCategory?: string;
16+
details?: string;
17+
inboundName?: string;
18+
outboundName?: string;
1919
// CommonAttributes
20-
label: string;
21-
visibility: string;
22-
background: string;
23-
fontSize: number;
24-
fontFamily: string;
25-
fontStyle: string;
26-
fontWeight: string;
27-
stroke: string;
28-
strokeThickness: string;
29-
strokeDashArray: string;
20+
label?: string;
21+
visibility?: string;
22+
background?: string;
23+
fontSize?: number;
24+
fontFamily?: string;
25+
fontStyle?: string;
26+
fontWeight?: string;
27+
stroke?: string;
28+
strokeThickness?: string;
29+
strokeDashArray?: string;
3030
// CategorizableNodeProperties
31-
icon: string;
32-
shape: string;
33-
style: string;
34-
horizontalAlignment: string;
35-
verticalAlignment: string;
36-
minWidth: number;
37-
maxWidth: number;
38-
nodeRadius: number;
39-
31+
icon?: string;
32+
shape?: string;
33+
style?: string;
34+
horizontalAlignment?: string;
35+
verticalAlignment?: string;
36+
minWidth?: number;
37+
maxWidth?: number;
38+
nodeRadius?: number;
4039
}

0 commit comments

Comments
 (0)