npm - tunecamp - Versions diffs - 1.0.0 - Mend

tunecamp 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (132) hide show

package/.env.local +2 -0
package/.vercel/README.txt +11 -0
package/.vercel/project.json +1 -0
package/LICENSE +22 -0
package/README.md +554 -0
package/dist/cli.d.ts +6 -0
package/dist/cli.d.ts.map +1 -0
package/dist/cli.js +172 -0
package/dist/cli.js.map +1 -0
package/dist/generator/embedGenerator.d.ts +38 -0
package/dist/generator/embedGenerator.d.ts.map +1 -0
package/dist/generator/embedGenerator.js +92 -0
package/dist/generator/embedGenerator.js.map +1 -0
package/dist/generator/feedGenerator.d.ts +50 -0
package/dist/generator/feedGenerator.d.ts.map +1 -0
package/dist/generator/feedGenerator.js +167 -0
package/dist/generator/feedGenerator.js.map +1 -0
package/dist/generator/podcastFeedGenerator.d.ts +54 -0
package/dist/generator/podcastFeedGenerator.d.ts.map +1 -0
package/dist/generator/podcastFeedGenerator.js +173 -0
package/dist/generator/podcastFeedGenerator.js.map +1 -0
package/dist/generator/proceduralCoverGenerator.d.ts +51 -0
package/dist/generator/proceduralCoverGenerator.d.ts.map +1 -0
package/dist/generator/proceduralCoverGenerator.js +228 -0
package/dist/generator/proceduralCoverGenerator.js.map +1 -0
package/dist/generator/siteGenerator.d.ts +55 -0
package/dist/generator/siteGenerator.d.ts.map +1 -0
package/dist/generator/siteGenerator.js +539 -0
package/dist/generator/siteGenerator.js.map +1 -0
package/dist/generator/templateEngine.d.ts +13 -0
package/dist/generator/templateEngine.d.ts.map +1 -0
package/dist/generator/templateEngine.js +146 -0
package/dist/generator/templateEngine.js.map +1 -0
package/dist/index.d.ts +12 -0
package/dist/index.d.ts.map +1 -0
package/dist/index.js +32 -0
package/dist/index.js.map +1 -0
package/dist/parser/catalogParser.d.ts +13 -0
package/dist/parser/catalogParser.d.ts.map +1 -0
package/dist/parser/catalogParser.js +120 -0
package/dist/parser/catalogParser.js.map +1 -0
package/dist/tools/generate-codes.d.ts +14 -0
package/dist/tools/generate-codes.d.ts.map +1 -0
package/dist/tools/generate-codes.js +274 -0
package/dist/tools/generate-codes.js.map +1 -0
package/dist/tools/generate-sea-pair.d.ts +14 -0
package/dist/tools/generate-sea-pair.d.ts.map +1 -0
package/dist/tools/generate-sea-pair.js +111 -0
package/dist/tools/generate-sea-pair.js.map +1 -0
package/dist/types/index.d.ts +117 -0
package/dist/types/index.d.ts.map +1 -0
package/dist/types/index.js +5 -0
package/dist/types/index.js.map +1 -0
package/dist/utils/audioUtils.d.ts +9 -0
package/dist/utils/audioUtils.d.ts.map +1 -0
package/dist/utils/audioUtils.js +67 -0
package/dist/utils/audioUtils.js.map +1 -0
package/dist/utils/configUtils.d.ts +11 -0
package/dist/utils/configUtils.d.ts.map +1 -0
package/dist/utils/configUtils.js +50 -0
package/dist/utils/configUtils.js.map +1 -0
package/dist/utils/fileUtils.d.ts +14 -0
package/dist/utils/fileUtils.d.ts.map +1 -0
package/dist/utils/fileUtils.js +73 -0
package/dist/utils/fileUtils.js.map +1 -0
package/examples/artist-free/README.md +36 -0
package/examples/artist-paycurtain/README.md +49 -0
package/examples/label/README.md +33 -0
package/gundb-keypair.json +8 -0
package/logo.svg +30 -0
package/package-lock.json +1176 -0
package/package.json +42 -0
package/public/assets/community-registry.js +291 -0
package/public/assets/download-stats.js +263 -0
package/public/assets/player.js +219 -0
package/public/assets/style.css +1170 -0
package/public/assets/theme-widget.js +353 -0
package/public/assets/unlock-codes.js +225 -0
package/public/atom.xml +22 -0
package/public/catalog.m3u +3 -0
package/public/feed.xml +22 -0
package/public/image.png +0 -0
package/public/index.html +249 -0
package/public/logo.svg +30 -0
package/public/releases/chirichetto/Homologo - Chirichetto.wav +0 -0
package/public/releases/chirichetto/cover.png +0 -0
package/public/releases/chirichetto/embed-code.txt +16 -0
package/public/releases/chirichetto/embed-compact.txt +8 -0
package/public/releases/chirichetto/embed.html +39 -0
package/public/releases/chirichetto/index.html +389 -0
package/public/releases/chirichetto/playlist.m3u +3 -0
package/templates/dark/assets/community-registry.js +291 -0
package/templates/dark/assets/download-stats.js +263 -0
package/templates/dark/assets/player.js +219 -0
package/templates/dark/assets/style.css +740 -0
package/templates/dark/index.hbs +73 -0
package/templates/dark/layout.hbs +84 -0
package/templates/dark/release.hbs +212 -0
package/templates/default/assets/community-registry.js +291 -0
package/templates/default/assets/download-stats.js +263 -0
package/templates/default/assets/player.js +219 -0
package/templates/default/assets/style.css +1170 -0
package/templates/default/assets/theme-widget.js +353 -0
package/templates/default/assets/unlock-codes.js +225 -0
package/templates/default/index.hbs +188 -0
package/templates/default/layout.hbs +117 -0
package/templates/default/release.hbs +553 -0
package/templates/minimal/assets/community-registry.js +291 -0
package/templates/minimal/assets/download-stats.js +263 -0
package/templates/minimal/assets/player.js +219 -0
package/templates/minimal/assets/style.css +796 -0
package/templates/minimal/index.hbs +73 -0
package/templates/minimal/layout.hbs +84 -0
package/templates/minimal/release.hbs +212 -0
package/templates/retro/assets/community-registry.js +291 -0
package/templates/retro/assets/download-stats.js +263 -0
package/templates/retro/assets/player.js +219 -0
package/templates/retro/assets/style.css +872 -0
package/templates/retro/index.hbs +73 -0
package/templates/retro/layout.hbs +84 -0
package/templates/retro/release.hbs +212 -0
package/templates/translucent/assets/community-registry.js +291 -0
package/templates/translucent/assets/download-stats.js +263 -0
package/templates/translucent/assets/player.js +219 -0
package/templates/translucent/assets/style.css +1352 -0
package/templates/translucent/index.hbs +73 -0
package/templates/translucent/layout.hbs +84 -0
package/templates/translucent/release.hbs +212 -0
package/website/community.html +492 -0
package/website/index.html +195 -0
package/website/styles.css +396 -0
package/website/tunecamp.svg +30 -0

