138 lines
3.3 KiB
Markdown
138 lines
3.3 KiB
Markdown
# SmartCane Web Apps
|
|
|
|
Collection of lightweight web applications for farm management and data analysis. Each app is self-contained and can be deployed independently to Netlify or any static hosting provider.
|
|
|
|
## Apps
|
|
|
|
### 🗺️ Sugar Mill Locator
|
|
**Location**: `sugar_mill_locator/`
|
|
|
|
Interactive map showing sugar cane mill locations across East & Southern Africa. Features include:
|
|
- View all mills with detailed information
|
|
- Color-coded by country, sized by production volume
|
|
- Draw tool to add new mill locations
|
|
- Export additions as CSV for database integration
|
|
- No backend required - fully static
|
|
|
|
**Files**:
|
|
- `index.html` - Main interface
|
|
- `app.js` - Map logic and interactions
|
|
- `sugar_cane_factories_africa.csv` - Mill location data
|
|
- `README.md` - Detailed documentation
|
|
|
|
**Usage**: Open `index.html` in a browser or deploy to Netlify
|
|
|
|
---
|
|
|
|
### ✓ Data Validation Tool
|
|
**Location**: `data_validation_tool/`
|
|
|
|
Validates and checks data quality for crop analysis inputs.
|
|
|
|
**Files**:
|
|
- `index.html` - Main interface
|
|
- `validator.js` - Validation logic
|
|
- `README.md` - Documentation
|
|
|
|
---
|
|
|
|
## Deployment
|
|
|
|
### Deploy to Netlify (Recommended)
|
|
|
|
1. Connect your GitHub repository to Netlify
|
|
2. Set build command: (leave empty - static files only)
|
|
3. Set publish directory: `webapps/`
|
|
|
|
Or drag & drop each app folder individually.
|
|
|
|
### Deploy Locally
|
|
|
|
Each app is a standalone HTML/JS application:
|
|
|
|
```bash
|
|
# Sugar Mill Locator
|
|
cd sugar_mill_locator
|
|
python -m http.server 8000
|
|
# Open http://localhost:8000
|
|
```
|
|
|
|
---
|
|
|
|
## Development
|
|
|
|
### Adding a New App
|
|
|
|
1. Create a new folder: `webapps/myapp/`
|
|
2. Create these files:
|
|
- `index.html` - Main page
|
|
- `app.js` (optional) - Logic
|
|
- `README.md` - Documentation
|
|
- Any assets (CSS, images, data files)
|
|
|
|
3. Update main `index.html` with a card linking to your app:
|
|
|
|
```html
|
|
<div class="app-card">
|
|
<div class="app-icon">🎯</div>
|
|
<div class="app-content">
|
|
<h2>My New App</h2>
|
|
<p>Description here</p>
|
|
<a href="./myapp/" class="app-btn">Open App</a>
|
|
</div>
|
|
</div>
|
|
```
|
|
|
|
### Hosting Data Files
|
|
|
|
- Place CSV/JSON files in the app folder
|
|
- Reference with relative paths: `./data.csv`
|
|
- The browser can load and parse them client-side
|
|
- No backend authentication needed
|
|
|
|
### External Libraries
|
|
|
|
- **Leaflet.js**: Maps (sugar_mill_locator)
|
|
- **OpenStreetMap**: Base map tiles (free)
|
|
- Others: Add via CDN in HTML `<head>`
|
|
|
|
---
|
|
|
|
## Workflow: Adding Mills to Database
|
|
|
|
**For Team Members**:
|
|
1. Open Sugar Mill Locator
|
|
2. Switch to "Draw & Add" mode
|
|
3. Click marker tool and draw points for new mills
|
|
4. Fill in details in the form
|
|
5. Export as CSV
|
|
6. Send CSV to Timon
|
|
|
|
**For Timon (Integration)**:
|
|
1. Receive exported CSV: `sugar_mills_additions_YYYY-MM-DD.csv`
|
|
2. Open `sugar_cane_factories_africa.csv`
|
|
3. Append new rows from exported file
|
|
4. Commit changes to repository
|
|
5. Updates visible immediately on next deploy
|
|
|
|
---
|
|
|
|
## Technical Notes
|
|
|
|
- All apps are static (no server required)
|
|
- Data stored in CSV/JSON files in app folders
|
|
- Client-side processing only
|
|
- CSV parsing handled by JavaScript
|
|
- No database backend needed for basic functionality
|
|
|
|
## Future Enhancements
|
|
|
|
- Google Sheets integration for live data updates
|
|
- Form submission via Formspree/Firebase
|
|
- Real-time collaboration features
|
|
- Data export to multiple formats (Excel, GeoJSON, etc.)
|
|
|
|
---
|
|
|
|
*Created December 2025 | Resilience BV*
|