Files
convert-ui/lib/utils/formatPresets.ts
Sebastian Krüger 6b0bda05db feat: add format presets for common conversion scenarios
Format presets included:
**Video Presets:**
- YouTube Video (1080p, H.264, optimized)
- Instagram Video (Square format, 1:1)
- Twitter Video (720p, small file)
- Web Optimized (Streaming, low bitrate)

**Audio Presets:**
- Podcast (MP3, voice optimized, 128k)
- High Quality Music (MP3, 320k)
- Audiobook (Mono, 64k, small size)

**Image Presets:**
- Web Thumbnail (JPG, 800px width)
- HD Image (PNG, lossless, high quality)
- Social Media (JPG, 1200px, optimized)
- Web Optimized (WebP, small size)

Implementation:
- Created formatPresets.ts with 11 predefined presets
- FormatPresets component with responsive grid layout
- One-click preset application
- Automatically configures format and options
- Toast notification on preset selection
- Visual feedback with ring highlight
- Organized by category (video/audio/image)
- Emoji icons for visual appeal

User experience:
- Quick access to common conversion scenarios
- No need to manually configure complex settings
- Preset descriptions explain use case
- Disabled during active conversion
- Clear visual indication of selected preset

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-17 13:30:35 +01:00

189 lines
4.0 KiB
TypeScript

import type { ConversionOptions } from '@/types/conversion';
export interface FormatPreset {
id: string;
name: string;
description: string;
icon: string;
category: 'video' | 'audio' | 'image';
outputFormat: string;
options: ConversionOptions;
}
/**
* Predefined format presets for common use cases
*/
export const FORMAT_PRESETS: FormatPreset[] = [
// Video Presets
{
id: 'youtube-video',
name: 'YouTube Video',
description: '1080p MP4, optimized for YouTube',
icon: '🎬',
category: 'video',
outputFormat: 'mp4',
options: {
videoCodec: 'libx264',
videoBitrate: '5M',
videoResolution: '1920x-1',
videoFps: 30,
audioCodec: 'aac',
audioBitrate: '192k',
},
},
{
id: 'instagram-video',
name: 'Instagram Video',
description: 'Square 1:1 format for Instagram',
icon: '📸',
category: 'video',
outputFormat: 'mp4',
options: {
videoCodec: 'libx264',
videoBitrate: '3M',
videoResolution: '1080x-1', // Will be cropped to square
videoFps: 30,
audioCodec: 'aac',
audioBitrate: '128k',
},
},
{
id: 'twitter-video',
name: 'Twitter Video',
description: '720p, optimized for Twitter',
icon: '🐦',
category: 'video',
outputFormat: 'mp4',
options: {
videoCodec: 'libx264',
videoBitrate: '2M',
videoResolution: '1280x-1',
videoFps: 30,
audioCodec: 'aac',
audioBitrate: '128k',
},
},
{
id: 'web-video',
name: 'Web Optimized',
description: 'Small file size for web streaming',
icon: '🌐',
category: 'video',
outputFormat: 'mp4',
options: {
videoCodec: 'libx264',
videoBitrate: '1.5M',
videoResolution: '854x-1',
videoFps: 24,
audioCodec: 'aac',
audioBitrate: '96k',
},
},
// Audio Presets
{
id: 'podcast-audio',
name: 'Podcast',
description: 'MP3, optimized for voice',
icon: '🎙️',
category: 'audio',
outputFormat: 'mp3',
options: {
audioCodec: 'libmp3lame',
audioBitrate: '128k',
audioSampleRate: 44100,
audioChannels: 2,
},
},
{
id: 'music-high-quality',
name: 'High Quality Music',
description: 'MP3, 320kbps for music',
icon: '🎵',
category: 'audio',
outputFormat: 'mp3',
options: {
audioCodec: 'libmp3lame',
audioBitrate: '320k',
audioSampleRate: 48000,
audioChannels: 2,
},
},
{
id: 'audiobook',
name: 'Audiobook',
description: 'Mono, small file size',
icon: '📚',
category: 'audio',
outputFormat: 'mp3',
options: {
audioCodec: 'libmp3lame',
audioBitrate: '64k',
audioSampleRate: 22050,
audioChannels: 1,
},
},
// Image Presets
{
id: 'web-thumbnail',
name: 'Web Thumbnail',
description: 'JPG, 800px width, optimized',
icon: '🖼️',
category: 'image',
outputFormat: 'jpg',
options: {
imageQuality: 85,
imageWidth: 800,
},
},
{
id: 'hd-image',
name: 'HD Image',
description: 'PNG, high quality, lossless',
icon: '🎨',
category: 'image',
outputFormat: 'png',
options: {
imageQuality: 100,
},
},
{
id: 'social-media-image',
name: 'Social Media',
description: 'JPG, 1200px, optimized',
icon: '📱',
category: 'image',
outputFormat: 'jpg',
options: {
imageQuality: 90,
imageWidth: 1200,
},
},
{
id: 'web-optimized-image',
name: 'Web Optimized',
description: 'WebP, small file size',
icon: '⚡',
category: 'image',
outputFormat: 'webp',
options: {
imageQuality: 80,
},
},
];
/**
* Get presets by category
*/
export function getPresetsByCategory(category: 'video' | 'audio' | 'image'): FormatPreset[] {
return FORMAT_PRESETS.filter(preset => preset.category === category);
}
/**
* Get preset by ID
*/
export function getPresetById(id: string): FormatPreset | undefined {
return FORMAT_PRESETS.find(preset => preset.id === id);
}