package/website/community.html ADDED Viewed

@@ -0,0 +1,492 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Tunecamp Community - Sites Using Tunecamp</title>
+    <meta name="description" content="Discover artists and music labels using Tunecamp. A decentralized directory of independent music sites.">
+    <link rel="stylesheet" href="styles.css">
+    <style>
+        .community-header {
+            text-align: center;
+            margin-bottom: 60px;
+        }
+        .community-header h1 {
+            font-size: 2.5rem;
+            margin-bottom: 20px;
+        }
+        .community-stats {
+            display: flex;
+            justify-content: center;
+            gap: 40px;
+            margin: 30px 0;
+        }
+        .stat-item {
+            text-align: center;
+        }
+        .stat-number {
+            font-size: 2.5rem;
+            font-weight: bold;
+            color: #007bff;
+        }
+        .stat-label {
+            font-size: 0.9rem;
+            color: #666;
+        }
+        .sites-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+            gap: 25px;
+            margin: 40px 0;
+        }
+        .site-card {
+            background: #f8f9fa;
+            border-radius: 12px;
+            overflow: hidden;
+            transition: transform 0.2s, box-shadow 0.2s;
+            text-decoration: none;
+            color: inherit;
+            display: block;
+        }
+        .site-card:hover {
+            transform: translateY(-4px);
+            box-shadow: 0 8px 25px rgba(0,0,0,0.1);
+            opacity: 1;
+            border-bottom: none;
+        }
+        .site-cover {
+            width: 100%;
+            height: 180px;
+            background: linear-gradient(135deg, #6366f1, #8b5cf6);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 4rem;
+            color: rgba(255,255,255,0.3);
+        }
+        .site-cover img {
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+        }
+        .site-info {
+            padding: 20px;
+        }
+        .site-title {
+            font-size: 1.1rem;
+            font-weight: 600;
+            margin-bottom: 5px;
+            color: #333;
+        }
+        .site-artist {
+            font-size: 0.9rem;
+            color: #666;
+            margin-bottom: 10px;
+        }
+        .site-url {
+            font-size: 0.8rem;
+            color: #007bff;
+            word-break: break-all;
+        }
+        .site-meta {
+            font-size: 0.75rem;
+            color: #999;
+            margin-top: 10px;
+        }
+        .loading {
+            text-align: center;
+            padding: 60px;
+            color: #666;
+        }
+        .loading-spinner {
+            font-size: 2rem;
+            animation: spin 1s linear infinite;
+            margin-bottom: 20px;
+        }
+        @keyframes spin {
+            from { transform: rotate(0deg); }
+            to { transform: rotate(360deg); }
+        }
+        .empty-state {
+            text-align: center;
+            padding: 60px;
+            color: #666;
+        }
+        .empty-state i {
+            font-size: 4rem;
+            color: #ddd;
+            margin-bottom: 20px;
+        }
+        .register-cta {
+            background: linear-gradient(135deg, #6366f1, #8b5cf6);
+            color: white;
+            padding: 40px;
+            border-radius: 12px;
+            text-align: center;
+            margin: 40px 0;
+        }
+        .register-cta h3 {
+            color: white;
+            margin-bottom: 15px;
+        }
+        .register-cta p {
+            opacity: 0.9;
+            margin-bottom: 20px;
+        }
+        .register-cta .btn {
+            background: white;
+            color: #6366f1;
+        }
+        .register-cta .btn:hover {
+            background: #f0f0f0;
+        }
+        .how-it-works {
+            background: #f8f9fa;
+            padding: 30px;
+            border-radius: 12px;
+            margin: 40px 0;
+        }
+        .how-it-works h3 {
+            margin-bottom: 20px;
+        }
+        .how-it-works ol {
+            padding-left: 20px;
+        }
+        .how-it-works li {
+            margin-bottom: 10px;
+            color: #666;
+        }
+        .back-link {
+            margin-bottom: 30px;
+        }
+        .back-link a {
+            color: #666;
+            text-decoration: none;
+            border-bottom: none;
+        }
+        .back-link a:hover {
+            color: #007bff;
+        }
+        .filter-bar {
+            display: flex;
+            gap: 15px;
+            margin-bottom: 30px;
+            flex-wrap: wrap;
+        }
+        .filter-bar input {
+            flex: 1;
+            min-width: 200px;
+            padding: 12px 16px;
+            border: 2px solid #dee2e6;
+            border-radius: 8px;
+            font-family: inherit;
+            font-size: 1rem;
+        }
+        .filter-bar input:focus {
+            outline: none;
+            border-color: #007bff;
+        }
+        .realtime-indicator {
+            display: inline-flex;
+            align-items: center;
+            gap: 8px;
+            font-size: 0.85rem;
+            color: #28a745;
+        }
+        .realtime-dot {
+            width: 8px;
+            height: 8px;
+            background: #28a745;
+            border-radius: 50%;
+            animation: pulse 2s infinite;
+        }
+        @keyframes pulse {
+            0%, 100% { opacity: 1; }
+            50% { opacity: 0.5; }
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <div class="back-link">
+            <a href="index.html">← Back to Tunecamp</a>
+        </div>
+        <header class="community-header">
+            <img src="tunecamp.svg" alt="Tunecamp" class="logo" style="width: 150px; height: 150px;">
+            <h1>Tunecamp Community</h1>
+            <p class="tagline">Discover independent artists and labels using Tunecamp</p>
+            <div class="community-stats">
+                <div class="stat-item">
+                    <div class="stat-number" id="siteCount">-</div>
+                    <div class="stat-label">Sites Registered</div>
+                </div>
+                <div class="stat-item">
+                    <div class="realtime-indicator">
+                        <span class="realtime-dot"></span>
+                        Live Updates
+                    </div>
+                </div>
+            </div>
+        </header>
+        <div class="filter-bar">
+            <input type="text" id="searchInput" placeholder="Search artists, titles..." oninput="filterSites()">
+        </div>
+        <div id="sitesContainer">
+            <div class="loading">
+                <div class="loading-spinner">⟳</div>
+                <p>Loading community sites from decentralized network...</p>
+            </div>
+        </div>
+        <div class="register-cta">
+            <h3>🎵 Join the Community!</h3>
+            <p>Your Tunecamp site is automatically registered when visitors browse it.<br>
+            No sign-up needed - it's fully decentralized via GunDB.</p>
+            <a href="index.html" class="btn">Get Started with Tunecamp</a>
+        </div>
+        <div class="how-it-works">
+            <h3>How does this work?</h3>
+            <ol>
+                <li><strong>Build your site</strong> with Tunecamp and deploy it anywhere</li>
+                <li><strong>Automatic registration</strong> - when someone visits your site, it gets added to this directory</li>
+                <li><strong>Decentralized</strong> - all data is stored on public GunDB peers, no central server</li>
+                <li><strong>Real-time</strong> - new sites appear here instantly as they're discovered</li>
+            </ol>
+            <p style="margin-top: 15px; color: #666; font-size: 0.9rem;">
+                <strong>Privacy:</strong> Only your public site URL, title, and artist name are shared.
+                No personal data or analytics are collected.
+            </p>
+        </div>
+        <footer>
+            <div class="footer-links">
+                <a href="https://github.com/scobru/tunecamp">GitHub</a>
+                <a href="https://www.npmjs.com/package/tunecamp">NPM</a>
+                <a href="index.html">Home</a>
+            </div>
+            <div class="footer-note">
+                Powered by GunDB - a decentralized database.
+            </div>
+        </footer>
+    </div>
+    <!-- GunDB -->
+    <script src="https://cdn.jsdelivr.net/npm/gun/gun.js"></script>
+    <script>
+        // GunDB configuration
+        const REGISTRY_PEERS = [
+            'https://gun.defucc.me/gun',
+            'https://gun.o8.is/gun',
+            'https://shogun-relay.scobrudot.dev/gun',
+            'https://relay.peer.ooo/gun',
+        ];
+        const REGISTRY_ROOT = 'shogun';
+        const REGISTRY_NAMESPACE = 'tunecamp-community';
+        let gun;
+        let allSites = new Map();
+        // Initialize
+        document.addEventListener('DOMContentLoaded', function() {
+            gun = Gun({ peers: REGISTRY_PEERS, localStorage: true });
+            loadSites();
+        });
+        function loadSites() {
+            const container = document.getElementById('sitesContainer');
+            // Subscribe to all sites
+            gun.get(REGISTRY_ROOT).get(REGISTRY_NAMESPACE).get('sites').map().on((data, key) => {
+                if (data && data.url) {
+                    allSites.set(key, {
+                        id: key,
+                        url: data.url,
+                        title: data.title || 'Untitled',
+                        description: data.description || '',
+                        artistName: data.artistName || '',
+                        coverImage: data.coverImage || '',
+                        registeredAt: data.registeredAt,
+                        lastSeen: data.lastSeen,
+                    });
+                    renderSites();
+                }
+            });
+            // Initial render after timeout (in case no sites yet)
+            setTimeout(() => {
+                if (allSites.size === 0) {
+                    container.innerHTML = `
+                        <div class="empty-state">
+                            <i>🎵</i>
+                            <h3>No sites registered yet</h3>
+                            <p>Be the first! Create a Tunecamp site and visitors will automatically register it here.</p>
+                        </div>
+                    `;
+                }
+                updateCount();
+            }, 3000);
+        }
+        function renderSites() {
+            const container = document.getElementById('sitesContainer');
+            const searchTerm = document.getElementById('searchInput').value.toLowerCase();
+            // Convert to array
+            let sitesArray = Array.from(allSites.values());
+            // Deduplicate by title+artist (keep the most recently seen)
+            const dedupMap = new Map();
+            sitesArray.forEach(site => {
+                const key = `${(site.title || '').toLowerCase().trim()}::${(site.artistName || '').toLowerCase().trim()}`;
+                const existing = dedupMap.get(key);
+                if (!existing || (site.lastSeen || 0) > (existing.lastSeen || 0)) {
+                    dedupMap.set(key, site);
+                }
+            });
+            sitesArray = Array.from(dedupMap.values());
+            // Filter by search term
+            if (searchTerm) {
+                sitesArray = sitesArray.filter(site =>
+                    site.title.toLowerCase().includes(searchTerm) ||
+                    site.artistName.toLowerCase().includes(searchTerm) ||
+                    site.url.toLowerCase().includes(searchTerm)
+                );
+            }
+            // Sort by lastSeen (most recent first)
+            sitesArray.sort((a, b) => (b.lastSeen || 0) - (a.lastSeen || 0));
+            if (sitesArray.length === 0) {
+                container.innerHTML = `
+                    <div class="empty-state">
+                        <i>🔍</i>
+                        <h3>No sites found</h3>
+                        <p>${searchTerm ? 'Try a different search term.' : 'No sites registered yet.'}</p>
+                    </div>
+                `;
+                return;
+            }
+            container.innerHTML = `
+                <div class="sites-grid">
+                    ${sitesArray.map(site => renderSiteCard(site)).join('')}
+                </div>
+            `;
+            updateCount();
+        }
+        function renderSiteCard(site) {
+            const coverHtml = site.coverImage
+                ? `<img src="${escapeHtml(site.coverImage)}" alt="${escapeHtml(site.title)}" onerror="this.parentElement.innerHTML='♪'">`
+                : '♪';
+            const displayUrl = site.url.replace(/^https?:\/\//, '').replace(/\/$/, '');
+            const lastSeenDate = site.lastSeen ? formatDate(site.lastSeen) : 'Unknown';
+            return `
+                <a href="${escapeHtml(site.url)}" target="_blank" rel="noopener" class="site-card">
+                    <div class="site-cover">${coverHtml}</div>
+                    <div class="site-info">
+                        <div class="site-title">${escapeHtml(site.title)}</div>
+                        ${site.artistName ? `<div class="site-artist">by ${escapeHtml(site.artistName)}</div>` : ''}
+                        <div class="site-url">${escapeHtml(displayUrl)}</div>
+                        <div class="site-meta">Last seen: ${lastSeenDate}</div>
+                    </div>
+                </a>
+            `;
+        }
+        function filterSites() {
+            renderSites();
+        }
+        function updateCount() {
+            // Count unique sites (deduplicated by title+artist)
+            const dedupMap = new Map();
+            allSites.forEach(site => {
+                const key = `${(site.title || '').toLowerCase().trim()}::${(site.artistName || '').toLowerCase().trim()}`;
+                if (!dedupMap.has(key)) {
+                    dedupMap.set(key, true);
+                }
+            });
+            document.getElementById('siteCount').textContent = dedupMap.size;
+        }
+        function formatDate(timestamp) {
+            const date = new Date(timestamp);
+            const now = new Date();
+            const diffMs = now - date;
+            const diffMins = Math.floor(diffMs / 60000);
+            const diffHours = Math.floor(diffMs / 3600000);
+            const diffDays = Math.floor(diffMs / 86400000);
+            if (diffMins < 1) return 'Just now';
+            if (diffMins < 60) return `${diffMins}m ago`;
+            if (diffHours < 24) return `${diffHours}h ago`;
+            if (diffDays < 7) return `${diffDays}d ago`;
+            return date.toLocaleDateString('en-US', {
+                month: 'short',
+                day: 'numeric',
+                year: date.getFullYear() !== now.getFullYear() ? 'numeric' : undefined,
+            });
+        }
+        function escapeHtml(str) {
+            if (!str) return '';
+            return str
+                .replace(/&/g, '&amp;')
+                .replace(/</g, '&lt;')
+                .replace(/>/g, '&gt;')
+                .replace(/"/g, '&quot;')
+                .replace(/'/g, '&#039;');
+        }
+    </script>
+</body>
+</html>

package/website/index.html ADDED Viewed

@@ -0,0 +1,195 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Tunecamp</title>
+    <meta name="description" content="A modern static site generator for musicians and music labels, inspired by Faircamp. Point Tunecamp at a folder hierarchy containing your audio files and generate a complete, database-free website.">
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div class="container">
+        <header>
+            <img src="tunecamp.svg" alt="Tunecamp" class="logo">
+            <h1>Tunecamp</h1>
+            <p class="tagline">A modern static site generator for musicians and music labels.</p>
+            <p class="tagline">Point Tunecamp at a folder hierarchy containing your audio files.<br>Within minutes, Tunecamp builds a complete website presenting your work.<br>The resulting site requires no database, no programming, and minimal maintenance.</p>
+        </header>
+        <div class="download-section">
+            <h2>Install</h2>
+            <p>Install via npm on Windows, macOS, and Linux</p>
+            <div class="download-buttons">
+                <a href="https://www.npmjs.com/package/tunecamp" class="btn">NPM</a>
+                <a href="https://github.com/scobru/tunecamp" class="btn btn-secondary">GitHub</a>
+                <a href="https://github.com/scobru/tunecamp#quick-start" class="btn btn-secondary">Docs</a>
+            </div>
+            <p><strong>Current version: 0.1.0</strong> | MIT licensed</p>
+        </div>
+        <div class="features">
+            <div class="feature-section">
+                <h2>Audio-First</h2>
+                <p>Built specifically for musicians and music labels with automatic metadata extraction.</p>
+                <ul class="feature-list">
+                    <li><strong>Multi-format Support</strong> MP3, FLAC, OGG, WAV, M4A, and more</li>
+                    <li><strong>Automatic Metadata</strong> Reads tags from your audio files</li>
+                    <li><strong>Built-in Player</strong> Modern HTML5 audio player</li>
+                    <li><strong>Zero Database</strong> Pure static HTML generation</li>
+                </ul>
+            </div>
+            <div class="feature-section">
+                <h2>Download Models</h2>
+                <p>Flexible download options to match your distribution style.</p>
+                <ul class="feature-list">
+                    <li><strong>Free Downloads</strong> Make all tracks immediately available</li>
+                    <li><strong>Soft Paycurtain (Honor System)</strong> Show PayPal/Stripe links with a suggested price, but downloads remain always available - it's up to the listener to support you</li>
+                    <li><strong>Unlock Codes</strong> Protect downloads with codes validated via GunDB (requires self-hosting to generate codes)</li>
+                    <li><strong>Download Stats</strong> Track download counts via decentralized GunDB</li>
+                </ul>
+            </div>
+            <div class="feature-section">
+                <h2>For Musicians & Labels</h2>
+                <p>Perfect for solo artists, bands, and music labels of all sizes.</p>
+                <ul class="feature-list">
+                    <li><strong>Solo Artists</strong> Showcase your complete discography</li>
+                    <li><strong>Bands & Collectives</strong> Represent your musical projects</li>
+                    <li><strong>Music Labels</strong> Multi-artist catalog support</li>
+                    <li><strong>Flexible Structure</strong> Organize releases, tracks, and metadata</li>
+                </ul>
+            </div>
+            <div class="feature-section">
+                <h2>Modern & Fast</h2>
+                <p>Built with modern web standards for optimal performance.</p>
+                <ul class="feature-list">
+                    <li><strong>Responsive Design</strong> Works on all devices</li>
+                    <li><strong>Fast Loading</strong> Static sites that load instantly</li>
+                    <li><strong>Mobile Friendly</strong> Optimized for mobile devices</li>
+                    <li><strong>SEO Ready</strong> Search engine optimized</li>
+                </ul>
+            </div>
+            <div class="feature-section">
+                <h2>Beautiful Themes</h2>
+                <p>Five ready-to-use themes with customizable options.</p>
+                <ul class="feature-list">
+                    <li><strong>Default</strong> Modern dark theme with purple/blue gradients</li>
+                    <li><strong>Minimal</strong> Clean light theme with lots of white space</li>
+                    <li><strong>Dark</strong> Aggressive dark theme with red accents</li>
+                    <li><strong>Retro</strong> 80s-inspired theme with neon colors</li>
+                    <li><strong>Translucent</strong> Glassmorphism with blur effects</li>
+                </ul>
+            </div>
+            <div class="feature-section">
+                <h2>Easy Configuration</h2>
+                <p>Simple YAML-based configuration for maximum flexibility.</p>
+                <ul class="feature-list">
+                    <li><strong>YAML Configuration</strong> Easy-to-edit config files</li>
+                    <li><strong>Artist Profiles</strong> Bio, links, and social media</li>
+                    <li><strong>Release Metadata</strong> Dates, descriptions, and credits</li>
+                    <li><strong>Custom Themes</strong> Create your own theme templates</li>
+                </ul>
+            </div>
+            <div class="feature-section">
+                <h2>Advanced Features</h2>
+                <p>Everything you need for modern distribution and sharing.</p>
+                <ul class="feature-list">
+                    <li><strong>RSS & Atom</strong> Automatic feed generation for releases</li>
+                    <li><strong>Podcast RSS</strong> Generate podcast feeds from your catalog</li>
+                    <li><strong>Embed Widgets</strong> Share releases with embeddable players</li>
+                    <li><strong>M3U Playlists</strong> Playlists per release and for the whole catalog</li>
+                    <li><strong>Procedural Covers</strong> Auto-generate cover art when missing</li>
+                    <li><strong>Unlock Codes</strong> Download protection via GunDB (requires self-hosting for code generation)</li>
+                </ul>
+            </div>
+            <div class="feature-section">
+                <h2>🌐 Community Directory</h2>
+                <p>Join the decentralized Tunecamp community!</p>
+                <ul class="feature-list">
+                    <li><strong>Auto-Discovery</strong> Your site is automatically registered when visitors browse it</li>
+                    <li><strong>Decentralized</strong> No sign-up, no central server - powered by GunDB</li>
+                    <li><strong>Real-time</strong> New sites appear instantly in the community directory</li>
+                    <li><strong>Privacy-First</strong> Only public info shared (URL, title, artist name)</li>
+                </ul>
+                <p style="margin-top: 15px;"><a href="community.html" class="btn btn-secondary">Browse Community →</a></p>
+            </div>
+        </div>
+        <!-- <div class="example-sites">
+            <h3>Sites Using Tunecamp</h3>
+            <p>These are some example sites - but many more are out there!</p>
+            <div class="site-links">
+                <a href="#" class="site-link">example1.com</a>
+                <a href="#" class="site-link">example2.com</a>
+                <a href="#" class="site-link">example3.com</a>
+                <a href="#" class="site-link">example4.com</a>
+                <a href="#" class="site-link">example5.com</a>
+                <a href="#" class="site-link">example6.com</a>
+            </div>
+        </div> -->
+        <div class="principles">
+            <h3>Tunecamp adheres to these principles:</h3>
+            <ul class="principles-list">
+                <li>Personal</li>
+                <li>Plain</li>
+                <li>Small</li>
+                <li>Simple</li>
+                <li>Light</li>
+                <li>Fast</li>
+                <li>Reduced</li>
+                <li>Elegant</li>
+                <li>Stable</li>
+                <li>Low/No-Maintenance</li>
+                <li>Free</li>
+                <li>Independent</li>
+                <li>Privacy-Respecting</li>
+                <li>Standards-Conforming</li>
+            </ul>
+        </div>
+        <div class="code-block">
+            <h3>Quick Start</h3>
+            <pre><code><span class="comment"># Install Tunecamp</span>
+npm install -g tunecamp
+<span class="comment"># Create your music catalog</span>
+mkdir my-music
+cd my-music
+<span class="comment"># Initialize catalog structure</span>
+tunecamp init .
+<span class="comment"># Add your audio files</span>
+cp *.mp3 releases/example-album/tracks/
+<span class="string"># (optional) rename example-album to your release slug</span>
+<span class="comment"># Configure your catalog</span>
+<span class="string"># Edit catalog.yaml, artist.yaml, and release.yaml files</span>
+<span class="comment"># Generate your website</span>
+tunecamp build . --output ./public
+<span class="comment"># Deploy to any static host</span>
+<span class="string"># Upload the public folder to Netlify, Vercel, GitHub Pages, etc.</span></code></pre>
+        </div>
+        <footer>
+            <div class="footer-links">
+                <a href="https://github.com/scobru/tunecamp">GitHub</a>
+                <a href="https://www.npmjs.com/package/tunecamp">NPM</a>
+                <a href="community.html">🌐 Community</a>
+            </div>
+            <div class="footer-note">
+                This page uses no cookies and no client-side scripts.
+            </div>
+        </footer>
+    </div>
+</body>
+</html>