const secret = 'confinement';
const isProd = (window.location.host == 'acceslibre.itineraire.evidenceb.com');
const hatierURL = isProd ?
    'https://itineraire.evidenceb.com/francais/premieres/module1'
    : 'https://hatier-staging.netlify.com/francais/premieres/module1';
const tokenGeneratorAPI = isProd ?
    'https://auth1.prod.evidenceb-services.com/generate/token'
    : 'https://auth1.staging.evidenceb-services.com/generate/token';

const linkShortenerAPI = 'https://liens.itineraire.evidenceb.com/v1/shorten'; //TODO isProd

const studentWarningLink = "Ce lien est votre lien personnel de connexion, conservez-le précieusement : ";
const teacherWarningLink = "Ce lien vous permettra de vous identifier automatiquement sur notre plateforme, gardez le précieusement : ";
const mailType = `Bonjour,

Voici le lien de connexion au service itineraireslitteraires.evidenceb.com qui vous permettra de vous inscrire à une banque d'exercices interactifs sur la grammaire de la langue française.
/!\\  collez le lien de votre classe ici /!\\

Ces exercices vous prépareront à la question de grammaire de l'oral du Bac.
Ce travail en ligne sera suivi par votre professeur qui pourra avoir accès à votre temps de connexion et votre progression et qui pourrait éventuellement servir à votre évaluation de fin de trimestre.

Bon travail  !`;

const copyButtonText = "Copier";
var tokenInfo = {};

const handleCopyButtonClick = function(content, buttonElement) {
    return function() {
        copyToClipboard(content);
        buttonElement.innerText = "Copié !";
        setTimeout(function(){
            buttonElement.innerText = copyButtonText;
        }, 1500);
    }
}

const addLink = async function(link, labelText) {
    console.log("Hi there, link: ", link);

    const parent = document.querySelector("#liens");
    const newLink = document.createElement("label");
    const nodeLabel = document.createTextNode(labelText);
    newLink.appendChild(nodeLabel);
    const linkElement = document.createElement("a");
    linkElement.href = link;
    linkElement.classList = "tokenLink";
    linkElement.target = "_blank";
    const linkElementContent = document.createTextNode(link);
    linkElement.appendChild(linkElementContent);
    newLink.appendChild(linkElement);

    // Boutton "Copier"
    const buttonElement = document.createElement("div");
    const nodeButton = document.createTextNode(copyButtonText);
    buttonElement.appendChild(nodeButton);
    buttonElement.classList = "button copyButton";
    buttonElement.onclick = handleCopyButtonClick(link, buttonElement);
    newLink.appendChild(buttonElement);

    parent.appendChild(newLink);
}

const addTitleStudentLinks = function() {
    const parent = document.querySelector("#liens");
    const title = document.createElement("h3");
    const nodeTitle = document.createTextNode("Les liens pour mes élèves");
    title.appendChild(nodeTitle)
    parent.appendChild(title);
}

const addMailExample = function() {
    const parent = document.querySelector("#mailType");
    var textAreaBlock = document.createElement("div");
    var textArea = document.createElement("textarea");
    const nodeLabel = document.createTextNode("Message type pour vos élèves :");
    textAreaBlock.appendChild(nodeLabel);
    textArea.rows = "13";
    textArea.readOnly = true;
    const textAreaContent = document.createTextNode(mailType);
    textArea.appendChild(textAreaContent);
    textArea.onclick=function() {
        this.focus();this.select()
    };
    textAreaBlock.appendChild(textArea);

    // Boutton "Copier"
    const buttonElement = document.createElement("div");
    const nodeButton = document.createTextNode(copyButtonText);
    buttonElement.appendChild(nodeButton);
    buttonElement.classList = "button copyButton textAreaCopyButton";
    buttonElement.onclick = handleCopyButtonClick(mailType, buttonElement);
    textAreaBlock.appendChild(buttonElement);

    parent.appendChild(textAreaBlock);
}

const logError = function(errorMsg) {
    select(".errorMsg").html(errorMsg);
}
const eraseErrorMsg = function() {
    select(".errorMsg").html('');
}
const eraseLinks = function() {
    select("#liens").html('');
    select("#mailType").html('');
}
const hideValidate = function() {
    select('.validate').hide();
}
const formatLastName = function(str) {
    return (str.trim().toUpperCase());
}
const isLetter = function(c) {
    return c.toLowerCase() != c.toUpperCase();
}
const formatFirstName = function(str) {
    const cp = String(str);
    return (str.split('').map(function(l, i) {
        if (i == 0) {
            return (l.toUpperCase());
        } else {
            if (!isLetter(cp.charAt(i - 1))) {
                return (l.toUpperCase());
            }
            return (l.toLowerCase());
        }
    }).join(''));
}

const resetValidate = function() {
    eraseErrorMsg();
    eraseLinks();
    select('.validate').show();
}

const getClasses = function() {
    var ret = [];
    const nodeArr = select("#classesContainer label input");

    for (var i = 0; i < nodeArr.length; i++) {
        ret.push(nodeArr[i].value);
    }
    return ret;
}

