Overview
MediaStream provides comprehensive tools to manage your media content across series, seasons, and episodes. This guide covers all aspects of content management, from viewing to editing and organizing your media library.Series Management
Viewing All Series
The Series list page displays all your content in a responsive grid layout:- Grid View: Auto-fit layout with minimum 200px card width
- Series Cards: Each card includes:
- Cover image (aspect-video format)
- Series title
- Series description
- Hover effects for better interaction
Series Card Features
Visual Feedback
Hover states provide immediate visual feedback with scale transforms and overlay effects
Quick Access
Click any series card to navigate directly to its detail page
Image Fallback
Default placeholder images ensure professional appearance even without custom uploads
Responsive Design
Grid automatically adjusts to your screen size for optimal viewing
Season Management
Seasons organize episodes within a series and provide logical groupings for your content.Viewing Seasons
On the series detail page, seasons appear in the left panel:Season Selector
Use the dropdown menu (280px width) to switch between different seasons:
- Shows current season title as placeholder
- Lists all available seasons
- Click to select and view episodes
Adding New Seasons
Click Add Button
Click the Plus (+) icon button next to the season dropdown.
- Button size: 32px square (w-8 aspect-square)
- Background: Secondary color with hover effect
- Icon size: 24px
Fill Season Form
On the creation page, provide:Title (Required)
- Name your season clearly
- Example: “Season 2”, “Winter 2024”
- Describe the season’s content
- Help viewers know what to expect
Editing Seasons
From the series detail page:- Locate the season card you want to edit
- Click the Pencil icon in the top-right corner
- Update the season information
- Save your changes
The edit button has a hover effect (bg-content-3) for better user experience and clear interaction feedback.
Episode Management
Viewing Episodes
Episodes are displayed in the right panel of the series detail page: Episode Card Layout:- Thumbnail: 25% width, aspect-video format
- Content Area: Remaining 75% width with:
- Episode title (large size)
- Episode description (base size)
- Clickable: Entire card navigates to episode detail view
Episode Information Display
Each episode card shows:Visual Preview
Thumbnail image with 16:9 aspect ratio for consistent display
Title
Episode name in prominent typography
Description
Brief overview of episode content
Episode Actions
Click on any episode card to:- View full episode details
- Access chapter information
- Manage episode settings
- View streaming analytics
Content Navigation
Breadcrumb Navigation
MediaStream uses breadcrumbs to help you navigate the content hierarchy:Sidebar Navigation
The persistent sidebar provides quick access:- Dashboard: Return to overview
- Series: Access series list
- Media: Upload and manage video files
Media Upload and Management
Uploading Video Files
MediaStream supports chunked video uploads for large files:Select Video File
Click the file input and choose your video:
- Accepted format: MP4
- Large files supported through chunked upload
- Chunk size: 10MB per chunk
Monitor Progress
Watch the upload progress bar:
- Real-time progress percentage
- Visual progress indicator
- Shows completion status
Upload Technical Details
The upload system features:- Chunked Uploads: Files split into 10MB chunks for reliability
- Progress Tracking: Real-time upload progress with percentage
- CDN Integration: Files stored on MediaStream CDN
- Error Handling: Automatic retry on chunk failure
Content Organization Best Practices
Logical Grouping
Organize episodes into seasons based on themes, release dates, or content types
Consistent Naming
Use clear, consistent naming conventions across series, seasons, and episodes
Quality Images
Upload high-quality cover images for better viewer engagement
Detailed Descriptions
Write comprehensive descriptions to help viewers discover content
Searching and Filtering
While viewing your content:- Browse the grid view for visual discovery
- Use the season selector to filter episodes by season
- Navigate through breadcrumbs for hierarchical browsing
Content Status and Visibility
Image Handling
The platform automatically manages images:- CDN Delivery: Images served from
platform-static.cdn.mdstrm.com - Fallback Images: Default placeholder if no custom image uploaded
- Lazy Loading: Images load efficiently as you scroll
- Hover Effects: Smooth transitions on interaction
Content Display
All content includes:- Responsive layouts that adapt to screen size
- Smooth transitions and animations
- Clear visual hierarchy
- Intuitive interaction patterns
The platform uses a grid system with auto-fit columns, ensuring your content displays beautifully on any screen size.
Troubleshooting
Series or season not appearing
Series or season not appearing
Make sure you’ve completed all required fields when creating content. Refresh the page to see newly added items.
Images not loading
Images not loading
Check your internet connection. The platform uses CDN for image delivery. If images still don’t load, try clearing your browser cache.
Upload failing
Upload failing
Ensure your video file is in MP4 format. For very large files, make sure you have a stable internet connection throughout the upload process.
Can't edit content
Can't edit content
Verify you’re logged in and have the necessary permissions. Try refreshing the page if edit buttons aren’t responding.
Next Steps
Create Series
Learn how to create new series and organize your content
User Settings
Customize your profile and preferences