Newer
Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
(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){
"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;
}
},
};
},{}],2:[function(require,module,exports){
"use strict";
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
const GAMEDEV_ASPECTS = [
{
title: "Dessin et création 2D",
image: "...",
comment: "",
details: [
"Créer des décors et des personnages",
"Dessiner sur ordinateur, faire du pixel art",
"Créer des animations 2D",
],
},
{
title: "Musique et effets sonores",
image: "...",
comment: "",
details: [
"Utiliser des logiciels de son et des synthétiseurs",
"Composer une musique",
"Faire une prise de son",
"Mixer un enregistrement",
],
},
{
title: "Développer un univers",
image: "...",
comment: "",
details: [
"Écrire une histoire, construire une narration",
"Imaginer des mondes et des personnages",
],
},
{
title: "Concevoir le jeu",
image: "...",
comment: "",
details: [
"Comprendres les différents éléments qui composent un jeu",
"Développer les mécanismes de gameplay",
],
},
{
title: "Programmation informatique",
image: "...",
comment: "",
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 et physique",
image: "...",
comment:
"<i>Le jeu vidéo et l'informatique en général, c'est l'occasion de découvrir plein de sujets en maths et en physique tout en s'amusant !</i>",
details: [
"Algorithmie, logique, calcul, ensembles, géométrie, trigonométrie, algèbre linéaire ,vecteurs, repères en 2 dimensions ...",
],
},
{
title: "Travail en équipe",
image: "...",
comment:
"<i>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.</i>",
details: [],
},
{
title: "Logiciels libres, systèmes Linux",
image: "...",
comment:
"<i>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 !</i>",
details: [],
},
];
class EducationPage {
constructor(args) {
Object.assign(this, args);
}
render() {
return {
tag: "div",
contents: [
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
{ tag: "h1", contents: "Pédagogie" },
{ tag: "h2", contents: "Game studio club" },
{ tag: "h3", contents: "Apprendre à créer un jeu vidéo de A à Z" },
{
tag: "p",
contents:
"La création d'un jeu vidéo c'est l'occasion d'aborder plein de choses différentes !",
},
{
tag: "ul",
contents: GAMEDEV_ASPECTS.map(li => {
return {
tag: "li",
contents: [
{ tag: "img", src: li.image },
{ tag: "strong", contents: li.title },
{ tag: "div", contents: li.comment },
{
tag: "ul",
contents: li.details.map(d => {
return {
tag: "li",
contents: d,
};
}),
},
],
};
}),
},
{
tag: "p",
contents:
"Une de ces choses vous intéresse mais pas spécialement le jeu vidéo ? <br>Pas de problème ! On peut se concentrer par exemple uniquement sur de la création 2D, ou de la création sonore, ou même uniquement des maths ! <br>L'orientation se fait en fonction des préférences de chacun.",
},
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" },
],
},
],
contents: `Vous pouvez vous inscrire au club pour un mois minium, pour soit 1 soit 2 séances par semaine.
<br>Vous devez choisir les jours ou vous viendrez au moment de l'inscription.
<br>Chaque plage horaire accueille un groupe de 5 personnes maximum.
<br>Le matériel informatique est fourni sur place, mais vouos pouvez amener votre propre ordinateur portable si vous le souhaitez.
`,
{ tag: "th", contents: "Durée de l'engagement" },
{ tag: "th", contents: "Séances hebdomadaires" },
{ tag: "th", contents: "Tarif" },
{ tag: "td", contents: "1 mois" },
{ tag: "td", contents: "1" },
{ tag: "td", contents: "70€" },
{ tag: "td", contents: "1 mois" },
{ tag: "td", contents: "2" },
{ tag: "td", contents: "100€" },
{ tag: "td", contents: "1 trimestre" },
{ tag: "td", contents: "1" },
{ tag: "td", contents: "190€" },
{ tag: "td", contents: "1 trimestre" },
{ tag: "td", contents: "2" },
{ tag: "td", contents: "280€" },
],
},
{ tag: "h3", contents: "Pour plus d'infos" },
{
tag: "ul",
contents: [
{ tag: "li", contents: "04 75 78 08 72" },
tag: "a",
href: "mailto:kuadrado-software@tutanota.com",
contents: "kuadrado-software@tutanota.com",
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
},
],
},
],
},
],
};
}
}
module.exports = EducationPage;
},{}],3:[function(require,module,exports){
"use strict";
"use strict";
const runPage = require("../../run-page");
const EducationPage = require("./education");
runPage(EducationPage);
},{"../../run-page":4,"./education":2}],4:[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":1,"./template/template":5}],5:[function(require,module,exports){
"use strict";
class Template {
constructor(props) {
this.props = props;
}
render() {
return {
tag: "main",
contents: [
{
tag: "header",
contents: [
{
tag: "ul",
contents: [
{
tag: "li",
contents: [
{
tag: "a",
href: "/public/",
contents: "Home",
},
],
},
{
tag: "li",
contents: [
{
tag: "a",
href: "/public/games/",
contents: "Jeux",
},
],
},
{
tag: "li",
contents: [
{
tag: "a",
href: "/public/software-development/",
contents: "Software development",
},
],
},
{
tag: "li",
contents: [
{
tag: "a",
href: "/public/education/",
contents: "Pédagogie",
},
],
},
],
},
],
},
{
tag: "div",
id: "page-container",
contents: [this.props.page.render()],
},
{
tag: "footer",
contents: [
{
tag: "a",
href: "mailto:kuadrado-software@tutanota.com",
contents: "kuadrado-software@tutanota.com",
},
],
},
],
};
}
}
module.exports = Template;
},{}]},{},[3]);