akus_schabernack2 #2

Merged
xziino merged 4 commits from akurosia/ff14-mitigator:akus_schabernack2 into master 2026-05-22 10:47:01 +02:00
6 changed files with 389 additions and 6 deletions
Showing only changes of commit e2eed52d07 - Show all commits

View File

@ -211,6 +211,9 @@
font-size: 12px;
color: var(--t2);
}
.badge-assign-buff { background: rgba(200,168,75,.08); border-color: rgba(200,168,75,.4); color: var(--gold); }
.badge-assign-debuff { background: rgba(224,92,92,.08); border-color: rgba(224,92,92,.4); color: var(--red); }
.badge-assign-shield { background: rgba(74,158,255,.08); border-color: rgba(74,158,255,.4); color: var(--blue); }
.mechanic-notes {
font-size: 12px;
@ -218,3 +221,91 @@
font-style: italic;
margin-top: 2px;
}
/* ── Import Modal ────────────────────────────────────────────────────────────── */
.modal-overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.72);
display: flex;
align-items: center;
justify-content: center;
z-index: 200;
padding: 20px;
}
.modal-box {
background: var(--bgcard);
border: 1px solid var(--borderem);
border-radius: var(--rl);
padding: 28px 32px;
max-width: 480px;
width: 100%;
}
.modal-title {
font-family: var(--font-d);
font-size: 15px;
color: var(--gold);
letter-spacing: 0.07em;
text-transform: uppercase;
margin-bottom: 22px;
}
.modal-section {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 20px;
}
.modal-label {
font-size: 12px;
color: var(--t2);
text-transform: uppercase;
letter-spacing: 0.06em;
margin-bottom: 2px;
}
.modal-radio-label {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
font-size: 14px;
color: var(--t1);
user-select: none;
}
/* Override global input styles that break radio button layout */
.modal-radio-label input[type="radio"] {
width: auto;
min-width: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
flex-shrink: 0;
}
.modal-subsection {
margin-left: 24px;
display: flex;
flex-direction: column;
gap: 6px;
}
.modal-subsection input,
.modal-subsection select {
font-size: 14px;
padding: 6px 10px;
}
.modal-hint {
font-size: 12px;
color: var(--t3);
}
.modal-actions {
display: flex;
gap: 8px;
margin-top: 6px;
}

View File

@ -687,6 +687,9 @@
document.getElementById('analysis-loading').style.display = 'none';
document.getElementById('analysis-content').style.display = 'block';
const exportBtn = document.getElementById('export-to-planner-btn');
if (exportBtn) exportBtn.style.display = '';
}
window.analysisTab = {
@ -705,6 +708,17 @@
refFightSelect.dispatchEvent(new Event('change'));
}
},
exportForPlanner() {
const fight = (window.App?.fights ?? []).find(f => f.id === window.App?.fightId);
return {
aoeEvents: lastEvents,
fightStart: lastFightStart,
phases: window.App?.phases ?? [],
players: currentPlayers,
fightName: fight?.name ?? `Fight ${window.App?.fightId ?? '?'}`,
reportCode: window.App?.reportCode ?? '',
};
},
reset() {
lastFightId = null;
refEvents = [];
@ -720,6 +734,12 @@
refFflogsLink.style.display = 'none';
refFflogsLink.href = '#';
refExtPanel.style.display = 'none';
const exportBtn = document.getElementById('export-to-planner-btn');
if (exportBtn) exportBtn.style.display = 'none';
},
};
document.getElementById('export-to-planner-btn')?.addEventListener('click', () => {
window.plannerTab?.showImportModal(window.analysisTab.exportForPlanner());
});
})();

View File

