translation english

website/src/template/components/navbar.js

 "use strict";
 
 const { images_url } = require("../../../constants");
+const translator = require("ks-cheap-translator");
+const t = translator.trad.bind(translator);
 
 const NAV_MENU_ITEMS = [
     { url: "/games/", text: "Jeux" },
     {
         url: "/education/",
         text: "Pédagogie",
-        // submenu: [
-        //     { url: "/gamedev", text: "Création de jeux vidéo" },
-        // ]
     },
     { url: "/software-development/", text: "Software" }
 ];
@@ -35,6 +34,12 @@ class NavBar {
         });
     }
 
+    handle_chang_lang(lang) {
+        translator.update_translations(lang).then(() => {
+            obj2htm.renderCycle();
+        }).catch(err => console.log(err));
+    }
+
     renderHome() {
         return {
             tag: "div",
@@ -76,10 +81,20 @@ class NavBar {
                         {
                             tag: "a",
                             href,
-                            contents: text,
+                            contents: t(text),
                         },
                     ].concat(submenu ? [this.renderMenu(submenu, true, url)] : []),
                 };
+            }).concat({
+                tag: "li",
+                class: "lang-flags",
+                contents: ["fr", "en"].map(lang => {
+                    return {
+                        tag: "img", src: `${images_url}/flag-${lang}.svg`,
+                        class: translator.locale === lang ? "selected" : "",
+                        onclick: this.handle_chang_lang.bind(this, lang)
+                    }
+                })
             }),
         };
     }

website/src/template/template.js

@@ -3,6 +3,8 @@
 const { in_construction } = require("../../config");
 const { images_url } = require("../../constants");
 const NavBar = require("./components/navbar");
+const translator = require("ks-cheap-translator");
+const t = translator.trad.bind(translator)
 
 class Template {
     constructor(props) {
@@ -23,7 +25,7 @@ class Template {
                         {
                             tag: "strong",
                             class: "page-contents-center",
-                            contents: "Site en construction ...",
+                            contents: t("Site en construction ..."),
                         },
                     ],
                 },
@@ -73,7 +75,7 @@ class Template {
                             contents: [
                                 {
                                     tag: "strong",
-                                    contents: "<blue>Sur les réseaux : </blue>",
+                                    contents: `<blue>${t("Sur les réseaux")} : </blue>`,
                                 },
                                 {
                                     tag: "a",
@@ -95,11 +97,11 @@ class Template {
                             tag: "span",
                             contents: `Copyleft 🄯 ${new Date()
                                 .getFullYear()} Kuadrado Software | 
-                                Toutes les images du site ont été réalisées par mes soins et peuvent être réutilisées pour un usage personnel.`,
+                                ${t("kuadrado-footer-copyleft")}`,
                         },
                         {
                             tag: "div", contents: [
-                                { tag: "span", contents: "Ce site web est " },
+                                { tag: "span", contents: t("Ce site web est") + " " },
                                 {
                                     tag: "a", target: "_blank",
                                     style_rules: { fontWeight: "bold" },