"use strict";

const { images_url } = require("../../../../constants");

const VULGARISATION_THEMES = [
    {
        title: "Qu'est-ce qui se passe dans mon ordinateur ?",
        image: `${images_url}/glitch_meta_screen1.png`,
        comment: "",
        details: [
            "Répondre à des questions simples sur l'informatique de tous les jours",
            "L'organisation des fichiers",
            "Le navigateur web",
            "Les logiciels usuels",
        ],
    },
    {
        title: "GNU/Linux, le monde du libre",
        image: `${images_url}/glitch_meta_screen2.png`,
        comment: "",
        details: [
            "Installer Linux, démystifier et faire tomber les barrières.",
            "Qu'est-ce qu'un logiciel libre ? Quels sont les enjeux ?",
        ],
    },
    {
        title: "Comment fonctionne le réseau internet ?",
        image: `${images_url}/glitch_meta_screen3.png`,
        comment: "",
        details: [
            "De quoi est fait le réseau internet ?",
            "Comment fonctionnent les différents services que nous utilisons ? (Sites, applications, boites mail, etc...)",
            "Qu'est-ce qu'un cloud ?",
        ],
    },
    {
        title: "Le langages des machines",
        image: `${images_url}/glitch_meta_screen4.png`,
        comment: "",
        details: [
            "Démystifier la programmation informatique",
            "Qu'est-ce qu'un langage de programmation",
            "À quoi ça sert ?",
            "Les métiers du développement informatique",
        ],
    },
];

class Popularization {
    render() {
        return {
            tag: "section",
            contents: [
                {
                    tag: "div",
                    class: "title-banner",
                    id: "popularization", // anchor id
                    contents: [{ tag: "h2", contents: "Ateliers de vulgarisation" }],
                },
                {
                    tag: "div",
                    class: "section-contents",
                    contents: [
                        {
                            tag: "div",
                            class: "full-row",
                            contents:
                                "<b>Nous proposons des animations d'une journée de vulgarisation autour de l'informatique sur les thèmes suivants</b>",
                        },
                        {
                            tag: "div",
                            class: "practical-infos",
                            contents: [
                                {
                                    tag: "div",
                                    class: "info-item",
                                    contents: [
                                        {
                                            tag: "span",
                                            contents:
                                                "Si vous êtes intéressé pour proposer une de ces animations dans votre structure, contactez-nous pour un devis gratuit.",
                                        },
                                    ],
                                },
                                {
                                    tag: "div",
                                    class: "info-item",
                                    contents: [
                                        {
                                            tag: "strong",
                                            contents: "Contact",
                                        },
                                        {
                                            tag: "span",
                                            contents: "04 75 78 08 72",
                                        },
                                        {
                                            tag: "a",
                                            href: "mailto:kuadrado-software@tutanota.com",
                                            contents: "kuadrado-software@tutanota.com",
                                        },
                                    ],
                                },
                            ],
                        },
                        {
                            tag: "ul",
                            class: "learning-themes",
                            contents: VULGARISATION_THEMES.map(li => {
                                return {
                                    tag: "li",
                                    class: "learning-theme",
                                    contents: [
                                        {
                                            tag: "div",
                                            class: "img-wrapper",
                                            contents: [{ tag: "img", src: li.image }],
                                        },
                                        {
                                            tag: "div",
                                            class: "right",
                                            contents: [
                                                { tag: "strong", contents: li.title },
                                                {
                                                    tag: "div",
                                                    class: "comment",
                                                    contents: li.comment,
                                                },
                                                {
                                                    tag: "ul",
                                                    contents: li.details.map(d => {
                                                        return {
                                                            tag: "li",
                                                            contents: d,
                                                        };
                                                    }),
                                                },
                                            ],
                                        },
                                    ],
                                };
                            }),
                        },
                    ],
                },
            ],
        };
    }
}

module.exports = Popularization;