IBD Music Studio — Inspired by Denisha

Studio Home

Inspired by Denisha · AI Music Production Studio

Title

Type

Genre

Mood

BPM (optional)

Inspiration / Concept

</div>
    <div class="flex-row">
      <button class="btn-primary" onclick="createProject()">Create Project</button>
      <button class="btn-ghost" onclick="document.getElementById('newProjectModal').classList.remove('open')">Cancel</button>
    </div>
  </div>
</div>

/* ══ COLOURS ══ */
const TYPE_COLORS = {
  'Song':'#d4a574','Poem':'#a78bfa','Spoken Word':'#f472b6',
  'Short Story':'#60a5fa','Lyrics Only':'#fb923c','Musical Theatre':'#4ade80'
};
const GENRE_EMOJIS = {
  'R&B / Soul':'🎷','Pop':'🎤','Gospel / Inspirational':'🙏','Hip-Hop / Rap':'🎧',
  'Afrobeats':'🥁','Neo-Soul':'🌙','Acoustic / Singer-Songwriter':'🎸',
  'Musical Theatre':'🎭','Spoken Word / Slam Poetry':'🎙️','Lo-fi / Chill':'☕'
};
const STATUSES = ['Idea','Draft','In Progress','Complete','Recording','Released'];
const STATUS_COLORS = {'Idea':'#6e6560','Draft':'#60a5fa','In Progress':'#fb923c','Complete':'#4ade80','Recording':'#a78bfa','Released':'#d4a574'};

/* ══ STORAGE ══ */
function loadProjects() { try { return JSON.parse(localStorage.getItem(PROJ_KEY) || '[]'); } catch(e) { return []; } }
function saveProjects(d) { localStorage.setItem(PROJ_KEY, JSON.stringify(d)); }
function loadPRS() { try { return JSON.parse(localStorage.getItem(PRS_KEY) || '[]'); } catch(e) { return []; } }
function savePRS(d) { localStorage.setItem(PRS_KEY, JSON.stringify(d)); }
function loadRevData() { try { return JSON.parse(localStorage.getItem(REV_KEY) || '{}'); } catch(e) { return {}; } }
function saveRevData(d) { localStorage.setItem(REV_KEY, JSON.stringify(d)); }

/* ══ STATE ══ */
let currentView = 'dashboard';
let currentProjectId = null;
let currentProjectTab = 'overview';

/* ══ API ══ */
function openKeyModal() {
  const k = localStorage.getItem('ibd_api_key');
  if (k) document.getElementById('keyInput').value = k;
  document.getElementById('keyModal').classList.add('open');
}
function closeKeyModal() { document.getElementById('keyModal').classList.remove('open'); }
function saveKey() {
  const k = document.getElementById('keyInput').value.trim();
  if (!k) return;
  localStorage.setItem('ibd_api_key', k);
  updateApiStatus(true); closeKeyModal(); showToast('AI connected ✓');
}
function clearKey() { localStorage.removeItem('ibd_api_key'); updateApiStatus(false); closeKeyModal(); }
function updateApiStatus(on) {
  document.getElementById('apiDot').className = 'api-dot' + (on ? ' on' : '');
  document.getElementById('apiText').textContent = on ? 'AI Connected' : 'AI Not Connected';
}
async function callAI(prompt, maxTokens = 1600) {
  const key = localStorage.getItem('ibd_api_key');
  if (!key) { openKeyModal(); throw new Error('No API key'); }
  const res = await fetch('https://api.anthropic.com/v1/messages', {
    method: 'POST',
    headers: { 'x-api-key': key, 'anthropic-version': '2023-06-01', 'content-type': 'application/json', 'anthropic-dangerous-direct-browser-iab': 'true' },
    body: JSON.stringify({ model: 'claude-haiku-4-5-20251001', max_tokens: maxTokens, messages: [{ role: 'user', content: prompt }] })
  });
  const data = await res.json();
  if (data.error) throw new Error(data.error.message);
  return data.content?.[0]?.text || '';
}

