From 16be4fdeaa99f07f66eb1fbbef3f3671e7a2c282 Mon Sep 17 00:00:00 2001 From: default Date: Thu, 25 Dec 2025 19:08:52 +0000 Subject: [PATCH] feat: Introduce 3D model viewing and upload capabilities, refine cost calculation, and simplify Docker setup. --- Dockerfile | 13 +---- README.md | 144 +++++++++++++++++++++++++++++++++++++++++------------ 2 files changed, 114 insertions(+), 43 deletions(-) diff --git a/Dockerfile b/Dockerfile index 380f4e9..3b44190 100644 --- a/Dockerfile +++ b/Dockerfile @@ -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"] diff --git a/README.md b/README.md index 0cf41be..7b37a8d 100644 --- a/README.md +++ b/README.md @@ -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.