A comprehensive fan site celebrating Kevin Parissien and The Honeymoon Suites, the legendary South African glamrock band from the 1990s Cape Town music scene.
- Interactive music player with playlist functionality
- Band member profiles and history
- Album showcase with real artwork
- Responsive design with glamrock aesthetics
- Photo galleries with real band images
- Interactive elements (costume try-on, fan art generator)
- Fan memories and quotes
- Concert timeline and venue history
- Deep dive into band history
- Album details and track listings
- Rare photos and behind-the-scenes content
- Historical context of the 1990s Cape Town scene
- Curated collection of their best tracks
- Interactive track listing with hover effects
- Album artwork and production credits
- Comprehensive liner notes
- YouTube API integration for real music streaming
- Bandcamp embed testing
- Hybrid streaming approach with fallbacks
- Developer tools for testing audio functionality
common.css- Shared styles, glamrock theme, navigationmusic-player.css- Music player, vinyl animations, waveformsgallery.css- Photo galleries, lightbox, interactive elementstest-lab.css- Development and testing interface styles
common.js- Shared functionality, smooth scrolling, animationsmusic-player.js- Music player logic, playlist managementgallery.js- Gallery interactions, lightbox, filteringtest-lab.js- Audio testing, YouTube API integration
config.example.js- Template for API keys and settingsconfig.js- Your actual configuration (create from template)- Automatic detection - Falls back gracefully if config missing
5star.jpeg- Five Star album coverfirstalbum.jpeg- Greatest Hits album cover
# Download or clone the repository
# Open index.html in any modern web browser
# Enjoy the complete fan site experience# Copy configuration template
cp config.example.js config.js
# Edit config.js and add your YouTube Data API v3 key
# Get API key from: https://console.cloud.google.com/See SETUP.md for detailed instructions
- No hardcoded API keys in source code
- Template-based configuration system
- Automatic config detection with graceful fallbacks
- Domain restrictions recommended for YouTube API
- Rate limiting and quota management
- See
SECURITY.mdfor detailed guidelines
- YouTube API - Primary source with search functionality
- Bandcamp - Official releases and high-quality audio
- Demo Mode - Simulated playback for development
- Automatic API key loading from config.js
- Fallback to manual entry if config unavailable
- Real-time status indicators showing config state
- Error handling for missing or invalid keys
- Track search and automatic discovery
- Playlist management with shuffle and repeat
- Progress tracking and seeking
- Volume control and audio visualization
- Fallback systems for unavailable tracks
- Mobile-first approach
- Bootstrap 5 grid system
- Touch-friendly interactions
- Optimized images and assets
- Progressive enhancement
- Neon color schemes (red, pink, purple, gold)
- Gradient animations and text effects
- Vintage frames and polaroid styling
- Floating elements and interactive animations
- Professional typography with dramatic flair
- Intuitive navigation between sections
- Smooth transitions and hover effects
- Keyboard shortcuts for music player
- Accessibility considerations
- Fast loading with optimized assets
- Modern browsers (Chrome, Firefox, Safari, Edge)
- Mobile browsers (iOS Safari, Chrome Mobile)
- Progressive enhancement for older browsers
- Graceful degradation for missing features
├── index.html # Main fan site (home page)
├── fan-gallery.html # Photo gallery with interactive elements
├── gallery-extended.html # Extended gallery with deep-dive content
├── greatest-hits.html # Greatest hits album showcase
├── audio-options-test.html # Audio testing lab with YouTube API
├── enhanced-audio-test.html # Enhanced audio testing interface
├── css/
│ ├── common.css # Shared styles (glamrock theme, navigation)
│ ├── music-player.css # Music player, vinyl animations, waveforms
│ ├── gallery.css # Gallery styles, photo cards, lightbox
│ └── test-lab.css # Testing interface styles, debug console
├── js/
│ ├── common.js # Shared functionality (animations, lightbox)
│ ├── music-player.js # Music player logic and playlist management
│ ├── gallery.js # Gallery interactions and filtering
│ └── test-lab.js # Audio testing and YouTube API integration
├── assets/
│ ├── 5star.jpeg # Five Star album cover (official artwork)
│ └── firstalbum.jpeg # Greatest Hits album cover
├── config.example.js # Configuration template for API keys
├── config.js # Your configuration file (create from template)
├── .env.example # Environment template (for reference)
├── .gitignore # Git ignore rules (protects sensitive files)
├── SECURITY.md # Security guidelines and best practices
├── SETUP.md # Detailed setup instructions
├── image-urls.md # Documentation of image sources
└── README.md # This documentation file
- GitHub Pages - Free hosting for static sites
- Netlify - Advanced features and CDN
- Vercel - Optimized for modern web apps
- Traditional web hosting - Any static file server
- Create config.js from template with your API keys
- Test all functionality locally
- Verify API key restrictions in Google Cloud Console
- Check .gitignore to ensure no sensitive files are committed
- Upload all files to your hosting provider
- Ensure proper MIME types for CSS/JS files:
.cssfiles:text/css.jsfiles:application/javascript.jpeg/.jpgfiles:image/jpeg
- Configure domain restrictions for API keys in Google Cloud Console
- Test all functionality in production environment
- Monitor API usage and quotas
- Domain Restrictions: Limit API keys to your production domain
- HTTPS: Ensure site is served over HTTPS for security
- CDN: Consider using a CDN for better performance
- Monitoring: Set up alerts for API quota usage
- Real audio streaming with proper licensing
- User comments and fan submissions
- Social media integration
- Newsletter signup and fan club features
- Merchandise store integration
- Concert booking and event listings
- Multi-language support
For technical issues or questions about The Honeymoon Suites:
- Check the browser console for error messages
- Verify API key configuration in config.js
- Review security guidelines in
SECURITY.md - Follow detailed setup in
SETUP.md - Test with different browsers and devices
The Honeymoon Suites were a legendary South African glamrock band from Cape Town's vibrant 1990s music scene. Led by charismatic vocalist Kevin Parissien, the band was known for their theatrical performances, elaborate costumes, and unique blend of glamrock and lounge music. Their album "Five Star" remains a classic of South African alternative rock.
Band Members:
- Kevin Parissien - Lead Vocals
- Julie Uranium - Keyboards, Percussion, Vocals
- Bood Carver - Bass, Guitar, Vocals
- Jamie Cloete - Guitar, Bass, Harmonica
- Eastern North - Drums, Vocals
- Douglas Armstrong - Trumpet, Percussion, Vocals
- Ampie Stander - Trombone, Percussion, Vocals
- Chaz Singer - Saxophone, Violins
"Free your ass and your mind will follow" - Kevin Parissien