Skip to content

Commit 08767a8

Browse files
committed
ocwg ocif 0.2 implementation
1 parent b28b9e7 commit 08767a8

File tree

4 files changed

+66
-111
lines changed

4 files changed

+66
-111
lines changed

apps/vps-web/src/app/pages/ocwg.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export function ocwgPage() {
1414
renderElement(
1515
<div
1616
id="color-picker-popup"
17-
class=" bg-white z-[100000] fixed w-[300px] h-auto max-w-[calc(100vw-80px)] top-[80px] right-[40px] shadow-lg rounded-lg"
17+
class=" hidden bg-white z-[100000] fixed w-[300px] h-auto max-w-[calc(100vw-80px)] top-[80px] right-[40px] shadow-lg rounded-lg"
1818
>
1919
<div class="flex flex-wrap p-4">
2020
<h2 class="font-bold text-lg mb-4 w-full">Theme Colors</h2>

libs/app-canvas/src/app/exporters/export-ocwg.ts

Lines changed: 52 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -34,37 +34,35 @@ export class OCWGExporter extends BaseExporter<OCWGFile, OCWGInfo> {
3434
_context: OCWGInfo,
3535
node: INodeComponent<BaseNodeInfo>,
3636
nodeInfo: BaseNodeInfo,
37-
nodeText: string,
37+
_nodeText: string,
3838
_isContainer: boolean,
3939
_isRectThumb: boolean,
4040
parentId?: string
4141
): string {
4242
const ocwgNode: OCWGNode = {
4343
id: `shape:${node.id}`,
44-
schema: '@code-flow-canvas/node',
45-
schema_version: '0.1',
46-
x: node.x,
47-
y: node.y,
48-
properties: {
49-
width: node.width ?? 0,
50-
height: node.height ?? 0,
51-
[nodeInfoPropertyName]: nodeInfo,
52-
},
53-
fallback: nodeText,
44+
position: [node.x, node.y],
45+
size: [node.width ?? 0, node.height ?? 0],
46+
data: [
47+
{
48+
...nodeInfo,
49+
type: nodeInfoPropertyName,
50+
nodeType: nodeInfo.type,
51+
},
52+
],
5453
};
5554
if (this.file?.nodes) {
5655
this.file.nodes.push(ocwgNode);
5756
}
5857
if (parentId && this.file) {
59-
const relation = this.file.relations.find((r) => r.name === parentId);
60-
if (relation && relation.schema === '@ocwg/set') {
58+
const relation = this.file.relations.find((r) => r.id === parentId);
59+
if (relation && relation.type === '@ocwg/set') {
6160
relation.members.push(ocwgNode.id);
6261
} else {
6362
const relation = {
64-
schema: '@ocwg/set' as const,
65-
schema_version: '0.1',
63+
type: '@ocwg/set' as const,
6664
members: [ocwgNode.id],
67-
name: parentId,
65+
id: parentId,
6866
};
6967
this.file.relations.push(relation);
7068
}
@@ -88,37 +86,35 @@ export class OCWGExporter extends BaseExporter<OCWGFile, OCWGInfo> {
8886
}
8987
const ocwgNode: OCWGNode = {
9088
id: `shape:${node.id}`,
91-
schema: '@code-flow-canvas/connection',
92-
schema_version: '0.1',
93-
x: node.x,
94-
y: node.y,
95-
properties: {
96-
width: node.width ?? 0,
97-
height: node.height ?? 0,
98-
[nodeInfoPropertyName]: nodeInfo,
99-
start: {
100-
connected_to: `shape:${node.startNode.id}`,
101-
port_name: 'output',
102-
},
103-
end: {
104-
connected_to: `shape:${node.endNode.id}`,
105-
port_name: 'input',
89+
position: [node.x, node.y],
90+
size: [node.width ?? 0, node.height ?? 0],
91+
data: [
92+
{
93+
...nodeInfo,
94+
type: nodeInfoPropertyName,
95+
nodeType: nodeInfo.type,
96+
start: {
97+
connected_to: `shape:${node.startNode.id}`,
98+
port_name: 'output',
99+
},
100+
end: {
101+
connected_to: `shape:${node.endNode.id}`,
102+
port_name: 'input',
103+
},
106104
},
107-
},
108-
fallback: 'connection',
105+
],
109106
};
110107
if (this.file?.nodes) {
111108
this.file.nodes.push(ocwgNode);
112109
}
113110
if (this.file?.relations) {
114111
{
115112
const relation = {
116-
id: node.id,
117-
name: `${node.id}-edge`,
118-
schema: '@ocwg/edge' as const,
119-
schema_version: '1.0' as const,
113+
type: '@ocwg/rel/edge' as const,
114+
id: `${node.id}-edge`,
120115
from: `shape:${node.startNode.id}`,
121116
to: `shape:${node.endNode.id}`,
117+
directed: true,
122118
};
123119
this.file.relations.push(relation);
124120
}
@@ -135,35 +131,33 @@ export class OCWGExporter extends BaseExporter<OCWGFile, OCWGInfo> {
135131
}
136132
const ocwgNode: OCWGNode = {
137133
id: `connection:${node.id}`,
138-
schema: '@code-flow-canvas/connection',
139-
schema_version: '0.1',
140-
x: node.x,
141-
y: node.y,
142-
properties: {
143-
width: node.width ?? 0,
144-
height: node.height ?? 0,
145-
[nodeInfoPropertyName]: nodeInfo,
146-
start: {
147-
connected_to: `shape:${node.startNode.id}`,
148-
port_name: node.startNodeThumb?.thumbName,
149-
},
150-
end: {
151-
connected_to: `shape:${node.endNode.id}`,
152-
port_name: node.endNodeThumb?.thumbName,
134+
position: [node.x, node.y],
135+
size: [node.width ?? 0, node.height ?? 0],
136+
data: [
137+
{
138+
...nodeInfo,
139+
type: nodeInfoPropertyName,
140+
nodeType: nodeInfo.type,
141+
start: {
142+
connected_to: `shape:${node.startNode.id}`,
143+
port_name: node.startNodeThumb?.thumbName,
144+
},
145+
end: {
146+
connected_to: `shape:${node.endNode.id}`,
147+
port_name: node.endNodeThumb?.thumbName,
148+
},
153149
},
154-
},
155-
fallback: 'connection',
150+
],
156151
};
157152
if (this.file?.nodes) {
158153
this.file.nodes.push(ocwgNode);
159154
}
160155
if (this.file?.relations) {
161156
{
162157
const relation = {
163-
id: node.id,
164-
name: `${node.id}-edge`,
165-
schema: '@ocwg/edge' as const,
166-
schema_version: '1.0' as const,
158+
id: `${node.id}-edge`,
159+
type: '@ocwg/rel/edge' as const,
160+
directed: true,
167161
from: `shape:${node.startNode.id}`,
168162
to: `shape:${node.endNode.id}`,
169163
};
Lines changed: 3 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,9 @@
11
import { OCWGFile } from './ocwg-schema';
22

33
export const ocwgEmptyFile: OCWGFile = {
4-
schema_version: '0.1',
4+
ocif: 'https://canvasprotocol.org/ocif/0.1',
55
nodes: [],
66
relations: [],
7-
schemas: {
8-
'@code-flow-canvas/node': {
9-
$schema:
10-
'https://www.canvasprotocol.org/schema/draft/2024-06/@ocwg/rectangle',
11-
$id: 'https://demo.codeflowcanvas.io/schema/draft-0.0.1/code-flow-canvas-node.json',
12-
properties: {
13-
'@code-flow-canvas/node-properties': {
14-
type: 'object',
15-
},
16-
},
17-
},
18-
'@code-flow-canvas/connection': {
19-
$schema:
20-
'https://www.canvasprotocol.org/schema/draft/2024-06/@ocwg/arrow',
21-
$id: 'https://demo.codeflowcanvas.io/schema/draft-0.0.1/code-flow-canvas-connection.json',
22-
properties: {
23-
'@code-flow-canvas/node-properties': {
24-
type: 'object',
25-
},
26-
start: {
27-
type: 'object',
28-
properties: {
29-
connected_to: { type: 'string' },
30-
port_name: { type: 'string' },
31-
},
32-
},
33-
end: {
34-
type: 'object',
35-
properties: {
36-
connected_to: { type: 'string' },
37-
port_name: { type: 'string' },
38-
},
39-
},
40-
},
41-
},
42-
},
7+
resources: [],
8+
schemas: {},
439
};

libs/app-canvas/src/app/exporters/ocwg/ocwg-schema.ts

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,31 @@
11
export type OCWGNode = {
22
id: string;
3-
schema: string;
4-
schema_version: string;
5-
x: number;
6-
y: number;
7-
z?: number;
8-
properties?: {
3+
position?: number[];
4+
size?: number[];
5+
data?: {
96
[key: string]: any;
10-
};
11-
fallback?: string;
7+
}[];
128
};
139

1410
export type OCWGEdge = {
11+
type: '@ocwg/rel/edge';
1512
id: string;
16-
name: string;
17-
schema: '@ocwg/edge';
18-
schema_version: '1.0';
13+
directed?: boolean;
1914
from: string;
2015
to: string;
2116
};
2217
export type OCWGRelation = OCWGSet | OCWGEdge;
2318

2419
export type OCWGSet = {
25-
schema: '@ocwg/set';
26-
schema_version: string;
20+
type: '@ocwg/set';
2721
members: Array<string>;
28-
name: string;
22+
id: string;
2923
};
3024
export type OCWGFile = {
31-
schema_version: string;
25+
ocif: string;
3226
nodes: OCWGNode[];
3327
relations: OCWGRelation[];
28+
resources: any[];
3429
schemas: {
3530
[key: string]: any;
3631
};

0 commit comments

Comments
 (0)