const registerTeacher = function() {
    const first_name = formatFirstName(document.querySelector("#prenomProf").value);
    const last_name = formatLastName(document.querySelector("#nomProf").value);
    const etablissement = document.querySelector("#etablissement").value;
    const classes = getClasses();

    const classesWithoutDuplicates = classes.filter(function(v, i){
        return (classes.indexOf(v) === i);
    });
    if (classesWithoutDuplicates.length !== classes.length) {
        logError("Vous ne pouvez pas avoir deux classes avec le même nom.");
        return;
    }
    eraseErrorMsg();
    hideValidate();
    if (first_name.length > 0
        && last_name.length > 0
        && etablissement.length > 0
        && (classes[0] && classes[0].length > 0))
    {
        eraseLinks();

        ajax.get(tokenGeneratorAPI,
        {
            userType: 'teacher',
            first_name: first_name,
            last_name: last_name,
            uaiEtablissement: etablissement,
            secret: secret,
            classes: classes
        },
        function(res) {
            const tokenObject = JSON.parse(res);
            const longTeacherLink = hatierURL + "?token_itineraire=" + tokenObject.token;
            handleTeacherLinks(longTeacherLink, classes, etablissement);
        },
        function(err) {
            console.log("erreur lors de la création du token professeur: ", err);
            logError("Une erreur s'est produite");
        })
    }
    else {
        logError("Il manque des informations");
    }
}

const handleTeacherLinks = function(longTeacherLink, classes, etablissement) {
    const requestURL = linkShortenerAPI
        + '?longlink=' + encodeURIComponent(longTeacherLink)
        + '&prefix=prof_';

    ajax.post(requestURL,
        {},
        async function(res) {
            const shortLinkObject = JSON.parse(res);
            await addLink(shortLinkObject.shortlink, teacherWarningLink);
            addTitleStudentLinks();

            for (var idx = 0; idx < classes.length; idx++) {
                const currentClass = String(classes[idx]);
                if (currentClass.length > 0) {
                    await addClassLink(currentClass, etablissement);
                }
            }
            addMailExample();
        },
        function(err) {
            logError('Une erreur s\'est produite');
            console.log('Error in handleTeacherLinks: ', err);
        }
    )
}

const addClassLink = async function(currentClass, etablissement) {
    ajax.get(tokenGeneratorAPI,
    {
        userType: 'student',
        first_name: '',
        last_name: '',
        uaiEtablissement: etablissement,
        classe: currentClass,
        secret: secret,
    },
    function(res) {
        const resObject = JSON.parse(res);
        const longClassLink = window.location + "?token_itineraire=" + resObject.token;
        const requestURL = linkShortenerAPI
            + '?longlink=' + encodeURIComponent(longClassLink)
            + '&prefix=classe_';

        ajax.post(
            requestURL,
            {},
            async function(res2) {
                const shortLinkObject = JSON.parse(res2);
                const shortlink = shortLinkObject.shortlink;
                await addLink(shortlink, `Lien pour la classe ${currentClass} : `);
            },
            function(err) {
                logError('Une erreur s\'est produite URL');
                console.log('Error in addClassLink: ', err);
            }
        );
    },
    function(err) {
        console.log('Error in addClassLink outer request: ', err);
        logError("Une erreur s'est produite");
    })
}

const registerStudent = function() {
    eraseErrorMsg();
    hideValidate();
    const first_name = formatFirstName(document.querySelector("#prenomEleve").value);
    const last_name = formatLastName(document.querySelector("#nomEleve").value);
    if (first_name.length > 0 && last_name.length > 0) {
        eraseLinks()
        ajax.get(tokenGeneratorAPI,
        {
            userType: 'student',
            first_name: first_name,
            last_name: last_name,
            uaiEtablissement: tokenInfo.uaiEtablissement,
            secret: secret,
            classe: tokenInfo.classe,
        },
        async function(res) {
            const tokenObject = JSON.parse(res);
            const link = hatierURL + "?token_itineraire=" + tokenObject.token;
            await addLink(link, studentWarningLink);
        },
        function(err) {
            console.log("erreur: ", err);
            logError("Une erreur s'est produite");
        })
    }
    else {
        logError('Il manque ton nom ou ton prénom');
    }
}

const getTokenFromURL = function() {
    const splitArray = window.location.search.slice(1).split('token_itineraire=');
    if (splitArray.length != 2) {
        return null;
    }
    return splitArray[1];
}

const removeClass = function() {
    const classesContainer = document.querySelector("#classesContainer");
    if (classesContainer.childElementCount > 1) {
        classesContainer.lastChild.remove();
        if (classesContainer.childElementCount == 1) {
            select('#removeClass').hide();
        }
        resetValidate();
    }
}

const addClass = function() {
    const parent = document.querySelector("#classesContainer");
    const newClassNumber = parent.childElementCount + 1;
    const idClass = `classe_${newClassNumber}`;
    var newClassElement = document.createElement("label");
    newClassElement.for = idClass;

    var newSpan = document.createElement("span");
    const newSpanNode = document.createTextNode(`Classe ${newClassNumber} :`);
    newSpan.appendChild(newSpanNode);
    newSpan.classList = "labelText";
    var newInput = document.createElement("input");
    newInput.type = "text";
    newInput.id = idClass;
    newInput.oninput = function() {
        resetValidate();
    }

    newClassElement.appendChild(newSpan);
    newClassElement.appendChild(newInput);
    parent.appendChild(newClassElement);
    select('#removeClass').show('inline-block');
    resetValidate();
}

const initPage = function() {
    const token_itineraire = getTokenFromURL();
    const validate = select('.validate');
    if (token_itineraire) {
        tokenInfo = JSON.parse(Base64.decode(token_itineraire));
        select('#eleve').show();
        validate.on("click", registerStudent);
        validate.changeText("M'inscrire");
    }
    else {
        select('#professeur').show();
        validate.on("click", registerTeacher);
        validate.changeText("Je m'inscris");
    }
    select('input').on('input', function() {
        resetValidate();
    })
}();