/* ══ NAVIGATION ══ */
function switchMainView(view, btn) {
  currentView = view;
  currentProjectId = null;
  document.querySelectorAll('.sidebar-nav-btn').forEach(b => b.classList.remove('active'));
  if (btn) btn.classList.add('active');
  document.querySelectorAll('.panel').forEach(p => p.classList.remove('active'));
  document.getElementById('view-' + view).classList.add('active');
  document.getElementById('workspaceTabs').style.display = 'none';
  renderView(view);
}
function openProject(id) {
  currentProjectId = id;
  currentView = 'project';
  currentProjectTab = 'overview';
  document.querySelectorAll('.sidebar-nav-btn').forEach(b => b.classList.remove('active'));
  document.querySelectorAll('.panel').forEach(p => p.classList.remove('active'));
  document.getElementById('view-project-overview').classList.add('active');
  document.getElementById('workspaceTabs').style.display = 'flex';
  const proj = loadProjects().find(p => p.id === id);
  if (proj) {
    document.getElementById('workspaceTitle').innerHTML = `<em>${proj.title}</em>`;
    document.getElementById('workspaceMeta').textContent = proj.type + ' · ' + proj.genre + ' · ' + proj.status;
  }
  renderProjectOverview(id);
  renderSidebar();
}
function switchProjectTab(tab, btn) {
  currentProjectTab = tab;
  document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
  btn.classList.add('active');
  document.querySelectorAll('.panel[id^="view-project-"]').forEach(p => p.classList.remove('active'));
  document.getElementById('view-project-' + tab).classList.add('active');
  if (tab === 'lyrics') renderProjectLyrics(currentProjectId);
  else if (tab === 'structure') renderProjectStructure(currentProjectId);
  else if (tab === 'beats') renderProjectBeats(currentProjectId);
  else if (tab === 'notes') renderProjectNotes(currentProjectId);
  else renderProjectOverview(currentProjectId);
}
function renderView(view) {
  if (view === 'dashboard') renderDashboard();
  else if (view === 'projects') renderAllProjects();
  else if (view === 'beatlab') renderBeatLab();
  else if (view === 'prs') renderPRS();
  else if (view === 'release') renderReleasePlanner();
  else if (view === 'revenue') renderRevenue();
  const titles = { dashboard:'<em>Studio</em> Home', projects:'<em>All</em> Projects', beatlab:'<em>Beat</em> Lab', prs:'PRS & <em>Publishing</em>', release:'<em>Release</em> Planner', revenue:'<em>Music</em> Revenue' };
  if (titles[view]) { document.getElementById('workspaceTitle').innerHTML = titles[view]; document.getElementById('workspaceMeta').textContent = 'Inspired by Denisha · AI Music Production Studio'; }
}
function renderSidebar() {
  const projects = loadProjects();
  const list = document.getElementById('projectList');
  if (projects.length === 0) {
    list.innerHTML = '<div style="padding:16px 11px;font-size:.7rem;color:var(--text-3);line-height:1.6">No projects yet.<br/>Click <strong style="color:var(--copper)">+ New Project</strong> to start your first song.</div>';
    return;
  }
  list.innerHTML = projects.slice().reverse().map(p => {
    const col = TYPE_COLORS[p.type] || '#d4a574';
    const emoji = GENRE_EMOJIS[p.genre] || '🎵';
    return `<div class="project-item ${currentProjectId === p.id ? 'active' : ''}" onclick="openProject('${p.id}')">
      <div class="project-emoji">${emoji}</div>
      <div class="project-info">
        <div class="project-name">${p.title}</div>
        <div class="project-meta">${p.genre} · ${p.status}</div>
      </div>
      <div class="project-type-tag" style="background:${col}22;color:${col};border:1px solid ${col}44">${p.type.split(' ')[0]}</div>
    </div>`;
  }).join('');
}

/* ══ PROJECT CRUD ══ */
function showNewProjectModal() { document.getElementById('newProjectModal').classList.add('open'); }
function createProject() {
  const title = document.getElementById('np_title').value.trim() || 'Untitled';
  const proj = {
    id: 'p' + Date.now(),
    title, type: document.getElementById('np_type').value,
    genre: document.getElementById('np_genre').value,
    mood: document.getElementById('np_mood').value,
    bpm: document.getElementById('np_bpm').value || '',
    concept: document.getElementById('np_concept').value || '',
    status: 'Idea', created: new Date().toLocaleDateString('en-GB'),
    sections: { verse1:'', prechorus:'', chorus:'', verse2:'', bridge:'', outro:'' },
    notes: '', structure: [], coWriteHistory: []
  };
  const projects = loadProjects();
  projects.push(proj);
  saveProjects(projects);
  document.getElementById('newProjectModal').classList.remove('open');
  renderSidebar();
  openProject(proj.id);
  showToast('Project created ✓');
}
function updateProject(id, updates) {
  const projects = loadProjects();
  const i = projects.findIndex(p => p.id === id);
  if (i > -1) { Object.assign(projects[i], updates); saveProjects(projects); }
}
function deleteProject(id) {
  if (!confirm('Delete this project? This cannot be undone.')) return;
  saveProjects(loadProjects().filter(p => p.id !== id));
  renderSidebar();
  switchMainView('projects', null);
  showToast('Project deleted');
}

/* ══ DASHBOARD ══ */
function renderDashboard() {
  const projects = loadProjects();
  const total = projects.length;
  const complete = projects.filter(p => ['Complete','Released'].includes(p.status)).length;
  const inProgress = projects.filter(p => p.status === 'In Progress').length;
  const songs = projects.filter(p => p.type === 'Song').length;
  const p = document.getElementById('view-dashboard');
  p.innerHTML = `
    <div class="dash-hero">
      <div class="dash-hero-eyebrow">Inspired by Denisha · AI Music Production Studio</div>
      <div class="dash-hero-title">Welcome to your <em>Creative Space</em></div>
      <div class="dash-hero-sub">Your songs, your stories, your voice — all in one place. Write lyrics with AI, generate beats for Suno and Udio, track your PRS royalties, and plan every release like a label would.</div>
      <div class="flex-row">
        <button class="btn-primary" onclick="showNewProjectModal()">+ New Project</button>
        <button class="btn-ghost" onclick="switchMainView('beatlab', document.querySelector('.sidebar-nav-btn:nth-child(3)'))">🎛️ Beat Lab</button>
      </div>
    </div>
    <div class="dash-stats">
      <div class="dash-stat"><div class="dash-stat-num">${total}</div><div class="dash-stat-label">Total Projects</div></div>
      <div class="dash-stat"><div class="dash-stat-num">${songs}</div><div class="dash-stat-label">Songs</div></div>
      <div class="dash-stat"><div class="dash-stat-num">${inProgress}</div><div class="dash-stat-label">In Progress</div></div>
      <div class="dash-stat"><div class="dash-stat-num">${complete}</div><div class="dash-stat-label">Complete</div></div>
    </div>
    <div class="section-head"><h2>Quick <em>Actions</em></h2></div>
    <div class="quick-actions-grid">
      <div class="quick-action-card" onclick="showNewProjectModal()">
        <div class="quick-action-icon">🎵</div>
        <div class="quick-action-title">New Song Project</div>
        <div class="quick-action-desc">Start writing — AI will help develop your lyrics, structure, and sound</div>
      </div>
      <div class="quick-action-card" onclick="switchMainView('beatlab', null)">
        <div class="quick-action-icon">🎛️</div>
        <div class="quick-action-title">Generate Beat Prompts</div>
        <div class="quick-action-desc">Create perfect Suno.ai & Udio.com prompts for any genre and mood</div>
      </div>
      <div class="quick-action-card" onclick="switchMainView('release', null)">
        <div class="quick-action-icon">🚀</div>
        <div class="quick-action-title">Plan a Release</div>
        <div class="quick-action-desc">Full 8-week campaign plan for your next single, EP, or album</div>
      </div>
      <div class="quick-action-card" onclick="switchMainView('prs', null)">
        <div class="quick-action-icon">📋</div>
        <div class="quick-action-title">PRS Registration</div>
        <div class="quick-action-desc">Register your songs and track royalty status for every piece</div>
      </div>
      <div class="quick-action-card" onclick="switchMainView('revenue', null)">
        <div class="quick-action-icon">💰</div>
        <div class="quick-action-title">Music Revenue</div>
        <div class="quick-action-desc">Track streaming, PRS, sync, and live performance income</div>
      </div>
      <div class="quick-action-card" onclick="switchMainView('projects', null)">
        <div class="quick-action-icon">📚</div>
        <div class="quick-action-title">All Projects</div>
        <div class="quick-action-desc">View your full creative catalog — songs, poems, stories, and more</div>
      </div>
    </div>
    ${total > 0 ? `
    <div class="section-head mt-24"><h2>Recent <em>Projects</em></h2></div>
    <div class="projects-grid">
      ${projects.slice(-3).reverse().map(proj => buildProjectCard(proj)).join('')}
    </div>` : ''}`;
}

