homepage.js

"use strict";

const { images_url } = require("../constants");
const NewsArticles = require("./home-page-components/news-articles");
const ThemeCard = require("./home-page-components/theme-card");

class HomePage {
    constructor(args) {
        Object.assign(this, args);
    }

    render() {
        return {
            tag: "div",
            id: "home-page",
            contents: [
                {
                    tag: "div",
                    class: "page-header",
                    contents: [
                        {
                            tag: "div",
                            class: "big-logo page-contents-center",
                            contents: [
                                {
                                    tag: "img",
                                    alt: "logo Kuadrado",
                                    src: `${images_url}/logo_kuadrado.svg`,
                                },
                                {
                                    tag: "img",
                                    class: "logo-text",
                                    alt: "Kuadrado",
                                    src: `${images_url}/logo_kuadrado_txt.svg`,
                                },
                            ],
                        },
                        { tag: "h1", contents: "Kuadrado Software", class: "page-contents-center" },
                        {
                            tag: "p",
                            class: "page-contents-center",
                            contents: `<b>Kvadrata rado</b> veut dire "roue carrée" en Esperanto.
                            <br/>Nous avons choisi ce symbole pour revendiquer le fait d'aimer fabriquer
                            les choses nous-même ... Quitte parfois à réinventer un peu la roue !
                            `,
                        },
                    ],
                },
                {
                    tag: "section",
                    class: "page-contents-center",
                    contents: [
                        { tag: "h2", contents: "Actu", class: "section-title bg-blue" },
                        new NewsArticles().render(),
                    ],
                },
                {
                    tag: "div",
                    class: "page-philo",
                    contents: [
                        {
                            tag: "p",
                            class: "page-contents-center",
                            contents: `Nous avons à cœur une démarche de légèreté et de simplicité dans nos créations.
                            <br /><br />Nous travaillons pour le plaisir de créer, de maîtriser et de comprendre.`,
                        },
                    ],
                },
                {
                    tag: "section",
                    class: "page-contents-center grid-3",
                    contents: [
                        {
                            title: "Jeux",
                            img: "game_controller.svg",
                            href: "/games/",
                            description:
                                "Toutes nos créations vidéoludiques, jeux web et jeux PC, projets en cours, c'est par ici que ça se passe.",
                        },
                        {
                            title: "Software",
                            img: "meca_proc.svg",
                            href: "/software-development/",
                            description: `Quand nous avons besoin d'un outil numérique, développement web, moteur de jeux ou outillage logiciel, nous aimons bien le fabriquer nous-même si c'est possible ... et si ça nous amuse ! 
                                <br/>Retrouvez nos projets software en détail sur cette page.`,
                        },
                        {
                            title: "Pédagogie",
                            img: "brain.svg",
                            href: "/education/",
                            description: `Démystifier et s'approprier la technologie par le partage de connaissances.
                            <br/>Découvrez nos initiatives pédagogiques.`,
                        },
                    ].map(cardProps => new ThemeCard(cardProps).render()),
                },
            ],
        };
    }
}

module.exports = HomePage;