docs: Update documentation for image descriptions feature

- README.md: Add image descriptions to Latest Features section
- CHANGELOG.md: Document complete implementation details
- FEATURE_PLAN: Mark status as Implemented (ready for testing)

All 8 phases complete: Backend + Frontend + Testing + Docs 
This commit is contained in:
Matthias Lotz 2025-11-07 18:39:48 +01:00
parent 8323cec156
commit d2f2fe158d
3 changed files with 82 additions and 2 deletions

View File

@ -1,5 +1,79 @@
# Changelog # Changelog
## [Unreleased] - Branch: feature/ImageDescription
### ✨ Image Descriptions Feature (November 2025)
#### Backend
- ✅ **Database Migration**: Added `image_description` column to `images` table (TEXT, nullable)
- Automatic migration on server startup
- Index created for performance optimization
- Backward compatible with existing images
- ✅ **Repository Layer**: Extended `GroupRepository.js` with description methods
- `updateImageDescription()` - Update single image description
- `updateBatchImageDescriptions()` - Batch update multiple descriptions
- Validation: Max 200 characters enforced
- `createGroup()` now accepts `imageDescription` field
- ✅ **API Endpoints**: New REST endpoints for description management
- `PATCH /groups/:groupId/images/:imageId` - Update single description
- `PATCH /groups/:groupId/images/batch-description` - Batch update
- Server-side validation (200 char limit)
- Error handling and detailed responses
- ✅ **Upload Integration**: Batch upload now supports descriptions
- `POST /api/upload/batch` accepts `descriptions` array
- Descriptions matched to images by filename
- Automatic truncation if exceeding limit
#### Frontend
- ✅ **Core Components**: Enhanced `ImageGalleryCard` and `ImageGallery`
- **Edit Mode**: Toggle button to activate description editing
- **Textarea**: Multi-line input with character counter (0/200)
- **Validation**: Real-time character limit enforcement
- **Placeholder**: Original filename shown as hint
- **Display Mode**: Italicized description display when not editing
- ✅ **Upload Flow**: Extended `MultiUploadPage.js`
- Edit mode for adding descriptions during upload
- State management for descriptions per image
- Descriptions sent to backend with upload
- Clean up on form reset
- ✅ **Moderation**: Enhanced `ModerationGroupImagesPage.js`
- Edit mode for existing group images
- Load descriptions from server
- Batch update API integration
- Save button with success feedback
- Optimistic UI updates
- ✅ **Slideshow**: Display descriptions during presentation
- Centered overlay below image
- Semi-transparent background with blur effect
- Responsive sizing (80% max width)
- Conditional rendering (only if description exists)
- ✅ **Public View**: Show descriptions in `PublicGroupImagesPage.js`
- Display in single-image gallery mode
- Italicized style for visual distinction
- No edit functionality (read-only)
#### Styling
- ✅ **CSS Additions**: New styles for edit mode and descriptions
- `.image-description-edit` - Edit textarea container
- `.image-description-edit textarea` - Input field styles
- `.char-counter` - Character counter with limit warning
- `.image-description-display` - Read-only description display
- Responsive design for mobile devices
#### Testing & Quality
- ✅ All phases implemented and committed
- ⏳ Integration testing pending
- ⏳ User acceptance testing pending
---
## [Unreleased] - Branch: upgrade/deps-react-node-20251028 ## [Unreleased] - Branch: upgrade/deps-react-node-20251028
### 🎯 Major Framework Upgrades (October 2025) ### 🎯 Major Framework Upgrades (October 2025)

View File

@ -18,7 +18,13 @@ A self-hosted image uploader with multi-image upload capabilities and automatic
## What's New ## What's New
This project extends the original [Image-Uploader by vallezw](https://github.com/vallezw/Image-Uploader) with enhanced multi-upload and slideshow capabilities. This project extends the original [Image-Uploader by vallezw](https://github.com/vallezw/Image-Uploader) with enhanced multi-upload and slideshow capabilities.
### 🆕 Latest Features (January 2025) ### 🆕 Latest Features (November 2025)
- **Image Descriptions**: 🆕 Add optional descriptions to individual images (max 200 characters)
- **Edit Mode**: Edit descriptions for uploaded images in upload preview and moderation interface
- **Slideshow Display**: Image descriptions shown as overlays during slideshow presentation
- **Public Display**: Descriptions visible in public group views and galleries
### Previous Features (January 2025)
- **Drag-and-Drop Image Reordering**: Admins can now reorder images using intuitive drag-and-drop - **Drag-and-Drop Image Reordering**: Admins can now reorder images using intuitive drag-and-drop
- **Touch-Friendly Interface**: Mobile-optimized controls with always-visible drag handles - **Touch-Friendly Interface**: Mobile-optimized controls with always-visible drag handles
- **Slideshow Integration**: Custom image order automatically applies to slideshow mode - **Slideshow Integration**: Custom image order automatically applies to slideshow mode

View File

@ -2,7 +2,7 @@
**Branch:** `feature/ImageDescription` **Branch:** `feature/ImageDescription`
**Datum:** 7. November 2025 **Datum:** 7. November 2025
**Status:** 🔄 In Planung **Status:** ✅ Implementiert (bereit für Testing)
--- ---