WikiLerni/views/wikilerni/includes/listing-questionnaires.pug

div(id="triple-column")
    -
        // je commence par répartir les éléments entre les 3 colonnes
        let questionnaires_col=[[],[],[]], col=0, tot=0, nbMaxQuestionnairesCol;
        // nombre d'élements par colonne :
        if(questionnaires.length < nbQuestionnairesList)
            nbMaxQuestionnairesCol=questionnaires.length;
        else
            nbMaxQuestionnairesCol=nbQuestionnairesList;
        for(let i in questionnaires)
        {
            if(tot < nbQuestionnairesList)
            {
                questionnaires_col[col].push(questionnaires[i]);
                tot++;
                if((col === 0 && tot >= (nbMaxQuestionnairesCol/3)) || (col === 1 && tot >= (nbMaxQuestionnairesCol/3*2)))
                    col++;
            }
        }
        let rotation=0, lastCar;
        col=1;
        
    for colQuestionaires in questionnaires_col
        div(class="column-"+col)
            for questionnaire in colQuestionaires
                -
                    rotation=Math.random()+"";
                    lastCar=parseInt(rotation.charAt(rotation.length-1),10);
                    if(lastCar > 4)
                        rotation*=-1;
                    let imgAttributes = { alt: txtIllustration.defaultAlt };
                    if(tool.isEmpty(questionnaire.Illustrations[0].alt)===false)
                        imgAttributes.alt=questionnaire.Illustrations[0].alt;
                    if(tool.isEmpty(questionnaire.Illustrations[0].title)===false)
                        imgAttributes.title=questionnaire.Illustrations[0].title;
                    let introduction=tool.shortenIfLongerThan(striptags(questionnaire.Questionnaire.introduction.replace("<br>", " ").replace("</p>", " ")), 200);

                div(class="quiz cardboard" style="transform: rotate("+rotation+"deg);")
                    h3
                        a(href="/quiz/"+questionnaire.Questionnaire.slug+".html") #{questionnaire.Questionnaire.title}                
                    div(class="quiz-image-wrapper" style="background-image: url('/img/quizs/"+questionnaire.Illustrations[0].url+"')")
                        a(href="/quiz/"+questionnaire.Questionnaire.slug+".html")
                            img(src="/img/quizs/"+questionnaire.Illustrations[0].url)&attributes(imgAttributes)
                    p#intro #{introduction}
                    p
                        a(href="/quiz/"+questionnaire.Questionnaire.slug+".html" class="button cardboard") #{txtGeneral.btnLinkToQuestionnaire}
        - col++;