Storm Drainage Calculation Dashboard

A browser-based storm drainage calculation dashboard for hydrology and stormwater preliminary design.

Engineering note: This tool is intended for preliminary calculations, learning, comparison, and early-stage stormwater design support. It is not a substitute for review by a qualified engineer, local drainage authority requirements, or project-specific hydrologic/hydraulic modeling.

Screenshot

Add a project screenshot here after enabling GitHub Pages:

![Storm Drainage Calculation Dashboard](docs/screenshot-dashboard.png)

Features

• Static browser application: no backend and no installation required.
• Dark gray RTL-first interface with a light theme option.
• Arabic interface with English terminology for engineering variables.
• Project identity page for project name, designer, design code/reference, and notes.
• Results dashboard summarizing the most important outputs.
• Raw rainfall data workspace with manual paste/file workflows and source URL helper.
• IDF pre-calculation workspace from table data, formula coefficients, or processed rainfall data.
• Quick IDF calculator using common IDF equation forms.
• SCS Curve Number runoff depth calculator.
• Rainfall designer for design storm hyetographs and cumulative distributions.
• Rational Method peak runoff calculator with multiple flow units.
• Chart drawing and PNG chart export.
• CSV export for IDF, CN, rainfall, and runoff outputs.
• Browser print workflow and configurable report preview.
• Local browser persistence plus project file save/open workflow.

Calculation Methods

The current static version includes these calculation modules:

1. IDF Curves

   • Supports coefficient-based IDF equations.
   • Supports table-driven design intensity workflows.
   • Supports extracting/adopting generated IDF results from raw rainfall workflows.

2. SCS Curve Number

   • Estimates runoff depth from rainfall depth, CN, AMC condition, and initial abstraction ratio.
   • Includes built-in land use and soil group reference values for quick preliminary checks.

3. Rainfall Designer

   • Generates cumulative and incremental rainfall distributions.
   • Includes predefined rainfall patterns and an alternating-block style workflow.

4. Rational Method

   • Computes peak discharge using:

   Q = C × I × A / 360
   

   where C is runoff coefficient, I is rainfall intensity in mm/hr, and A is area in hectares.

How to Use

1. Open index.html directly in a modern browser, or serve it locally.
2. Start from Project Setup and enter project metadata.
3. Use Raw Rainfall if you want to prepare rainfall inputs before IDF.
4. Use IDF Design to define or generate the design rainfall intensity.
5. Use Hydraulic Calculations for IDF, CN, rainfall pattern, and Rational Method modules.
6. Review the summary in Results Dashboard.
7. Export charts/CSV or print the report when needed.

Run Locally

Open directly:

start index.html

Or run a simple local static server:

python -m http.server 8000

Then open:

http://localhost:8000

Project Structure

.
├─ index.html
├─ assets/
│  ├─ css/
│  │  └─ styles.css
│  ├─ js/
│  │  └─ app.js
│  └─ img/
│     └─ logo.png
├─ docs/
│  ├─ PROJECT_REVIEW.md
│  ├─ FEATURES.md
│  ├─ ROADMAP.md
│  └─ SCREENSHOTS.md
├─ .github/
│  └─ workflows/
│     └─ pages.yml
├─ README.md
├─ LICENSE
├─ CHANGELOG.md
├─ CONTRIBUTING.md
├─ SECURITY.md
├─ CODE_OF_CONDUCT.md
└─ .gitignore

Limitations

• This is a static client-side tool; calculations run in the browser.
• No server-side audit trail, user management, or database is included.
• Built-in lookup tables should be reviewed against the governing local drainage standard before design approval.
• Online rainfall fetching depends on external data availability and browser network permissions.
• The project does not replace detailed hydraulic modeling, GIS drainage network analysis, or authority-approved design software.

Roadmap

• Add automated tests for calculation functions.
• Add more transparent engineering references for built-in coefficients and tables.
• Add import/export templates for rainfall and IDF data.
• Improve accessibility and mobile layout testing.
• Add optional unit-system presets.
• Add sample datasets and tutorial workflows.

عربي مختصر

لوحة Storm Drainage Calculation Dashboard هي أداة ويب تعمل من المتصفح لحسابات أولية في تصريف مياه الأمطار، وتشمل IDF و SCS Curve Number و Rainfall Designer و Rational Method. الأداة مناسبة للمراجعة الأولية والتعليم والتحقق السريع، وليست بديلًا عن مراجعة مهندس مختص أو اشتراطات الجهة المحلية.

License

This project is released under the MIT License.

Author

Ahmad Ibrahim