const contributionPostsTitles = historyData.titles;
const contributionPostsContents = historyData.contents;
const contributionDates = historyData.dates;

document.addEventListener('DOMContentLoaded', function() {
    if (document.querySelector('.revision-q') && contributionDates.length > 0) {
        let historyBlock = document.createElement('div');
        historyBlock.style.marginRight = "20px";
        let historyTitle = document.createElement('h1');
        historyTitle.style.marginTop = "100px";
        historyTitle.style.fontWeight = "lighter";
        historyTitle.innerText = "Minutages auxquels vous avez contribué";
        historyBlock.append(historyTitle);

        let historyTable = document.createElement('table');
        historyTable.style.width = "100%";
        historyTable.style.padding = "20px";
        let historyTableHead = document.createElement('thead');
        let tableHeadTr = document.createElement('tr');

        let thDate = document.createElement('th');
        thDate.style.paddingBottom = "10px";
        thDate.style.fontStyle = "italic";
        thDate.style.borderRight = "solid 1px white";
        thDate.innerText = "Date de la contribution";


        let thMinutage = document.createElement('th');
        thMinutage.style.paddingBottom = "10px";
        thMinutage.style.fontStyle = "italic";
        thMinutage.innerText = "Minutage";
        let thImage = document.createElement('th');
        thImage.style.paddingBottom = "10px";
        thImage.style.fontStyle = "italic";
        thImage.innerText = "Images";
        let thVoix = document.createElement('th');
        thVoix.style.paddingBottom = "10px";
        thVoix.style.fontStyle = "italic";
        thVoix.innerText = "Voix Off et In";
        let thBandeSon = document.createElement('th');
        thBandeSon.style.paddingBottom = "10px";
        thBandeSon.style.fontStyle = "italic";
        thBandeSon.innerText = "Bande Son";
        let thEcrits = document.createElement('th');
        thEcrits.style.paddingBottom = "10px";
        thEcrits.style.fontStyle = "italic";
        thEcrits.innerText = "Écrits";
        tableHeadTr.append(thDate);
        tableHeadTr.append(thMinutage);
        tableHeadTr.append(thImage);
        tableHeadTr.append(thVoix);
        tableHeadTr.append(thBandeSon);
        tableHeadTr.append(thEcrits);
        historyTableHead.append(tableHeadTr);
        historyTable.append(historyTableHead);
        let tableBody = document.createElement('tbody');
        
        for (let i = 0; i < contributionPostsTitles.length; i++) {
            let tableRow = document.createElement('tr');

            let caseDate = document.createElement('th');
            caseDate.style.borderRight = "solid 1px white";
            for (let date of contributionDates) {
                if (date[0] === contributionPostsTitles[i]) {
                    let thisDate = date[1];
                    let time = thisDate.split(' ')[1];
                    thisDate = thisDate.split(' ')[0].split('-');
                    thisDate = `${thisDate[2]}/${thisDate[1]}/${thisDate[0]}`;
                    caseDate.innerHTML += `<p>${thisDate} ${time}</p>`;
                }
            }
            tableRow.append(caseDate); 
            
            let caseMinutage = document.createElement('th');
            caseMinutage.innerText = contributionPostsTitles[i];
            caseMinutage.style.paddingTop = "10px";
            caseMinutage.style.paddingBottom = "10px";

            tableRow.append(caseMinutage);

            let casesContents = contributionPostsContents[i].split('---');

            let imageTh = document.createElement('th');
            imageTh.innerHTML = casesContents[1].slice(0, -17);
            tableRow.append(imageTh);

            let voixTh = document.createElement('th');
            voixTh.innerHTML = casesContents[2].slice(0, -11);
            tableRow.append(voixTh);

            let bandeSonTh = document.createElement('th');
            bandeSonTh.innerHTML = casesContents[3].slice(0, -8);
            tableRow.append(bandeSonTh);

            let ecritsTh = document.createElement('th');
            ecritsTh.innerHTML = casesContents[4];
            tableRow.append(ecritsTh);

            tableBody.append(tableRow);
        }

        historyTable.append(tableBody);

        let allThs = historyTable.querySelectorAll('th');
        for (let th of allThs) {
            th.style.padding = "10px";
            th.style.paddingBottom = "20px";
            th.style.paddingTop = "20px";
            th.style.borderBottom = "solid 1px white";
        }
        
        historyBlock.append(historyTable);

        let wpContent = document.querySelector('#wpbody-content');
        wpContent.append(historyBlock);
    }
});