/* ══ ALL PROJECTS ══ */
function renderAllProjects() {
  const projects = loadProjects();
  const p = document.getElementById('view-projects');
  p.innerHTML = `
    <div class="section-head">
      <h2>All <em>Projects</em></h2>
      <button class="btn-primary btn-sm" onclick="showNewProjectModal()">+ New Project</button>
    </div>
    ${projects.length === 0 ? `
      <div style="text-align:center;padding:60px 20px">
        <div style="font-size:3rem;opacity:.3;margin-bottom:12px">🎵</div>
        <div style="font-size:.84rem;color:var(--text-3)">No projects yet. Start with your first song.</div>
        <button class="btn-primary" style="margin-top:16px" onclick="showNewProjectModal()">+ Create First Project</button>
      </div>` :
      `<div class="projects-grid">${projects.slice().reverse().map(proj => buildProjectCard(proj)).join('')}</div>`
    }`;
}
function buildProjectCard(proj) {
  const col = TYPE_COLORS[proj.type] || '#d4a574';
  const emoji = GENRE_EMOJIS[proj.genre] || '🎵';
  const statCol = STATUS_COLORS[proj.status] || '#6e6560';
  const wordCount = Object.values(proj.sections || {}).join(' ').split(/\s+/).filter(w => w).length;
  return `<div class="proj-card" onclick="openProject('${proj.id}')">
    <div class="proj-card-top" style="background:${col}"></div>
    <div class="proj-card-body">
      <div class="proj-card-type" style="background:${col}22;color:${col};border:1px solid ${col}44">${proj.type}</div>
      <div class="proj-card-title">${proj.title}</div>
      <div class="proj-card-genre">${emoji} ${proj.genre} · ${proj.mood || ''} ${proj.bpm ? '· ' + proj.bpm + ' BPM' : ''}</div>
      <div class="proj-card-status" style="color:${statCol}">● ${proj.status}</div>
      ${wordCount > 0 ? `<div style="font-size:.62rem;color:var(--text-3);margin-top:4px">${wordCount} words written</div>` : ''}
    </div>
    <div class="proj-card-foot">
      <button class="btn-ghost btn-sm" onclick="event.stopPropagation();openProject('${proj.id}')">Open ↗</button>
      <button class="copy-btn btn-sm" onclick="event.stopPropagation();deleteProject('${proj.id}')" style="color:var(--danger);border-color:rgba(239,68,68,.3)">Delete</button>
    </div>
  </div>`;
}