@ -219,9 +219,14 @@ function renderMechanicList(plan) {
<div class="mechanic-assignments">
${m.assignments.length === 0
? '<span class="mechanic-no-assign">Keine Zuweisung</span>'
: m.assignments.map(a =>
`<span class="badge badge-assign">${escHtml(a.job)} · ${escHtml(a.ability)}</span>`
).join('')
: m.assignments.map(a => {
const cls = a.buffType === 'debuff' ? 'badge-assign-debuff'
: a.buffType === 'shield' ? 'badge-assign-shield'
: a.buffType === 'buff' ? 'badge-assign-buff'
: '';
const label = a.job ? `${escHtml(a.job)} · ${escHtml(a.ability)}` : escHtml(a.ability);
return `<span class="badge badge-assign ${cls}">${label}</span>`;
}).join('')
}
</div>
${m.notes ? `<div class="mechanic-notes">${escHtml(m.notes)}</div>` : ''}
@ -306,6 +311,222 @@ function initNewPlanForm() {
});
}
// ── Ability → Job mapping ─────────────────────────────────────────────────────
const ABILITY_JOB_MAP = {
'Passage of Arms': 'PLD', 'Divine Veil': 'PLD', 'Guardian': 'PLD',
'Shake It Off': 'WAR', 'Bloodwhetting': 'WAR',
'Dark Missionary': 'DRK',
'Heart of Light': 'GNB',
'Temperance': 'WHM', 'Divine Benison': 'WHM', 'Divine Caress': 'WHM',
'Sacred Soil': 'SCH', 'Expedient': 'SCH', 'Fey Illumination': 'SCH',
'Galvanize': 'SCH', 'Seraphic Veil': 'SCH', 'Catalyze': 'SCH',
'Collective Unconscious': 'AST', 'Neutral Sect': 'AST',
'Intersection': 'AST', 'the Spire': 'AST',
'Kerachole': 'SGE', 'Holos': 'SGE', 'Holosakos': 'SGE',
'Panhaima': 'SGE', 'Haima': 'SGE',
'Eukrasian Prognosis': 'SGE', 'Eukrasian Prognosis II': 'SGE',
'Eukrasian Diagnosis': 'SGE', 'Differential Diagnosis': 'SGE',
'Troubadour': 'BRD',
'Tactician': 'MCH',
'Shield Samba': 'DNC', 'Improvised Finish': 'DNC',
'Radiant Aegis': 'SMN',
'Magick Barrier': 'RDM',
'Tempera Coat': 'PCT', 'Tempera Grassa': 'PCT',
};
const JOB_FROM_TYPE = {
'Paladin': 'PLD', 'Warrior': 'WAR', 'DarkKnight': 'DRK', 'Gunbreaker': 'GNB',
'WhiteMage': 'WHM', 'Scholar': 'SCH', 'Astrologian': 'AST', 'Sage': 'SGE',
'Monk': 'MNK', 'Dragoon': 'DRG', 'Ninja': 'NIN', 'Samurai': 'SAM',
'Reaper': 'RPR', 'Viper': 'VPR', 'Bard': 'BRD', 'Machinist': 'MCH',
'Dancer': 'DNC', 'BlackMage': 'BLM', 'Summoner': 'SMN', 'RedMage': 'RDM',
'Pictomancer': 'PCT',
};
const TANK_JOBS = new Set(['PLD', 'WAR', 'DRK', 'GNB']);
const MELEE_JOBS = new Set(['MNK', 'DRG', 'NIN', 'SAM', 'RPR', 'VPR']);
const CASTER_JOBS = new Set(['BLM', 'SMN', 'RDM', 'PCT']);
function guessJob(abilityName, players) {
if (ABILITY_JOB_MAP[abilityName]) return ABILITY_JOB_MAP[abilityName];
const jobs = (players ?? []).map(p => JOB_FROM_TYPE[p.type] ?? '');
if (abilityName === 'Reprisal') {
const tanks = jobs.filter(j => TANK_JOBS.has(j));
return tanks.length === 1 ? tanks[0] : '';
}
if (abilityName === 'Feint') {
const melees = jobs.filter(j => MELEE_JOBS.has(j));
return melees.length === 1 ? melees[0] : '';
}
if (abilityName === 'Addle') {
const casters = jobs.filter(j => CASTER_JOBS.has(j));
return casters.length === 1 ? casters[0] : '';
}
return '';
}
// ── AoE Events → Plan Mechanics ───────────────────────────────────────────────
function aoeEventsToMechanics(aoeEvents, fightStart, phases, players, withMitigations) {
return aoeEvents.map(ev => {
const relTs = ev.timestamp - fightStart;
const phase = (phases ?? []).filter(p => p.id !== 0).find(p =>
ev.timestamp >= p.startTime && ev.timestamp < p.endTime
);
const nonTankTargets = ev.targets.filter(t => t.role !== 'tank' && (t.unmitigatedAmount ?? 0) > 0);
const fallbackTargets = ev.targets.filter(t => (t.unmitigatedAmount ?? 0) > 0);
const relevantTargets = nonTankTargets.length > 0 ? nonTankTargets : fallbackTargets;
const avgUnmit = relevantTargets.length > 0
? Math.round(relevantTargets.reduce((s, t) => s + t.unmitigatedAmount, 0) / relevantTargets.length)
: 0;
let assignments = [];
if (withMitigations) {
const seen = new Set();
for (const t of ev.targets) {
for (const m of (t.mitigations ?? [])) {
const key = m.key ?? m.name;
if (!seen.has(key)) {
seen.add(key);
assignments.push({ ability: key, job: guessJob(key, players), buffType: m.buffType ?? '' });
}
}
}
}
return {
id: crypto.randomUUID(),
name: ev.abilityName,
timestamp: relTs,
phase: phase?.name ?? '',
unmitigatedDamage: avgUnmit,
notes: '',
assignments,
};
});
}
// ── Merge + Create plan from import ──────────────────────────────────────────
function doImport(data, withMitigations, whereMode, mergeId, newName) {
const { aoeEvents, fightStart, phases, players, fightName, reportCode } = data;
const mechanics = aoeEventsToMechanics(aoeEvents, fightStart, phases, players, withMitigations);
if (whereMode === 'new') {
const plan = createPlan(newName || fightName || 'Importierter Plan');
return updatePlan(plan.id, {
mechanics,
source: { reportCode, fightName },
});
}
// Merge into existing plan
const plan = getPlan(mergeId);
if (!plan) return null;
const merged = [...plan.mechanics];
for (const newM of mechanics) {
const exists = plan.mechanics.some(m =>
m.name === newM.name && Math.abs(m.timestamp - newM.timestamp) < 5000
);
if (!exists) merged.push(newM);
}
merged.sort((a, b) => a.timestamp - b.timestamp);
return updatePlan(mergeId, { mechanics: merged });
}
// ── Import Modal ──────────────────────────────────────────────────────────────
let pendingImportData = null;
function showImportModal(data) {
pendingImportData = data;
// Pre-fill name
const nameInput = document.getElementById('import-plan-name');
if (nameInput) { nameInput.value = data.fightName || ''; }
// Populate merge dropdown
const planSelect = document.getElementById('import-plan-select');
if (planSelect) {
const plans = loadPlans();
planSelect.innerHTML = '<option value="">— Plan auswählen —</option>';
plans.forEach(p => {
const opt = document.createElement('option');
opt.value = p.id;
opt.textContent = p.name;
planSelect.appendChild(opt);
});
const mergeLabel = document.getElementById('import-merge-label');
if (mergeLabel) mergeLabel.style.opacity = plans.length === 0 ? '0.4' : '';
const mergeRadio = document.querySelector('input[name="import-where"][value="merge"]');
if (mergeRadio) mergeRadio.disabled = plans.length === 0;
}
// Reset to defaults
document.querySelectorAll('input[name="import-what"]').forEach(r => { r.checked = r.value === 'with-mitigations'; });
document.querySelectorAll('input[name="import-where"]').forEach(r => { r.checked = r.value === 'new'; });
document.getElementById('import-new-section').style.display = '';
document.getElementById('import-merge-section').style.display = 'none';
document.getElementById('planner-import-modal').style.display = 'flex';
nameInput?.focus();
nameInput?.select();
}
function hideImportModal() {
document.getElementById('planner-import-modal').style.display = 'none';
pendingImportData = null;
}
function initImportModal() {
document.querySelectorAll('input[name="import-where"]').forEach(radio => {
radio.addEventListener('change', () => {
document.getElementById('import-new-section').style.display = radio.value === 'new' ? '' : 'none';
document.getElementById('import-merge-section').style.display = radio.value === 'merge' ? '' : 'none';
});
});
document.getElementById('import-cancel-btn')?.addEventListener('click', hideImportModal);
document.getElementById('planner-import-modal')?.addEventListener('click', e => {
if (e.target === e.currentTarget) hideImportModal();
});
document.addEventListener('keydown', e => {
if (e.key === 'Escape' && pendingImportData) hideImportModal();
});
document.getElementById('import-confirm-btn')?.addEventListener('click', () => {
if (!pendingImportData) return;
const withMitigations = document.querySelector('input[name="import-what"]:checked')?.value === 'with-mitigations';
const whereMode = document.querySelector('input[name="import-where"]:checked')?.value ?? 'new';
const newName = document.getElementById('import-plan-name')?.value.trim();
const mergeId = document.getElementById('import-plan-select')?.value;
if (whereMode === 'new' && !newName) {
document.getElementById('import-plan-name')?.focus();
return;
}
if (whereMode === 'merge' && !mergeId) {
document.getElementById('import-plan-select')?.focus();
return;
}
const plan = doImport(pendingImportData, withMitigations, whereMode, mergeId, newName);
if (!plan) return;
hideImportModal();
renderPlanList();
openPlan(plan.id);
window.showTab?.('planner');
});
}
// ── window.plannerTab (hooks for other tabs) ──────────────────────────────────
window.plannerTab = {
@ -318,16 +539,20 @@ window.plannerTab = {
}
},
showImportModal(data) {
showImportModal(data);
},
importFromAnalysis(aoeEvents, _refEvents, _options) {
// Schritt 3 — noch nicht implementiert
console.log('[Planner] importFromAnalysis — not yet implemented', aoeEvents);
}
console.log('[Planner] importFromAnalysis — use showImportModal instead', aoeEvents);
},
};
// ── Init ──────────────────────────────────────────────────────────────────────
document.addEventListener('DOMContentLoaded', () => {
initNewPlanForm();
initImportModal();
renderPlanList();
renderPlanDetail(null);
});

