-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathstructs.sh.drawio
More file actions
94 lines (94 loc) · 9.7 KB
/
structs.sh.drawio
File metadata and controls
94 lines (94 loc) · 9.7 KB
1
2
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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<mxfile host="app.diagrams.net" modified="2021-03-12T00:45:11.538Z" agent="5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.182 Safari/537.36" etag="jIZOjyseRGiVYcXXdNzP" version="14.4.7" type="github">
<diagram id="XLOuRtN34n5Z5yokZOCO" name="Page-1">
<mxGraphModel dx="2064" dy="1180" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100" math="0" shadow="0">
<root>
<mxCell id="0" />
<mxCell id="1" parent="0" />
<mxCell id="99zXDO54VEeCHQZNWTri-1" value="C codebase:<br><ul><li style="text-align: left"><br></li></ul>" style="whiteSpace=wrap;html=1;aspect=fixed;" vertex="1" parent="1">
<mxGeometry x="-110" y="520" width="150" height="150" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-4" value="<b>MongoDB Instance:</b><br><ul><li style="text-align: left">User profile&nbsp;</li><li style="text-align: left">State of the data structures the user has built (from this, we should be able to reconstruct the data structure they left off on)</li></ul>" style="shape=datastore;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="110" y="120" width="310" height="210" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-8" value="" style="strokeWidth=1;shadow=0;dashed=0;align=center;html=1;shape=mxgraph.mockup.containers.browserWindow;rSize=0;strokeColor=#666666;strokeColor2=#008cff;strokeColor3=#c4c4c4;mainText=,;recursiveResize=0;" vertex="1" parent="1">
<mxGeometry x="880" y="330" width="550" height="380" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-9" value="Page 1" style="strokeWidth=1;shadow=0;dashed=0;align=center;html=1;shape=mxgraph.mockup.containers.anchor;fontSize=17;fontColor=#666666;align=left;" vertex="1" parent="99zXDO54VEeCHQZNWTri-8">
<mxGeometry x="60" y="12" width="110" height="26" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-10" value="https://www.structs.sh/ds/linked-list" style="strokeWidth=1;shadow=0;dashed=0;align=center;html=1;shape=mxgraph.mockup.containers.anchor;rSize=0;fontSize=17;fontColor=#666666;align=left;" vertex="1" parent="99zXDO54VEeCHQZNWTri-8">
<mxGeometry x="130" y="60" width="390" height="30" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-5" value="Add Node" style="strokeWidth=1;shadow=0;dashed=0;align=center;html=1;shape=mxgraph.mockup.buttons.button;strokeColor=#666666;fontColor=#ffffff;mainText=;buttonStyle=round;fontSize=17;fontStyle=1;fillColor=#008cff;whiteSpace=wrap;" vertex="1" parent="99zXDO54VEeCHQZNWTri-8">
<mxGeometry x="30" y="140" width="100" height="30" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-6" value="Other Functions..." style="strokeWidth=1;shadow=0;dashed=0;align=center;html=1;shape=mxgraph.mockup.buttons.button;strokeColor=#666666;fontColor=#ffffff;mainText=;buttonStyle=round;fontSize=17;fontStyle=1;fillColor=#008cff;whiteSpace=wrap;" vertex="1" parent="99zXDO54VEeCHQZNWTri-8">
<mxGeometry x="150" y="140" width="180" height="30" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-11" value="12" style="ellipse;whiteSpace=wrap;html=1;aspect=fixed;" vertex="1" parent="99zXDO54VEeCHQZNWTri-8">
<mxGeometry x="70" y="220" width="80" height="80" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-13" value="" style="endArrow=classic;html=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;" edge="1" parent="99zXDO54VEeCHQZNWTri-8" source="99zXDO54VEeCHQZNWTri-11" target="99zXDO54VEeCHQZNWTri-14">
<mxGeometry width="50" height="50" relative="1" as="geometry">
<mxPoint x="180" y="290" as="sourcePoint" />
<mxPoint x="230" y="240" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-14" value="15" style="ellipse;whiteSpace=wrap;html=1;aspect=fixed;" vertex="1" parent="99zXDO54VEeCHQZNWTri-8">
<mxGeometry x="190" y="220" width="80" height="80" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-16" value="<div style="text-align: left"><span>1. Suppose the user clicks 'Add Node' with a value of 20.</span></div><div style="text-align: left">2. An HTTP request is made to our Express.js server to an endpoint that might look like:<br>&nbsp; &nbsp; &nbsp; <b>POST /api/ds/linked_list</b></div>" style="rounded=1;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="770" y="170" width="340" height="80" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-17" value="" style="endArrow=classic;html=1;exitX=0.288;exitY=0.039;exitDx=0;exitDy=0;exitPerimeter=0;" edge="1" parent="1" source="99zXDO54VEeCHQZNWTri-5" target="99zXDO54VEeCHQZNWTri-16">
<mxGeometry width="50" height="50" relative="1" as="geometry">
<mxPoint x="860" y="390" as="sourcePoint" />
<mxPoint x="910" y="340" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-18" value="" style="endArrow=classic;html=1;exitX=0.998;exitY=0.303;exitDx=0;exitDy=0;exitPerimeter=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;" edge="1" parent="1" source="99zXDO54VEeCHQZNWTri-8" target="99zXDO54VEeCHQZNWTri-19">
<mxGeometry width="50" height="50" relative="1" as="geometry">
<mxPoint x="1470.0000000000002" y="451.1700000000001" as="sourcePoint" />
<mxPoint x="1530" y="440" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-19" value="Our frontend, built with React plus a bunch of other Javascript/CSS libraries for:<br><ul><li style="text-align: left">Animations</li><li style="text-align: left">Vector graphics</li><li style="text-align: left">Audio</li><li style="text-align: left">Component styling (eg. Material UI)</li></ul>" style="rounded=1;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="1490" y="380" width="320" height="120" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-20" value="Express server:<br><ul><li style="text-align: left"><br></li></ul>" style="whiteSpace=wrap;html=1;aspect=fixed;" vertex="1" parent="1">
<mxGeometry x="190" y="520" width="150" height="150" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-21" value="" style="endArrow=none;html=1;" edge="1" parent="1">
<mxGeometry width="50" height="50" relative="1" as="geometry">
<mxPoint x="740" y="910" as="sourcePoint" />
<mxPoint x="740" y="40" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-22" value="<font style="font-size: 32px">Backend</font>" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="1">
<mxGeometry x="590" y="50" width="110" height="20" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-23" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;exitX=0.5;exitY=1;exitDx=0;exitDy=0;" edge="1" parent="1" source="99zXDO54VEeCHQZNWTri-22" target="99zXDO54VEeCHQZNWTri-22">
<mxGeometry relative="1" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-24" value="<font style="font-size: 32px">Frontend<br></font>" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="1">
<mxGeometry x="780" y="45" width="110" height="30" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-25" value="" style="endArrow=classic;html=1;exitX=0;exitY=0.5;exitDx=0;exitDy=0;entryX=1;entryY=0.5;entryDx=0;entryDy=0;" edge="1" parent="1" source="99zXDO54VEeCHQZNWTri-16" target="99zXDO54VEeCHQZNWTri-26">
<mxGeometry width="50" height="50" relative="1" as="geometry">
<mxPoint x="650" y="320" as="sourcePoint" />
<mxPoint x="700" y="270" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-28" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1" source="99zXDO54VEeCHQZNWTri-26" target="99zXDO54VEeCHQZNWTri-20">
<mxGeometry relative="1" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-29" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;entryX=0.5;entryY=1;entryDx=0;entryDy=0;" edge="1" parent="1" source="99zXDO54VEeCHQZNWTri-26" target="99zXDO54VEeCHQZNWTri-4">
<mxGeometry relative="1" as="geometry" />
</mxCell>
<mxCell id="99zXDO54VEeCHQZNWTri-26" value="The Express.js server processes this 'add node' request by<br><br>3. Fetching the JSON for the user's current data structure state from the database&nbsp;<br>4. Passes that JSON to the C/C++ server for processing" style="rounded=1;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="90" y="375" width="350" height="100" as="geometry" />
</mxCell>
</root>
</mxGraphModel>
</diagram>
</mxfile>