From bea5f0525a0e7d3622277acfe8415613ea372e6e Mon Sep 17 00:00:00 2001
From: Evgeny Poberezkin <e.poberezkin@me.com>
Date: Mon, 23 Dec 2019 23:18:17 +0000
Subject: [PATCH] docs: simplex connection

---
 diagrams/simplex1.mmd |   8 +
 diagrams/simplex1.svg | 498 ++++++++++++++++++++++++++++++++++++++++++
 diagrams/simplex2.mmd |  26 +++
 diagrams/simplex2.svg | 498 ++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 1030 insertions(+)
 create mode 100644 diagrams/simplex1.mmd
 create mode 100644 diagrams/simplex1.svg
 create mode 100644 diagrams/simplex2.mmd
 create mode 100644 diagrams/simplex2.svg

diff --git a/diagrams/simplex1.mmd b/diagrams/simplex1.mmd
new file mode 100644
index 000000000..d4e9ad3d5
--- /dev/null
+++ b/diagrams/simplex1.mmd
@@ -0,0 +1,8 @@
+graph LR
+  S("sender (key 1)") --> C
+  C --> R("receiver (key 2)")
+  R --> C
+  subgraph connection
+    C{{"verify sender (1) ---> pubsub <---> verify receiver (2)"}}
+  end
+  
\ No newline at end of file
diff --git a/diagrams/simplex1.svg b/diagrams/simplex1.svg
new file mode 100644
index 000000000..3f5cd1f35
--- /dev/null
+++ b/diagrams/simplex1.svg
@@ -0,0 +1,498 @@
+<svg id="mermaid-1577142258919" width="840.203125" xmlns="http://www.w3.org/2000/svg" height="127.75" viewBox="0 0 840.203125 127.75"><style>
+
+
+
+#mermaid-1577142258919 .label {
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  color: #333; }
+
+#mermaid-1577142258919 .label text {
+  fill: #333; }
+
+#mermaid-1577142258919 .node rect,
+#mermaid-1577142258919 .node circle,
+#mermaid-1577142258919 .node ellipse,
+#mermaid-1577142258919 .node polygon {
+  fill: #ECECFF;
+  stroke: #9370DB;
+  stroke-width: 1px; }
+
+#mermaid-1577142258919 .node .label {
+  text-align: center; }
+
+#mermaid-1577142258919 .node.clickable {
+  cursor: pointer; }
+
+#mermaid-1577142258919 .arrowheadPath {
+  fill: #333333; }
+
+#mermaid-1577142258919 .edgePath .path {
+  stroke: #333333;
+  stroke-width: 1.5px; }
+
+#mermaid-1577142258919 .edgeLabel {
+  background-color: #e8e8e8;
+  text-align: center; }
+
+#mermaid-1577142258919 .cluster rect {
+  fill: #ffffde;
+  stroke: #aaaa33;
+  stroke-width: 1px; }
+
+#mermaid-1577142258919 .cluster text {
+  fill: #333; }
+
+#mermaid-1577142258919 div.mermaidTooltip {
+  position: absolute;
+  text-align: center;
+  max-width: 200px;
+  padding: 2px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  font-size: 12px;
+  background: #ffffde;
+  border: 1px solid #aaaa33;
+  border-radius: 2px;
+  pointer-events: none;
+  z-index: 100; }
+
+#mermaid-1577142258919 .actor {
+  stroke: #CCCCFF;
+  fill: #ECECFF; }
+
+#mermaid-1577142258919 text.actor {
+  fill: black;
+  stroke: none; }
+
+#mermaid-1577142258919 .actor-line {
+  stroke: grey; }
+
+#mermaid-1577142258919 .messageLine0 {
+  stroke-width: 1.5;
+  stroke-dasharray: '2 2';
+  stroke: #333; }
+
+#mermaid-1577142258919 .messageLine1 {
+  stroke-width: 1.5;
+  stroke-dasharray: '2 2';
+  stroke: #333; }
+
+#mermaid-1577142258919 #arrowhead {
+  fill: #333; }
+
+#mermaid-1577142258919 .sequenceNumber {
+  fill: white; }
+
+#mermaid-1577142258919 #sequencenumber {
+  fill: #333; }
+
+#mermaid-1577142258919 #crosshead path {
+  fill: #333 !important;
+  stroke: #333 !important; }
+
+#mermaid-1577142258919 .messageText {
+  fill: #333;
+  stroke: none; }
+
+#mermaid-1577142258919 .labelBox {
+  stroke: #CCCCFF;
+  fill: #ECECFF; }
+
+#mermaid-1577142258919 .labelText {
+  fill: black;
+  stroke: none; }
+
+#mermaid-1577142258919 .loopText {
+  fill: black;
+  stroke: none; }
+
+#mermaid-1577142258919 .loopLine {
+  stroke-width: 2;
+  stroke-dasharray: '2 2';
+  stroke: #CCCCFF; }
+
+#mermaid-1577142258919 .note {
+  stroke: #aaaa33;
+  fill: #fff5ad; }
+
+#mermaid-1577142258919 .noteText {
+  fill: black;
+  stroke: none;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  font-size: 14px; }
+
+#mermaid-1577142258919 .activation0 {
+  fill: #f4f4f4;
+  stroke: #666; }
+
+#mermaid-1577142258919 .activation1 {
+  fill: #f4f4f4;
+  stroke: #666; }
+
+#mermaid-1577142258919 .activation2 {
+  fill: #f4f4f4;
+  stroke: #666; }
+
+
+#mermaid-1577142258919 .mermaid-main-font {
+  font-family: "trebuchet ms", verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 .section {
+  stroke: none;
+  opacity: 0.2; }
+
+#mermaid-1577142258919 .section0 {
+  fill: rgba(102, 102, 255, 0.49); }
+
+#mermaid-1577142258919 .section2 {
+  fill: #fff400; }
+
+#mermaid-1577142258919 .section1,
+#mermaid-1577142258919 .section3 {
+  fill: white;
+  opacity: 0.2; }
+
+#mermaid-1577142258919 .sectionTitle0 {
+  fill: #333; }
+
+#mermaid-1577142258919 .sectionTitle1 {
+  fill: #333; }
+
+#mermaid-1577142258919 .sectionTitle2 {
+  fill: #333; }
+
+#mermaid-1577142258919 .sectionTitle3 {
+  fill: #333; }
+
+#mermaid-1577142258919 .sectionTitle {
+  text-anchor: start;
+  font-size: 11px;
+  text-height: 14px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+
+#mermaid-1577142258919 .grid .tick {
+  stroke: lightgrey;
+  opacity: 0.3;
+  shape-rendering: crispEdges; }
+#mermaid-1577142258919   .grid .tick text {
+    font-family: 'trebuchet ms', verdana, arial;
+    font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 .grid path {
+  stroke-width: 0; }
+
+
+#mermaid-1577142258919 .today {
+  fill: none;
+  stroke: red;
+  stroke-width: 2px; }
+
+
+
+#mermaid-1577142258919 .task {
+  stroke-width: 2; }
+
+#mermaid-1577142258919 .taskText {
+  text-anchor: middle;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 .taskText:not([font-size]) {
+  font-size: 11px; }
+
+#mermaid-1577142258919 .taskTextOutsideRight {
+  fill: black;
+  text-anchor: start;
+  font-size: 11px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 .taskTextOutsideLeft {
+  fill: black;
+  text-anchor: end;
+  font-size: 11px; }
+
+
+#mermaid-1577142258919 .task.clickable {
+  cursor: pointer; }
+
+#mermaid-1577142258919 .taskText.clickable {
+  cursor: pointer;
+  fill: #003163 !important;
+  font-weight: bold; }
+
+#mermaid-1577142258919 .taskTextOutsideLeft.clickable {
+  cursor: pointer;
+  fill: #003163 !important;
+  font-weight: bold; }
+
+#mermaid-1577142258919 .taskTextOutsideRight.clickable {
+  cursor: pointer;
+  fill: #003163 !important;
+  font-weight: bold; }
+
+
+#mermaid-1577142258919 .taskText0,
+#mermaid-1577142258919 .taskText1,
+#mermaid-1577142258919 .taskText2,
+#mermaid-1577142258919 .taskText3 {
+  fill: white; }
+
+#mermaid-1577142258919 .task0,
+#mermaid-1577142258919 .task1,
+#mermaid-1577142258919 .task2,
+#mermaid-1577142258919 .task3 {
+  fill: #8a90dd;
+  stroke: #534fbc; }
+
+#mermaid-1577142258919 .taskTextOutside0,
+#mermaid-1577142258919 .taskTextOutside2 {
+  fill: black; }
+
+#mermaid-1577142258919 .taskTextOutside1,
+#mermaid-1577142258919 .taskTextOutside3 {
+  fill: black; }
+
+
+#mermaid-1577142258919 .active0,
+#mermaid-1577142258919 .active1,
+#mermaid-1577142258919 .active2,
+#mermaid-1577142258919 .active3 {
+  fill: #bfc7ff;
+  stroke: #534fbc; }
+
+#mermaid-1577142258919 .activeText0,
+#mermaid-1577142258919 .activeText1,
+#mermaid-1577142258919 .activeText2,
+#mermaid-1577142258919 .activeText3 {
+  fill: black !important; }
+
+
+#mermaid-1577142258919 .done0,
+#mermaid-1577142258919 .done1,
+#mermaid-1577142258919 .done2,
+#mermaid-1577142258919 .done3 {
+  stroke: grey;
+  fill: lightgrey;
+  stroke-width: 2; }
+
+#mermaid-1577142258919 .doneText0,
+#mermaid-1577142258919 .doneText1,
+#mermaid-1577142258919 .doneText2,
+#mermaid-1577142258919 .doneText3 {
+  fill: black !important; }
+
+
+#mermaid-1577142258919 .crit0,
+#mermaid-1577142258919 .crit1,
+#mermaid-1577142258919 .crit2,
+#mermaid-1577142258919 .crit3 {
+  stroke: #ff8888;
+  fill: red;
+  stroke-width: 2; }
+
+#mermaid-1577142258919 .activeCrit0,
+#mermaid-1577142258919 .activeCrit1,
+#mermaid-1577142258919 .activeCrit2,
+#mermaid-1577142258919 .activeCrit3 {
+  stroke: #ff8888;
+  fill: #bfc7ff;
+  stroke-width: 2; }
+
+#mermaid-1577142258919 .doneCrit0,
+#mermaid-1577142258919 .doneCrit1,
+#mermaid-1577142258919 .doneCrit2,
+#mermaid-1577142258919 .doneCrit3 {
+  stroke: #ff8888;
+  fill: lightgrey;
+  stroke-width: 2;
+  cursor: pointer;
+  shape-rendering: crispEdges; }
+
+#mermaid-1577142258919 .milestone {
+  transform: rotate(45deg) scale(0.8, 0.8); }
+
+#mermaid-1577142258919 .milestoneText {
+  font-style: italic; }
+
+#mermaid-1577142258919 .doneCritText0,
+#mermaid-1577142258919 .doneCritText1,
+#mermaid-1577142258919 .doneCritText2,
+#mermaid-1577142258919 .doneCritText3 {
+  fill: black !important; }
+
+#mermaid-1577142258919 .activeCritText0,
+#mermaid-1577142258919 .activeCritText1,
+#mermaid-1577142258919 .activeCritText2,
+#mermaid-1577142258919 .activeCritText3 {
+  fill: black !important; }
+
+#mermaid-1577142258919 .titleText {
+  text-anchor: middle;
+  font-size: 18px;
+  fill: black;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 g.classGroup text {
+  fill: #9370DB;
+  stroke: none;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  font-size: 10px; }
+#mermaid-1577142258919   g.classGroup text .title {
+    font-weight: bolder; }
+
+#mermaid-1577142258919 g.classGroup rect {
+  fill: #ECECFF;
+  stroke: #9370DB; }
+
+#mermaid-1577142258919 g.classGroup line {
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 .classLabel .box {
+  stroke: none;
+  stroke-width: 0;
+  fill: #ECECFF;
+  opacity: 0.5; }
+
+#mermaid-1577142258919 .classLabel .label {
+  fill: #9370DB;
+  font-size: 10px; }
+
+#mermaid-1577142258919 .relation {
+  stroke: #9370DB;
+  stroke-width: 1;
+  fill: none; }
+
+#mermaid-1577142258919 #compositionStart {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 #compositionEnd {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 #aggregationStart {
+  fill: #ECECFF;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 #aggregationEnd {
+  fill: #ECECFF;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 #dependencyStart {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 #dependencyEnd {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 #extensionStart {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 #extensionEnd {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 .commit-id,
+#mermaid-1577142258919 .commit-msg,
+#mermaid-1577142258919 .branch-label {
+  fill: lightgrey;
+  color: lightgrey;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 .pieTitleText {
+  text-anchor: middle;
+  font-size: 25px;
+  fill: black;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 .slice {
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 g.stateGroup text {
+  fill: #9370DB;
+  stroke: none;
+  font-size: 10px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142258919 g.stateGroup text {
+  fill: #9370DB;
+  stroke: none;
+  font-size: 10px; }
+
+#mermaid-1577142258919 g.stateGroup .state-title {
+  font-weight: bolder;
+  fill: black; }
+
+#mermaid-1577142258919 g.stateGroup rect {
+  fill: #ECECFF;
+  stroke: #9370DB; }
+
+#mermaid-1577142258919 g.stateGroup line {
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142258919 .transition {
+  stroke: #9370DB;
+  stroke-width: 1;
+  fill: none; }
+
+#mermaid-1577142258919 .stateGroup .composit {
+  fill: white;
+  border-bottom: 1px; }
+
+#mermaid-1577142258919 .stateGroup .alt-composit {
+  fill: #e0e0e0;
+  border-bottom: 1px; }
+
+#mermaid-1577142258919 .state-note {
+  stroke: #aaaa33;
+  fill: #fff5ad; }
+#mermaid-1577142258919   .state-note text {
+    fill: black;
+    stroke: none;
+    font-size: 10px; }
+
+#mermaid-1577142258919 .stateLabel .box {
+  stroke: none;
+  stroke-width: 0;
+  fill: #ECECFF;
+  opacity: 0.5; }
+
+#mermaid-1577142258919 .stateLabel text {
+  fill: black;
+  font-size: 10px;
+  font-weight: bold;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+:root {
+  --mermaid-font-family: '"trebuchet ms", verdana, arial';
+  --mermaid-font-family: "Comic Sans MS", "Comic Sans", cursive; }
+
+:root { --mermaid-font-family: "trebuchet ms", verdana, arial;}</style><style>#mermaid-1577142258919 {
+    color: rgb(0, 0, 0);
+    font: normal normal 400 normal 16px / normal "trebuchet ms", verdana, arial;
+  }</style><g transform="translate(0, 0)"><g class="output"><g class="clusters"><g class="cluster" id="connection" transform="translate(414.5390625,63.875)" style="opacity: 1;"><rect width="468.515625" height="111.75" x="-234.2578125" y="-55.875"></rect><g class="label" transform="translate(0, -41.875)" id="mermaid-1577142258919Text"><g transform="translate(-39.4375,-9.5)"><foreignObject width="78.875" height="19"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">connection</div></foreignObject></g></g></g></g><g class="edgePaths"><g class="edgePath" style="opacity: 1;"><path class="path" d="M130.28125,65.25L155.28125,65.25L180.28125,65.25L205.78125,65.75" marker-end="url(#arrowhead106563)" style="fill:none"></path><defs><marker id="arrowhead106563" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1; stroke-dasharray: 1, 0;"></path></marker></defs></g><g class="edgePath" style="opacity: 1;"><path class="path" d="M619.9238137755102,57.00387755102041L648.796875,55.25L673.796875,55.25L698.796875,57.97618844777645" marker-end="url(#arrowhead106564)" style="fill:none"></path><defs><marker id="arrowhead106564" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1; stroke-dasharray: 1, 0;"></path></marker></defs></g><g class="edgePath" style="opacity: 1;"><path class="path" d="M698.796875,77.79732492758562L673.796875,82.5L648.796875,82.5L616.8659307753546,80.61188844929075" marker-end="url(#arrowhead106565)" style="fill:none"></path><defs><marker id="arrowhead106565" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1; stroke-dasharray: 1, 0;"></path></marker></defs></g></g><g class="edgeLabels"><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span class="edgeLabel"></span></div></foreignObject></g></g></g><g class="nodes"><g class="node" id="C" transform="translate(414.5390625,65.25)" style="opacity: 1;"><polygon points="9.75,0 408.765625,0 418.515625,-19.5 408.765625,-39 9.75,-39 0,-19.5" transform="translate(-209.2578125,19.5)" class="label-container"></polygon><g class="label" transform="translate(0,0)"><g transform="translate(-189.5078125,-9.5)"><foreignObject width="379.015625" height="19"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">verify sender (1) ---&gt; pubsub &lt;---&gt; verify receiver (2)</div></foreignObject></g></g></g><g class="node" id="S" transform="translate(69.140625,65.25)" style="opacity: 1;"><rect rx="5" ry="5" x="-61.140625" y="-19.5" width="122.28125" height="39" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-51.140625,-9.5)"><foreignObject width="102.28125" height="19"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">sender (key 1)</div></foreignObject></g></g></g><g class="node" id="R" transform="translate(765.5,65.25)" style="opacity: 1;"><rect rx="5" ry="5" x="-66.703125" y="-19.5" width="133.40625" height="39" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-56.703125,-9.5)"><foreignObject width="113.40625" height="19"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">receiver (key 2)</div></foreignObject></g></g></g></g></g></g></svg>
\ No newline at end of file
diff --git a/diagrams/simplex2.mmd b/diagrams/simplex2.mmd
new file mode 100644
index 000000000..47842dab4
--- /dev/null
+++ b/diagrams/simplex2.mmd
@@ -0,0 +1,26 @@
+sequenceDiagram
+  participant S as sender (client)
+  participant A as API
+  participant Q as pubsub
+  participant P as publisher
+  participant R as receiver (client)
+  note over R: sign subscription (1)
+  R ->> P: subscribe to messages
+  note over P: verify subscriber (1)
+  alt subscriber verified?
+    P -->> Q: subscribe
+  else
+    P ->> R: reject subscription
+  end
+  note over S: sign message (2)
+  S ->> A: send message
+  note over A: verify sender (2)
+  alt sender verified?
+    A -->> Q: queue message
+    activate Q
+  else
+    A ->> S: reject message
+  end
+  Q -->> P: take message
+  deactivate Q
+  P ->> R: deliver message
diff --git a/diagrams/simplex2.svg b/diagrams/simplex2.svg
new file mode 100644
index 000000000..55af1592d
--- /dev/null
+++ b/diagrams/simplex2.svg
@@ -0,0 +1,498 @@
+<svg id="mermaid-1577142543534" width="100%" xmlns="http://www.w3.org/2000/svg" height="100%" style="max-width:1050px;" viewBox="-50 -10 1050 735"><style>
+
+
+
+#mermaid-1577142543534 .label {
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  color: #333; }
+
+#mermaid-1577142543534 .label text {
+  fill: #333; }
+
+#mermaid-1577142543534 .node rect,
+#mermaid-1577142543534 .node circle,
+#mermaid-1577142543534 .node ellipse,
+#mermaid-1577142543534 .node polygon {
+  fill: #ECECFF;
+  stroke: #9370DB;
+  stroke-width: 1px; }
+
+#mermaid-1577142543534 .node .label {
+  text-align: center; }
+
+#mermaid-1577142543534 .node.clickable {
+  cursor: pointer; }
+
+#mermaid-1577142543534 .arrowheadPath {
+  fill: #333333; }
+
+#mermaid-1577142543534 .edgePath .path {
+  stroke: #333333;
+  stroke-width: 1.5px; }
+
+#mermaid-1577142543534 .edgeLabel {
+  background-color: #e8e8e8;
+  text-align: center; }
+
+#mermaid-1577142543534 .cluster rect {
+  fill: #ffffde;
+  stroke: #aaaa33;
+  stroke-width: 1px; }
+
+#mermaid-1577142543534 .cluster text {
+  fill: #333; }
+
+#mermaid-1577142543534 div.mermaidTooltip {
+  position: absolute;
+  text-align: center;
+  max-width: 200px;
+  padding: 2px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  font-size: 12px;
+  background: #ffffde;
+  border: 1px solid #aaaa33;
+  border-radius: 2px;
+  pointer-events: none;
+  z-index: 100; }
+
+#mermaid-1577142543534 .actor {
+  stroke: #CCCCFF;
+  fill: #ECECFF; }
+
+#mermaid-1577142543534 text.actor {
+  fill: black;
+  stroke: none; }
+
+#mermaid-1577142543534 .actor-line {
+  stroke: grey; }
+
+#mermaid-1577142543534 .messageLine0 {
+  stroke-width: 1.5;
+  stroke-dasharray: '2 2';
+  stroke: #333; }
+
+#mermaid-1577142543534 .messageLine1 {
+  stroke-width: 1.5;
+  stroke-dasharray: '2 2';
+  stroke: #333; }
+
+#mermaid-1577142543534 #arrowhead {
+  fill: #333; }
+
+#mermaid-1577142543534 .sequenceNumber {
+  fill: white; }
+
+#mermaid-1577142543534 #sequencenumber {
+  fill: #333; }
+
+#mermaid-1577142543534 #crosshead path {
+  fill: #333 !important;
+  stroke: #333 !important; }
+
+#mermaid-1577142543534 .messageText {
+  fill: #333;
+  stroke: none; }
+
+#mermaid-1577142543534 .labelBox {
+  stroke: #CCCCFF;
+  fill: #ECECFF; }
+
+#mermaid-1577142543534 .labelText {
+  fill: black;
+  stroke: none; }
+
+#mermaid-1577142543534 .loopText {
+  fill: black;
+  stroke: none; }
+
+#mermaid-1577142543534 .loopLine {
+  stroke-width: 2;
+  stroke-dasharray: '2 2';
+  stroke: #CCCCFF; }
+
+#mermaid-1577142543534 .note {
+  stroke: #aaaa33;
+  fill: #fff5ad; }
+
+#mermaid-1577142543534 .noteText {
+  fill: black;
+  stroke: none;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  font-size: 14px; }
+
+#mermaid-1577142543534 .activation0 {
+  fill: #f4f4f4;
+  stroke: #666; }
+
+#mermaid-1577142543534 .activation1 {
+  fill: #f4f4f4;
+  stroke: #666; }
+
+#mermaid-1577142543534 .activation2 {
+  fill: #f4f4f4;
+  stroke: #666; }
+
+
+#mermaid-1577142543534 .mermaid-main-font {
+  font-family: "trebuchet ms", verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 .section {
+  stroke: none;
+  opacity: 0.2; }
+
+#mermaid-1577142543534 .section0 {
+  fill: rgba(102, 102, 255, 0.49); }
+
+#mermaid-1577142543534 .section2 {
+  fill: #fff400; }
+
+#mermaid-1577142543534 .section1,
+#mermaid-1577142543534 .section3 {
+  fill: white;
+  opacity: 0.2; }
+
+#mermaid-1577142543534 .sectionTitle0 {
+  fill: #333; }
+
+#mermaid-1577142543534 .sectionTitle1 {
+  fill: #333; }
+
+#mermaid-1577142543534 .sectionTitle2 {
+  fill: #333; }
+
+#mermaid-1577142543534 .sectionTitle3 {
+  fill: #333; }
+
+#mermaid-1577142543534 .sectionTitle {
+  text-anchor: start;
+  font-size: 11px;
+  text-height: 14px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+
+#mermaid-1577142543534 .grid .tick {
+  stroke: lightgrey;
+  opacity: 0.3;
+  shape-rendering: crispEdges; }
+#mermaid-1577142543534   .grid .tick text {
+    font-family: 'trebuchet ms', verdana, arial;
+    font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 .grid path {
+  stroke-width: 0; }
+
+
+#mermaid-1577142543534 .today {
+  fill: none;
+  stroke: red;
+  stroke-width: 2px; }
+
+
+
+#mermaid-1577142543534 .task {
+  stroke-width: 2; }
+
+#mermaid-1577142543534 .taskText {
+  text-anchor: middle;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 .taskText:not([font-size]) {
+  font-size: 11px; }
+
+#mermaid-1577142543534 .taskTextOutsideRight {
+  fill: black;
+  text-anchor: start;
+  font-size: 11px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 .taskTextOutsideLeft {
+  fill: black;
+  text-anchor: end;
+  font-size: 11px; }
+
+
+#mermaid-1577142543534 .task.clickable {
+  cursor: pointer; }
+
+#mermaid-1577142543534 .taskText.clickable {
+  cursor: pointer;
+  fill: #003163 !important;
+  font-weight: bold; }
+
+#mermaid-1577142543534 .taskTextOutsideLeft.clickable {
+  cursor: pointer;
+  fill: #003163 !important;
+  font-weight: bold; }
+
+#mermaid-1577142543534 .taskTextOutsideRight.clickable {
+  cursor: pointer;
+  fill: #003163 !important;
+  font-weight: bold; }
+
+
+#mermaid-1577142543534 .taskText0,
+#mermaid-1577142543534 .taskText1,
+#mermaid-1577142543534 .taskText2,
+#mermaid-1577142543534 .taskText3 {
+  fill: white; }
+
+#mermaid-1577142543534 .task0,
+#mermaid-1577142543534 .task1,
+#mermaid-1577142543534 .task2,
+#mermaid-1577142543534 .task3 {
+  fill: #8a90dd;
+  stroke: #534fbc; }
+
+#mermaid-1577142543534 .taskTextOutside0,
+#mermaid-1577142543534 .taskTextOutside2 {
+  fill: black; }
+
+#mermaid-1577142543534 .taskTextOutside1,
+#mermaid-1577142543534 .taskTextOutside3 {
+  fill: black; }
+
+
+#mermaid-1577142543534 .active0,
+#mermaid-1577142543534 .active1,
+#mermaid-1577142543534 .active2,
+#mermaid-1577142543534 .active3 {
+  fill: #bfc7ff;
+  stroke: #534fbc; }
+
+#mermaid-1577142543534 .activeText0,
+#mermaid-1577142543534 .activeText1,
+#mermaid-1577142543534 .activeText2,
+#mermaid-1577142543534 .activeText3 {
+  fill: black !important; }
+
+
+#mermaid-1577142543534 .done0,
+#mermaid-1577142543534 .done1,
+#mermaid-1577142543534 .done2,
+#mermaid-1577142543534 .done3 {
+  stroke: grey;
+  fill: lightgrey;
+  stroke-width: 2; }
+
+#mermaid-1577142543534 .doneText0,
+#mermaid-1577142543534 .doneText1,
+#mermaid-1577142543534 .doneText2,
+#mermaid-1577142543534 .doneText3 {
+  fill: black !important; }
+
+
+#mermaid-1577142543534 .crit0,
+#mermaid-1577142543534 .crit1,
+#mermaid-1577142543534 .crit2,
+#mermaid-1577142543534 .crit3 {
+  stroke: #ff8888;
+  fill: red;
+  stroke-width: 2; }
+
+#mermaid-1577142543534 .activeCrit0,
+#mermaid-1577142543534 .activeCrit1,
+#mermaid-1577142543534 .activeCrit2,
+#mermaid-1577142543534 .activeCrit3 {
+  stroke: #ff8888;
+  fill: #bfc7ff;
+  stroke-width: 2; }
+
+#mermaid-1577142543534 .doneCrit0,
+#mermaid-1577142543534 .doneCrit1,
+#mermaid-1577142543534 .doneCrit2,
+#mermaid-1577142543534 .doneCrit3 {
+  stroke: #ff8888;
+  fill: lightgrey;
+  stroke-width: 2;
+  cursor: pointer;
+  shape-rendering: crispEdges; }
+
+#mermaid-1577142543534 .milestone {
+  transform: rotate(45deg) scale(0.8, 0.8); }
+
+#mermaid-1577142543534 .milestoneText {
+  font-style: italic; }
+
+#mermaid-1577142543534 .doneCritText0,
+#mermaid-1577142543534 .doneCritText1,
+#mermaid-1577142543534 .doneCritText2,
+#mermaid-1577142543534 .doneCritText3 {
+  fill: black !important; }
+
+#mermaid-1577142543534 .activeCritText0,
+#mermaid-1577142543534 .activeCritText1,
+#mermaid-1577142543534 .activeCritText2,
+#mermaid-1577142543534 .activeCritText3 {
+  fill: black !important; }
+
+#mermaid-1577142543534 .titleText {
+  text-anchor: middle;
+  font-size: 18px;
+  fill: black;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 g.classGroup text {
+  fill: #9370DB;
+  stroke: none;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family);
+  font-size: 10px; }
+#mermaid-1577142543534   g.classGroup text .title {
+    font-weight: bolder; }
+
+#mermaid-1577142543534 g.classGroup rect {
+  fill: #ECECFF;
+  stroke: #9370DB; }
+
+#mermaid-1577142543534 g.classGroup line {
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 .classLabel .box {
+  stroke: none;
+  stroke-width: 0;
+  fill: #ECECFF;
+  opacity: 0.5; }
+
+#mermaid-1577142543534 .classLabel .label {
+  fill: #9370DB;
+  font-size: 10px; }
+
+#mermaid-1577142543534 .relation {
+  stroke: #9370DB;
+  stroke-width: 1;
+  fill: none; }
+
+#mermaid-1577142543534 #compositionStart {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 #compositionEnd {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 #aggregationStart {
+  fill: #ECECFF;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 #aggregationEnd {
+  fill: #ECECFF;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 #dependencyStart {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 #dependencyEnd {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 #extensionStart {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 #extensionEnd {
+  fill: #9370DB;
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 .commit-id,
+#mermaid-1577142543534 .commit-msg,
+#mermaid-1577142543534 .branch-label {
+  fill: lightgrey;
+  color: lightgrey;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 .pieTitleText {
+  text-anchor: middle;
+  font-size: 25px;
+  fill: black;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 .slice {
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 g.stateGroup text {
+  fill: #9370DB;
+  stroke: none;
+  font-size: 10px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+#mermaid-1577142543534 g.stateGroup text {
+  fill: #9370DB;
+  stroke: none;
+  font-size: 10px; }
+
+#mermaid-1577142543534 g.stateGroup .state-title {
+  font-weight: bolder;
+  fill: black; }
+
+#mermaid-1577142543534 g.stateGroup rect {
+  fill: #ECECFF;
+  stroke: #9370DB; }
+
+#mermaid-1577142543534 g.stateGroup line {
+  stroke: #9370DB;
+  stroke-width: 1; }
+
+#mermaid-1577142543534 .transition {
+  stroke: #9370DB;
+  stroke-width: 1;
+  fill: none; }
+
+#mermaid-1577142543534 .stateGroup .composit {
+  fill: white;
+  border-bottom: 1px; }
+
+#mermaid-1577142543534 .stateGroup .alt-composit {
+  fill: #e0e0e0;
+  border-bottom: 1px; }
+
+#mermaid-1577142543534 .state-note {
+  stroke: #aaaa33;
+  fill: #fff5ad; }
+#mermaid-1577142543534   .state-note text {
+    fill: black;
+    stroke: none;
+    font-size: 10px; }
+
+#mermaid-1577142543534 .stateLabel .box {
+  stroke: none;
+  stroke-width: 0;
+  fill: #ECECFF;
+  opacity: 0.5; }
+
+#mermaid-1577142543534 .stateLabel text {
+  fill: black;
+  font-size: 10px;
+  font-weight: bold;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-family: var(--mermaid-font-family); }
+
+:root {
+  --mermaid-font-family: '"trebuchet ms", verdana, arial';
+  --mermaid-font-family: "Comic Sans MS", "Comic Sans", cursive; }
+
+:root { --mermaid-font-family: "trebuchet ms", verdana, arial;}</style><style>#mermaid-1577142543534 {
+    color: rgb(0, 0, 0);
+    font: normal normal 400 normal 16px / normal "trebuchet ms", verdana, arial;
+  }</style><g></g><g><line id="actor9781" x1="75" y1="5" x2="75" y2="724" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="0" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="75" dy="0">sender (client)</tspan></text></g><g><line id="actor9782" x1="275" y1="5" x2="275" y2="724" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="200" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="275" dy="0">API</tspan></text></g><g><line id="actor9783" x1="475" y1="5" x2="475" y2="724" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="400" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="475" dy="0">pubsub</tspan></text></g><g><line id="actor9784" x1="675" y1="5" x2="675" y2="724" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="600" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="675" dy="0">publisher</tspan></text></g><g><line id="actor9785" x1="875" y1="5" x2="875" y2="724" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="800" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="875" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="875" dy="0">receiver (client)</tspan></text></g><defs><marker id="arrowhead" refX="5" refY="2" markerWidth="6" markerHeight="4" orient="auto"><path d="M 0,0 V 4 L6,2 Z"></path></marker></defs><defs><marker id="crosshead" markerWidth="15" markerHeight="8" orient="auto" refX="16" refY="4"><path fill="black" stroke="#000000" stroke-width="1px" d="M 9,2 V 6 L16,4 Z" style="stroke-dasharray: 0, 0;"></path><path fill="none" stroke="#000000" stroke-width="1px" d="M 0,1 L 6,7 M 6,1 L 0,7" style="stroke-dasharray: 0, 0;"></path></marker></defs><defs><marker id="sequencenumber" refX="15" refY="15" markerWidth="60" markerHeight="40" orient="auto"><circle cx="15" cy="15" r="6"></circle></marker></defs><g><rect x="800" y="75" fill="#EDF2AE" stroke="#666" width="150" height="36" rx="0" ry="0" class="note"></rect><text x="796" y="99" class="noteText"><tspan x="816">sign subscription (1)</tspan></text></g><g><text x="775" y="139" class="messageText" style="text-anchor: middle;">subscribe to messages</text><line x1="875" y1="146" x2="675" y2="146" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="600" y="156" fill="#EDF2AE" stroke="#666" width="150" height="36" rx="0" ry="0" class="note"></rect><text x="596" y="180" class="noteText"><tspan x="616">verify subscriber (1)</tspan></text></g><g><text x="575" y="245" class="messageText" style="text-anchor: middle;">subscribe</text><line x1="675" y1="252" x2="475" y2="252" class="messageLine1" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="stroke-dasharray: 3, 3; fill: none;"></line></g><g><text x="775" y="300" class="messageText" style="text-anchor: middle;">reject subscription</text><line x1="675" y1="307" x2="875" y2="307" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><line x1="465" y1="202" x2="885" y2="202" class="loopLine"></line><line x1="885" y1="202" x2="885" y2="317" class="loopLine"></line><line x1="465" y1="317" x2="885" y2="317" class="loopLine"></line><line x1="465" y1="202" x2="465" y2="317" class="loopLine"></line><line x1="465" y1="262" x2="885" y2="262" class="loopLine" style="stroke-dasharray: 3, 3;"></line><polygon points="465,202 515,202 515,215 506.6,222 465,222" class="labelBox"></polygon><text x="472.5" y="217" class="labelText"><tspan x="472.5">alt</tspan></text><text x="675" y="217" class="loopText" style="text-anchor: middle;"><tspan x="675">[ subscriber verified? ]</tspan></text></g><g><rect x="0" y="327" fill="#EDF2AE" stroke="#666" width="150" height="36" rx="0" ry="0" class="note"></rect><text x="-4" y="351" class="noteText"><tspan x="16">sign message (2)</tspan></text></g><g><text x="175" y="391" class="messageText" style="text-anchor: middle;">send message</text><line x1="75" y1="398" x2="275" y2="398" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="200" y="408" fill="#EDF2AE" stroke="#666" width="150" height="36" rx="0" ry="0" class="note"></rect><text x="196" y="432" class="noteText"><tspan x="216">verify sender (2)</tspan></text></g><g><text x="375" y="497" class="messageText" style="text-anchor: middle;">queue message</text><line x1="275" y1="504" x2="475" y2="504" class="messageLine1" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="stroke-dasharray: 3, 3; fill: none;"></line></g><g><rect x="470" y="506" fill="#EDF2AE" stroke="#666" width="10" height="98" rx="0" ry="0" class="activation0"></rect></g><g><text x="175" y="552" class="messageText" style="text-anchor: middle;">reject message</text><line x1="275" y1="559" x2="75" y2="559" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><line x1="65" y1="454" x2="485" y2="454" class="loopLine"></line><line x1="485" y1="454" x2="485" y2="569" class="loopLine"></line><line x1="65" y1="569" x2="485" y2="569" class="loopLine"></line><line x1="65" y1="454" x2="65" y2="569" class="loopLine"></line><line x1="65" y1="514" x2="485" y2="514" class="loopLine" style="stroke-dasharray: 3, 3;"></line><polygon points="65,454 115,454 115,467 106.6,474 65,474" class="labelBox"></polygon><text x="72.5" y="469" class="labelText"><tspan x="72.5">alt</tspan></text><text x="275" y="469" class="loopText" style="text-anchor: middle;"><tspan x="275">[ sender verified? ]</tspan></text></g><g><text x="577.5" y="597" class="messageText" style="text-anchor: middle;">take message</text><line x1="480" y1="604" x2="675" y2="604" class="messageLine1" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="stroke-dasharray: 3, 3; fill: none;"></line></g><g><text x="775" y="632" class="messageText" style="text-anchor: middle;">deliver message</text><line x1="675" y1="639" x2="875" y2="639" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="0" y="659" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="691.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="75" dy="0">sender (client)</tspan></text></g><g><rect x="200" y="659" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="691.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="275" dy="0">API</tspan></text></g><g><rect x="400" y="659" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="691.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="475" dy="0">pubsub</tspan></text></g><g><rect x="600" y="659" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="691.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="675" dy="0">publisher</tspan></text></g><g><rect x="800" y="659" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="875" y="691.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="875" dy="0">receiver (client)</tspan></text></g></svg>
\ No newline at end of file