Skip to content

Commit

Permalink
kyle's high level draft pt 1
Browse files Browse the repository at this point in the history
  • Loading branch information
@kek20009
kek20009 committed Oct 23, 2024
1 parent b4b98e4 commit dd2cad7
Showing 1 changed file with 210 additions and 0 deletions.
210 changes: 210 additions & 0 deletions hld-01-.drawio
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,210 @@
<mxfile host="65bd71144e">
<diagram id="9vSqKRrPFCf_6qJthSVX" name="Page-1">
<mxGraphModel dx="1158" dy="742" 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="15" value="" style="whiteSpace=wrap;html=1;fillColor=none;" parent="1" vertex="1">
<mxGeometry x="60" y="30" width="720" height="600" as="geometry"/>
</mxCell>
<mxCell id="2" value="Frontend&amp;nbsp;" style="whiteSpace=wrap;html=1;" parent="1" vertex="1">
<mxGeometry x="220" y="145" width="230" height="170" as="geometry"/>
</mxCell>
<mxCell id="5" value="" style="edgeStyle=none;html=1;exitX=0.211;exitY=1.041;exitDx=0;exitDy=0;exitPerimeter=0;" parent="1" source="18" target="4" edge="1">
<mxGeometry relative="1" as="geometry"/>
</mxCell>
<mxCell id="40" value="CALL TO FLASK&lt;br&gt;&lt;span style=&quot;background-color: rgb(42, 37, 47);&quot;&gt;Flask interaction SQLite&lt;/span&gt;" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=10;" vertex="1" connectable="0" parent="5">
<mxGeometry x="-0.561" y="1" relative="1" as="geometry">
<mxPoint as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="6" value="" style="edgeStyle=none;html=1;exitX=0.25;exitY=0;exitDx=0;exitDy=0;entryX=0.25;entryY=1;entryDx=0;entryDy=0;" parent="1" source="3" target="2" edge="1">
<mxGeometry relative="1" as="geometry">
<Array as="points"/>
</mxGeometry>
</mxCell>
<mxCell id="43" value="Return from Flask" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=10;" vertex="1" connectable="0" parent="6">
<mxGeometry x="-0.1251" y="1" relative="1" as="geometry">
<mxPoint x="1" as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="3" value="API" style="whiteSpace=wrap;html=1;" parent="1" vertex="1">
<mxGeometry x="220" y="405" width="230" height="170" as="geometry"/>
</mxCell>
<mxCell id="4" value="SQL database&amp;nbsp;" style="whiteSpace=wrap;html=1;" parent="1" vertex="1">
<mxGeometry x="110" y="665" width="230" height="170" as="geometry"/>
</mxCell>
<mxCell id="7" value="" style="edgeStyle=none;html=1;" parent="1" edge="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="400" y="315" as="sourcePoint"/>
<mxPoint x="400" y="405" as="targetPoint"/>
</mxGeometry>
</mxCell>
<mxCell id="39" value="Create request" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=10;" vertex="1" connectable="0" parent="7">
<mxGeometry x="-0.2195" y="2" relative="1" as="geometry">
<mxPoint as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="9" value="" style="edgeStyle=none;html=1;" parent="1" edge="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="230" y="665" as="sourcePoint"/>
<mxPoint x="230" y="575" as="targetPoint"/>
</mxGeometry>
</mxCell>
<mxCell id="41" value="RETURN DATA" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=10;" vertex="1" connectable="0" parent="9">
<mxGeometry x="-0.1169" y="-1" relative="1" as="geometry">
<mxPoint as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="11" value="" style="sketch=0;shadow=0;dashed=0;html=1;strokeColor=none;labelPosition=center;verticalLabelPosition=bottom;verticalAlign=top;outlineConnect=0;align=center;shape=mxgraph.office.databases.database;fillColor=#DA4026;" parent="1" vertex="1">
<mxGeometry x="320" y="665" width="15" height="30" as="geometry"/>
</mxCell>
<mxCell id="12" value="" style="strokeColor=#dddddd;shadow=1;strokeWidth=1;rounded=1;absoluteArcSize=1;arcSize=2;" parent="1" vertex="1">
<mxGeometry x="260" y="415" width="160" height="60" as="geometry"/>
</mxCell>
<mxCell id="13" value="&lt;font color=&quot;#000000&quot;&gt;Flask&lt;/font&gt;" style="editableCssRules=.*;html=1;fontColor=#999999;shape=image;verticalLabelPosition=middle;labelBackgroundColor=#ffffff;verticalAlign=middle;labelPosition=right;align=left;spacingLeft=20;part=1;points=[];imageAspect=0;image=data:image/svg+xml,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnY9Imh0dHBzOi8vdmVjdGEuaW8vbmFubyIgd2lkdGg9IjE5Ljk1MDAwMDc2MjkzOTQ1MyIgaGVpZ2h0PSIxMiIgdmlld0JveD0iMCAwIDE5Ljk1MDAwMDc2MjkzOTQ1MyAxMiI+JiN4YTsJPHN0eWxlIHR5cGU9InRleHQvY3NzIj4mI3hhOwkuc3Qwe2ZpbGw6IzQyODVmNH0mI3hhOwkuc3Qxe2ZpbGw6I2FlY2JmYX0mI3hhOwk8L3N0eWxlPiYjeGE7CTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik02IDZsMSAyaDZsMS0yLTEtMkg3eiIgZmlsbD0iIzQyODVmNCIvPiYjeGE7CTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik03LjUxIDRIN0w2IDZoOGwtMS0yeiIgZmlsbD0iI2FlY2JmYSIvPiYjeGE7CTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNi45NyA2bDEuNS0yLjI1TDE2IDBoLTN6IiBmaWxsPSIjNDI4NWY0Ii8+JiN4YTsJPHBhdGggY2xhc3M9InN0MSIgZD0iTTE2Ljk3IDZoMEwxMyAxMmgzbDMuOTUtNi0xLjQ4LTIuMjV6IiBmaWxsPSIjYWVjYmZhIi8+JiN4YTsJPHBhdGggY2xhc3M9InN0MCIgZD0iTTIuOTggNmwtMS41IDIuMjVMMy45NSAxMmgzeiIgZmlsbD0iIzQyODVmNCIvPiYjeGE7CTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0yLjk4IDZoMGwzLjk3LTZoLTNMMCA2bDEuNDggMi4yNXoiIGZpbGw9IiNhZWNiZmEiLz4mI3hhOzwvc3ZnPg==;" parent="12" vertex="1">
<mxGeometry width="30" height="18" relative="1" as="geometry">
<mxPoint x="15" y="21" as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="16" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;image=https://1000logos.net/wp-content/uploads/2021/11/Docker-Logo-2013.png;" parent="1" vertex="1">
<mxGeometry x="600" y="510.78" width="190" height="107.06" as="geometry"/>
</mxCell>
<mxCell id="17" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;image=https://cdn.freebiesupply.com/logos/large/2x/react-1-logo-png-transparent.png;" parent="1" vertex="1">
<mxGeometry x="395" y="160" width="50" height="50" as="geometry"/>
</mxCell>
<mxCell id="18" value="&lt;font style=&quot;font-size: 12px;&quot;&gt;GET /pets&lt;br&gt;POST /adopt&lt;br&gt;GET / profile&lt;br&gt;GET /querystring&lt;br&gt;&lt;/font&gt;" style="whiteSpace=wrap;html=1;" parent="1" vertex="1">
<mxGeometry x="330" y="515" width="120" height="57.61" as="geometry"/>
</mxCell>
<mxCell id="20" value="" style="edgeStyle=none;html=1;" parent="1" edge="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="460" y="510.78" as="sourcePoint"/>
<mxPoint x="460" y="520.78" as="targetPoint"/>
<Array as="points">
<mxPoint x="460" y="520.78"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="22" value="" style="edgeStyle=none;html=1;" parent="1" edge="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="460" y="543.81" as="sourcePoint"/>
<mxPoint x="460" y="553.8100000000001" as="targetPoint"/>
<Array as="points">
<mxPoint x="460" y="553.8100000000001"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="23" value="" style="edgeStyle=none;html=1;" parent="1" edge="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="460" y="535" as="sourcePoint"/>
<mxPoint x="460" y="525" as="targetPoint"/>
<Array as="points">
<mxPoint x="460" y="525"/>
<mxPoint x="460" y="535"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="24" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;fontSize=12;image=https://blog.facialix.com/wp-content/uploads/2023/02/maxresdefault-55.jpg;" parent="1" vertex="1">
<mxGeometry x="220" y="525" width="84.49" height="47.61" as="geometry"/>
</mxCell>
<mxCell id="25" value="&lt;font style=&quot;&quot;&gt;&lt;font style=&quot;font-size: 10px;&quot;&gt;POST or PUT /pets&lt;br&gt;POST / profile&lt;/font&gt;&lt;br&gt;&lt;/font&gt;" style="whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="450" y="455" width="90" height="27.61" as="geometry"/>
</mxCell>
<mxCell id="29" value="" style="edgeStyle=none;html=1;" edge="1" parent="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="550" y="482.61" as="sourcePoint"/>
<mxPoint x="550" y="472.61" as="targetPoint"/>
<Array as="points">
<mxPoint x="550" y="472.61"/>
<mxPoint x="550" y="482.61"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="30" value="" style="edgeStyle=none;html=1;" edge="1" parent="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="550" y="465" as="sourcePoint"/>
<mxPoint x="550" y="455" as="targetPoint"/>
<Array as="points">
<mxPoint x="550" y="455"/>
<mxPoint x="550" y="465"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="32" value="" style="edgeStyle=none;html=1;fontSize=10;exitX=0.419;exitY=0.983;exitDx=0;exitDy=0;exitPerimeter=0;entryX=0.638;entryY=0.005;entryDx=0;entryDy=0;entryPerimeter=0;" edge="1" parent="1" source="31" target="2">
<mxGeometry relative="1" as="geometry"/>
</mxCell>
<mxCell id="38" value="USER INPUT" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=10;" vertex="1" connectable="0" parent="32">
<mxGeometry x="-0.1849" y="-1" relative="1" as="geometry">
<mxPoint as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="31" value="&lt;div style=&quot;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;Search bar&amp;nbsp; = GET&lt;/span&gt;&lt;br&gt;&lt;/div&gt;&lt;div style=&quot;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;&amp;nbsp;forms = POST&lt;/span&gt;&lt;/div&gt;&lt;div style=&quot;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;buttons = GET or POST&lt;/span&gt;&lt;/div&gt;" style="whiteSpace=wrap;html=1;fontSize=10;align=left;" vertex="1" parent="1">
<mxGeometry x="261" y="55" width="250" height="60" as="geometry"/>
</mxCell>
<mxCell id="34" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;fontSize=10;image=https://3.bp.blogspot.com/-VdxnwsQC46k/WUE-wWtj3VI/AAAAAAAAbbE/EsX2rnx6sRkz6AZ3ojgSrSsvKubbyjyQwCLcBGAs/s1600/Sqlite.jpg;" vertex="1" parent="1">
<mxGeometry x="110" y="675" width="60" height="45" as="geometry"/>
</mxCell>
<mxCell id="36" value="" style="edgeStyle=none;html=1;" edge="1" parent="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="460" y="562.6099999999999" as="sourcePoint"/>
<mxPoint x="460" y="572.6099999999999" as="targetPoint"/>
<Array as="points">
<mxPoint x="460" y="572.61"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="44" value="&lt;span style=&quot;font-size: 10px;&quot;&gt;PUT /updateProfile&lt;br&gt;DELETE /favPet&lt;br&gt;&lt;/span&gt;" style="whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="450" y="395" width="90" height="37.61" as="geometry"/>
</mxCell>
<mxCell id="45" value="" style="edgeStyle=none;html=1;" edge="1" parent="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="550" y="395" as="sourcePoint"/>
<mxPoint x="550" y="405" as="targetPoint"/>
<Array as="points">
<mxPoint x="550" y="405"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="46" value="" style="edgeStyle=none;html=1;" edge="1" parent="1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="550" y="414.9999999999999" as="sourcePoint"/>
<mxPoint x="550" y="424.9999999999999" as="targetPoint"/>
<Array as="points">
<mxPoint x="550" y="425"/>
</Array>
</mxGeometry>
</mxCell>
<mxCell id="48" value="Return from Database to API&lt;br&gt;1. Animals (searches &amp;amp; details)&lt;br&gt;2. updated profiles&amp;nbsp;&lt;br&gt;3. confirmed submitted aoptions&lt;br&gt;4. updated favorie pets&lt;br&gt;" style="text;strokeColor=none;align=left;fillColor=none;html=1;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontSize=10;" vertex="1" parent="1">
<mxGeometry x="60" y="575" width="150" height="30" as="geometry"/>
</mxCell>
<mxCell id="49" value="SQL commands from API calls:&lt;br&gt;&lt;ul&gt;&lt;li&gt;SELECT ALL from GET /getAnimals&lt;/li&gt;&lt;li&gt;SELECT DETAILS from&amp;nbsp;GET /getAnimalDetails/:id&lt;/li&gt;&lt;li&gt;SELECT FAVORITES from&amp;nbsp;GET /getFavorites/:userId&lt;/li&gt;&lt;li&gt;SELECT ALL ADOPTION REQUESTS from GET /getAdoptionRequests/:userId&lt;/li&gt;&lt;li&gt;INSERT ADOPTION APPLICATIONS from&amp;nbsp;POST /submitAdoption&lt;/li&gt;&lt;li&gt;INSERT FAVORITE from&amp;nbsp;POST /addFavorite&amp;nbsp;&lt;/li&gt;&lt;li&gt;INSERT USER from&amp;nbsp;POST /registerUser&lt;/li&gt;&lt;li&gt;UPDATE USER INFO from&amp;nbsp;PUT /updateProfile/:userId&lt;/li&gt;&lt;li&gt;UPDATE ANIMAL INFO from PUT /updateAnimal/:animalId&lt;/li&gt;&lt;li&gt;UPDATE ADOPTION STATUS from&amp;nbsp;PUT /updateAdoptionStatus/:adoptionId&lt;/li&gt;&lt;li&gt;DELETE FAVORITE from&amp;nbsp;DELETE /deleteFavoritePet/:favoriteId&lt;/li&gt;&lt;li&gt;DELETE AOPTION REQUEST from&amp;nbsp;DELETE /deleteAdoption/:adoptionId&lt;/li&gt;&lt;/ul&gt;" style="text;html=1;align=left;verticalAlign=middle;resizable=0;points=[];autosize=1;strokeColor=none;fillColor=none;fontSize=10;" vertex="1" parent="1">
<mxGeometry x="340" y="640" width="410" height="260" as="geometry"/>
</mxCell>
<mxCell id="50" value="&lt;font style=&quot;font-size: 6px;&quot;&gt;Components&amp;nbsp;&lt;br&gt;1. Home page&lt;br&gt;2. Details page&lt;br&gt;3. Profile page&lt;br&gt;4. Favorites&amp;nbsp;&lt;br&gt;5. current requests page&lt;br&gt;&lt;/font&gt;" style="text;strokeColor=none;align=left;fillColor=none;html=1;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontSize=10;" vertex="1" parent="1">
<mxGeometry x="150" y="160" width="90" height="30" as="geometry"/>
</mxCell>
<mxCell id="51" value="&lt;div style=&quot;text-align: left;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;API HANDLING!&lt;/span&gt;&lt;/div&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;1. Display message&lt;/span&gt;&lt;/div&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;both loading &amp;amp; error&lt;/span&gt;&lt;/div&gt;" style="text;strokeColor=none;align=center;fillColor=none;html=1;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontSize=6;" vertex="1" parent="1">
<mxGeometry x="390" y="285" width="60" height="30" as="geometry"/>
</mxCell>
<mxCell id="52" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;fontSize=6;image=https://th.bing.com/th/id/R.4cabe54de36ab64a75b3e7950791ebbe?rik=O%2fQV78LjrxMZAQ&amp;riu=http%3a%2f%2fwww.blog.plint-sites.nl%2fwordpress%2fwp-content%2fuploads%2f2016%2f07%2freact-router.png&amp;ehk=TwaiwR0BI%2f6o9ZtnEwLtqZ2wAYf9FFT%2bxSM0vT6XQIA%3d&amp;risl=&amp;pid=ImgRaw&amp;r=0&amp;sres=1&amp;sresct=1;" vertex="1" parent="1">
<mxGeometry x="220" y="154" width="94.14" height="42" as="geometry"/>
</mxCell>
<mxCell id="53" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;fontSize=6;image=https://www.x-cart.com/wp-content/uploads/2017/02/http_to_https-1.jpg;" vertex="1" parent="1">
<mxGeometry x="220" y="277" width="105.11" height="38" as="geometry"/>
</mxCell>
<mxCell id="54" value="ENSURE HTTPS" style="text;strokeColor=none;align=center;fillColor=none;html=1;verticalAlign=middle;whiteSpace=wrap;rounded=0;fontSize=6;" vertex="1" parent="1">
<mxGeometry x="230" y="260" width="60" height="30" as="geometry"/>
</mxCell>
<mxCell id="55" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;fontSize=6;image=https://cdn1.vectorstock.com/i/1000x1000/49/90/loading-icon-on-black-vector-24544990.jpg;" vertex="1" parent="1">
<mxGeometry x="378" y="252.16" width="35" height="37.84" as="geometry"/>
</mxCell>
<mxCell id="56" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;fontSize=6;image=https://thumbs.dreamstime.com/b/error-search-d-man-magnifying-glass-searching-problem-49010922.jpg;" vertex="1" parent="1">
<mxGeometry x="413" y="253" width="37" height="37" as="geometry"/>
</mxCell>
<mxCell id="57" value="" style="shape=image;imageAspect=0;aspect=fixed;verticalLabelPosition=bottom;verticalAlign=top;fontSize=6;image=https://www.seoclerk.com/pics/523331-1e2qQI1490977998.jpg;" vertex="1" parent="1">
<mxGeometry x="220" y="210" width="55.45" height="37" as="geometry"/>
</mxCell>
</root>
</mxGraphModel>
</diagram>
</mxfile>

0 comments on commit dd2cad7

Please sign in to comment.