ASF-Nabd/frontend-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
mahmamdouh
2026-08-02 17:09:34 +02:00
commit e6bcafdfee
30 changed files with 7154 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
static/images/deployment_architecture.svg Normal file
View File

@@ -0,0 +1,88 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 650" width="100%" height="100%" style="background-color: #0F172A; font-family: 'Segoe UI', system-ui, sans-serif;">
<defs>
<!-- Arrowhead markers -->
<marker id="arrow-blue" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse">
<path d="M 0 0 L 10 5 L 0 10 z" fill="#38BDF8" />
</marker>
<marker id="arrow-gold" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse">
<path d="M 0 0 L 10 5 L 0 10 z" fill="#F59E0B" />
</marker>
<!-- Drop Shadows -->
<filter id="shadow" x="-5%" y="-5%" width="110%" height="110%">
<feDropShadow dx="0" dy="4" stdDeviation="6" flood-color="#000000" flood-opacity="0.4"/>
</filter>
</defs>
<!-- TOP BLOCK: Nabd Cloud + Mobile -->
<g filter="url(#shadow)">
<rect x="220" y="30" width="360" height="90" rx="12" fill="#1E293B" stroke="#38BDF8" stroke-width="2" />
<text x="400" y="70" text-anchor="middle" fill="#F8FAFC" font-size="18" font-weight="bold">Nabd Cloud + Mobile</text>
<text x="400" y="95" text-anchor="middle" fill="#94A3B8" font-size="14">(remote monitor / control)</text>
</g>
<!-- HTTPS OUTBOUND CONNECTION LINE -->
<line x1="400" y1="210" x2="400" y2="130" stroke="#38BDF8" stroke-width="2" stroke-dasharray="6,6" marker-end="url(#arrow-blue)" />
<rect x="300" y="155" width="200" height="26" rx="13" fill="#0F172A" stroke="#38BDF8" stroke-width="1"/>
<text x="400" y="172" text-anchor="middle" fill="#38BDF8" font-size="12" font-weight="bold">HTTPS (outbound from farm)</text>
<!-- MAIN CONTAINER: Poultry Farm -->
<rect x="50" y="210" width="700" height="400" rx="16" fill="#1E293B" fill-opacity="0.6" stroke="#334155" stroke-width="2" stroke-dasharray="4,4" />
<text x="80" y="245" fill="#94A3B8" font-size="14" font-weight="bold" letter-spacing="1">POULTRY FARM</text>
<!-- CENTER BLOCK: Main Hub (Edge Controller) -->
<g filter="url(#shadow)">
<rect x="180" y="270" width="440" height="110" rx="12" fill="#1E293B" stroke="#F59E0B" stroke-width="2" />
<text x="400" y="305" text-anchor="middle" fill="#F59E0B" font-size="20" font-weight="bold">Main Hub (Edge Controller)</text>
<text x="400" y="335" text-anchor="middle" fill="#F8FAFC" font-size="13">Main Controller for Farm &amp; House</text>
<text x="400" y="358" text-anchor="middle" fill="#94A3B8" font-size="12">(Compute, HMI, Actuators, Data Fusion, Alarms, OTA Host)</text>
</g>
<!-- WIRELESS CONNECTION LINES -->
<path d="M 400 380 L 400 440" stroke="#F59E0B" stroke-width="2" />
<path d="M 120 440 L 680 440" stroke="#F59E0B" stroke-width="2" />
<line x1="120" y1="440" x2="120" y2="470" stroke="#F59E0B" stroke-width="2" marker-end="url(#arrow-gold)" />
<line x1="260" y1="440" x2="260" y2="470" stroke="#F59E0B" stroke-width="2" marker-end="url(#arrow-gold)" />
<line x1="400" y1="440" x2="400" y2="470" stroke="#F59E0B" stroke-width="2" marker-end="url(#arrow-gold)" />
<line x1="680" y1="440" x2="680" y2="470" stroke="#F59E0B" stroke-width="2" marker-end="url(#arrow-gold)" />
<rect x="290" y="427" width="220" height="26" rx="13" fill="#0F172A" stroke="#F59E0B" stroke-width="1"/>
<text x="400" y="444" text-anchor="middle" fill="#F59E0B" font-size="12" font-weight="bold">Wi-Fi / MQTT-TLS (Wireless)</text>
<!-- BOTTOM BLOCKS: Sensor Hubs -->
<!-- SH #1 -->
<g filter="url(#shadow)">
<rect x="60" y="480" width="120" height="75" rx="8" fill="#0F172A" stroke="#334155" stroke-width="1.5" />
<text x="120" y="512" text-anchor="middle" fill="#F8FAFC" font-size="15" font-weight="bold">SH #1</text>
<text x="120" y="535" text-anchor="middle" fill="#94A3B8" font-size="11">ESP32-S3</text>
</g>
<!-- SH #2 -->
<g filter="url(#shadow)">
<rect x="200" y="480" width="120" height="75" rx="8" fill="#0F172A" stroke="#334155" stroke-width="1.5" />
<text x="260" y="512" text-anchor="middle" fill="#F8FAFC" font-size="15" font-weight="bold">SH #2</text>
<text x="260" y="535" text-anchor="middle" fill="#94A3B8" font-size="11">ESP32-S3</text>
</g>
<!-- SH #3 -->
<g filter="url(#shadow)">
<rect x="340" y="480" width="120" height="75" rx="8" fill="#0F172A" stroke="#334155" stroke-width="1.5" />
<text x="400" y="512" text-anchor="middle" fill="#F8FAFC" font-size="15" font-weight="bold">SH #3</text>
<text x="400" y="535" text-anchor="middle" fill="#94A3B8" font-size="11">ESP32-S3</text>
</g>
<!-- ELLIPSIS (...) -->
<text x="540" y="525" text-anchor="middle" fill="#94A3B8" font-size="28" font-weight="bold">• • •</text>
<!-- SH #N -->
<g filter="url(#shadow)">
<rect x="620" y="480" width="120" height="75" rx="8" fill="#0F172A" stroke="#334155" stroke-width="1.5" />
<text x="680" y="512" text-anchor="middle" fill="#F8FAFC" font-size="15" font-weight="bold">SH #N</text>
<text x="680" y="535" text-anchor="middle" fill="#94A3B8" font-size="11">ESP32-S3</text>
</g>
<!-- SENSOR HUB FOOTNOTE -->
<text x="400" y="585" text-anchor="middle" fill="#94A3B8" font-size="12">ESP32-S3 Sensor Hub stations in each room (Sensing &amp; Calibration Only)</text>
<text x="400" y="602" text-anchor="middle" fill="#38BDF8" font-size="11" font-weight="bold">N = Sized dynamically based on room length / layout</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB