@liquidcars/atlas-geometry-processes 0.1.1 → 0.2.0
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/README.md +11 -12
- package/index.js +70 -107
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -61,7 +61,6 @@ stable and backwards compatible.
|
|
|
61
61
|
geometry: process.activity
|
|
62
62
|
geometryOptions:
|
|
63
63
|
variant: task
|
|
64
|
-
icon: "✓"
|
|
65
64
|
|
|
66
65
|
- id: order-valid
|
|
67
66
|
name: Order valid?
|
|
@@ -73,7 +72,7 @@ stable and backwards compatible.
|
|
|
73
72
|
name: Rejected
|
|
74
73
|
geometry: process.document
|
|
75
74
|
geometryOptions:
|
|
76
|
-
|
|
75
|
+
copies: 2
|
|
77
76
|
|
|
78
77
|
relations:
|
|
79
78
|
- from: receive-order
|
|
@@ -94,8 +93,7 @@ semantics:
|
|
|
94
93
|
{
|
|
95
94
|
"geometry": "process.display",
|
|
96
95
|
"geometryOptions": {
|
|
97
|
-
"screen": "active"
|
|
98
|
-
"icon": "UI"
|
|
96
|
+
"screen": "active"
|
|
99
97
|
},
|
|
100
98
|
"geometryPalette": {
|
|
101
99
|
"body": "#263746",
|
|
@@ -104,17 +102,18 @@ semantics:
|
|
|
104
102
|
}
|
|
105
103
|
~~~
|
|
106
104
|
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
105
|
+
Images are optional on the few symbols where a real visual asset is useful.
|
|
106
|
+
The pack deliberately avoids text-based icon fields because entity labels are
|
|
107
|
+
the semantic caption and front-face text competes with them. Images accept
|
|
108
|
+
browser-loadable URLs or data URIs; external hosts must permit cross-origin
|
|
109
|
+
loading when required by the browser.
|
|
110
110
|
|
|
111
111
|
## Design notes
|
|
112
112
|
|
|
113
|
-
The
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
flat 2D SVG glyphs.
|
|
113
|
+
The symbols follow common flowchart semantics while remaining volumetric. The
|
|
114
|
+
terminator is a single rounded pill, documents use a light paper face with a
|
|
115
|
+
wave at the lower edge, connectors face the camera as compact discs, and notes
|
|
116
|
+
use the familiar folded-corner Post-it silhouette.
|
|
118
117
|
|
|
119
118
|
The pack uses namespace process and registers itself on import:
|
|
120
119
|
|
package/index.js
CHANGED
|
@@ -2,16 +2,14 @@ import { registerGeometryPack } from "@liquidcars/atlas";
|
|
|
2
2
|
|
|
3
3
|
const clamp = (value, minimum, maximum) => Math.min(maximum, Math.max(minimum, Number(value) || minimum));
|
|
4
4
|
|
|
5
|
-
const
|
|
6
|
-
if (!parameters?.
|
|
5
|
+
const frontImage = (parameters, position = [0, 0, .54], size = [.3, .24, 1]) => {
|
|
6
|
+
if (!parameters?.image) return [];
|
|
7
7
|
return [{
|
|
8
8
|
shape: "plane",
|
|
9
9
|
size,
|
|
10
10
|
position,
|
|
11
|
-
color:
|
|
12
|
-
icon: parameters.icon,
|
|
11
|
+
color: "#ffffff",
|
|
13
12
|
image: parameters.image,
|
|
14
|
-
iconColor: "#ffffff",
|
|
15
13
|
edges: false,
|
|
16
14
|
doubleSided: true
|
|
17
15
|
}];
|
|
@@ -26,6 +24,17 @@ const frontLine = (position, size, color = "accent") => ({
|
|
|
26
24
|
metalness: .12
|
|
27
25
|
});
|
|
28
26
|
|
|
27
|
+
const frontWave = (y = -.29, z = .175, color = "body") => Array.from({ length: 15 }, (_, index) => {
|
|
28
|
+
const progress = index / 14;
|
|
29
|
+
return {
|
|
30
|
+
shape: "sphere",
|
|
31
|
+
size: [.09, .026, .018],
|
|
32
|
+
position: [-.42 + progress * .84, y + Math.sin(progress * Math.PI * 2) * .045, z],
|
|
33
|
+
color,
|
|
34
|
+
edges: false
|
|
35
|
+
};
|
|
36
|
+
});
|
|
37
|
+
|
|
29
38
|
const processPalette = {
|
|
30
39
|
body: "#496879",
|
|
31
40
|
edge: "#8fd3ee",
|
|
@@ -33,7 +42,10 @@ const processPalette = {
|
|
|
33
42
|
decision: "#d19a54",
|
|
34
43
|
data: "#5e9f9a",
|
|
35
44
|
input: "#6c8fb7",
|
|
36
|
-
paper: "#
|
|
45
|
+
paper: "#f4f1e8",
|
|
46
|
+
note: "#efcf62",
|
|
47
|
+
fold: "#fff0ae",
|
|
48
|
+
screen: "#173541",
|
|
37
49
|
storage: "#597887",
|
|
38
50
|
accent: "#72dbc9",
|
|
39
51
|
positive: "#8bd8a8",
|
|
@@ -44,7 +56,7 @@ const processPalette = {
|
|
|
44
56
|
export const processGeometryPack = {
|
|
45
57
|
namespace: "process",
|
|
46
58
|
name: "Process Symbols",
|
|
47
|
-
version: "0.
|
|
59
|
+
version: "0.2.0",
|
|
48
60
|
category: "Processes",
|
|
49
61
|
palette: processPalette,
|
|
50
62
|
geometries: [
|
|
@@ -55,19 +67,14 @@ export const processGeometryPack = {
|
|
|
55
67
|
category: "Processes · Essentials",
|
|
56
68
|
canonicalSize: [3, 1.35, 1.5],
|
|
57
69
|
parameters: {
|
|
58
|
-
kind: { type: "select", label: "Kind", options: ["start", "end"], default: "start" }
|
|
59
|
-
icon: { type: "icon", label: "Front icon", default: "" },
|
|
60
|
-
image: { type: "image", label: "Front image URL", default: "" }
|
|
70
|
+
kind: { type: "select", label: "Kind", options: ["start", "end"], default: "start" }
|
|
61
71
|
},
|
|
62
72
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0] },
|
|
63
73
|
create({ parameters }) {
|
|
64
74
|
const color = parameters.kind === "end" ? "negative" : "positive";
|
|
65
75
|
return {
|
|
66
76
|
parts: [
|
|
67
|
-
{ shape: "box", size: [
|
|
68
|
-
{ shape: "sphere", size: [.62, .8, .82], position: [-.35, 0, 0], color, edges: false },
|
|
69
|
-
{ shape: "sphere", size: [.62, .8, .82], position: [.35, 0, 0], color, edges: false },
|
|
70
|
-
...frontMarker(parameters, "ink", [0, 0, .45], [.34, .26, 1])
|
|
77
|
+
{ shape: "box", size: [1, .72, .7], color, radius: .36, segments: 10, edgeColor: "edge" }
|
|
71
78
|
]
|
|
72
79
|
};
|
|
73
80
|
}
|
|
@@ -81,7 +88,6 @@ export const processGeometryPack = {
|
|
|
81
88
|
parameters: {
|
|
82
89
|
variant: { type: "select", label: "Variant", options: ["task", "subprocess", "call"], default: "task" },
|
|
83
90
|
radius: { type: "number", label: "Corner radius", min: 0, max: .2, step: .01, default: .05 },
|
|
84
|
-
icon: { type: "icon", label: "Front icon", default: "" },
|
|
85
91
|
image: { type: "image", label: "Front image URL", default: "" }
|
|
86
92
|
},
|
|
87
93
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], detail: [0, 0, 1] },
|
|
@@ -96,7 +102,7 @@ export const processGeometryPack = {
|
|
|
96
102
|
);
|
|
97
103
|
}
|
|
98
104
|
if (parameters.variant === "call") parts.push(frontLine([0, .39, .42], [.72, .035, .035], "accent"));
|
|
99
|
-
return { parts: [...parts, ...
|
|
105
|
+
return { parts: [...parts, ...frontImage(parameters)] };
|
|
100
106
|
}
|
|
101
107
|
},
|
|
102
108
|
{
|
|
@@ -106,16 +112,14 @@ export const processGeometryPack = {
|
|
|
106
112
|
category: "Processes · Essentials",
|
|
107
113
|
canonicalSize: [2.25, 1.8, 2.25],
|
|
108
114
|
parameters: {
|
|
109
|
-
outcome: { type: "select", label: "Expected outcome", options: ["neutral", "positive", "negative"], default: "neutral" }
|
|
110
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
115
|
+
outcome: { type: "select", label: "Expected outcome", options: ["neutral", "positive", "negative"], default: "neutral" }
|
|
111
116
|
},
|
|
112
117
|
anchors: { input: [-1, 0, 0], yes: [1, 0, 0], no: [0, -1, 0], detail: [0, 0, 1] },
|
|
113
118
|
create({ parameters }) {
|
|
114
119
|
const color = parameters.outcome === "positive" ? "positive" : parameters.outcome === "negative" ? "negative" : "decision";
|
|
115
120
|
return {
|
|
116
121
|
parts: [
|
|
117
|
-
{ shape: "box", size: [.88, .22, .88], rotation: [0, 0, Math.PI / 4], color, edgeColor: "edge", radius: .04 }
|
|
118
|
-
...frontMarker(parameters, "ink", [0, 0, .15], [.25, .2, 1])
|
|
122
|
+
{ shape: "box", size: [.88, .22, .88], rotation: [0, 0, Math.PI / 4], color, edgeColor: "edge", radius: .04 }
|
|
119
123
|
]
|
|
120
124
|
};
|
|
121
125
|
}
|
|
@@ -128,7 +132,6 @@ export const processGeometryPack = {
|
|
|
128
132
|
canonicalSize: [2.7, 1.55, 1.7],
|
|
129
133
|
parameters: {
|
|
130
134
|
direction: { type: "select", label: "Direction", options: ["input", "output", "both"], default: "input" },
|
|
131
|
-
icon: { type: "icon", label: "Front icon", default: "" },
|
|
132
135
|
image: { type: "image", label: "Front image URL", default: "" }
|
|
133
136
|
},
|
|
134
137
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], detail: [0, 0, 1] },
|
|
@@ -137,7 +140,7 @@ export const processGeometryPack = {
|
|
|
137
140
|
return {
|
|
138
141
|
parts: [
|
|
139
142
|
{ shape: "box", size: [1, .58, .78], rotation: [0, 0, -.16], color, edgeColor: "edge", radius: .03 },
|
|
140
|
-
...
|
|
143
|
+
...frontImage(parameters, [0, 0, .43], [.3, .23, 1])
|
|
141
144
|
]
|
|
142
145
|
};
|
|
143
146
|
}
|
|
@@ -148,15 +151,12 @@ export const processGeometryPack = {
|
|
|
148
151
|
description: "A manually performed operation.",
|
|
149
152
|
category: "Processes · Advanced",
|
|
150
153
|
canonicalSize: [2.75, 1.6, 1.7],
|
|
151
|
-
parameters: {
|
|
152
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
153
|
-
},
|
|
154
|
+
parameters: {},
|
|
154
155
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0] },
|
|
155
156
|
create({ parameters }) {
|
|
156
157
|
return {
|
|
157
158
|
parts: [
|
|
158
|
-
{ shape: "frustum-pyramid", size: [1, .64, .84], color: "input", edgeColor: "edge" }
|
|
159
|
-
...frontMarker(parameters, "ink", [0, 0, .44], [.28, .22, 1])
|
|
159
|
+
{ shape: "frustum-pyramid", size: [1, .64, .84], color: "input", edgeColor: "edge" }
|
|
160
160
|
]
|
|
161
161
|
};
|
|
162
162
|
}
|
|
@@ -166,11 +166,9 @@ export const processGeometryPack = {
|
|
|
166
166
|
name: "Document",
|
|
167
167
|
description: "A document or generated record.",
|
|
168
168
|
category: "Processes · Essentials",
|
|
169
|
-
canonicalSize: [2.65, 2,
|
|
169
|
+
canonicalSize: [2.65, 2, .72],
|
|
170
170
|
parameters: {
|
|
171
|
-
copies: { type: "number", label: "Copies", min: 1, max: 3, step: 1, default: 1 }
|
|
172
|
-
icon: { type: "icon", label: "Front icon", default: "" },
|
|
173
|
-
image: { type: "image", label: "Front image URL", default: "" }
|
|
171
|
+
copies: { type: "number", label: "Copies", min: 1, max: 3, step: 1, default: 1 }
|
|
174
172
|
},
|
|
175
173
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], archive: [0, -1, 0] },
|
|
176
174
|
create({ parameters }) {
|
|
@@ -179,18 +177,14 @@ export const processGeometryPack = {
|
|
|
179
177
|
for (let index = copies - 1; index >= 0; index--) {
|
|
180
178
|
parts.push({
|
|
181
179
|
shape: "box",
|
|
182
|
-
size: [1, .
|
|
183
|
-
position: [index * .
|
|
180
|
+
size: [1, .76, .34],
|
|
181
|
+
position: [index * .055, index * .04, index * -.08],
|
|
184
182
|
color: index === 0 ? "paper" : "body",
|
|
185
183
|
edgeColor: "edge",
|
|
186
184
|
radius: .04
|
|
187
185
|
});
|
|
188
186
|
}
|
|
189
|
-
parts.push(
|
|
190
|
-
frontLine([-.28, -.22, .43], [.42, .035, .035], "ink"),
|
|
191
|
-
frontLine([.22, -.22, .43], [.22, .035, .035], "ink"),
|
|
192
|
-
...frontMarker(parameters, "ink", [0, .12, .44], [.25, .2, 1])
|
|
193
|
-
);
|
|
187
|
+
parts.push(...frontWave(-.29, .185, "body"));
|
|
194
188
|
return { parts };
|
|
195
189
|
}
|
|
196
190
|
},
|
|
@@ -201,7 +195,6 @@ export const processGeometryPack = {
|
|
|
201
195
|
category: "Processes · Advanced",
|
|
202
196
|
canonicalSize: [2.9, 1.8, 1.8],
|
|
203
197
|
parameters: {
|
|
204
|
-
icon: { type: "icon", label: "Front icon", default: "" },
|
|
205
198
|
image: { type: "image", label: "Front image URL", default: "" }
|
|
206
199
|
},
|
|
207
200
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], call: [0, 0, 1] },
|
|
@@ -211,7 +204,7 @@ export const processGeometryPack = {
|
|
|
211
204
|
{ shape: "box", size: [1, .76, .8], color: "process", edgeColor: "edge", radius: .07 },
|
|
212
205
|
frontLine([-.42, 0, .43], [.035, .68, .035], "accent"),
|
|
213
206
|
frontLine([.42, 0, .43], [.035, .68, .035], "accent"),
|
|
214
|
-
...
|
|
207
|
+
...frontImage(parameters)
|
|
215
208
|
]
|
|
216
209
|
};
|
|
217
210
|
}
|
|
@@ -223,8 +216,7 @@ export const processGeometryPack = {
|
|
|
223
216
|
category: "Processes · Essentials",
|
|
224
217
|
canonicalSize: [2.45, 1.9, 2.1],
|
|
225
218
|
parameters: {
|
|
226
|
-
tiers: { type: "number", label: "Tiers", min: 1, max: 4, step: 1, default: 2 }
|
|
227
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
219
|
+
tiers: { type: "number", label: "Tiers", min: 1, max: 4, step: 1, default: 2 }
|
|
228
220
|
},
|
|
229
221
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], query: [0, 0, 1] },
|
|
230
222
|
create({ parameters }) {
|
|
@@ -239,7 +231,7 @@ export const processGeometryPack = {
|
|
|
239
231
|
edgeColor: "accent"
|
|
240
232
|
});
|
|
241
233
|
}
|
|
242
|
-
return { parts
|
|
234
|
+
return { parts };
|
|
243
235
|
}
|
|
244
236
|
},
|
|
245
237
|
{
|
|
@@ -248,22 +240,14 @@ export const processGeometryPack = {
|
|
|
248
240
|
description: "A store managed inside the process boundary.",
|
|
249
241
|
category: "Processes · Advanced",
|
|
250
242
|
canonicalSize: [2.55, 2, 1.8],
|
|
251
|
-
parameters: {
|
|
252
|
-
partitions: { type: "number", label: "Partitions", min: 1, max: 4, step: 1, default: 2 },
|
|
253
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
254
|
-
},
|
|
243
|
+
parameters: {},
|
|
255
244
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], access: [0, 0, 1] },
|
|
256
|
-
create(
|
|
257
|
-
|
|
258
|
-
const parts = [
|
|
245
|
+
create() {
|
|
246
|
+
return { parts: [
|
|
259
247
|
{ shape: "box", size: [1, .78, .8], color: "storage", edgeColor: "edge", radius: .03 },
|
|
260
|
-
frontLine([
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
const x = -.36 + index * (.72 / partitions);
|
|
264
|
-
parts.push(frontLine([x, 0, .44], [.022, .66, .035], "accent"));
|
|
265
|
-
}
|
|
266
|
-
return { parts: [...parts, ...frontMarker(parameters)] };
|
|
248
|
+
frontLine([-.36, 0, .43], [.025, .66, .035], "accent"),
|
|
249
|
+
frontLine([0, .28, .43], [.72, .025, .035], "accent")
|
|
250
|
+
] };
|
|
267
251
|
}
|
|
268
252
|
},
|
|
269
253
|
{
|
|
@@ -273,8 +257,7 @@ export const processGeometryPack = {
|
|
|
273
257
|
category: "Processes · Advanced",
|
|
274
258
|
canonicalSize: [2.6, 1.9, 2.15],
|
|
275
259
|
parameters: {
|
|
276
|
-
medium: { type: "select", label: "Medium", options: ["disk", "drum"], default: "disk" }
|
|
277
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
260
|
+
medium: { type: "select", label: "Medium", options: ["disk", "drum"], default: "disk" }
|
|
278
261
|
},
|
|
279
262
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], read: [0, 0, 1] },
|
|
280
263
|
create({ parameters }) {
|
|
@@ -282,8 +265,7 @@ export const processGeometryPack = {
|
|
|
282
265
|
return {
|
|
283
266
|
parts: [
|
|
284
267
|
{ shape: "cylinder", size: [.86, 1.02, .86], rotation: [0, 0, Math.PI / 2], color, edgeColor: "edge" },
|
|
285
|
-
{ shape: "cylinder", size: [.48, 1.04, .48], rotation: [0, 0, Math.PI / 2], color: "accent", edges: false }
|
|
286
|
-
...frontMarker(parameters, "ink", [0, 0, .5], [.27, .2, 1])
|
|
268
|
+
{ shape: "cylinder", size: [.48, 1.04, .48], rotation: [0, 0, Math.PI / 2], color: "accent", edges: false }
|
|
287
269
|
]
|
|
288
270
|
};
|
|
289
271
|
}
|
|
@@ -295,7 +277,6 @@ export const processGeometryPack = {
|
|
|
295
277
|
category: "Processes · Advanced",
|
|
296
278
|
canonicalSize: [2.75, 1.65, 1.75],
|
|
297
279
|
parameters: {
|
|
298
|
-
icon: { type: "icon", label: "Front icon", default: "" },
|
|
299
280
|
image: { type: "image", label: "Front image URL", default: "" }
|
|
300
281
|
},
|
|
301
282
|
anchors: { input: [-1, .15, 0], output: [1, 0, 0], operator: [0, 1, 0] },
|
|
@@ -303,7 +284,7 @@ export const processGeometryPack = {
|
|
|
303
284
|
return {
|
|
304
285
|
parts: [
|
|
305
286
|
{ shape: "box", size: [1, .62, .8], rotation: [0, 0, .16], color: "input", edgeColor: "edge", radius: .03 },
|
|
306
|
-
...
|
|
287
|
+
...frontImage(parameters, [0, 0, .43], [.3, .22, 1])
|
|
307
288
|
]
|
|
308
289
|
};
|
|
309
290
|
}
|
|
@@ -314,15 +295,12 @@ export const processGeometryPack = {
|
|
|
314
295
|
description: "Preparation, setup or initialization step.",
|
|
315
296
|
category: "Processes · Advanced",
|
|
316
297
|
canonicalSize: [2.7, 1.8, 1.8],
|
|
317
|
-
parameters: {
|
|
318
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
319
|
-
},
|
|
298
|
+
parameters: {},
|
|
320
299
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], setup: [0, 1, 0] },
|
|
321
300
|
create({ parameters }) {
|
|
322
301
|
return {
|
|
323
302
|
parts: [
|
|
324
|
-
{ shape: "prism", size: [1, .74, .82], color: "process", edgeColor: "edge" }
|
|
325
|
-
...frontMarker(parameters)
|
|
303
|
+
{ shape: "prism", size: [1, .74, .82], color: "process", edgeColor: "edge" }
|
|
326
304
|
]
|
|
327
305
|
};
|
|
328
306
|
}
|
|
@@ -334,8 +312,7 @@ export const processGeometryPack = {
|
|
|
334
312
|
category: "Processes · Advanced",
|
|
335
313
|
canonicalSize: [2.8, 1.9, 1.8],
|
|
336
314
|
parameters: {
|
|
337
|
-
lanes: { type: "number", label: "Lanes", min: 2, max: 4, step: 1, default: 2 }
|
|
338
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
315
|
+
lanes: { type: "number", label: "Lanes", min: 2, max: 4, step: 1, default: 2 }
|
|
339
316
|
},
|
|
340
317
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], lane: [0, 0, 1] },
|
|
341
318
|
create({ parameters }) {
|
|
@@ -347,7 +324,7 @@ export const processGeometryPack = {
|
|
|
347
324
|
const y = -.27 + index * (.54 / Math.max(1, lanes - 1));
|
|
348
325
|
parts.push(frontLine([0, y, .43], [.66, .025, .035], index % 2 ? "accent" : "edge"));
|
|
349
326
|
}
|
|
350
|
-
return { parts
|
|
327
|
+
return { parts };
|
|
351
328
|
}
|
|
352
329
|
},
|
|
353
330
|
{
|
|
@@ -357,17 +334,17 @@ export const processGeometryPack = {
|
|
|
357
334
|
category: "Processes · Advanced",
|
|
358
335
|
canonicalSize: [2.7, 1.9, 1.8],
|
|
359
336
|
parameters: {
|
|
360
|
-
limit: { type: "number", label: "Limit", min: 1, max: 99, step: 1, default: 3 }
|
|
361
|
-
icon: { type: "icon", label: "Front icon", default: "" }
|
|
337
|
+
limit: { type: "number", label: "Limit", min: 1, max: 99, step: 1, default: 3 }
|
|
362
338
|
},
|
|
363
339
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], loop: [0, 0, 1] },
|
|
364
340
|
create({ parameters }) {
|
|
365
341
|
const limit = Math.round(clamp(parameters.limit, 1, 99));
|
|
342
|
+
const limitWidth = .2 + Math.log10(limit + 1) / 2 * .5;
|
|
366
343
|
return {
|
|
367
344
|
parts: [
|
|
368
345
|
{ shape: "pyramid-square", size: [1, .72, .82], color: "decision", edgeColor: "edge" },
|
|
369
346
|
frontLine([0, -.17, .45], [.34, .035, .035], "ink"),
|
|
370
|
-
|
|
347
|
+
frontLine([0, .12, .45], [limitWidth, .045, .035], "ink")
|
|
371
348
|
]
|
|
372
349
|
};
|
|
373
350
|
}
|
|
@@ -380,17 +357,17 @@ export const processGeometryPack = {
|
|
|
380
357
|
canonicalSize: [2.9, 1.8, 1.8],
|
|
381
358
|
parameters: {
|
|
382
359
|
screen: { type: "select", label: "Screen state", options: ["idle", "active", "warning"], default: "active" },
|
|
383
|
-
image: { type: "image", label: "Screen image URL", default: "" }
|
|
384
|
-
icon: { type: "icon", label: "Screen icon", default: "" }
|
|
360
|
+
image: { type: "image", label: "Screen image URL", default: "" }
|
|
385
361
|
},
|
|
386
362
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], user: [0, 0, 1] },
|
|
387
363
|
create({ parameters }) {
|
|
388
|
-
const color = parameters.screen === "warning" ? "negative" : parameters.screen === "active" ? "accent" : "
|
|
364
|
+
const color = parameters.screen === "warning" ? "negative" : parameters.screen === "active" ? "accent" : "screen";
|
|
389
365
|
return {
|
|
390
366
|
parts: [
|
|
391
367
|
{ shape: "box", size: [.9, .68, .76], color: "body", edgeColor: "edge", radius: .12 },
|
|
392
|
-
{ shape: "box", size: [.72, .5, .05], position: [0, .02, .41], color
|
|
393
|
-
|
|
368
|
+
{ shape: "box", size: [.72, .5, .05], position: [0, .02, .41], color, edgeColor: color, radius: .03 },
|
|
369
|
+
{ shape: "sphere", size: [.055, .055, .035], position: [.36, -.29, .43], color, edges: false },
|
|
370
|
+
...frontImage(parameters, [0, .02, .45], [.25, .18, 1])
|
|
394
371
|
]
|
|
395
372
|
};
|
|
396
373
|
}
|
|
@@ -400,19 +377,16 @@ export const processGeometryPack = {
|
|
|
400
377
|
name: "Connector",
|
|
401
378
|
description: "An in-page connector or continuation point.",
|
|
402
379
|
category: "Processes · Essentials",
|
|
403
|
-
canonicalSize: [1.55, 1.55,
|
|
380
|
+
canonicalSize: [1.55, 1.55, .55],
|
|
404
381
|
parameters: {
|
|
405
|
-
kind: { type: "select", label: "Kind", options: ["sequence", "junction"], default: "sequence" }
|
|
406
|
-
icon: { type: "icon", label: "Connector icon", default: "" }
|
|
382
|
+
kind: { type: "select", label: "Kind", options: ["sequence", "junction"], default: "sequence" }
|
|
407
383
|
},
|
|
408
384
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], continuation: [0, 0, 1] },
|
|
409
385
|
create({ parameters }) {
|
|
410
386
|
const color = parameters.kind === "junction" ? "decision" : "accent";
|
|
411
387
|
return {
|
|
412
388
|
parts: [
|
|
413
|
-
{ shape: "cylinder", size: [.
|
|
414
|
-
{ shape: "sphere", size: [.32, .32, .32], position: [0, 0, .39], color: "ink", edges: false },
|
|
415
|
-
...frontMarker(parameters, "ink", [0, 0, .51], [.2, .16, 1])
|
|
389
|
+
{ shape: "cylinder", size: [.82, .22, .82], rotation: [Math.PI / 2, 0, 0], color, edgeColor: "edge" }
|
|
416
390
|
]
|
|
417
391
|
};
|
|
418
392
|
}
|
|
@@ -423,16 +397,12 @@ export const processGeometryPack = {
|
|
|
423
397
|
description: "A continuation to another page or diagram.",
|
|
424
398
|
category: "Processes · Advanced",
|
|
425
399
|
canonicalSize: [2.2, 2.1, 1.7],
|
|
426
|
-
parameters: {
|
|
427
|
-
target: { type: "string", label: "Target", default: "" },
|
|
428
|
-
icon: { type: "icon", label: "Reference icon", default: "" }
|
|
429
|
-
},
|
|
400
|
+
parameters: {},
|
|
430
401
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0], continuation: [0, -1, 0] },
|
|
431
402
|
create({ parameters }) {
|
|
432
403
|
return {
|
|
433
404
|
parts: [
|
|
434
|
-
{ shape: "pyramid-square", size: [1, .72, .82], rotation: [0, 0, Math.PI / 4], color: "paper", edgeColor: "edge" }
|
|
435
|
-
...frontMarker({ ...parameters, icon: parameters.icon || parameters.target }, "ink", [0, 0, .2], [.25, .18, 1])
|
|
405
|
+
{ shape: "pyramid-square", size: [1, .72, .82], rotation: [0, 0, Math.PI / 4], color: "paper", edgeColor: "edge" }
|
|
436
406
|
]
|
|
437
407
|
};
|
|
438
408
|
}
|
|
@@ -442,18 +412,15 @@ export const processGeometryPack = {
|
|
|
442
412
|
name: "Note",
|
|
443
413
|
description: "A note linked to a process symbol.",
|
|
444
414
|
category: "Processes · Essentials",
|
|
445
|
-
canonicalSize: [2.
|
|
446
|
-
parameters: {
|
|
447
|
-
icon: { type: "icon", label: "Annotation icon", default: "i" },
|
|
448
|
-
image: { type: "image", label: "Annotation image URL", default: "" }
|
|
449
|
-
},
|
|
415
|
+
canonicalSize: [2.35, 2.15, .62],
|
|
416
|
+
parameters: {},
|
|
450
417
|
anchors: { target: [-1, 0, 0], note: [1, 0, 0] },
|
|
451
418
|
create({ parameters }) {
|
|
452
419
|
return {
|
|
453
420
|
parts: [
|
|
454
|
-
{ shape: "box", size: [.
|
|
455
|
-
|
|
456
|
-
|
|
421
|
+
{ shape: "box", size: [.82, .82, .32], color: "note", edgeColor: "edge", radius: .025 },
|
|
422
|
+
{ shape: "pyramid-triangle", size: [.22, .035, .22], position: [.31, .31, .18], rotation: [Math.PI / 2, 0, Math.PI / 4], color: "fold", edges: false },
|
|
423
|
+
frontLine([.2, .2, .185], [.24, .025, .018], "body")
|
|
457
424
|
]
|
|
458
425
|
};
|
|
459
426
|
}
|
|
@@ -465,8 +432,7 @@ export const processGeometryPack = {
|
|
|
465
432
|
category: "Processes · Advanced",
|
|
466
433
|
canonicalSize: [2.5, 1.55, 1.55],
|
|
467
434
|
parameters: {
|
|
468
|
-
direction: { type: "select", label: "Direction", options: ["forward", "back"], default: "forward" }
|
|
469
|
-
icon: { type: "icon", label: "Transfer icon", default: "" }
|
|
435
|
+
direction: { type: "select", label: "Direction", options: ["forward", "back"], default: "forward" }
|
|
470
436
|
},
|
|
471
437
|
anchors: { input: [-1, 0, 0], output: [1, 0, 0] },
|
|
472
438
|
create({ parameters }) {
|
|
@@ -474,8 +440,7 @@ export const processGeometryPack = {
|
|
|
474
440
|
return {
|
|
475
441
|
parts: [
|
|
476
442
|
{ shape: "box", size: [.62, .16, .16], position: [-.17, 0, 0], color: "accent", edges: false },
|
|
477
|
-
{ shape: "cone", size: [.42, .42, .42], position: [.28, 0, 0], rotation: [0, 0, rotation], color: "accent", edgeColor: "edge" }
|
|
478
|
-
...frontMarker(parameters, "ink", [0, 0, .24], [.2, .16, 1])
|
|
443
|
+
{ shape: "cone", size: [.42, .42, .42], position: [.28, 0, 0], rotation: [0, 0, rotation], color: "accent", edgeColor: "edge" }
|
|
479
444
|
]
|
|
480
445
|
};
|
|
481
446
|
}
|
|
@@ -487,16 +452,14 @@ export const processGeometryPack = {
|
|
|
487
452
|
category: "Processes · Advanced",
|
|
488
453
|
canonicalSize: [2.25, 1.8, 2.1],
|
|
489
454
|
parameters: {
|
|
490
|
-
state: { type: "select", label: "State", options: ["true", "false", "unknown"], default: "unknown" }
|
|
491
|
-
icon: { type: "icon", label: "Condition icon", default: "" }
|
|
455
|
+
state: { type: "select", label: "State", options: ["true", "false", "unknown"], default: "unknown" }
|
|
492
456
|
},
|
|
493
457
|
anchors: { input: [-1, 0, 0], true: [1, .35, 0], false: [1, -.35, 0] },
|
|
494
458
|
create({ parameters }) {
|
|
495
459
|
const color = parameters.state === "true" ? "positive" : parameters.state === "false" ? "negative" : "decision";
|
|
496
460
|
return {
|
|
497
461
|
parts: [
|
|
498
|
-
{ shape: "pyramid-triangle", size: [1, .68, .84], color, edgeColor: "edge" }
|
|
499
|
-
...frontMarker(parameters, "ink", [0, 0, .45], [.22, .18, 1])
|
|
462
|
+
{ shape: "pyramid-triangle", size: [1, .68, .84], color, edgeColor: "edge" }
|
|
500
463
|
]
|
|
501
464
|
};
|
|
502
465
|
}
|