75 lines
3.5 KiB
HTML
75 lines
3.5 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Interaction Diagrams for Syndicated Actors</title>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link href="style.css" rel="stylesheet">
|
|
<script src="node_modules/@preserves/core/dist/preserves.js"></script>
|
|
<script src="node_modules/@syndicate-lang/core/dist/syndicate.js"></script>
|
|
<script src="node_modules/@syndicate-lang/html/dist/syndicate-html.js"></script>
|
|
<script src="node_modules/@syndicate-lang/ws-relay/dist/syndicate-ws-relay.js"></script>
|
|
<script src="index.js"></script>
|
|
</head>
|
|
<body>
|
|
<p>Interaction Diagrams for Syndicated Actors</p>
|
|
<div id="container">
|
|
<svg id="playground" viewBox="0 0 100 100" width="100" height="100">
|
|
<defs>
|
|
<marker id="arrowhead" markerWidth="15" markerHeight="15" refX="3.75" refY="7.5"
|
|
orient="auto-start-reverse">
|
|
<polygon points="0 0, 15 7.5, 0 15, 3.75 7.5, 0 0" />
|
|
</marker>
|
|
<linearGradient id="swimlane-fadeout" x1="0" x2="0" y1="0" y2="1">
|
|
<stop stop-color="var(--lifeline-color)" stop-opacity="1" offset="0%"/>
|
|
<stop stop-color="var(--lifeline-color)" stop-opacity="0" offset="100%"/>
|
|
</linearGradient>
|
|
</defs>
|
|
|
|
<!-- <path d="M 0 30 c 17.7 17.7 232.3 -17.7 250 0" -->
|
|
<!-- stroke-width="2" -->
|
|
<!-- fill="none" -->
|
|
<!-- stroke="#000" -->
|
|
<!-- marker-end="url(#arrowhead)"/> -->
|
|
<!-- <line x1="0" y1="50" x2="250" y2="50" stroke="#000" stroke-width="2" marker-end="url(#arrowhead)" /> -->
|
|
|
|
<!-- <path d="M16.7,178 c87.6-46.9,162.9-185.4,227-136.4C307.2,90.1,195,158.5,111,108.9C71,85.2,92.2,30.7,126,7" -->
|
|
<!-- stroke-width="2" -->
|
|
<!-- fill="none" -->
|
|
<!-- stroke="#000" -->
|
|
<!-- marker-end="url(#arrowhead)"/> -->
|
|
|
|
<g id="underlay"></g>
|
|
<g id="overlay"></g>
|
|
|
|
<!-- <text x="20" y="20" style="white-space: pre;">Hello world! -->
|
|
<!-- blahhhh -->
|
|
<!-- noodles -->
|
|
<!-- I am a banana.</text> -->
|
|
|
|
<!-- <rect x="-33" y="100" width="100" height="100" style="fill: pink;"></rect> -->
|
|
|
|
<!-- <rect x="100" y="100" width="100" height="100" style="fill: #ff00ff;"></rect> -->
|
|
|
|
<!-- <rect x="100" y="300" width="100" height="100" style="fill: pink;"></rect> -->
|
|
<!-- <rect x="100" y="500" width="100" height="100"></rect> -->
|
|
<!-- <rect x="100" y="700" width="100" height="100"></rect> -->
|
|
<!-- <rect x="100" y="900" width="100" height="100"></rect> -->
|
|
<!-- <rect x="100" y="1100" width="100" height="100"></rect> -->
|
|
<!-- <rect x="100" y="1300" width="100" height="100"></rect> -->
|
|
<!-- <rect x="100" y="1500" width="100" height="100"></rect> -->
|
|
|
|
<!-- <rect x="300" y="100" width="100" height="100" style="fill: blue;"></rect> -->
|
|
<!-- <rect x="500" y="100" width="100" height="100" style="fill: orange;"></rect> -->
|
|
<!-- <rect x="700" y="100" width="100" height="100" style="fill: orange;"></rect> -->
|
|
<!-- <rect x="900" y="100" width="100" height="100" style="fill: #ffaaff;"></rect> -->
|
|
<!-- <rect x="1100" y="100" width="100" height="100" style="fill: #f00;"></rect> -->
|
|
<!-- <rect x="1300" y="100" width="100" height="100"></rect> -->
|
|
<!-- <rect x="1500" y="100" width="100" height="100"></rect> -->
|
|
|
|
</svg>
|
|
</div>
|
|
<script>Main.main();</script>
|
|
</body>
|
|
</html>
|