diff --git a/css/components.css b/css/components.css index 02bbfe4..55ac8a4 100644 --- a/css/components.css +++ b/css/components.css @@ -80,6 +80,30 @@ select option { background: var(--bg2); } .btn-sm { padding: 5px 13px; font-size: 13px; } +/* ── Export choice dropdown ─────────────────────────────────────────────────── */ +.export-choice-menu { + position: fixed; + z-index: 1000; + background: var(--bg2); + border: 1px solid var(--bg3); + border-radius: var(--r); + overflow: hidden; + box-shadow: 0 4px 16px rgba(0,0,0,0.5); +} +.export-choice-item { + display: block; + width: 100%; + padding: 9px 18px; + background: transparent; + border: none; + color: var(--t1); + font-size: 13px; + text-align: left; + cursor: pointer; + white-space: nowrap; +} +.export-choice-item:hover { background: var(--bg3); color: var(--gold); } + /* ── Stats row ──────────────────────────────────────────────────────────────── */ .stats-row { display: flex; diff --git a/js/analysis.js b/js/analysis.js index 5f160eb..ffc0de5 100644 --- a/js/analysis.js +++ b/js/analysis.js @@ -724,6 +724,42 @@ mitigationNames, }; }, + exportRefForPlanner() { + const sameReportId = parseInt(refFightSelect.value, 10); + const extId = parseInt(refExtFightSelect.value, 10); + let fight = null, reportCode = '', fightId = 0; + if (sameReportId) { + fight = allSameReportFights.find(f => f.id === sameReportId); + reportCode = window.App?.reportCode ?? ''; + fightId = sameReportId; + } else if (extId) { + fight = extFights.find(f => f.id === extId); + reportCode = extReportCode; + fightId = extId; + } + const transitions = fight?.phaseTransitions ?? []; + const phases = transitions.length === 0 ? [] : [ + { id: 0, name: 'Ganzer Fight', startTime: fight.startTime, endTime: fight.endTime }, + ...transitions.map((t, i) => ({ + id: t.id, + name: `Phase ${t.id}`, + startTime: t.startTime, + endTime: transitions[i + 1]?.startTime ?? fight.endTime, + })), + ]; + return { + aoeEvents: refEvents, + fightStart: refFightStart, + phases, + players: refPlayers, + fightName: fight?.name ?? 'Referenz-Fight', + reportCode, + fightId, + fightEnd: fight?.endTime ?? 0, + mitigationNames, + }; + }, + hasRefExport() { return refEvents.length > 0; }, reset() { lastFightId = null; refEvents = []; @@ -745,7 +781,45 @@ }, }; - document.getElementById('export-to-planner-btn')?.addEventListener('click', () => { - window.plannerTab?.showImportModal(window.analysisTab.exportForPlanner()); + document.getElementById('export-to-planner-btn')?.addEventListener('click', (e) => { + if (!refEvents.length) { + window.plannerTab?.showImportModal(window.analysisTab.exportForPlanner()); + return; + } + showExportChoiceMenu(e.currentTarget); }); + + function showExportChoiceMenu(anchor) { + document.getElementById('export-choice-menu')?.remove(); + const menu = document.createElement('div'); + menu.id = 'export-choice-menu'; + menu.className = 'export-choice-menu'; + + [ + { label: 'Aktueller Fight', fn: () => window.analysisTab.exportForPlanner() }, + { label: 'Referenz-Fight', fn: () => window.analysisTab.exportRefForPlanner() }, + ].forEach(({ label, fn }) => { + const btn = document.createElement('button'); + btn.className = 'export-choice-item'; + btn.textContent = label; + btn.addEventListener('click', () => { + menu.remove(); + window.plannerTab?.showImportModal(fn()); + }); + menu.appendChild(btn); + }); + + document.body.appendChild(menu); + const rect = anchor.getBoundingClientRect(); + menu.style.top = (rect.bottom + 4) + 'px'; + menu.style.right = (window.innerWidth - rect.right) + 'px'; + + const close = (ev) => { + if (!menu.contains(ev.target) && ev.target !== anchor) { + menu.remove(); + document.removeEventListener('click', close, true); + } + }; + setTimeout(() => document.addEventListener('click', close, true), 0); + } })();