pyegeria 5.3.4.13__py3-none-any.whl → 5.3.4.15__py3-none-any.whl
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.
- pyegeria/mermaid_utilities.py +241 -76
- pyegeria/test_m.html +101 -72
- {pyegeria-5.3.4.13.dist-info → pyegeria-5.3.4.15.dist-info}/METADATA +1 -1
- {pyegeria-5.3.4.13.dist-info → pyegeria-5.3.4.15.dist-info}/RECORD +7 -7
- {pyegeria-5.3.4.13.dist-info → pyegeria-5.3.4.15.dist-info}/LICENSE +0 -0
- {pyegeria-5.3.4.13.dist-info → pyegeria-5.3.4.15.dist-info}/WHEEL +0 -0
- {pyegeria-5.3.4.13.dist-info → pyegeria-5.3.4.15.dist-info}/entry_points.txt +0 -0
pyegeria/mermaid_utilities.py
CHANGED
@@ -226,124 +226,289 @@ def construct_mermaid_html(mermaid_str: str) -> str:
|
|
226
226
|
graph_id = f"mermaid-graph-{guid}"
|
227
227
|
escaped_header = html.escape(title_label) if title_label else "" # Sanitize the header safely
|
228
228
|
escaped_mermaid_code = html.escape(mermaid_code)
|
229
|
+
header_html = f"""
|
230
|
+
<h3 id="{graph_id}-heading" style="margin: 20px 0; font-size: 1.5em; text-align: center;">
|
231
|
+
{escaped_header}
|
232
|
+
</h3>
|
233
|
+
<p id="{graph_id}-subheading" style="margin: 0; padding: 5px; font-size: 1em; text-align: center; color: gray; flex: 0 0 auto;">
|
234
|
+
GUID: {guid}
|
235
|
+
</p>
|
236
|
+
""" if title_label else ""
|
229
237
|
|
230
238
|
html_content = f"""
|
231
|
-
<style>
|
232
|
-
|
233
|
-
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
|
259
|
-
|
260
|
-
|
261
|
-
|
262
|
-
|
263
|
-
</style>
|
264
|
-
|
265
|
-
<div id="{graph_id}-container" class="diagram-container">
|
266
|
-
|
267
|
-
|
268
|
-
|
239
|
+
<style>
|
240
|
+
.diagram-container {{
|
241
|
+
position: relative;
|
242
|
+
width: 90%; /* Adjust container width */
|
243
|
+
height: 500px; /* Fixed height */
|
244
|
+
margin: 20px auto;
|
245
|
+
border: 1px solid #ccc;
|
246
|
+
overflow: hidden; /* Prevents content overflow */
|
247
|
+
}}
|
248
|
+
|
249
|
+
.svg-pan-zoom-controls {{
|
250
|
+
position: absolute;
|
251
|
+
top: 10px;
|
252
|
+
right: 10px;
|
253
|
+
display: flex;
|
254
|
+
flex-direction: column;
|
255
|
+
gap: 5px;
|
256
|
+
z-index: 10;
|
257
|
+
}}
|
258
|
+
|
259
|
+
.svg-pan-zoom-controls button {{
|
260
|
+
background-color: #007bff;
|
261
|
+
color: white;
|
262
|
+
border: none;
|
263
|
+
padding: 5px 10px;
|
264
|
+
border-radius: 3px;
|
265
|
+
cursor: pointer;
|
266
|
+
font-size: 14px;
|
267
|
+
}}
|
268
|
+
.svg-pan-zoom-controls button:hover {{
|
269
|
+
background-color: #0056b3;
|
270
|
+
}}
|
271
|
+
</style>
|
272
|
+
|
273
|
+
<div id="{graph_id}-container" class="diagram-container">
|
274
|
+
<div id="{graph_id}" class="mermaid">
|
275
|
+
{mermaid_code}
|
276
|
+
</div>
|
269
277
|
</div>
|
270
|
-
</div>
|
271
278
|
|
272
|
-
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
273
|
-
<script src="https://cdn.jsdelivr.net/npm/svg-pan-zoom@3.6.1/dist/svg-pan-zoom.min.js"></script>
|
274
279
|
<script>
|
275
|
-
|
276
|
-
// Initialize Mermaid and Pan-Zoom functionality
|
280
|
+
(function() {{
|
277
281
|
const graph_id = "{graph_id}";
|
282
|
+
let panZoomInstance; // Reference for svg-pan-zoom instance
|
278
283
|
|
279
284
|
function initializeMermaid(graph_id) {{
|
280
|
-
const
|
281
|
-
|
282
|
-
|
283
|
-
|
285
|
+
const container = document.getElementById(`${{graph_id}}-container`);
|
286
|
+
const diagram = document.getElementById(`${{graph_id}}`);
|
287
|
+
|
288
|
+
if (!container || !diagram) {{
|
289
|
+
console.error(`Container or diagram not found for ID "${{graph_id}}"`);
|
284
290
|
return;
|
285
291
|
}}
|
286
292
|
|
287
|
-
//
|
288
|
-
mermaid.initialize({{ startOnLoad: false
|
289
|
-
mermaid.init(undefined,
|
293
|
+
// Initialize Mermaid
|
294
|
+
mermaid.initialize({{ startOnLoad: false }});
|
295
|
+
mermaid.init(undefined, diagram);
|
290
296
|
|
297
|
+
// Set a small delay to allow Mermaid rendering to complete
|
291
298
|
setTimeout(() => {{
|
292
|
-
const svg =
|
299
|
+
const svg = container.querySelector("svg");
|
300
|
+
|
293
301
|
if (!svg) {{
|
294
|
-
console.error(`SVG not
|
302
|
+
console.error(`SVG not found for graph ID "${{graph_id}}"`);
|
295
303
|
return;
|
296
304
|
}}
|
297
305
|
|
298
|
-
//
|
306
|
+
// Force SVG to fit the container
|
299
307
|
svg.setAttribute("width", "100%");
|
300
308
|
svg.setAttribute("height", "100%");
|
309
|
+
svg.setAttribute("preserveAspectRatio", "xMidYMid meet");
|
310
|
+
svg.style.display = "block";
|
311
|
+
|
312
|
+
if (!svg.hasAttribute("viewBox")) {{
|
313
|
+
const bbox = svg.getBBox();
|
314
|
+
svg.setAttribute("viewBox", `0 0 ${{bbox.width}} ${{bbox.height}}`);
|
315
|
+
}}
|
301
316
|
|
302
317
|
// Initialize Pan-Zoom
|
303
|
-
|
318
|
+
panZoomInstance = svgPanZoom(svg, {{
|
304
319
|
zoomEnabled: true,
|
305
|
-
controlIconsEnabled: false,
|
320
|
+
controlIconsEnabled: false, // Custom controls
|
306
321
|
fit: true,
|
307
322
|
center: true,
|
323
|
+
contain: true,
|
308
324
|
minZoom: 0.5,
|
309
|
-
maxZoom: 10
|
310
|
-
contain: true
|
325
|
+
maxZoom: 10
|
311
326
|
}});
|
312
327
|
|
313
|
-
// Add
|
328
|
+
// Add controls
|
314
329
|
const controlsContainer = document.createElement("div");
|
315
|
-
controlsContainer.className = "svg-pan-
|
330
|
+
controlsContainer.className = "svg-pan-zoom-controls";
|
316
331
|
controlsContainer.innerHTML = `
|
317
|
-
<button id="${{graph_id}}-zoom-in">+</button>
|
318
|
-
<button id="${{graph_id}}-zoom-out">-</button>
|
319
|
-
<button id="${{graph_id}}-reset">Reset</button>
|
332
|
+
<button type="button" id="${{graph_id}}-zoom-in">+</button>
|
333
|
+
<button type="button" id="${{graph_id}}-zoom-out">-</button>
|
334
|
+
<button type="button" id="${{graph_id}}-reset">Reset</button>
|
320
335
|
`;
|
321
|
-
|
336
|
+
container.appendChild(controlsContainer);
|
322
337
|
|
323
|
-
//
|
324
|
-
document.getElementById(`${{graph_id}}-zoom-in`).addEventListener("click", () =>
|
325
|
-
|
338
|
+
// Attach control event listeners
|
339
|
+
document.getElementById(`${{graph_id}}-zoom-in`).addEventListener("click", () => {{
|
340
|
+
if (panZoomInstance) panZoomInstance.zoomIn();
|
341
|
+
}});
|
342
|
+
document.getElementById(`${{graph_id}}-zoom-out`).addEventListener("click", () => {{
|
343
|
+
if (panZoomInstance) panZoomInstance.zoomOut();
|
344
|
+
}});
|
326
345
|
document.getElementById(`${{graph_id}}-reset`).addEventListener("click", () => {{
|
327
|
-
|
328
|
-
|
346
|
+
if (panZoomInstance) {{
|
347
|
+
panZoomInstance.resetZoom();
|
348
|
+
panZoomInstance.center();
|
349
|
+
}}
|
329
350
|
}});
|
330
|
-
}}, 500);
|
351
|
+
}}, 500); // Delay for Mermaid and SVG rendering
|
331
352
|
}}
|
332
353
|
|
333
|
-
if
|
334
|
-
|
335
|
-
|
336
|
-
|
337
|
-
|
354
|
+
// Check if Mermaid and SVG-Pan-Zoom are loaded
|
355
|
+
const loadMermaid = typeof mermaid === "undefined";
|
356
|
+
const loadSvgPanZoom = typeof svgPanZoom === "undefined";
|
357
|
+
|
358
|
+
if (loadMermaid || loadSvgPanZoom) {{
|
359
|
+
const promises = [];
|
360
|
+
|
361
|
+
// Load Mermaid.js if not already loaded
|
362
|
+
if (loadMermaid) {{
|
363
|
+
promises.push(new Promise((resolve) => {{
|
364
|
+
const script = document.createElement("script");
|
365
|
+
script.src = "https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js";
|
366
|
+
script.onload = resolve;
|
367
|
+
document.head.appendChild(script);
|
368
|
+
}}));
|
369
|
+
}}
|
370
|
+
|
371
|
+
// Load SVG-Pan-Zoom if not already loaded
|
372
|
+
if (loadSvgPanZoom) {{
|
373
|
+
promises.push(new Promise((resolve) => {{
|
374
|
+
const script = document.createElement("script");
|
375
|
+
script.src = "https://cdn.jsdelivr.net/npm/svg-pan-zoom@3.6.1/dist/svg-pan-zoom.min.js";
|
376
|
+
script.onload = resolve;
|
377
|
+
document.head.appendChild(script);
|
378
|
+
}}));
|
379
|
+
}}
|
380
|
+
|
381
|
+
Promise.all(promises).then(() => initializeMermaid(graph_id));
|
338
382
|
}} else {{
|
339
383
|
initializeMermaid(graph_id);
|
340
384
|
}}
|
341
|
-
}});
|
385
|
+
}})();
|
342
386
|
</script>
|
343
387
|
|
344
|
-
"""
|
388
|
+
"""
|
389
|
+
|
390
|
+
|
391
|
+
|
345
392
|
|
346
393
|
return html_content
|
394
|
+
|
395
|
+
# html_content = f"""
|
396
|
+
# <style>
|
397
|
+
# /* Style for the diagram container */
|
398
|
+
# .diagram-container {{
|
399
|
+
# position: relative;
|
400
|
+
# width: 100%; /* Adjust the diagram container width */
|
401
|
+
# height: 500px; /* Set a fixed height for the container */
|
402
|
+
# margin: 0 auto;
|
403
|
+
# border: 1px solid #ccc; /* Optional border for visualization */
|
404
|
+
# overflow: hidden; /* Prevent content overflow outside the container */
|
405
|
+
# }}
|
406
|
+
#
|
407
|
+
# /* Style for zoom controls */
|
408
|
+
# .svg-pan-zoom_controls {{
|
409
|
+
# position: absolute;
|
410
|
+
# top: 10px;
|
411
|
+
# right: 10px;
|
412
|
+
# display: flex;
|
413
|
+
# flex-direction: column;
|
414
|
+
# gap: 5px;
|
415
|
+
# }}
|
416
|
+
# .svg-pan-zoom_controls button {{
|
417
|
+
# background-color: #007bff;
|
418
|
+
# color: white;
|
419
|
+
# border: none;
|
420
|
+
# padding: 5px 10px;
|
421
|
+
# border-radius: 3px;
|
422
|
+
# cursor: pointer;
|
423
|
+
# font-size: 14px;
|
424
|
+
# }}
|
425
|
+
# .svg-pan-zoom_controls button:hover {{
|
426
|
+
# background-color: #0056b3;
|
427
|
+
# }}
|
428
|
+
# </style>
|
429
|
+
#
|
430
|
+
# <div id="{graph_id}-container" class="diagram-container">
|
431
|
+
# <!-- Mermaid diagram will be dynamically rendered here -->
|
432
|
+
# <div id="{graph_id}" class="mermaid">
|
433
|
+
# {mermaid_code}
|
434
|
+
# </div>
|
435
|
+
# </div>
|
436
|
+
#
|
437
|
+
# <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
438
|
+
# <script src="https://cdn.jsdelivr.net/npm/svg-pan-zoom@3.6.1/dist/svg-pan-zoom.min.js"></script>
|
439
|
+
# <script>
|
440
|
+
# document.addEventListener("DOMContentLoaded", () => {{
|
441
|
+
# // Initialize Mermaid and Pan-Zoom functionality
|
442
|
+
# const graph_id = "{graph_id}";
|
443
|
+
#
|
444
|
+
# function initializeMermaid(graph_id) {{
|
445
|
+
# const containerElement = document.getElementById(`${{graph_id}}-container`);
|
446
|
+
#
|
447
|
+
# if (!containerElement) {{
|
448
|
+
# console.error(`Container with ID "${{graph_id}}-container" not found.`);
|
449
|
+
# return;
|
450
|
+
# }}
|
451
|
+
#
|
452
|
+
# // Configure Mermaid
|
453
|
+
# mermaid.initialize({{ startOnLoad: false, logLevel: "debug" }});
|
454
|
+
# mermaid.init(undefined, `#${{graph_id}}`);
|
455
|
+
#
|
456
|
+
# setTimeout(() => {{
|
457
|
+
# const svg = containerElement.querySelector("svg");
|
458
|
+
# if (!svg) {{
|
459
|
+
# console.error(`SVG not rendered for ID "${{graph_id}}".`);
|
460
|
+
# return;
|
461
|
+
# }}
|
462
|
+
#
|
463
|
+
# // Set initial size
|
464
|
+
# svg.setAttribute("width", "100%");
|
465
|
+
# svg.setAttribute("height", "100%");
|
466
|
+
#
|
467
|
+
# // Initialize Pan-Zoom
|
468
|
+
# const panZoom = svgPanZoom(svg, {{
|
469
|
+
# zoomEnabled: true,
|
470
|
+
# controlIconsEnabled: false,
|
471
|
+
# fit: true,
|
472
|
+
# center: true,
|
473
|
+
# minZoom: 0.5,
|
474
|
+
# maxZoom: 10,
|
475
|
+
# contain: true
|
476
|
+
# }});
|
477
|
+
#
|
478
|
+
# // Add custom controls
|
479
|
+
# const controlsContainer = document.createElement("div");
|
480
|
+
# controlsContainer.className = "svg-pan-zoom_controls";
|
481
|
+
# controlsContainer.innerHTML = `
|
482
|
+
# <button id="${{graph_id}}-zoom-in">+</button>
|
483
|
+
# <button id="${{graph_id}}-zoom-out">-</button>
|
484
|
+
# <button id="${{graph_id}}-reset">Reset</button>
|
485
|
+
# `;
|
486
|
+
# containerElement.appendChild(controlsContainer);
|
487
|
+
#
|
488
|
+
# // Handle controls
|
489
|
+
# document.getElementById(`${{graph_id}}-zoom-in`).addEventListener("click", () => panZoom.zoomIn());
|
490
|
+
# document.getElementById(`${{graph_id}}-zoom-out`).addEventListener("click", () => panZoom.zoomOut());
|
491
|
+
# document.getElementById(`${{graph_id}}-reset`).addEventListener("click", () => {{
|
492
|
+
# panZoom.resetZoom();
|
493
|
+
# panZoom.center();
|
494
|
+
# }});
|
495
|
+
# }}, 500);
|
496
|
+
# }}
|
497
|
+
#
|
498
|
+
# if (typeof mermaid === "undefined") {{
|
499
|
+
# const script = document.createElement('script');
|
500
|
+
# script.src = "https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js";
|
501
|
+
# script.onload = () => initializeMermaid(graph_id);
|
502
|
+
# document.head.appendChild(script);
|
503
|
+
# }} else {{
|
504
|
+
# initializeMermaid(graph_id);
|
505
|
+
# }}
|
506
|
+
# }});
|
507
|
+
# </script>
|
508
|
+
#
|
509
|
+
# """
|
510
|
+
#
|
511
|
+
# return html_content
|
347
512
|
# This one almost works - no controls and diagram too small
|
348
513
|
# html_content = f"""
|
349
514
|
# <!DOCTYPE html>
|
pyegeria/test_m.html
CHANGED
@@ -1,42 +1,53 @@
|
|
1
1
|
|
2
|
-
<style>
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
<div id="mermaid-graph-c4f8d707-7c85-4125-b5fd-c3257a2ef2ef" class="
|
39
|
-
|
2
|
+
<style>
|
3
|
+
/* Style the diagram container */
|
4
|
+
.diagram-container {
|
5
|
+
position: relative;
|
6
|
+
width: 90%; /* Adjust container width */
|
7
|
+
height: 500px; /* Fixed height */
|
8
|
+
margin: 0 auto;
|
9
|
+
border: 1px solid #ccc;
|
10
|
+
overflow: hidden; /* Prevents content overflow */
|
11
|
+
}
|
12
|
+
|
13
|
+
/* Style custom zoom controls */
|
14
|
+
.svg-pan-zoom-controls {
|
15
|
+
position: absolute;
|
16
|
+
top: 10px;
|
17
|
+
right: 10px;
|
18
|
+
display: flex;
|
19
|
+
flex-direction: column;
|
20
|
+
gap: 5px;
|
21
|
+
z-index: 10; /* Ensures controls are above other elements */
|
22
|
+
}
|
23
|
+
|
24
|
+
.svg-pan-zoom-controls button {
|
25
|
+
background-color: #007bff;
|
26
|
+
color: white;
|
27
|
+
border: none;
|
28
|
+
padding: 5px 10px;
|
29
|
+
border-radius: 3px;
|
30
|
+
cursor: pointer;
|
31
|
+
font-size: 14px;
|
32
|
+
}
|
33
|
+
.svg-pan-zoom-controls button:hover {
|
34
|
+
background-color: #0056b3;
|
35
|
+
}
|
36
|
+
</style>
|
37
|
+
|
38
|
+
<div id="mermaid-graph-c4f8d707-7c85-4125-b5fd-c3257a2ef2ef-container" class="diagram-container">
|
39
|
+
<!-- Title/Heading (optional; include as needed) -->
|
40
|
+
|
41
|
+
<h3 id="mermaid-graph-c4f8d707-7c85-4125-b5fd-c3257a2ef2ef-heading" style="margin: 20px 0; font-size: 1.5em; text-align: center;">
|
42
|
+
Component for Solution Blueprint - Clinical Trial Management Solution Blueprint
|
43
|
+
</h3>
|
44
|
+
<p id="mermaid-graph-c4f8d707-7c85-4125-b5fd-c3257a2ef2ef-subheading" style="margin: 0; padding: 5px; font-size: 1em; text-align: center; color: gray; flex: 0 0 auto;">
|
45
|
+
GUID: c4f8d707-7c85-4125-b5fd-c3257a2ef2ef
|
46
|
+
</p>
|
47
|
+
|
48
|
+
<!-- Mermaid rendering area -->
|
49
|
+
<div id="mermaid-graph-c4f8d707-7c85-4125-b5fd-c3257a2ef2ef" class="mermaid">
|
50
|
+
flowchart TD
|
40
51
|
%%{init: {"flowchart": {"htmlLabels": false}} }%%
|
41
52
|
|
42
53
|
subgraph c4f8d707-7c85-4125-b5fd-c3257a2ef2ef [Components and Actors]
|
@@ -136,79 +147,97 @@ style b5c8da4c-f925-4cf1-8294-e43cd2c1a584 color:#FFFFFF, fill:#838cc7, stroke:#
|
|
136
147
|
style f6bc847b-868d-43cc-b767-41f5fe3e47d1 color:#FFFFFF, fill:#AA00FF, stroke:#E1D5E7
|
137
148
|
style d48f579f-76d3-4c49-b1b4-575f5645a9d0 color:#FFFFFF, fill:#838cc7, stroke:#3079ab
|
138
149
|
style f37f3735-28a1-4e03-9ff5-3fe2f137f661 color:#FFFFFF, fill:#AA00FF, stroke:#E1D5E7
|
139
|
-
style fb32bef2-e79f-4893-b500-2e547f24d482 color:#FFFFFF, fill:#838cc7, stroke:#3079ab
|
150
|
+
style fb32bef2-e79f-4893-b500-2e547f24d482 color:#FFFFFF, fill:#838cc7, stroke:#3079ab
|
151
|
+
</div>
|
140
152
|
</div>
|
141
|
-
</div>
|
142
153
|
|
143
|
-
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
154
|
+
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
144
155
|
<script src="https://cdn.jsdelivr.net/npm/svg-pan-zoom@3.6.1/dist/svg-pan-zoom.min.js"></script>
|
156
|
+
|
145
157
|
<script>
|
146
|
-
|
147
|
-
// Initialize Mermaid and Pan-Zoom functionality
|
158
|
+
(function() {
|
148
159
|
const graph_id = "mermaid-graph-c4f8d707-7c85-4125-b5fd-c3257a2ef2ef";
|
160
|
+
let panZoomInstance; // Store reference to the panZoom instance
|
149
161
|
|
162
|
+
// Function to initialize Mermaid
|
150
163
|
function initializeMermaid(graph_id) {
|
151
|
-
const
|
152
|
-
|
153
|
-
|
154
|
-
|
164
|
+
const container = document.getElementById(`${graph_id}-container`);
|
165
|
+
const diagram = document.getElementById(`${graph_id}`);
|
166
|
+
|
167
|
+
if (!container || !diagram) {
|
168
|
+
console.error(`Container or diagram not found for ID "${graph_id}"`);
|
155
169
|
return;
|
156
170
|
}
|
157
171
|
|
158
|
-
//
|
159
|
-
mermaid.initialize({ startOnLoad: false
|
160
|
-
mermaid.init(undefined,
|
172
|
+
// Initialize Mermaid
|
173
|
+
mermaid.initialize({ startOnLoad: false });
|
174
|
+
mermaid.init(undefined, diagram);
|
161
175
|
|
176
|
+
// Set a small delay to allow Mermaid rendering to complete before initializing Pan-Zoom
|
162
177
|
setTimeout(() => {
|
163
|
-
const svg =
|
178
|
+
const svg = container.querySelector("svg");
|
164
179
|
if (!svg) {
|
165
|
-
console.error(`SVG not
|
180
|
+
console.error(`SVG not found for graph ID "${graph_id}"`);
|
166
181
|
return;
|
167
182
|
}
|
168
183
|
|
169
|
-
//
|
184
|
+
// Force the SVG to fit the container by setting width, height, and viewBox
|
170
185
|
svg.setAttribute("width", "100%");
|
171
186
|
svg.setAttribute("height", "100%");
|
187
|
+
svg.setAttribute("preserveAspectRatio", "xMidYMid meet");
|
188
|
+
svg.style.display = "block";
|
172
189
|
|
173
|
-
|
174
|
-
|
190
|
+
if (!svg.hasAttribute("viewBox")) {
|
191
|
+
const bbox = svg.getBBox();
|
192
|
+
svg.setAttribute("viewBox", `0 0 ${bbox.width} ${bbox.height}`);
|
193
|
+
}
|
194
|
+
|
195
|
+
// Initialize Pan-Zoom functionality
|
196
|
+
panZoomInstance = svgPanZoom(svg, {
|
175
197
|
zoomEnabled: true,
|
176
|
-
controlIconsEnabled: false,
|
198
|
+
controlIconsEnabled: false, // Use custom controls
|
177
199
|
fit: true,
|
178
200
|
center: true,
|
201
|
+
contain: true,
|
179
202
|
minZoom: 0.5,
|
180
|
-
maxZoom: 10
|
181
|
-
contain: true
|
203
|
+
maxZoom: 10
|
182
204
|
});
|
183
205
|
|
184
206
|
// Add custom controls
|
185
207
|
const controlsContainer = document.createElement("div");
|
186
|
-
controlsContainer.className = "svg-pan-
|
208
|
+
controlsContainer.className = "svg-pan-zoom-controls";
|
187
209
|
controlsContainer.innerHTML = `
|
188
|
-
<button id="${graph_id}-zoom-in">+</button>
|
189
|
-
<button id="${graph_id}-zoom-out">-</button>
|
190
|
-
<button id="${graph_id}-reset">Reset</button>
|
210
|
+
<button type="button" id="${graph_id}-zoom-in">+</button>
|
211
|
+
<button type="button" id="${graph_id}-zoom-out">-</button>
|
212
|
+
<button type="button" id="${graph_id}-reset">Reset</button>
|
191
213
|
`;
|
192
|
-
|
214
|
+
container.appendChild(controlsContainer);
|
193
215
|
|
194
|
-
//
|
195
|
-
document.getElementById(`${graph_id}-zoom-in`).addEventListener("click", () =>
|
196
|
-
|
216
|
+
// Add event listeners for the controls
|
217
|
+
document.getElementById(`${graph_id}-zoom-in`).addEventListener("click", () => {
|
218
|
+
if (panZoomInstance) panZoomInstance.zoomIn();
|
219
|
+
});
|
220
|
+
document.getElementById(`${graph_id}-zoom-out`).addEventListener("click", () => {
|
221
|
+
if (panZoomInstance) panZoomInstance.zoomOut();
|
222
|
+
});
|
197
223
|
document.getElementById(`${graph_id}-reset`).addEventListener("click", () => {
|
198
|
-
|
199
|
-
|
224
|
+
if (panZoomInstance) {
|
225
|
+
panZoomInstance.resetZoom();
|
226
|
+
panZoomInstance.center();
|
227
|
+
}
|
200
228
|
});
|
201
|
-
}, 500);
|
229
|
+
}, 500); // Delay of 500ms for Mermaid and SVG rendering
|
202
230
|
}
|
203
231
|
|
232
|
+
// Load Mermaid.js if not already loaded
|
204
233
|
if (typeof mermaid === "undefined") {
|
205
|
-
const script = document.createElement(
|
234
|
+
const script = document.createElement("script");
|
206
235
|
script.src = "https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js";
|
207
236
|
script.onload = () => initializeMermaid(graph_id);
|
208
237
|
document.head.appendChild(script);
|
209
238
|
} else {
|
210
239
|
initializeMermaid(graph_id);
|
211
240
|
}
|
212
|
-
});
|
241
|
+
})();
|
213
242
|
</script>
|
214
|
-
|
243
|
+
|
@@ -245,7 +245,7 @@ pyegeria/full_omag_server_config.py,sha256=CQqLCy_3DZFvJZEOcGf50HWdFaWpiAIs6z-kK
|
|
245
245
|
pyegeria/glossary_browser_omvs.py,sha256=ci57LXFjIAXWw6XXFu8pIbeR_3y4hl_x4F2-HHdy7VM,93585
|
246
246
|
pyegeria/glossary_manager_omvs.py,sha256=GJQo5E3bxv8JL84wTGqJKMrMo7QqNAPtyJJgvGpI_lU,132558
|
247
247
|
pyegeria/m_test.py,sha256=BDKRLsHsAWnwCbzHkkvfsc8ZIJ0k-jmwPPNuTSgW6Qo,7659
|
248
|
-
pyegeria/mermaid_utilities.py,sha256=
|
248
|
+
pyegeria/mermaid_utilities.py,sha256=eIQ21z8KuoeKWkDLChvU_f3O-33sFah67Vaks0Oaj0g,40651
|
249
249
|
pyegeria/metadata_explorer_omvs.py,sha256=xHnZTQKbd6XwOhYia-RiIisrvZcqHi0SL1l6OCf04Gk,86911
|
250
250
|
pyegeria/my_profile_omvs.py,sha256=d0oJYCJG7pS9BINPuGciVa00ac0jwPHNANXDCLginEc,34720
|
251
251
|
pyegeria/platform_services.py,sha256=xlF5p5HPKDGTFFDsuxm2RLhr8vjZPv4T7e2qCkDgKXE,41654
|
@@ -255,14 +255,14 @@ pyegeria/runtime_manager_omvs.py,sha256=Z5wY9ignNjil8O6yjihZftxkGoh9A4PQDcXhoIsO
|
|
255
255
|
pyegeria/server_operations.py,sha256=vmiUDU_Xa0U8pa0Fdb-QKkoeSqs7WfMwIpG_XU3xgeI,16784
|
256
256
|
pyegeria/solution_architect_omvs.py,sha256=x6CfPTyn1l2DFYVEFP0t_rT9uVjoFr596hBBeuVaMRg,22093
|
257
257
|
pyegeria/template_manager_omvs.py,sha256=PfJ9dOfmBvf59DgRdZ9Dl1Kl_UYqjF-JncXVnbCqLZU,42408
|
258
|
-
pyegeria/test_m.html,sha256=
|
258
|
+
pyegeria/test_m.html,sha256=equ-hAZ8yn8g5pzzmslQaO_k75GWaWg9OxeHpCBG_4U,13531
|
259
259
|
pyegeria/test_m1.html,sha256=XS_1IAtfG4ZlZk45QTkrFWWpjQMVlO21ScDMX2Frl3g,14086
|
260
260
|
pyegeria/test_mer.ipynb,sha256=G7hpHn07IXnt_VKvnTDvljwwHB7RfC0etOMyZKt1icQ,30809
|
261
261
|
pyegeria/utils.py,sha256=GCt1C0bp0Xng1ahzbZhzV9qQwH7Dj93IaCt2dvWb-sg,5417
|
262
262
|
pyegeria/valid_metadata_omvs.py,sha256=kL3bEkoBtNCaQKjziFwRAqQyleu-i2ua_REIogfulFw,65031
|
263
263
|
pyegeria/x_action_author_omvs.py,sha256=6b725SPsC52AI7ols7Qq8MsBlZuAXr_BgJ_-ychVRCw,6386
|
264
|
-
pyegeria-5.3.4.
|
265
|
-
pyegeria-5.3.4.
|
266
|
-
pyegeria-5.3.4.
|
267
|
-
pyegeria-5.3.4.
|
268
|
-
pyegeria-5.3.4.
|
264
|
+
pyegeria-5.3.4.15.dist-info/LICENSE,sha256=xx0jnfkXJvxRnG63LTGOxlggYnIysveWIZ6H3PNdCrQ,11357
|
265
|
+
pyegeria-5.3.4.15.dist-info/METADATA,sha256=MCI6Baa0OgGreARNDJm282wBYOBxfgw1WoQx-HZgK_E,2736
|
266
|
+
pyegeria-5.3.4.15.dist-info/WHEEL,sha256=IYZQI976HJqqOpQU6PHkJ8fb3tMNBFjg-Cn-pwAbaFM,88
|
267
|
+
pyegeria-5.3.4.15.dist-info/entry_points.txt,sha256=LS9g5JPSBL0whnyAcGhLZCAyUp6PkPU6fjHP9Aso1V4,6176
|
268
|
+
pyegeria-5.3.4.15.dist-info/RECORD,,
|
File without changes
|
File without changes
|
File without changes
|