export class UsedMethodsRenderer { constructor(usedMethodsData, language) { this.usedMethodsData = usedMethodsData; this.language = language; } render() { const container = document.createElement('div'); container.style.marginBottom = '20px'; container.innerHTML = `<h3>Used Methods</h3>`; let methods = this.usedMethodsData['dcc:usedMethod']; if (!methods) { container.textContent = 'No used methods data available.'; return container; } if (!Array.isArray(methods)) { methods = [methods]; } methods.forEach(method => { const details = document.createElement('details'); details.style.border = '1px solid #ccc'; details.style.padding = '8px'; details.style.marginBottom = '10px'; // Summary: show method name (language-specific), norm and reference const summary = document.createElement('summary'); let methodName = ''; if (method['dcc:name'] && method['dcc:name']['dcc:content']) { const content = method['dcc:name']['dcc:content']; methodName = Array.isArray(content) ? (content.find(item => item.$ && item.$.lang === this.language) || content[0])._ || '' : content._ || ''; } const norm = method['dcc:norm'] || ''; const reference = method['dcc:reference'] || ''; summary.innerHTML = `<strong>${methodName}</strong> (${norm})`; if (reference) { summary.innerHTML += ` - <a href="${reference}" target="_blank">Reference</a>`; } details.appendChild(summary); // Expanded content: language-specific description const contentDiv = document.createElement('div'); contentDiv.style.marginTop = '8px'; contentDiv.style.fontFamily = 'sans-serif'; let description = ''; if (method['dcc:description'] && method['dcc:description']['dcc:content']) { const desc = method['dcc:description']['dcc:content']; description = Array.isArray(desc) ? (desc.find(c => c.$ && c.$.lang === this.language) || desc[0])._ || '' : desc._ || ''; } contentDiv.innerHTML = description; details.appendChild(contentDiv); container.appendChild(details); }); return container; } }