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;
    }
}