'use strict';

import {
    fetchReport,
} from "../ds.js";

document.addEventListener('readystatechange', async () => {
    const report = await fetchReport(location.search.replace("?id=", ''));

    const resKeys = Object.keys(report.resource);
    // Default value...
    let resType = 'Object';

    if (resKeys.length) {
        resType = resKeys[0].split(' ')[0]; 

        document.querySelector('#rep-tit')
            .innerText = `${resType} ${report.displayname}`;
    
        const repTable = document.querySelector('#resource tbody');
        // TODO manage files and nested objects
        // e.g. if (typeof report.resource[key] == 'object') ...
        for (const key of resKeys) {
            const row = document.createElement('tr');
            let rowspan = '';
            let innerList = null;
            
            if (typeof report.resource[key] == 'object') {
                const boolValue = '@value' in report.resource[key];
                innerList = document.createElement('ul');

                if (! boolValue) {
                    rowspan = Object.keys(report.resource[key]).length;

                    for (const k in report.resource[key]) {
                        const li = document.createElement('li');
                        li.innerHTML = 
                            `<strong>${k.replace(key,'')}</strong>:
                            ${report.resource[key][k]}`;

                        if (report.resource[key][k] !== null) {
                            innerList.appendChild(li);
                        }
                    }
                } else {
                    innerList.innerHTML = `<li>${report.resource[key]['@value']}</li>`;
                }
            }

            if (!key.includes('Coordinates')) {
                let value = innerList !== null ? 
                    innerList.outerHTML : report.resource[key];
                row.innerHTML = `
                    <td class="text-bold key">${key.replace(resType, '')}</td>
                    <td>${value}</td>
                `;
            }

            repTable.appendChild(row);
        }
    }
})