/* ══ PROJECT OVERVIEW ══ */
function renderProjectOverview(id) {
  const proj = loadProjects().find(p => p.id === id);
  if (!proj) return;
  const col = TYPE_COLORS[proj.type] || '#d4a574';
  const wordCount = Object.values(proj.sections || {}).join(' ').split(/\s+/).filter(w => w).length;
  const p = document.getElementById('view-project-overview');
  p.innerHTML = `
    <div class="card-gold card" style="margin-bottom:18px">
      <div style="display:flex;align-items:start;justify-content:space-between;gap:14px;flex-wrap:wrap">
        <div>
          <div style="font-size:.58rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--copper);margin-bottom:6px">${proj.type} · ${proj.genre}</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:1.7rem;font-weight:300;color:var(--text);margin-bottom:4px">${proj.title}</div>
          <div style="font-size:.76rem;color:var(--text-2)">${proj.mood || ''}${proj.bpm ? ' · ' + proj.bpm + ' BPM' : ''}</div>
        </div>
        <div>
          <label style="margin-bottom:6px">Status</label>
          <select onchange="updateProjectStatus('${id}',this.value)" style="width:160px">
            ${STATUSES.map(s => `<option${proj.status === s ? ' selected' : ''}>${s}</option>`).join('')}
          </select>
        </div>
      </div>
      ${proj.concept ? `<div style="margin-top:14px;padding-top:14px;border-top:1px solid var(--border);font-size:.78rem;color:var(--text-2);line-height:1.6;font-weight:300;font-style:italic">"${proj.concept}"</div>` : ''}
    </div>
    <div class="grid-4" style="margin-bottom:20px">
      <div class="dash-stat"><div class="dash-stat-num">${wordCount}</div><div class="dash-stat-label">Words Written</div></div>
      <div class="dash-stat"><div class="dash-stat-num">${Object.values(proj.sections || {}).filter(v => v.trim()).length}</div><div class="dash-stat-label">Sections Done</div></div>
      <div class="dash-stat"><div class="dash-stat-num">${proj.coWriteHistory?.length || 0}</div><div class="dash-stat-label">AI Sessions</div></div>
      <div class="dash-stat"><div class="dash-stat-num">${proj.created}</div><div class="dash-stat-label">Created</div></div>
    </div>
    <div class="section-head"><h2>AI <em>Co-Write Session</em></h2></div>
    <div class="card" style="margin-bottom:18px">
      <div class="form-row">
        <label>What do you need help with?</label>
        <select id="ov_aiMode">
          <option>Write a full song based on my concept</option>
          <option>Write just the chorus for this song</option>
          <option>Write Verse 1 based on my concept</option>
          <option>Give me 5 different hook options</option>
          <option>Develop my existing lyrics further</option>
          <option>Rewrite to make it more powerful</option>
          <option>Suggest a bridge section</option>
          <option>Make the lyrics rhyme better</option>
          <option>Convert this concept to spoken word</option>
        </select>
      </div>
      <div class="form-row">
        <label>Any extra direction? (optional)</label>
        <textarea id="ov_aiExtra" style="min-height:60px" placeholder="e.g. 'Make it more vulnerable', 'Reference rising up after failure', 'Keep it under 3 minutes'…">

`; } function updateProjectStatus(id, status) { updateProject(id, { status }); const proj = loadProjects().find(p => p.id === id); if (proj) document.getElementById('workspaceMeta').textContent = proj.type + ' · ' + proj.genre + ' · ' + status; renderSidebar(); showToast('Status updated ✓'); } async function runProjectAI(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const mode = document.getElementById('ov_aiMode').value; const extra = document.getElementById('ov_aiExtra').value; const existingLyrics = Object.entries(proj.sections || {}).filter(([,v]) => v.trim()).map(([k,v]) => k.toUpperCase() + ':\n' + v).join('\n\n'); const btn = document.getElementById('ov_aiBtn'); btn.disabled = true; btn.textContent = '✨ Writing…'; document.getElementById('ov_output').style.display = 'block'; document.getElementById('ov_outputBody').innerHTML = '

AI is writing your lyrics…

'; const prompt = `You are a professional songwriter working with Denisha Shaw — artist, author, and founder of Inspired by Denisha. Song: "${proj.title}" Type: ${proj.type} Genre: ${proj.genre} Mood: ${proj.mood} BPM: ${proj.bpm || 'flexible'} Concept: ${proj.concept || 'not specified'} ${existingLyrics ? 'Existing Lyrics:\n' + existingLyrics : ''} Task: ${mode} ${extra ? 'Additional direction: ' + extra : ''} Write in Denisha's voice — empowering, real, emotionally resonant, confident. No filler lines. Format with section headers (VERSE 1, PRE-CHORUS, CHORUS etc). Make every line count.`; try { const text = await callAI(prompt, 1800); document.getElementById('ov_outputBody').textContent = text; window._ovOutput = text; const proj2 = loadProjects().find(p => p.id === id); if (proj2) { if (!proj2.coWriteHistory) proj2.coWriteHistory = []; proj2.coWriteHistory.push({ date: new Date().toLocaleDateString('en-GB'), mode, text: text.slice(0,200) + '…' }); updateProject(id, { coWriteHistory: proj2.coWriteHistory }); } renderProjectOverview(id); showToast('Lyrics generated ✓'); } catch(e) { document.getElementById('ov_outputBody').textContent = 'Error: ' + e.message; } btn.disabled = false; btn.textContent = '✨ Generate with AI'; } function copyOvOutput() { navigator.clipboard.writeText(window._ovOutput || ''); showToast('Copied ✓'); } function saveAIToLyrics(id) { const text = window._ovOutput || ''; if (!text) return; const proj = loadProjects().find(p => p.id === id); if (!proj) return; // parse sections from AI output const sectionMap = { 'verse 1': 'verse1', 'pre-chorus': 'prechorus', 'pre chorus': 'prechorus', 'chorus': 'chorus', 'verse 2': 'verse2', 'bridge': 'bridge', 'outro': 'outro', 'hook': 'chorus' }; const sections = { ...proj.sections }; let currentSection = null; let currentText = []; text.split('\n').forEach(line => { const lower = line.toLowerCase().trim(); const match = Object.keys(sectionMap).find(k => lower.startsWith(k)); if (match) { if (currentSection) sections[sectionMap[currentSection]] = currentText.join('\n').trim(); currentSection = match; currentText = []; } else if (currentSection) currentText.push(line); }); if (currentSection) sections[sectionMap[currentSection]] = currentText.join('\n').trim(); updateProject(id, { sections }); showToast('Saved to Lyrics tab ✓'); } /* ══ LYRIC EDITOR ══ */ const LYRIC_SECTIONS = [ { key:'verse1', label:'Verse 1', color:'#d4a574', bars:8 }, { key:'prechorus', label:'Pre-Chorus', color:'#a78bfa', bars:4 }, { key:'chorus', label:'Chorus', color:'#f472b6', bars:8 }, { key:'verse2', label:'Verse 2', color:'#d4a574', bars:8 }, { key:'bridge', label:'Bridge', color:'#60a5fa', bars:4 }, { key:'outro', label:'Outro', color:'#4ade80', bars:4 } ]; function renderProjectLyrics(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const sections = proj.sections || {}; const allText = Object.values(sections).join(' '); const wordCount = allText.split(/\s+/).filter(w => w).length; const lineCount = allText.split('\n').filter(l => l.trim()).length; const estTime = Math.round(wordCount / 130 * 60); const p = document.getElementById('view-project-lyrics'); p.innerHTML = `

${LYRIC_SECTIONS.map(s => `

${s.label}

`).join('')}

`; } function saveLyricSection(id, sectionKey, value) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const sections = { ...proj.sections, [sectionKey]: value }; updateProject(id, { sections }); } function saveAllLyrics(id) { LYRIC_SECTIONS.forEach(s => { const el = document.getElementById('ls_' + s.key); if (el) saveLyricSection(id, s.key, el.value); }); showToast('Saved ✓'); } function copySection(key, id) { const el = document.getElementById('ls_' + key); if (el) navigator.clipboard.writeText(el.value); showToast('Copied ✓'); } function copyAllLyrics(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const text = LYRIC_SECTIONS.filter(s => (proj.sections[s.key]||'').trim()).map(s => s.label.toUpperCase() + '\n' + proj.sections[s.key]).join('\n\n'); navigator.clipboard.writeText(text); showToast('All lyrics copied ✓'); } function downloadLyrics(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const text = `${proj.title}\nBy Denisha Shaw (Inspired by Denisha)\n${proj.genre} · ${proj.mood}\n\n` + LYRIC_SECTIONS.filter(s => (proj.sections[s.key]||'').trim()).map(s => s.label.toUpperCase() + '\n' + proj.sections[s.key]).join('\n\n'); const b = new Blob([text], { type: 'text/plain' }); const a = document.createElement('a'); a.href = URL.createObjectURL(b); a.download = proj.title.replace(/\s+/g,'_') + '_lyrics.txt'; a.click(); } function updateWordcounts() { let total = 0; let totalLines = 0; LYRIC_SECTIONS.forEach(s => { const el = document.getElementById('ls_' + s.key); const text = el ? el.value : ''; const wc = text.split(/\s+/).filter(w => w).length; const lc = text.split('\n').filter(l => l.trim()).length; total += wc; totalLines += lc; const wcEl = document.getElementById('wc_' + s.key); if (wcEl) wcEl.textContent = wc; }); const tEl = document.getElementById('wc_total'); if (tEl) tEl.textContent = total; const lEl = document.getElementById('wc_lines'); if (lEl) lEl.textContent = totalLines; const est = Math.round(total / 130 * 60); const tTEl = document.getElementById('wc_time'); if (tTEl) tTEl.textContent = Math.floor(est/60) + ':' + String(est%60).padStart(2,'0'); } async function aiExpandSection(sectionKey, id, sectionLabel) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const existing = (proj.sections[sectionKey] || '').trim(); const prompt = `Write a ${sectionLabel} for this song by Denisha Shaw. Song: "${proj.title}" · ${proj.genre} · ${proj.mood} Concept: ${proj.concept || 'empowering personal growth'} ${existing ? 'Existing ' + sectionLabel + ' to develop/complete:\n' + existing : 'Write a fresh ' + sectionLabel} Rules: Empowering, authentic, no filler. 4-8 lines. Ready to sing immediately.`; try { const text = await callAI(prompt, 600); const el = document.getElementById('ls_' + sectionKey); if (el) { el.value = text.trim(); saveLyricSection(id, sectionKey, text.trim()); updateWordcounts(); } showToast(sectionLabel + ' written ✓'); } catch(e) { showToast('Error: ' + e.message); } } async function findRhymes() { const word = document.getElementById('rhyme_input').value.trim(); if (!word) return; try { const text = await callAI(`Give me 20 words that rhyme with or near-rhyme with "${word}". Format as a simple comma-separated list. Include perfect rhymes, near rhymes, and slant rhymes. Keep it useful for songwriting.`, 300); document.getElementById('rhyme_output').textContent = text; } catch(e) { document.getElementById('rhyme_output').textContent = 'Error — check your API key'; } } /* ══ STRUCTURE BUILDER ══ */ const STRUCTURE_SECTIONS = [ { key:'intro', label:'Intro', color:'#6e6560', defaultBars:4 }, { key:'verse1', label:'Verse 1', color:'#d4a574', defaultBars:8 }, { key:'prechorus', label:'Pre-Chorus', color:'#a78bfa', defaultBars:4 }, { key:'chorus', label:'Chorus', color:'#f472b6', defaultBars:8 }, { key:'verse2', label:'Verse 2', color:'#d4a574', defaultBars:8 }, { key:'chorus2', label:'Chorus (x2)', color:'#f472b6', defaultBars:8 }, { key:'bridge', label:'Bridge', color:'#60a5fa', defaultBars:4 }, { key:'choruscx', label:'Chorus Out', color:'#f472b6', defaultBars:8 }, { key:'outro', label:'Outro', color:'#4ade80', defaultBars:4 } ]; function renderProjectStructure(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const structure = proj.structure || STRUCTURE_SECTIONS.filter(s => ['verse1','chorus','verse2','chorus2','bridge','choruscx'].includes(s.key)); const totalBars = structure.reduce((s, sec) => s + (sec.bars || sec.defaultBars || 8), 0); const p = document.getElementById('view-project-structure'); p.innerHTML = `

Song Structure

Build your song's arrangement. Total: ${totalBars} bars · Approx ${Math.round(totalBars * 2)} seconds at 120 BPM

${STRUCTURE_SECTIONS.map(s => `

${s.label} +

`).join('')}

${structure.map((sec, i) => { const bars = sec.bars || sec.defaultBars || 8; const pct = Math.round((bars / 32) * 100); return `

${sec.label}

bars

`; }).join('')}

`; } function loadDefaultStructure(id) { const def = STRUCTURE_SECTIONS.filter(s => ['verse1','prechorus','chorus','verse2','chorus2','bridge','choruscx','outro'].includes(s.key)); updateProject(id, { structure: def.map(s => ({ ...s })) }); renderProjectStructure(id); showToast('Default structure loaded ✓'); } function addStructureSection(id, key, label, bars, color) { const proj = loadProjects().find(p => p.id === id); const structure = [...(proj?.structure || []), { key, label, bars, color }]; updateProject(id, { structure }); renderProjectStructure(id); } function removeStructureSection(id, i) { const proj = loadProjects().find(p => p.id === id); const structure = [...(proj?.structure || [])]; structure.splice(i, 1); updateProject(id, { structure }); renderProjectStructure(id); } function updateStructureBars(id, i, val) { const proj = loadProjects().find(p => p.id === id); const structure = [...(proj?.structure || [])]; structure[i].bars = parseInt(val) || 8; updateProject(id, { structure }); renderProjectStructure(id); } async function generateStructureAI(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; document.getElementById('structureAiOutput').style.display = 'block'; document.getElementById('structureAiBody').innerHTML = '

Thinking about your structure…

'; try { const text = await callAI(`Suggest the ideal song structure for a ${proj.genre} ${proj.type} called "${proj.title}" with a ${proj.mood} mood. Provide: 1. Recommended section order with bar counts 2. Why this structure works for this genre 3. Any genre-specific tips (e.g. gospel usually has a vamp, R&B has a bridge breakdown) 4. Timing estimate at typical ${proj.bpm || '90'} BPM`, 800); document.getElementById('structureAiBody').textContent = text; showToast('Structure suggestion ready ✓'); } catch(e) { document.getElementById('structureAiBody').textContent = 'Error: ' + e.message; } } /* ══ PROJECT BEATS ══ */ function renderProjectBeats(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const p = document.getElementById('view-project-beats'); p.innerHTML = `

Beat & Production Prompts

Generate AI-powered beat prompts tailored to ${proj.title} and paste them directly into Suno.ai or Udio.com.

Style Reference Artist

Additional Instruments

Paste Your Lyrics / First Verse (optional)

`; } async function generateProjectBeats(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const artist = document.getElementById('pb_artist').value; const instruments = document.getElementById('pb_instruments').value; const lyrics = document.getElementById('pb_lyrics').value.trim(); const btn = document.getElementById('pb_btn'); btn.disabled = true; btn.textContent = '🎛️ Generating…'; try { const text = await callAI(`Generate two AI music prompts for the song "${proj.title}" by Denisha Shaw. Genre: ${proj.genre} · Mood: ${proj.mood} · BPM: ${proj.bpm || 'flexible'} ${artist ? 'Style reference: ' + artist : ''} ${instruments ? 'Instruments: ' + instruments : ''} ${lyrics ? 'Lyrics excerpt:\n' + lyrics.slice(0,300) : '(Instrumental — no lyrics yet)'} Format EXACTLY: SUNO: [Suno prompt — use metatags like [verse], [chorus]. Include style, mood, tempo. Max 250 chars.] UDIO: [Udio prompt — more descriptive, include genre tags, instrument details, mood descriptors. Max 350 chars.]`, 500); const sunoM = text.match(/SUNO:\n([\s\S]+?)(?=UDIO:|$)/); const udioM = text.match(/UDIO:\n([\s\S]+?)$/); const suno = sunoM ? sunoM[1].trim() : text.split('\n\n')[0]; const udio = udioM ? udioM[1].trim() : text.split('\n\n')[1] || text; window._sunoP = suno; window._udioP = udio; document.getElementById('pb_output').style.display = 'block'; document.getElementById('pb_suno').textContent = suno; document.getElementById('pb_udio').textContent = udio; document.getElementById('pb_suno_chars').textContent = suno.length + ' characters'; document.getElementById('pb_udio_chars').textContent = udio.length + ' characters'; showToast('Beat prompts ready ✓'); } catch(e) { showToast('Error: ' + e.message); } btn.disabled = false; btn.textContent = '🎛️ Generate Beat Prompts'; } /* ══ PROJECT NOTES ══ */ function renderProjectNotes(id) { const proj = loadProjects().find(p => p.id === id); if (!proj) return; const p = document.getElementById('view-project-notes'); p.innerHTML = `

Project Notes

AI Session History

${(proj.coWriteHistory || []).length === 0 ? '

No AI sessions yet for this project.

' : proj.coWriteHistory.slice().reverse().map((h,i) => `

${h.mode} ${h.date}

${h.text}

`).join('')}`; } function saveNotes(id) { const el = document.getElementById('pn_notes'); if (el) { updateProject(id, { notes: el.value }); showToast('Notes saved ✓'); } } /* ══ BEAT LAB (standalone) ══ */ const BEAT_PRESETS = [ { id:'rb', icon:'🎷', name:'R&B Soul', desc:'Smooth, groove-driven, emotional', style:'smooth R&B soul, lush strings, warm bass, 808 hits, jazzy chords', bpm:'75-90' }, { id:'gospel', icon:'🙏', name:'Gospel', desc:'Uplifting, full choir, powerful', style:'contemporary gospel, full choir, live drums, organ, uplifting key changes', bpm:'85-100' }, { id:'pop', icon:'🎤', name:'Pop Anthem', desc:'Catchy, radio-ready, universal', style:'pop anthem, punchy production, layered synths, four-on-floor drums, modern mix', bpm:'95-115' }, { id:'afro', icon:'🥁', name:'Afrobeats', desc:'Infectious rhythm, modern energy', style:'Afrobeats, percussion-driven, talking drum, melodic guitar, bass-heavy groove', bpm:'90-105' }, { id:'neosoul', icon:'🌙', name:'Neo-Soul', desc:'Deep, soulful, introspective', style:'neo-soul, Rhodes piano, live bass, subtle hip-hop drums, warm vintage tone', bpm:'70-85' }, { id:'hiphop', icon:'🎧', name:'Hip-Hop', desc:'Hard-hitting, lyric-driven', style:'hip-hop, punchy 808 bass, crispy hi-hats, boom bap drums, sample-based chords', bpm:'85-95' }, { id:'acoustic', icon:'🎸', name:'Acoustic', desc:'Stripped back, intimate, raw', style:'acoustic singer-songwriter, fingerpicked guitar, soft percussion, intimate vocal space', bpm:'60-80' }, { id:'theatre', icon:'🎭', name:'Musical Theatre', desc:'Dramatic, orchestral, powerful', style:'musical theatre, full orchestra, dramatic builds, show-stopping chorus, Broadway production', bpm:'varies' } ]; let selectedBeatPreset = 'rb'; function renderBeatLab() { const p = document.getElementById('view-beatlab'); p.innerHTML = `

Beat Lab

Select a genre preset, customise your sound, and get ready-to-use prompts for Suno.ai and Udio.com. Paste the prompt → get a full backing track in 30 seconds.

${BEAT_PRESETS.map(bp => `

${bp.icon}

${bp.name}

${bp.desc}

${bp.bpm} BPM

`).join('')}

Song Title (optional)

Mood Override

Artist Reference

Key Instruments

Paste Lyrics (optional — Suno will sing them)

Open Suno ↗ Open Udio ↗

`; } function selectBeatPreset(id, el) { selectedBeatPreset = id; document.querySelectorAll('.beat-preset').forEach(b => b.classList.remove('selected')); el.classList.add('selected'); } async function runBeatLab() { const preset = BEAT_PRESETS.find(b => b.id === selectedBeatPreset); const title = document.getElementById('bl_title').value; const mood = document.getElementById('bl_mood').value; const artist = document.getElementById('bl_artist').value; const instruments = document.getElementById('bl_instruments').value; const lyrics = document.getElementById('bl_lyrics').value.trim(); const btn = document.getElementById('bl_btn'); btn.disabled = true; btn.textContent = '🎛️ Generating…'; try { const text = await callAI(`Create optimised AI music generation prompts for Suno.ai and Udio.com. Genre Preset: ${preset.name} (${preset.style}) Title: ${title || 'untitled track'} Mood: ${mood === 'Auto (from preset)' ? preset.desc : mood} BPM: ${preset.bpm} Artist Reference: ${artist || 'none specified'} Instruments: ${instruments || 'standard for genre'} ${lyrics ? 'Lyrics to set to music:\n' + lyrics.slice(0, 400) : '(Instrumental)'} Output EXACTLY: SUNO: [Suno prompt — use [verse] [chorus] tags, style descriptors, max 280 chars] UDIO: [Udio prompt — descriptive paragraph style with genre, mood, instruments, artist reference, max 380 chars]`, 600); const sM = text.match(/SUNO:\n([\s\S]+?)(?=UDIO:|$)/); const uM = text.match(/UDIO:\n([\s\S]+?)$/); window._blSuno = sM ? sM[1].trim() : text.slice(0, 280); window._blUdio = uM ? uM[1].trim() : text.slice(280); document.getElementById('bl_output').style.display = 'block'; document.getElementById('bl_suno').textContent = window._blSuno; document.getElementById('bl_udio').textContent = window._blUdio; showToast('Beat prompts ready ✓'); } catch(e) { showToast('Error: ' + e.message); } btn.disabled = false; btn.textContent = '🎛️ Generate Prompts'; } /* ══ PRS & PUBLISHING ══ */ function renderPRS() { const songs = loadPRS(); const registered = songs.filter(s => s.status === 'Registered').length; const pending = songs.filter(s => s.status === 'Pending').length; const p = document.getElementById('view-prs'); p.innerHTML = `

PRS & Publishing

${songs.length}

Songs Tracked

${registered}

Registered

${pending}

Pending

${songs.length - registered - pending}

Not Registered

💡 Every performance = royalties owed. Register with PRS for Music (free) at prsformusic.com/join. Once registered, log every song so PRS can pay you when it's played, broadcast, or streamed.

${songs.length === 0 ? `` : songs.map(s => { const col = s.status === 'Registered' ? '#4ade80' : s.status === 'Pending' ? '#fb923c' : '#6e6560'; return ``; }).join('')}

Song Title	ISWC	Writers	Genre	Year	Status
No songs registered yet. Click + Register Song to start.
${s.title}	${s.iswc \|\| '—'}	${s.cowriters \|\| '100% Denisha Shaw'}	${s.genre \|\| '—'}	${s.year \|\| '—'}	${s.status}

→ Join PRS for Music Register Works DistroKid Distribution TuneCore

`; } function showAddPRSSong() { const f = document.getElementById('addPRSForm'); f.style.display = f.style.display === 'none' ? 'block' : 'none'; } function addPRSSong() { const songs = loadPRS(); songs.push({ id: String(Date.now()), title: document.getElementById('prs_title').value || 'Untitled', iswc: document.getElementById('prs_iswc').value, cowriters: document.getElementById('prs_cowriters').value, status: document.getElementById('prs_status').value, genre: document.getElementById('prs_genre').value, year: document.getElementById('prs_year').value || String(new Date().getFullYear()) }); savePRS(songs); renderPRS(); showToast('Song registered ✓'); } function deletePRSSong(id) { savePRS(loadPRS().filter(s => s.id !== id)); renderPRS(); showToast('Removed'); } /* ══ RELEASE PLANNER ══ */ function renderReleasePlanner() { const p = document.getElementById('view-release'); p.innerHTML = `

Release Planner

Plan your full release campaign — from studio to streaming. AI generates a complete 8-week playbook.

Release Title

Release Type

Target Release Date

Primary Genre

What's the story / message behind this release?

`; } async function generateReleasePlan() { const title = document.getElementById('rp_title').value || 'my release'; const type = document.getElementById('rp_type').value; const date = document.getElementById('rp_date').value || 'upcoming'; const genre = document.getElementById('rp_genre').value; const story = document.getElementById('rp_story').value; const btn = document.getElementById('rp_btn'); btn.disabled = true; btn.textContent = '🚀 Building plan…'; document.getElementById('rp_output').style.display = 'block'; document.getElementById('rp_body').innerHTML = '

Building your release campaign…

'; try { const text = await callAI(`Create a complete 8-week music release plan for Denisha Shaw (Inspired by Denisha). Release: "${title}" · ${type} Target Date: ${date} Genre: ${genre} Story/Message: ${story || 'Empowerment, finding your voice, confidence'} Write a week-by-week campaign plan with: Week -8 to -6: Pre-production & prep Week -5 to -4: Teaser & build anticipation Week -3 to -2: Pre-release momentum Week -1: Final countdown Week 0: RELEASE WEEK Week +1 to +2: Post-release amplification For each week list: 3-5 specific tasks, social content ideas, platform actions. Also include: DistroKid submission deadline, Spotify editorial pitch timing, press release timing, PRS notification. Be specific and actionable. Denisha is a solo artist with limited team.`, 2000); document.getElementById('rp_body').textContent = text; window._rpText = text; showToast('Release plan ready ✓'); } catch(e) { document.getElementById('rp_body').textContent = 'Error: ' + e.message; } btn.disabled = false; btn.textContent = '🚀 Generate 8-Week Release Plan'; } function downloadReleasePlan() { const text = window._rpText || ''; const b = new Blob([text], {type:'text/plain'}); const a = document.createElement('a'); a.href = URL.createObjectURL(b); a.download = 'Release_Plan.txt'; a.click(); } /* ══ REVENUE ══ */ const MUSIC_REV_STREAMS = [ { id:'streaming', icon:'🎵', name:'Streaming Royalties', desc:'Spotify, Apple Music, YouTube Music via DistroKid/TuneCore. ~£0.003-0.005 per stream.', link:'https://distrokid.com' }, { id:'prs', icon:'📋', name:'PRS Performance Royalties', desc:'Radio, TV, live venues, streaming mechanical rights. Register at prsformusic.com.', link:'https://prsformusic.com' }, { id:'youtube', icon:'▶️', name:'YouTube Ad Revenue', desc:'Monetise your official videos. Also earn from Content ID when others use your music.', link:'https://studio.youtube.com' }, { id:'live', icon:'🎤', name:'Live Performance Fees', desc:'School performances, events, corporate bookings, SYPC programmes.', link:'' }, { id:'sync', icon:'🎬', name:'Sync Licensing', desc:'Your music used in TV, film, ads, games. Can be £50-5,000+ per placement.', link:'https://musicgateway.com' }, { id:'merch', icon:'👕', name:'Merch & Physical', desc:'CDs, lyric books (KDP), merchandise — direct to fans.', link:'https://kdp.amazon.com' } ]; function renderRevenue() { const data = loadRevData(); let totalMonthly = 0; MUSIC_REV_STREAMS.forEach(s => totalMonthly += parseFloat(data[s.id] || 0)); const p = document.getElementById('view-revenue'); p.innerHTML = `

Music Revenue Tracker

Total Monthly Estimate

£${totalMonthly.toFixed(0)}

Update each stream as you grow

£${(totalMonthly * 12).toFixed(0)}

Annual projection

${MUSIC_REV_STREAMS.map(s => `

${s.icon}

${s.name}

${s.desc}

Monthly £

£${parseFloat(data[s.id]||0).toFixed(0)}/mo

${s.link ? `→ ${s.name.split(' ')[0]} ↗` : ''}

`).join('')}

`; } function updateMusicRev(id, val) { const d = loadRevData(); d[id] = parseFloat(val) || 0; saveRevData(d); renderRevenue(); } /* ══ TOAST ══ */ function showToast(msg) { const t = document.getElementById('toast'); t.textContent = msg; t.classList.add('show'); setTimeout(() => t.classList.remove('show'), 3000); } /* ══ INIT ══ */ document.addEventListener('DOMContentLoaded', () => { if (localStorage.getItem('ibd_api_key')) updateApiStatus(true); const savedKey = localStorage.getItem('ibd_api_key'); if (savedKey) document.getElementById('keyInput').value = savedKey; renderSidebar(); renderDashboard(); document.querySelectorAll('.modal-overlay').forEach(m => m.addEventListener('click', function(e) { if (e.target === this) this.classList.remove('open'); })); });