feat: Introduce 3D model viewing and upload capabilities, refine cost calculation, and simplify Docker setup.

This commit is contained in:
2025-12-25 19:08:52 +00:00
parent ee6712cc8e
commit 16be4fdeaa
2 changed files with 114 additions and 43 deletions

View File

@@ -16,7 +16,7 @@ COPY . .
RUN bun run build
# Production stage
FROM oven/bun:1-slim AS production
FROM oven/bun:1 AS production
WORKDIR /app
@@ -43,16 +43,5 @@ ENV PORT=3000
# Expose the port
EXPOSE 3000
# Create a non-root user
RUN addgroup --system --gid 1001 nodejs && \
adduser --system --uid 1001 filaprint && \
chown -R filaprint:nodejs /app
USER filaprint
# Health check
HEALTHCHECK --interval=30s --timeout=10s --start-period=5s --retries=3 \
CMD curl -f http://localhost:3000/ || exit 1
# Start the application
CMD ["bun", "run", "start"]

144
README.md
View File

@@ -1,6 +1,8 @@
# Filaprint
Filaprint is a modern, premium web application designed to help 3D printing enthusiasts manage their filament inventory, track print jobs, and calculate costs and energy usage.
Filaprint is a modern, premium web application designed to help 3D printing enthusiasts manage their filament inventory, track print jobs, view 3D models, and calculate costs and energy usage.
![Filaprint Dashboard](https://img.shields.io/badge/Filaprint-3D%20Print%20Manager-blue?style=for-the-badge)
## 🛠️ Technology Stack
@@ -9,10 +11,12 @@ Filaprint is a modern, premium web application designed to help 3D printing enth
- **Styling:** Tailwind CSS v4 (Cerberus Theme)
- **State Management:** Svelte 5 Runes
- **Build Tool:** Vite
- **3D Rendering:** Three.js (STL & OBJ loaders)
- **Data Visualization:** Chart.js
- **Icons:** Iconify (@iconify/svelte)
- **Database:** MongoDB with Mongoose
- **Authentication:** JWT with bcrypt password hashing
- **Container:** Docker with Docker Compose
## ✨ Features
@@ -37,23 +41,39 @@ Filaprint is a modern, premium web application designed to help 3D printing enth
- **Log Prints:**
- Link to specific Printer and Filament Spool.
- Duration (minutes) and Weight used (g).
- Calculated Cost (auto-calculated or manual override).
- Duration input with hours and minutes fields.
- Weight used (g) and calculated cost (auto or manual).
- Status: Success, Fail, Cancelled, **In Progress**.
- **3D Model Upload:** Attach STL or OBJ files to prints.
- **In Progress Tracking:**
- Assign printer and spool to active jobs.
- Specify elapsed time for accurate dashboard countdown.
- Real-time progress display on dashboard.
- **Cost Calculation:**
- Filament cost based on spool price and weight used.
- Electricity cost based on printer power consumption and duration.
- User-configurable electricity rate ($/kWh).
- **Edit/Delete:** Full CRUD operations for print history.
- **History:** Clickable entries with detailed information.
### 4. Printer Configuration
### 4. 3D Model Library
- **Model Gallery:** Browse all uploaded 3D models in a grid layout.
- **Interactive 3D Viewer:**
- Support for STL and OBJ file formats.
- Orbit controls (rotate, pan, zoom).
- Touch support for mobile devices.
- Auto-rotation with stop on interaction.
- **Upload Progress:** Progress bar with percentage for model uploads.
- **Full-Screen View:** Click to view models in an immersive full-screen viewer.
### 5. Printer Configuration
- **Profiles:** Manage multiple printers with custom names.
- **Specs:** Model name, Power consumption (Watts), Nozzle diameter (mm).
- **Configure Button:** Edit or delete printer profiles.
### 5. Analytics
### 6. Analytics
- **Daily Filament Usage:** Line chart showing filament consumption over time.
- **Daily Electricity Usage:** Bar chart showing power consumption in kWh.
@@ -61,10 +81,13 @@ Filaprint is a modern, premium web application designed to help 3D printing enth
- **Material Distribution:** Doughnut chart showing material breakdown.
- **Stats Summary:** Total prints, success rate, total electricity used.
### 6. User Management
### 7. User Management
- **Authentication:** Secure login/registration with JWT tokens.
- **User Settings:** Profile editing and password change.
- **User Settings:**
- Profile editing (username, location).
- Electricity rate configuration ($/kWh).
- Password change.
- **Admin Panel:** Manage users (Admin role only).
- **Role-Based Access:** Admin and User roles with appropriate permissions.
@@ -74,9 +97,11 @@ Filaprint is a modern, premium web application designed to help 3D printing enth
- `_id`: ObjectId
- `username`: String (Required, Unique)
- `email`: String
- `password`: String (Hashed with bcrypt)
- `role`: String (Enum: User, Admin)
- `location`: String
- `electricity_rate`: Number (Default: 0.12 $/kWh)
- `currency`: String (Default: USD)
- `createdAt`: Date
### Spool Schema
@@ -110,9 +135,11 @@ Filaprint is a modern, premium web application designed to help 3D printing enth
- `name`: String
- `duration_minutes`: Number
- `filament_used_g`: Number
- `calculated_cost_filament`: Number
- `calculated_cost_filament`: Number (Total cost including electricity)
- `calculated_cost_energy`: Number (Electricity cost only)
- `status`: String (Enum: Success, Fail, Cancelled, In Progress)
- `started_at`: Date (For In Progress jobs)
- `stl_file`: String (Path to uploaded 3D model)
- `date`: Date (Default: Date.now)
## 🚀 Getting Started
@@ -121,8 +148,9 @@ Filaprint is a modern, premium web application designed to help 3D printing enth
- Node.js 18+ or Bun
- MongoDB instance (local or Atlas)
- Docker (optional, for containerized deployment)
### Installation
### Local Development
```bash
# Clone the repository
@@ -138,36 +166,79 @@ cp .env.example .env
# Run development server
bun run dev
# Build for production
bun run build
# Start production server
bun run start
```
### Docker Deployment
```bash
# Copy environment file
cp .env.example .env
# Edit .env with secure values
# Build and start containers
docker compose up -d --build
# View logs
docker compose logs -f filaprint
# Stop containers
docker compose down
```
### Environment Variables
```env
# MongoDB Connection
MONGODB_URI=mongodb://localhost:27017/filaprint
# JWT Secret (use a secure random string in production)
JWT_SECRET=your-super-secret-jwt-key
# Application Origin (required for CSRF protection)
ORIGIN=http://localhost:3000
# Docker MongoDB Settings
MONGO_USER=admin
MONGO_PASSWORD=changeme
```
## 📁 Project Structure
```
src/
├── lib/
│ ├── components/
│ │ ├── ui/ # Base UI components (Button, Card, Input, Modal)
│ │ ├── prints/ # Print-specific components (LogPrintModal, EditPrintModal)
│ │ └── Navbar.svelte
├── models/ # Mongoose schemas
└── server/ # Server utilities (db connection, auth)
├── routes/
├── admin/users/ # Admin user management
│ ├── analytics/ # Analytics dashboard
│ ├── login/ # Authentication
│ ├── printers/ # Printer management
│ ├── prints/ # Print job logging
│ ├── register/ # User registration
│ ├── settings/ # User settings
└── spools/ # Filament inventory
└── app.css # Global styles (Cerberus theme)
filaprint/
├── src/
│ ├── lib/
│ │ ├── components/
│ │ │ ├── ui/ # Base UI components (Button, Card, Input, Modal)
│ │ │ ├── prints/ # Print-specific components (LogPrintModal, EditPrintModal)
├── STLViewer.svelte # 3D model viewer (STL & OBJ)
└── Navbar.svelte
│ │ ├── models/ # Mongoose schemas
│ └── server/ # Server utilities (db connection, auth)
│ ├── routes/
│ ├── admin/users/ # Admin user management
│ ├── analytics/ # Analytics dashboard
│ ├── api/upload-stl/ # 3D model upload endpoint
│ ├── library/ # 3D model library
│ ├── login/ # Authentication
│ ├── printers/ # Printer management
├── prints/ # Print job logging
│ │ ├── register/ # User registration
│ │ ├── settings/ # User settings
│ │ └── spools/ # Filament inventory
│ └── app.css # Global styles (Cerberus theme)
├── static/
│ └── uploads/models/ # Uploaded 3D model files
├── server/ # Production server
├── Dockerfile # Container build instructions
├── docker-compose.yml # Container orchestration
└── package.json
```
## ✅ Completed Features
@@ -177,18 +248,23 @@ src/
- [x] Spool management (CRUD)
- [x] Printer management (CRUD)
- [x] Print job logging with "In Progress" support
- [x] Cost calculation (auto and manual)
- [x] Duration input with hours/minutes fields
- [x] Cost calculation (filament + electricity)
- [x] User-configurable electricity rate
- [x] Filament deduction on print completion
- [x] Analytics with Chart.js (filament, electricity, materials)
- [x] User settings (profile, password change)
- [x] 3D Model Library with interactive viewer
- [x] STL and OBJ file upload with progress bar
- [x] Mobile hamburger menu (solid background)
- [x] User settings (profile, location, electricity rate, password)
- [x] Admin user management panel
- [x] Browser notifications for completed prints
- [x] Iconify icon library integration
- [x] Responsive design
- [x] Docker containerization
## 🔮 Future Enhancements
- [ ] 3D spool visualization with Threlte
- [ ] QR/Barcode scanning for quick spool lookup
- [ ] Photo uploads for print jobs
- [ ] Export data (CSV/PDF reports)
@@ -196,3 +272,9 @@ src/
- [ ] Dark/Light theme toggle
- [ ] Email notifications
- [ ] Print job templates
- [ ] 3D printer integration (OctoPrint, Klipper)
- [ ] Thumbnail generation for 3D models
## 📄 License
MIT License - See LICENSE file for details.