UML Diagram.svg

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="832px" height="1071px" viewBox="-0.5 -0.5 832 1071" content="&lt;mxfile host=&quot;app.diagrams.net&quot; modified=&quot;2021-08-02T18:28:59.678Z&quot; agent=&quot;5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.164 Safari/537.36&quot; etag=&quot;wefl9fT9Dpjf0MBZyzjO&quot; version=&quot;14.9.3&quot;&gt;&lt;diagram id=&quot;lGCVuUl4PbGJVv6rN0aE&quot; name=&quot;Page-1&quot;&gt;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&lt;/diagram&gt;&lt;/mxfile&gt;" style="background-color: rgb(255, 255, 255);"><defs/><g><rect x="440" y="40" width="390" height="1030" fill-opacity="0.6" fill="#f5f5f5" stroke="#666666" stroke-opacity="0.6" stroke-dasharray="3 3" pointer-events="all"/><rect x="470" y="100" width="340" height="620" fill-opacity="0.6" fill="#ffffff" stroke="#000000" stroke-opacity="0.6" stroke-dasharray="3 3" pointer-events="all"/><rect x="470" y="860" width="340" height="180" fill-opacity="0.6" fill="#ffffff" stroke="#000000" stroke-opacity="0.6" stroke-dasharray="3 3" pointer-events="all"/><rect x="0" y="40" width="370" height="660" fill-opacity="0.6" fill="#f5f5f5" stroke="#000000" stroke-opacity="0.6" stroke-dasharray="3 3" pointer-events="all"/><ellipse cx="405" cy="7.5" rx="7.500000000000001" ry="7.500000000000001" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 405 15 L 405 40 M 405 20 L 390 20 M 405 20 L 420 20 M 405 40 L 390 60 M 405 40 L 420 60" fill="none" stroke="#6c8ebf" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 67px; margin-left: 405px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; "><font face="Verdana" style="font-size: 16px">User</font></div></div></div></foreignObject><text x="405" y="79" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">User</text></switch></g><rect x="10" y="370" width="120" height="60" rx="9" ry="9" fill="#fff2cc" stroke="#d6b656" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 400px; margin-left: 11px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana" style="font-size: 16px">Content</font></div></div></div></foreignObject><text x="70" y="404" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Content</text></switch></g><rect x="240" y="250" width="120" height="60" rx="9" ry="9" fill="#fff2cc" stroke="#d6b656" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 280px; margin-left: 241px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 16px">Popup</span></font></div></div></div></foreignObject><text x="300" y="284" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Popup</text></switch></g><rect x="120" y="610" width="120" height="60" rx="9" ry="9" fill="#fff2cc" stroke="#d6b656" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 640px; margin-left: 121px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 16px">Background</span></font></div></div></div></foreignObject><text x="180" y="644" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Background</text></switch></g><path d="M 605 915 C 569 915 560 950 588.8 957 C 560 972.4 592.4 1006 615.8 992 C 632 1020 686 1020 704 992 C 740 992 740 964 717.5 950 C 740 922 704 894 672.5 908 C 650 887 614 887 605 915 Z" fill="#dae8fc" stroke="#6c8ebf" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 178px; height: 1px; padding-top: 950px; margin-left: 561px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 16px">Socket<br />Server</span></font></div></div></div></foreignObject><text x="650" y="954" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Socket...</text></switch></g><ellipse cx="180" cy="150" rx="60.00000000000001" ry="40" fill="#fff2cc" stroke="#d6b656" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 150px; margin-left: 121px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 16px">Chrome<br />Browser<br /></span></font></div></div></div></foreignObject><text x="180" y="154" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Chrome...</text></switch></g><ellipse cx="640" cy="150" rx="60.00000000000001" ry="40" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 150px; margin-left: 581px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font style="font-size: 16px" face="Verdana">PWA</font></div></div></div></foreignObject><text x="640" y="154" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">PWA</text></switch></g><path d="M 545 320 L 600 370 L 545 420 L 490 370 Z" fill="#d5e8d4" stroke="#82b366" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 108px; height: 1px; padding-top: 370px; margin-left: 491px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 16px">Validate</span></font></div></div></div></foreignObject><text x="545" y="374" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Validate</text></switch></g><rect x="680" y="340" width="100" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 98px; height: 1px; padding-top: 370px; margin-left: 681px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font style="font-size: 16px" face="Verdana">Error</font></div></div></div></foreignObject><text x="730" y="374" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Error</text></switch></g><rect x="670" y="492.5" width="120" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 523px; margin-left: 671px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana" style="font-size: 16px">Remote</font></div></div></div></foreignObject><text x="730" y="526" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Remote</text></switch></g><path d="M 370 40 L 245.42 116.66" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 240.95 119.41 L 245.08 112.76 L 245.42 116.66 L 248.75 118.73 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 440 40 L 584.23 107.31" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 588.99 109.53 L 581.16 109.74 L 584.23 107.31 L 584.12 103.4 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 222.43 178.28 L 285.3 235.71" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 289.17 239.25 L 281.65 237.11 L 285.3 235.71 L 286.37 231.94 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 160.22 187.76 L 72.95 354.36" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 70.52 359.01 L 70.67 351.18 L 72.95 354.36 L 76.87 354.43 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 180 190 L 209.54 593.65" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 209.92 598.88 L 205.92 592.16 L 209.54 593.65 L 212.9 591.65 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 240 600 L 298.67 326.23" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 299.77 321.09 L 301.72 328.67 L 298.67 326.23 L 294.88 327.2 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 245.25 672.6 L 577.12 900.21" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 240.92 669.63 L 248.67 670.71 L 245.25 672.6 L 244.72 676.48 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 581.45 903.18 L 573.7 902.11 L 577.12 900.21 L 577.66 896.34 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 360 280 L 600.43 190.46" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 605.35 188.63 L 600.01 194.35 L 600.43 190.46 L 597.57 187.79 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 612.76 187.44 L 562.35 314.08" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 560.41 318.96 L 559.75 311.16 L 562.35 314.08 L 566.25 313.75 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 600 370 L 663.63 370" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 668.88 370 L 661.88 373.5 L 663.63 370 L 661.88 366.5 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 730 340 L 691.64 196.15" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 690.29 191.08 L 695.47 196.94 L 691.64 196.15 L 688.71 198.75 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 690.77 883.68 L 729.23 566.32" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 690.13 888.89 L 687.5 881.52 L 690.77 883.68 L 694.45 882.36 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 729.87 561.11 L 732.5 568.48 L 729.23 566.32 L 725.55 567.64 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><rect x="140" y="70" width="90" height="20" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 80px; margin-left: 185px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; "><font style="font-size: 16px" face="Verdana">Extension</font></div></div></div></foreignObject><text x="185" y="84" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Extension</text></switch></g><rect x="605" y="70" width="70" height="20" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 80px; margin-left: 640px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; "><font face="Verdana" style="font-size: 16px">Server</font></div></div></div></foreignObject><text x="640" y="84" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Server</text></switch></g><rect x="285" y="90" width="65" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 63px; height: 1px; padding-top: 105px; margin-left: 286px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">1. Browser  opened</span></font></div></div></div></foreignObject><text x="318" y="109" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">1. Browser...</text></switch></g><rect x="270" y="492.5" width="90" height="50" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 518px; margin-left: 271px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">3. QR Code <br />Generated <br />and Displayed</span></font></div></div></div></foreignObject><text x="315" y="521" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">3. QR Code...</text></switch></g><rect x="480" y="170" width="60" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 58px; height: 1px; padding-top: 185px; margin-left: 481px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">5. QR Code Scanned</span></font></div></div></div></foreignObject><text x="510" y="189" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">5. QR Code...</text></switch></g><rect x="450" y="65" width="60" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 58px; height: 1px; padding-top: 80px; margin-left: 451px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">4. PWA opened</span></font></div></div></div></foreignObject><text x="480" y="84" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">4. PWA ope...</text></switch></g><path d="M 551.2 436.25 L 635.45 874.52" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 550.21 431.1 L 554.97 437.31 L 551.2 436.25 L 548.1 438.63 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 636.44 879.68 L 631.68 873.46 L 635.45 874.52 L 638.56 872.14 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><rect x="270" y="780" width="120" height="40" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 800px; margin-left: 271px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana" style="font-size: 10px">2. Socket Created and Communication initiated</font></div></div></div></foreignObject><text x="330" y="804" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">2. Socket Created an...</text></switch></g><rect x="490" y="600" width="90" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 615px; margin-left: 491px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">6. Validation</span></font></div></div></div></foreignObject><text x="535" y="619" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">6. Validation</text></switch></g><rect x="700" y="770" width="90" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 785px; margin-left: 701px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">7. Connection<br />Established<br /></span></font></div></div></div></foreignObject><text x="745" y="789" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">7. Connection...</text></switch></g><rect x="620" y="430" width="50" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 445px; margin-left: 621px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">True</span></font></div></div></div></foreignObject><text x="645" y="449" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">True</text></switch></g><rect x="620" y="340" width="50" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 355px; margin-left: 621px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">False</span></font></div></div></div></foreignObject><text x="645" y="359" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">False</text></switch></g><rect x="710" y="240" width="50" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 255px; margin-left: 711px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana"><span style="font-size: 10px">Retry</span></font></div></div></div></foreignObject><text x="735" y="259" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Retry</text></switch></g><path d="M 761.35 568.12 Q 840 1040 665 1045 Q 490 1050 265 870 Q 40 690 40 448.24" fill="none" stroke="#007fff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 760.37 562.21 L 765.63 569.44 L 761.35 568.12 L 757.74 570.75 Z" fill="#007fff" stroke="#007fff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/><path d="M 40 442.24 L 44 450.24 L 40 448.24 L 36 450.24 Z" fill="#007fff" stroke="#007fff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/><rect x="180" y="890" width="120" height="40" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 910px; margin-left: 181px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><font face="Verdana" color="#007fff" style="font-size: 14px">Resulting Connection Path</font></div></div></div></foreignObject><text x="240" y="914" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Resulting Connection...</text></switch></g><path d="M 600 370 L 619.86 370 Q 629.86 370 629.86 380 L 629.86 510 Q 629.86 520 639.86 520 L 653.63 520" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 658.88 520 L 651.88 523.5 L 653.63 520 L 651.88 516.5 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 128.07 593.93 L 80.93 446.07" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 129.66 598.93 L 124.2 593.33 L 128.07 593.93 L 130.87 591.2 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><path d="M 79.34 441.07 L 84.8 446.67 L 80.93 446.07 L 78.13 448.8 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 520px; margin-left: 105px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; background-color: #ffffff; white-space: nowrap; "><font face="Verdana" style="font-size: 10px">Internal<br />Communication</font></div></div></div></foreignObject><text x="105" y="524" fill="#000000" font-family="Helvetica" font-size="11px" text-anchor="middle">Internal...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Viewer does not support full SVG 1.1</text></a></switch></svg>