View File

@ -17,4 +17,5 @@ document.addEventListener('DOMContentLoaded', () => {
}
tabs.forEach(btn => btn.addEventListener('click', () => showTab(btn.dataset.tab)));
window.showTab = showTab;
});

View File

@ -35,6 +35,51 @@
</div>
</main>
</div>
<!-- Planner Import Modal -->
<div id="planner-import-modal" class="modal-overlay" style="display:none">
<div class="modal-box">
<div class="modal-title">In Planer exportieren</div>
<div class="modal-section">
<div class="modal-label">Was importieren?</div>
<label class="modal-radio-label">
<input type="radio" name="import-what" value="with-mitigations" checked>
<span>Mechaniken + Mitigation</span>
</label>
<label class="modal-radio-label">
<input type="radio" name="import-what" value="mechanics">
<span>Nur Mechaniken</span>
</label>
</div>
<div class="modal-section">
<div class="modal-label">Wohin?</div>
<label class="modal-radio-label">
<input type="radio" name="import-where" value="new" checked>
<span>Neuer Plan</span>
</label>
<div id="import-new-section" class="modal-subsection">
<input type="text" id="import-plan-name" placeholder="Plan-Name…">
</div>
<label class="modal-radio-label" id="import-merge-label">
<input type="radio" name="import-where" value="merge">
<span>In bestehenden Plan mergen</span>
</label>
<div id="import-merge-section" class="modal-subsection" style="display:none">
<select id="import-plan-select">
<option value=""> Plan auswählen </option>
</select>
<div class="modal-hint">Neue Mechaniken werden hinzugefügt, bestehende Assignments bleiben erhalten.</div>
</div>
</div>
<div class="modal-actions">
<button id="import-confirm-btn" class="btn btn-gold">Importieren</button>
<button id="import-cancel-btn" class="btn">Abbrechen</button>
</div>
</div>
</div>
<script src="js/app.js"></script>
<script src="js/tabs.js"></script>
<script src="js/analysis.js"></script>

View File

@ -40,6 +40,7 @@
<div class="card-title">AoE Timeline</div>
<select id="phase-select" class="filter-input" style="display:none"></select>
<input type="text" id="player-filter" class="filter-input" placeholder="Spieler filtern…">
<button id="export-to-planner-btn" class="btn btn-sm btn-gold" style="display:none">📋 Exportieren</button>
</div>
<div id="aoe-timeline"></div>
</div>