-
peter_rabbit authoredpeter_rabbit authored
education.js 37.08 KiB
(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
const ENV = "dev";
let server_url;
switch (ENV) {
case "dev":
server_url = "http://localhost";
break;
case "prod":
server_url = "http://kuadrado-software.fr";
}
module.exports = { server_url };
},{}],2:[function(require,module,exports){
const { server_url } = require("./config");
module.exports = {
images_url: `${server_url}/assets/images`,
};
},{"./config":1}],3:[function(require,module,exports){
"use strict";
module.exports = {
setRenderCycleRoot(renderCycleRoot) {
this.renderCycleRoot = renderCycleRoot;
},
objectToHtml: function objectToHtml(obj) {
const { tag } = obj;
const node = document.createElement(tag);
const excludeKeys = ["tag", "contents", "style_rules", "state"];
Object.keys(obj)
.filter(attr => !excludeKeys.includes(attr))
.forEach(attr => {
if (attr === "class") {
node.classList.add(...obj[attr].split(" ").filter(s => s !== ""));
} else {
node[attr] = obj[attr];
}
});
if (obj.contents && typeof obj.contents === "string") {
node.innerHTML = obj.contents;
} else {
obj.contents &&
obj.contents.length > 0 &&
obj.contents.forEach(el => {
switch (typeof el) {
case "string":
node.innerHTML = el;
break;
case "object":
node.appendChild(objectToHtml(el));
break;
}
});
}
if (obj.style_rules) {
Object.keys(obj.style_rules).forEach(rule => {
node.style[rule] = obj.style_rules[rule];
});
}
return node;
},
renderCycle: function () { this.subRender(this.renderCycleRoot.render(), document.getElementsByTagName("main")[0], {
mode: "replace",
});
},
subRender(object, htmlNode, options = { mode: "append" }) {
const insert = this.objectToHtml(object);
switch (options.mode) {
case "append":
htmlNode.appendChild(insert);
break;
case "override":
htmlNode.innerHTML = "";
htmlNode.appendChild(insert);
break;
case "insert-before":
htmlNode.insertBefore(insert, htmlNode.childNodes[options.insertIndex]);
break;
case "adjacent":
/**
* options.insertLocation must be one of:
*
* afterbegin
* afterend
* beforebegin
* beforeend
*/
htmlNode.insertAdjacentHTML(options.insertLocation, insert);
break;
case "replace":
htmlNode.parentNode.replaceChild(insert, htmlNode);
break;
case "remove":
htmlNode.remove();
break;
}
},
};
},{}],4:[function(require,module,exports){
"use strict";
const { images_url } = require("../../../../constants");
const GAMEDEV_THEMES = [
{
title: "Dessin et création 2D",
image: "learning_theme_2d.png",
details: [
"Création de décors et de personnages",
"Dessin sur ordinateur, pixel art, vectoriel",
"Animations 2D",
],
},
{
title: "Musique et sons",
image: "learning_theme_sound.png",
details: ["Logiciels de son et synthétiseurs", "Composition", "Prise de son", "Mixage"],
},
{
title: "Écriture",
image: "learning_theme_write.png",
details: [
"Écrire une histoire, construire une narration",
"Imaginer des mondes et des personnages",
],
},
{
title: "Conception",
image: "learning_theme_conception.png",
details: [ "Concevoir les différents éléments qui composent le jeu",
"Développer les mécanismes de gameplay",
],
},
{
title: "Programmation",
image: "learning_theme_coding.png",
details: [
"Apprendre pas à pas à coder avec différents langages de programmation",
"Découvrir les bases du web en créant des mini-jeux en lignes",
],
},
{
title: "Mathématiques",
image: "learning_theme_math.png",
comment:
"<em>Créer un jeu vidéo c'est l'occasion de découvrir plein de sujets en maths et en physique tout en s'amusant !</em>",
details: [
"Algorithmie",
"Logique (algèbre booléen)",
"Géométrie",
"Trigonométrie",
"Algèbre linéaire",
"Repères 2D / 3D",
"Vecteurs 2D / 3D",
"Newton",
"...",
],
},
{
title: "Travail d'équipe",
image: "learning_theme_team.png",
comment: `
<em>
Faire son jeu tout seul c'est bien mais ça peut être long !
<br />Créer des jeux c'est aussi l'occasion de se mettre à plusieurs pour tirer le meilleur parti des différents talents de chacun.
</em>`,
details: ["Gestion de projet", "Méthodologie", "Communication"],
},
{
title: "Logiciels libres, GNU/Linux",
image: "learning_theme_linux.png",
comment:
"<em>Nous utilisons essentiellement des logiciels libres sur Linux.<br />C'est donc une bonne occasion de découvrir et démystifier tout ça en douceur !</em>",
details: ["Ubuntu / Debian", "GIMP", "LMMS", "Audacity", "Pencil2d", "..."],
},
];
class GameStudioClub {
render() {
return {
tag: "section",
contents: [
{
tag: "div",
class: "title-banner game-banner",
id: "game-studio-club", // anchor id
contents: [{ tag: "h2", contents: "Game Studio Club" }],
},
{
tag: "div",
class: "section-contents",
contents: [
{
tag: "div",
class: "full-row",
contents: [
{
tag: "h3",
class: "big", contents:
"Apprendre à créer un <blue>jeu vidéo</blue> de A à Z",
},
{
tag: "strong",
contents:
"La création d'un jeu vidéo c'est l'occasion d'aborder plein de choses différentes !",
},
{
tag: "p",
contents:
"<em><b><blue>Aucun prérequis nécessaire</blue></b>. Pas besoin d'être fort en maths ou en informatique, le but est d'apprendre et se détendre !</em>",
},
],
},
{
tag: "div",
class: "practical-infos",
contents: [
{
tag: "div",
class: "info-item",
contents: [
{ tag: "strong", contents: "Ça se passe où ?" },
{
tag: "span",
contents:
"Dans nos locaux,<br/><em>32 rue Simon Vialet, passage du Cheminou<br/>07240 Vernoux en Vivarais</em>",
},
],
},
{
tag: "div",
class: "info-item",
contents: [
{ tag: "strong", contents: "Pour qui ?" },
{
tag: "span",
contents:
"Tout le monde à partir de <b><blue>12 ans</blue></b>.",
},
],
},
{
tag: "div",
class: "info-item",
contents: [
{
tag: "strong",
contents: "Contact",
},
{
tag: "span",
contents: "04 75 78 08 72",
},
{
tag: "a",
href: "mailto:contact@kuadrado-software.fr",
contents: "contact@kuadrado-software.fr",
},
],
},
],
},
{
tag: "div",
class: "list-wrapper",
contents: [
{
tag: "ul", class: "learning-themes",
contents: GAMEDEV_THEMES.map(li => {
return {
tag: "li",
class: "learning-theme",
contents: [
{
tag: "strong",
class: "title",
contents: li.title,
},
{ tag: "img", src: `${images_url}/${li.image}` },
{
tag: "div",
class: "details",
contents: [
li.comment && {
tag: "div",
class: "comment",
contents: li.comment,
},
{
tag: "ul",
contents: li.details.map(d => {
return {
tag: "li",
contents: d,
};
}),
},
],
},
],
};
}),
},
],
},
{
tag: "div",
class: "infos-inscriptions full-row",
contents: [
{
tag: "div",
class: "groups",
contents: [
{
tag: "h3",
contents: "Groupes",
},
{
tag: "p",
contents:
"Les groupes sont de <b><blue>5 personnes</blue></b> maximum.",
},
{
tag: "div",
class: "table-wrapper",
contents: [
{
tag: "table",
contents: [
{
tag: "tr",
contents: [
{ tag: "td", contents: "Mardi" },
{
tag: "td",
contents: "16h - 19h",
}, ],
},
{
tag: "tr",
contents: [
{ tag: "td", contents: "Mercredi" },
{
tag: "td",
contents: "14h - 17h",
},
],
},
{
tag: "tr",
contents: [
{ tag: "td", contents: "Jeudi" },
{
tag: "td",
contents: "16h - 19h",
},
],
},
],
},
],
},
],
},
{
tag: "div",
class: "pricing",
contents: [
{
tag: "h3",
contents: "Inscription, fonctionnement et tarifs",
},
{
tag: "p",
contents: `Vous pouvez vous inscrire dans un des groupes pour un mois ou un trimestre.
<br /><br />Le matériel informatique est fourni sur place, mais vous pouvez amener votre propre ordinateur portable si vous le souhaitez.
`,
},
{
tag: "div",
class: "table-wrapper",
contents: [
{
tag: "table",
contents: [
{
tag: "tr",
contents: [
{
tag: "td",
contents: "Abonnement 1 mois",
},
{
tag: "td",
contents: "(4 séances)",
},
{ tag: "td", contents: "60€" },
],
},
{
tag: "tr",
contents: [
{
tag: "td",
contents:
"Abonnement 1 trimestre", },
{
tag: "td",
contents: "(12 séances)",
},
{ tag: "td", contents: "160€" },
],
},
],
},
],
},
{
tag: "div",
contents: [
{
tag: "a",
class: "download-link",
download: "fiche-inscription",
href: "/assets/documents/fiche-inscription.pdf",
contents: "Télécharger la fiche d'inscription",
},
],
},
],
},
],
},
],
},
],
};
}
}
module.exports = GameStudioClub;
},{"../../../../constants":2}],5:[function(require,module,exports){
"use strict";
const { images_url } = require("../../../../constants");
const VULGARISATION_THEMES = [
{
title: "Qu'est-ce qui se passe dans mon ordinateur ?",
image: "learning_theme_pc.png",
details: [
"Répondre aux questions sur l'informatique de tous les jours",
"L'organisation des fichiers",
"Le navigateur web et les logiciels usuels",
"Le système d'exploitation",
],
},
{
title: "GNU/Linux, le monde du libre",
image: "learning_theme_linux.png",
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 web ?",
image: "learning_theme_web.png",
details: [
"De quoi est fait le réseau internet ?",
"Comment fonctionnent les différents services que nous utilisons ?",
"Qu'est-ce qu'un cloud ?",
],
}, {
title: "Le langages des machines",
image: "learning_theme_coding.png",
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 popu-banner",
id: "popularization", // anchor id
contents: [{ tag: "h2", contents: "Vulgarisation numérique" }],
},
{
tag: "div",
class: "section-contents",
contents: [
{
tag: "div",
class: "full-row",
contents: [
{
tag: "h3",
class: "big",
contents:
"<blue>Démystifier</blue> l'informatique",
},
{
tag: "strong",
contents:
"Pour <blue>découvrir et échanger</blue> autour des <blue>outils numériques</blue> que nous utilisons tous les jours !",
},
{
tag: "p",
contents:
"<em>Des animations d'un journée ouvertes à tous organisées en partenariat avec les structures demandeuses</em>",
},
]
},
{
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 <b><blue>devis gratuit</blue></b>.",
},
],
},
{
tag: "div",
class: "info-item",
contents: [
{
tag: "strong", contents: "Contact",
},
{
tag: "span",
contents: "04 75 78 08 72",
},
{
tag: "a",
href: "mailto:contact@kuadrado-software.fr",
contents: "contact@kuadrado-software.fr",
},
],
},
],
},
{
tag: "div",
class: "list-wrapper",
contents: [
{
tag: "ul",
class: "learning-themes",
contents: VULGARISATION_THEMES.map(li => {
return {
tag: "li",
class: "learning-theme " + li.class,
contents: [
{
tag: "strong",
class: "title",
contents: li.title,
},
{ tag: "img", src: `${images_url}/${li.image}` },
{
tag: "div",
class: "details",
contents: [
{
tag: "div",
class: "comment",
contents: li.comment,
},
{
tag: "ul",
contents: li.details.map(d => {
return {
tag: "li",
contents: d,
};
}),
},
],
},
],
};
}),
},
],
},
// {
// tag: "ul",
// class: "learning-themes",
// contents: VULGARISATION_THEMES.map(li => {
// return {
// tag: "li",
// class: "learning-theme " + li.class,
// contents: [
// { tag: "strong", class: "title", contents: li.title },
// { tag: "img", src: `${images_url}/${li.image}` },
// { // tag: "div",
// class: "details",
// contents: [
// {
// tag: "div",
// class: "comment",
// contents: li.comment,
// },
// {
// tag: "ul",
// contents: li.details.map(d => {
// return {
// tag: "li",
// contents: d,
// };
// }),
// },
// ],
// },
// ],
// };
// }),
// },
],
},
],
};
}
}
module.exports = Popularization;
},{"../../../../constants":2}],6:[function(require,module,exports){
"use strict";
const GameStudioClub = require("./components/game-studio-club");
const Popularization = require("./components/popularization");
class EducationPage {
constructor(args) {
Object.assign(this, args);
}
render() {
return {
tag: "div",
id: "education-page",
contents: [
{ tag: "h1", contents: "<blue>Pédagogie</blue>" },
{
tag: "p",
class: "edu-philo",
contents:
"Démystifier et s'approprier la technologie par le partage de connaissances.",
},
new GameStudioClub().render(),
new Popularization().render(),
],
};
}
}
module.exports = EducationPage;
},{"./components/game-studio-club":4,"./components/popularization":5}],7:[function(require,module,exports){
"use strict";
"use strict";
const runPage = require("../../run-page");
const EducationPage = require("./education");runPage(EducationPage);
},{"../../run-page":8,"./education":6}],8:[function(require,module,exports){
"use strict";
const objectHtmlRenderer = require("./lib/object-html-renderer");
const Template = require("./template/template");
module.exports = function runPage(PageComponent) {
const template = new Template({ page: new PageComponent() });
objectHtmlRenderer.setRenderCycleRoot(template);
objectHtmlRenderer.renderCycle();
};
},{"./lib/object-html-renderer":3,"./template/template":10}],9:[function(require,module,exports){
"use strict";
const { images_url } = require("../../../constants");
const NAV_MENU_ITEMS = [
["/games/", "Jeux"],
["/software-development/", "Software"],
[
"/education/",
"Pédagogie",
[
// submenu
["/education/#game-studio-club", "Game Studio Club"],
["/education/#popularization", "Vulgarisation numérique"],
],
],
];
class NavBar {
constructor() {
this.initEventHandlers();
}
handleBurgerClick() {
document.getElementById("nav-menu-list").classList.toggle("responsive-show");
}
initEventHandlers() {
window.addEventListener("click", event => {
if (
event.target.id !== "nav-menu-list" &&
!event.target.classList.contains("burger") &&
!event.target.parentNode.classList.contains("burger")
) {
document.getElementById("nav-menu-list").classList.remove("responsive-show");
}
});
}
renderHome() {
return {
tag: "div",
class: "home",
contents: [
{
tag: "a",
href: "/",
contents: [
{ tag: "img", src: `${images_url}/logo_kuadrado.svg` },
{
tag: "img",
class: "logo-text",
src: `${images_url}/logo_kuadrado_txt.svg`,
},
], },
],
};
}
renderMenu(menuItemsArray, isSubmenu = false) {
return {
tag: "ul",
id: "nav-menu-list",
class: isSubmenu ? "submenu" : "",
contents: menuItemsArray.map(link => {
const [href, text, submenu] = link;
return {
tag: "li",
class: !isSubmenu && window.location.pathname === href ? "active" : "",
contents: [
{
tag: "a",
href,
contents: text,
},
].concat(submenu ? [this.renderMenu(submenu, true)] : []),
};
}),
};
}
renderResponsiveBurger() {
return {
tag: "div",
class: "burger",
onclick: this.handleBurgerClick.bind(this),
contents: [{ tag: "span", contents: "···" }],
};
}
render() {
return {
tag: "nav",
contents: [
this.renderHome(),
this.renderResponsiveBurger(),
this.renderMenu(NAV_MENU_ITEMS),
],
};
}
}
module.exports = NavBar;
},{"../../../constants":2}],10:[function(require,module,exports){
"use strict";
const { images_url } = require("../../constants");
const NavBar = require("./components/navbar");
class Template {
constructor(props) {
this.props = props;
}
render() {
return {
tag: "main",
contents: [
{
tag: "header",
contents: [new NavBar().render()],
},
{
tag: "div", id: "page-container",
contents: [this.props.page.render()],
},
{
tag: "footer",
contents: [
{
tag: "div",
class: "logo",
contents: [
{
tag: "img",
src: `${images_url}/logo_kuadrado.svg`,
},
{
tag: "img",
class:"text-logo",
src: `${images_url}/logo_kuadrado_txt.svg`,
},
],
},
{
tag:"span",
contents: "Toutes les images du site ont été réalisées par nos soins et peuvent être réutilisées pour un usage personnel."
},
{
tag: "a",
href: "mailto:contact@kuadrado-software.fr",
contents: "contact@kuadrado-software.fr",
},
],
},
],
};
}
}
module.exports = Template;
},{"../../constants":2,"./components/navbar":9}]},{},[7]);