505 lines
18 KiB
HTML
505 lines
18 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Das Artist Development - Forum Setup</title>
|
|
<style>
|
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
|
|
min-height: 100vh;
|
|
color: #e4e4e4;
|
|
padding: 2rem;
|
|
}
|
|
|
|
.container {
|
|
max-width: 900px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
header {
|
|
text-align: center;
|
|
margin-bottom: 3rem;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 2.5rem;
|
|
background: linear-gradient(90deg, #e94560, #ff6b6b);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.subtitle {
|
|
color: #8892b0;
|
|
font-size: 1.1rem;
|
|
}
|
|
|
|
.category {
|
|
background: rgba(255,255,255,0.05);
|
|
border-radius: 16px;
|
|
padding: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
border: 1px solid rgba(255,255,255,0.1);
|
|
}
|
|
|
|
.category-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.75rem;
|
|
margin-bottom: 1rem;
|
|
padding-bottom: 0.75rem;
|
|
border-bottom: 1px solid rgba(255,255,255,0.1);
|
|
}
|
|
|
|
.category-icon {
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.category-title {
|
|
font-size: 1.25rem;
|
|
font-weight: 600;
|
|
color: #fff;
|
|
}
|
|
|
|
.forum-group {
|
|
background: rgba(0,0,0,0.2);
|
|
border-radius: 12px;
|
|
padding: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.forum-group:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.forum-name {
|
|
font-weight: 600;
|
|
color: #e94560;
|
|
margin-bottom: 0.25rem;
|
|
font-size: 0.95rem;
|
|
}
|
|
|
|
.forum-desc {
|
|
font-size: 0.8rem;
|
|
color: #8892b0;
|
|
margin-bottom: 0.75rem;
|
|
}
|
|
|
|
label {
|
|
display: block;
|
|
font-size: 0.85rem;
|
|
color: #ccd6f6;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
|
|
input[type="text"], textarea {
|
|
width: 100%;
|
|
padding: 0.75rem;
|
|
border: 1px solid rgba(255,255,255,0.15);
|
|
border-radius: 8px;
|
|
background: rgba(0,0,0,0.3);
|
|
color: #fff;
|
|
font-size: 0.95rem;
|
|
margin-bottom: 0.5rem;
|
|
transition: border-color 0.2s, box-shadow 0.2s;
|
|
}
|
|
|
|
input[type="text"]:focus, textarea:focus {
|
|
outline: none;
|
|
border-color: #e94560;
|
|
box-shadow: 0 0 0 3px rgba(233, 69, 96, 0.2);
|
|
}
|
|
|
|
input::placeholder, textarea::placeholder {
|
|
color: #5a6a8a;
|
|
}
|
|
|
|
textarea {
|
|
resize: vertical;
|
|
min-height: 80px;
|
|
}
|
|
|
|
.submit-section {
|
|
text-align: center;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
button {
|
|
background: linear-gradient(90deg, #e94560, #ff6b6b);
|
|
color: #fff;
|
|
border: none;
|
|
padding: 1rem 3rem;
|
|
font-size: 1.1rem;
|
|
font-weight: 600;
|
|
border-radius: 50px;
|
|
cursor: pointer;
|
|
transition: transform 0.2s, box-shadow 0.2s;
|
|
}
|
|
|
|
button:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 10px 30px rgba(233, 69, 96, 0.3);
|
|
}
|
|
|
|
button:active {
|
|
transform: translateY(0);
|
|
}
|
|
|
|
button:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
transform: none;
|
|
}
|
|
|
|
.status {
|
|
margin-top: 1rem;
|
|
padding: 1rem;
|
|
border-radius: 8px;
|
|
display: none;
|
|
}
|
|
|
|
.status.success {
|
|
display: block;
|
|
background: rgba(46, 213, 115, 0.2);
|
|
border: 1px solid rgba(46, 213, 115, 0.5);
|
|
color: #2ed573;
|
|
}
|
|
|
|
.status.error {
|
|
display: block;
|
|
background: rgba(255, 71, 87, 0.2);
|
|
border: 1px solid rgba(255, 71, 87, 0.5);
|
|
color: #ff4757;
|
|
}
|
|
|
|
.helper-text {
|
|
font-size: 0.8rem;
|
|
color: #5a6a8a;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.priority-badge {
|
|
display: inline-block;
|
|
padding: 0.15rem 0.5rem;
|
|
border-radius: 4px;
|
|
font-size: 0.7rem;
|
|
font-weight: 600;
|
|
margin-left: 0.5rem;
|
|
}
|
|
|
|
.priority-high {
|
|
background: rgba(233, 69, 96, 0.3);
|
|
color: #ff6b6b;
|
|
}
|
|
|
|
.priority-medium {
|
|
background: rgba(255, 193, 7, 0.3);
|
|
color: #ffc107;
|
|
}
|
|
|
|
.priority-low {
|
|
background: rgba(100, 181, 246, 0.3);
|
|
color: #64b5f6;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>🎸 Das Artist Development</h1>
|
|
<p class="subtitle">Fill out this form to create initial threads in each forum channel</p>
|
|
</header>
|
|
|
|
<form id="forumForm">
|
|
<!-- PRODUCTION -->
|
|
<div class="category">
|
|
<div class="category-header">
|
|
<span class="category-icon">📀</span>
|
|
<span class="category-title">PRODUCTION</span>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">new-music <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">Core production work. New tracks, ideas, WIPs.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="new-music-title" placeholder="e.g., Current WIPs & Ideas">
|
|
<label>Initial Message</label>
|
|
<textarea name="new-music-message" placeholder="What's currently in the works? Drop track ideas, WIP links, production notes..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">mix-creation <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">DJ mixes, set building, tracklist curation.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="mix-creation-title" placeholder="e.g., Mix Strategy & Tracklists">
|
|
<label>Initial Message</label>
|
|
<textarea name="mix-creation-message" placeholder="Mix goals, target length, vibe, tracklist drafts..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">remixes</div>
|
|
<div class="forum-desc">Remix projects, bootlegs, and edits.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="remixes-title" placeholder="e.g., Remix Targets & Ideas">
|
|
<label>Initial Message</label>
|
|
<textarea name="remixes-message" placeholder="Songs to remix, bootleg ideas, edit concepts..."></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- DISTRIBUTION -->
|
|
<div class="category">
|
|
<div class="category-header">
|
|
<span class="category-icon">📣</span>
|
|
<span class="category-title">DISTRIBUTION</span>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">label-submissions <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">Submitting tracks to labels. (Blocked by: new-music)</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="label-submissions-title" placeholder="e.g., Target Labels & Submission Tracker">
|
|
<label>Initial Message</label>
|
|
<textarea name="label-submissions-message" placeholder="Labels to target, submission status, contacts..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">playlist-pitching <span class="priority-badge priority-medium">MEDIUM</span></div>
|
|
<div class="forum-desc">Getting tracks on curated playlists.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="playlist-pitching-title" placeholder="e.g., Playlist Targets">
|
|
<label>Initial Message</label>
|
|
<textarea name="playlist-pitching-message" placeholder="Playlists to pitch, curators to contact, strategies..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">own-playlist-strategy <span class="priority-badge priority-low">LOW</span></div>
|
|
<div class="forum-desc">Building owned playlists. Playlist ads strategy.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="own-playlist-strategy-title" placeholder="e.g., Owned Playlist Plan">
|
|
<label>Initial Message</label>
|
|
<textarea name="own-playlist-strategy-message" placeholder="Playlist concepts, growth tactics, ad strategies..."></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PROMOTION -->
|
|
<div class="category">
|
|
<div class="category-header">
|
|
<span class="category-icon">🎯</span>
|
|
<span class="category-title">PROMOTION</span>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">paid-social-promo <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">Paid ads, boosted posts, social campaigns.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="paid-social-promo-title" placeholder="e.g., Ad Campaign Strategy">
|
|
<label>Initial Message</label>
|
|
<textarea name="paid-social-promo-message" placeholder="Budget, platforms, targeting, creative ideas..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">landing-pages <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">Landing pages for songs/ads. Conversion funnels.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="landing-pages-title" placeholder="e.g., Landing Page Requirements">
|
|
<label>Initial Message</label>
|
|
<textarea name="landing-pages-message" placeholder="What pages are needed, designs, CTAs, tracking..."></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- NETWORKING -->
|
|
<div class="category">
|
|
<div class="category-header">
|
|
<span class="category-icon">🤝</span>
|
|
<span class="category-title">NETWORKING</span>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">event-networking <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">Networking at music events, shows, festivals.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="event-networking-title" placeholder="e.g., Upcoming Events & Networking Targets">
|
|
<label>Initial Message</label>
|
|
<textarea name="event-networking-message" placeholder="Events to attend, people to meet, networking goals..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">la-promoters-bookings <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">Finding LA event company owners, local bookings. (Blocked by: mix)</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="la-promoters-bookings-title" placeholder="e.g., LA Promoter Research">
|
|
<label>Initial Message</label>
|
|
<textarea name="la-promoters-bookings-message" placeholder="Promoters to research, venues, booking contacts (e.g., Good Society)..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">artist-collabs <span class="priority-badge priority-medium">MEDIUM</span></div>
|
|
<div class="forum-desc">Finding artists to collab with.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="artist-collabs-title" placeholder="e.g., Collab Wishlist & Criteria">
|
|
<label>Initial Message</label>
|
|
<textarea name="artist-collabs-message" placeholder="Artists to collab with, what you're looking for (quality, vibe, following)..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">artist-plays-support <span class="priority-badge priority-low">LOW</span></div>
|
|
<div class="forum-desc">Getting played out by other artists. Goal: Griztronics at the Gorge</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="artist-plays-support-title" placeholder="e.g., DJ Support Goals">
|
|
<label>Initial Message</label>
|
|
<textarea name="artist-plays-support-message" placeholder="Artists to send tracks to, relationship building strategy..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">mentors-advisors</div>
|
|
<div class="forum-desc">Consulting with experienced people in the space.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="mentors-advisors-title" placeholder="e.g., Mentors & Industry Contacts">
|
|
<label>Initial Message</label>
|
|
<textarea name="mentors-advisors-message" placeholder="People to learn from, questions to ask, advice received..."></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- BUSINESS -->
|
|
<div class="category">
|
|
<div class="category-header">
|
|
<span class="category-icon">📊</span>
|
|
<span class="category-title">BUSINESS</span>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">growth-to-revenue <span class="priority-badge priority-high">HIGH PRIORITY</span></div>
|
|
<div class="forum-desc">Calculating growth to $$$. Revenue modeling, monetization strategy.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="growth-to-revenue-title" placeholder="e.g., Revenue Goals & Metrics">
|
|
<label>Initial Message</label>
|
|
<textarea name="growth-to-revenue-message" placeholder="Revenue targets, monetization paths, KPIs to track..."></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- HQ -->
|
|
<div class="category">
|
|
<div class="category-header">
|
|
<span class="category-icon">🛠️</span>
|
|
<span class="category-title">HQ</span>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">general</div>
|
|
<div class="forum-desc">General discussion, random thoughts, quick questions.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="general-title" placeholder="e.g., Welcome & Introductions">
|
|
<label>Initial Message</label>
|
|
<textarea name="general-message" placeholder="Kick things off, introduce the project..."></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">wins</div>
|
|
<div class="forum-desc">Celebrate wins big and small.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="wins-title" placeholder="e.g., Wins Log 2026">
|
|
<label>Initial Message</label>
|
|
<textarea name="wins-message" placeholder="First win to log? Even small ones count!"></textarea>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">meeting-notes</div>
|
|
<div class="forum-desc">Notes from calls, syncs, and planning sessions.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="meeting-notes-title" placeholder="e.g., Kickoff Meeting Notes">
|
|
<label>Initial Message</label>
|
|
<textarea name="meeting-notes-message" placeholder="Notes from your first planning session..."></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- RESOURCES (standalone) -->
|
|
<div class="category">
|
|
<div class="category-header">
|
|
<span class="category-icon">📚</span>
|
|
<span class="category-title">RESOURCES</span>
|
|
</div>
|
|
|
|
<div class="forum-group">
|
|
<div class="forum-name">resources</div>
|
|
<div class="forum-desc">Useful links, tools, templates, guides, reference material.</div>
|
|
<label>Thread Title</label>
|
|
<input type="text" name="resources-title" placeholder="e.g., Useful Tools & Links">
|
|
<label>Initial Message</label>
|
|
<textarea name="resources-message" placeholder="Drop helpful resources, tools, templates..."></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="submit-section">
|
|
<button type="submit">🚀 Create Forum Threads</button>
|
|
<div id="status" class="status"></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<script>
|
|
document.getElementById('forumForm').addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
|
|
const btn = e.target.querySelector('button');
|
|
const status = document.getElementById('status');
|
|
|
|
btn.disabled = true;
|
|
btn.textContent = 'Submitting...';
|
|
status.className = 'status';
|
|
status.style.display = 'none';
|
|
|
|
const formData = new FormData(e.target);
|
|
const forums = {};
|
|
|
|
const forumNames = [
|
|
'new-music', 'mix-creation', 'remixes',
|
|
'label-submissions', 'playlist-pitching', 'own-playlist-strategy',
|
|
'paid-social-promo', 'landing-pages',
|
|
'event-networking', 'la-promoters-bookings', 'artist-collabs', 'artist-plays-support', 'mentors-advisors',
|
|
'growth-to-revenue',
|
|
'general', 'wins', 'meeting-notes', 'resources'
|
|
];
|
|
|
|
forumNames.forEach(name => {
|
|
const title = formData.get(`${name}-title`);
|
|
const message = formData.get(`${name}-message`);
|
|
if (title && title.trim()) {
|
|
forums[name] = { title: title.trim(), message: message?.trim() || '' };
|
|
}
|
|
});
|
|
|
|
try {
|
|
const response = await fetch('/submit', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ forums, submittedBy: 'Dylan' })
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
status.className = 'status success';
|
|
status.textContent = `✅ ${result.message} Buba will create them shortly!`;
|
|
status.style.display = 'block';
|
|
} else {
|
|
throw new Error(result.error || 'Unknown error');
|
|
}
|
|
} catch (err) {
|
|
status.className = 'status error';
|
|
status.textContent = `❌ Error: ${err.message}`;
|
|
status.style.display = 'block';
|
|
}
|
|
|
|
btn.disabled = false;
|
|
btn.textContent = '🚀 Create Forum Threads';
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|