Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
Commit 0a40115e authored by Pierre Jarriges's avatar Pierre Jarriges
Browse files

Merge branch 'dev' into 'master' 

Dev

See merge request !13
parents 18aba973 1a0f020f
No related branches found
No related tags found
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 421 additions and 8471 deletions
.gitignore
+ 1
− 1
View file @ 0a40115e
bundle.js bundle.js
*.map *.map
*.css.map *.css.map
src/**/*.css *.css
node_modules node_modules
target target
.env .env
Makefile
+ 2
− 2
View file @ 0a40115e
...@@ -23,10 +23,10 @@ bash-api: ...@@ -23,10 +23,10 @@ bash-api:
docker exec -it kuadrado_server bash docker exec -it kuadrado_server bash
build-website: build-website:
npm run --prefix ./website build npm run --prefix ./website build-prod
build-website-debug: build-website-debug:
npm run --prefix ./website build debug npm run --prefix ./website build
build-admin: build-admin:
npm run --prefix ./admin-frontend build npm run --prefix ./admin-frontend build
......
admin-frontend/src/components/create-article-form.js
+ 1
− 1
View file @ 0a40115e
...@@ -193,7 +193,7 @@ class CreateArticleForm { ...@@ -193,7 +193,7 @@ class CreateArticleForm {
maxWidth: "800px", maxWidth: "800px",
}, },
contents: [ contents: [
{ tag: "button", contents: "RESET", onclick: this.reset.bind(this) }, !this.params.data && { tag: "button", contents: "RESET", onclick: this.reset.bind(this) },
{ tag: "h2", contents: article.title }, { tag: "h2", contents: article.title },
{ tag: "h4", contents: article.subtitle }, { tag: "h4", contents: article.subtitle },
{ tag: "p", contents: article.body.replace(/\n/g, "<br>") }, { tag: "p", contents: article.body.replace(/\n/g, "<br>") },
......
admin-frontend/src/components/update-article-form.js
+ 8
− 38
View file @ 0a40115e
...@@ -9,7 +9,12 @@ class UpdateArticleForm { ...@@ -9,7 +9,12 @@ class UpdateArticleForm {
this.state = { this.state = {
search_article_title: "", search_article_title: "",
article_to_update: {}, article_to_update: {},
} };
this.articles_list = new ArticleList({
on_select_article: this.handle_select_article.bind(this),
on_delete_result: this.handle_delete_article.bind(this)
});
} }
reset() { reset() {
...@@ -39,38 +44,6 @@ class UpdateArticleForm { ...@@ -39,38 +44,6 @@ class UpdateArticleForm {
.catch(err => alert(err)) .catch(err => alert(err))
} }
refresh_search_result() {
obj2htm.subRender(
this.render_search_result(),
document.getElementById("update-article-form-search-result"),
{ mode: "replace" },
);
}
render_search_result() {
const { search_result } = this.state;
return {
tag: "div",
id: "update-article-form-search-result",
style_rules: {
display: "flex",
gap: "10px",
alignItems: "center"
},
contents: search_result.title ? [
{ tag: "strong", contents: search_result.title },
{
tag: "button", contents: "SELECT",
onclick: this.handle_select_result.bind(this)
},
{
tag: "button", contents: "DELETE",
onclick: this.handle_delete_article.bind(this)
}
] : []
}
}
refresh_update_form() { refresh_update_form() {
obj2htm.subRender( obj2htm.subRender(
this.render_update_form(), this.render_update_form(),
...@@ -88,7 +61,7 @@ class UpdateArticleForm { ...@@ -88,7 +61,7 @@ class UpdateArticleForm {
data: this.state.article_to_update, data: this.state.article_to_update,
on_article_sent: () => { on_article_sent: () => {
this.reset(); this.reset();
this.refresh_search_result(); this.articles_list.refresh_list();
} }
}).render()] }).render()]
: [] : []
...@@ -110,10 +83,7 @@ class UpdateArticleForm { ...@@ -110,10 +83,7 @@ class UpdateArticleForm {
maxWidth: "800px", maxWidth: "800px",
}, },
contents: [ contents: [
new ArticleList({ this.articles_list.render(),
on_select_article: this.handle_select_article.bind(this),
on_delete_result: this.handle_delete_article.bind(this)
}).render(),
{ tag: "hr", style_rules: { width: "100%" } }, { tag: "hr", style_rules: { width: "100%" } },
this.render_update_form(), this.render_update_form(),
] ]
......
public/assets/images/screen_mentalo_app.png 0 → 100644
+ 0
− 0
View file @ 0a40115e
public/assets/images/screen_mentalo_app.png

56 KiB

public/assets/translations/en.json
+ 3
− 1
View file @ 0a40115e
...@@ -29,5 +29,7 @@ ...@@ -29,5 +29,7 @@
"edu-learn-mentalo": "Create a game in a few sessions with the Mentalo application. Handle logical, narrative and artistic concepts with maximum simplicity.", "edu-learn-mentalo": "Create a game in a few sessions with the Mentalo application. Handle logical, narrative and artistic concepts with maximum simplicity.",
"Me contacter": "Contact me", "Me contacter": "Contact me",
"Pour s'inscrire ou en savoir plus": "To register or find out more", "Pour s'inscrire ou en savoir plus": "To register or find out more",
"software-page-intro": "R&D, experimental projects, software tools for game development or for the web." "software-page-intro": "R&D, experimental projects, software tools for game development or for the web.",
"Programme XXXX": "{%date%} program",
"Rien de prévu pour le moment": "Nothing planned for the moment"
} }
\ No newline at end of file
public/assets/translations/fr.json
+ 2
− 1
View file @ 0a40115e
...@@ -12,5 +12,6 @@ ...@@ -12,5 +12,6 @@
"edu-learn-computer": "Perdu avec votre ordinateur ou votre smartphone, les logiciels, internet ? Prenez en main les fondamentaux apprenez pas à pas à utiliser sereinement la technologie.", "edu-learn-computer": "Perdu avec votre ordinateur ou votre smartphone, les logiciels, internet ? Prenez en main les fondamentaux apprenez pas à pas à utiliser sereinement la technologie.",
"edu-learn-gnu": "<b>Passez le cap du libre ! </b><br/>Apprenez à installer Linux, faites vos premiers pas avec les logiciels libres et acquérez une autonomie suffisante pour une utilisation basique.", "edu-learn-gnu": "<b>Passez le cap du libre ! </b><br/>Apprenez à installer Linux, faites vos premiers pas avec les logiciels libres et acquérez une autonomie suffisante pour une utilisation basique.",
"edu-learn-mentalo": "Créez un jeu en quelques séances avec l'application Mentalo. Manipulez des concepts logiques, narratifs et artistiques avec le maximum de simplicité.", "edu-learn-mentalo": "Créez un jeu en quelques séances avec l'application Mentalo. Manipulez des concepts logiques, narratifs et artistiques avec le maximum de simplicité.",
"software-page-intro": "R&D, projets expérimentaux, outillage logiciel pour le développement de jeu ou pour le web." "software-page-intro": "R&D, projets expérimentaux, outillage logiciel pour le développement de jeu ou pour le web.",
"Programme XXXX": "Programme {%date%}"
} }
\ No newline at end of file
public/education/education.js
+ 2
− 879
View file @ 0a40115e
This diff is collapsed.
public/games/games.js
+ 2
− 4503
View file @ 0a40115e
This diff is collapsed.
public/main.js
+ 2
− 846
View file @ 0a40115e
This diff is collapsed.
public/software-development/software-development.js
+ 2
− 984
View file @ 0a40115e
This diff is collapsed.
public/style/style.css deleted 100644 → 0
+ 0
− 987
View file @ 18aba973
This diff is collapsed.
website/package.json
+ 3
− 3
View file @ 0a40115e
...@@ -5,9 +5,9 @@ ...@@ -5,9 +5,9 @@
"main": "src/main.js", "main": "src/main.js",
"scripts": { "scripts": {
"test": "echo \"Error: no test specified\" && exit 1", "test": "echo \"Error: no test specified\" && exit 1",
"style-watch": "sass --watch ./src/style.scss ./public/style/style.css", "style-watch": "sass --watch ./src/style.scss ../public/style/style.css",
"build": "node build.js && sass ./src/style.scss ../public/style/style.css", "build": "node build.js && sass ./src/style.scss ../public/style/style.css",
"build-prod": "node build.js prod && sass ./src/style.scss ./public/style/style.css --style=compressed" "build-prod": "node build.js prod && sass ./src/style.scss ../public/style/style.css --style=compressed"
}, },
"repository": "https://gitlab.com/peter_rabbit/kuadrado-website", "repository": "https://gitlab.com/peter_rabbit/kuadrado-website",
"author": "Kuadrado", "author": "Kuadrado",
...@@ -22,4 +22,4 @@ ...@@ -22,4 +22,4 @@
"sass": "^1.32.0", "sass": "^1.32.0",
"simple-browser-js-bundler": "^0.1.1" "simple-browser-js-bundler": "^0.1.1"
} }
} }
\ No newline at end of file
website/src/pages/education/components/edu-article.js 0 → 100644
+ 84
− 0
View file @ 0a40115e
"use strict";
const { images_url } = require("../../../../constants");
const ImageCarousel = require("../../../generic-components/image-carousel");
const { getArticleBody } = require("../../../lib/article-utils");
class EduArticle {
constructor(props) {
this.props = props;
}
render() {
const { title, body, subtitle, images, details = [] } = this.props;
return {
tag: "article",
class: "edu-article",
typeof: "Article",
contents: [
{
tag: "h2",
class: "edu-art-title",
contents: title,
property: "name",
},
{
tag: "div", class: "edu-art-image",
contents: [
{
tag: "img", src: `${images_url}/${images[0]}`
}
]
},
{
tag: "h3",
class: "edu-art-subtitle",
contents: subtitle,
property: "alternativeHeadline",
},
{
tag: "div",
class: "edu-art-description",
contents: getArticleBody(body),
property: "description",
},
images.length > 1 && {
tag: "div", class: "edu-art-carousel", contents: [
new ImageCarousel({ images: images.map(img => `${images_url}/${img}`) }).render()
]
},
details.length > 0 && {
tag: "div",
class: "article-details edu-art-details",
contents: [
{
tag: "h2",
contents: "Details",
},
{
tag: "ul",
class: "details-list",
contents: details.map(detail => {
return {
tag: "li",
class: "detail",
contents: [
{ tag: "label", contents: detail.label },
{
tag: "div",
class: "detail-value",
contents: detail.value
},
],
};
}),
},
],
},
],
};
}
}
module.exports = EduArticle;
\ No newline at end of file
website/src/pages/education/components/edu-articles.js 0 → 100644
+ 60
− 0
View file @ 0a40115e
"use strict";
const { loadArticles } = require("../../../lib/article-utils");
const translator = require("ks-cheap-translator");
const t = translator.trad.bind(translator);
const EduArticle = require("./edu-article");
class EduArticles {
constructor(props) {
this.props = props;
this.state = {
articles: [],
loaded: false,
};
this.id = "edu-articles-section";
this.loadArticles();
}
loadArticles() {
loadArticles("education", translator.locale)
.then(articles => {
this.state.articles = articles;
})
.catch(e => console.log(e))
.finally(() => {
this.state.loaded = true;
this.refresh()
});
}
renderPlaceholder() {
return {
tag: "article",
class: "placeholder",
contents: [{ tag: "div" }, { tag: "div" }, { tag: "div" }, { tag: "div" }],
};
}
refresh() {
obj2htm.subRender(this.render(), document.getElementById(this.id), {
mode: "replace",
});
}
render() {
const { articles, loaded } = this.state;
return {
tag: "section",
class: "edu-articles page-contents-center",
id: this.id,
contents:
loaded && articles.length > 0
? articles.map(article => new EduArticle({ ...article }).render())
: loaded && articles.length === 0 ? [
{ tag: "p", contents: t("Rien de prévu pour le moment") }
] : [this.renderPlaceholder()],
};
}
}
module.exports = EduArticles;
\ No newline at end of file
website/src/pages/education/education.js
+ 3
− 50
View file @ 0a40115e
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
const { images_url } = require("../../../constants"); const { images_url } = require("../../../constants");
const WebPage = require("../../lib/web-page"); const WebPage = require("../../lib/web-page");
const translator = require("ks-cheap-translator"); const translator = require("ks-cheap-translator");
const EduArticles = require("./components/edu-articles");
const t = translator.trad.bind(translator); const t = translator.trad.bind(translator);
const EDU_THEMES = [ const EDU_THEMES = [
...@@ -79,7 +80,6 @@ class EducationPage extends WebPage { ...@@ -79,7 +80,6 @@ class EducationPage extends WebPage {
}, },
{ {
tag: "section", tag: "section",
class: "bg-dark",
contents: [ contents: [
{ {
tag: "div", tag: "div",
...@@ -104,55 +104,8 @@ class EducationPage extends WebPage { ...@@ -104,55 +104,8 @@ class EducationPage extends WebPage {
}, },
] ]
}, },
{ { tag: "h2", class: "edu-section-title page-contents-center", contents: t("Programme XXXX", { date: "2022" }) },
tag: "section", new EduArticles().render(),
class: "practical-info",
contents: [
{
tag: "div",
class: "page-contents-center",
contents: [
{
tag: "div",
class: "info-block",
contents: [
{ tag: "h3", class: "info-title", contents: `${t("Pour s'inscrire ou en savoir plus")} <em>(programme 2022 à définir, plus d'infos bientôt)</em>` },
{
tag: "ul",
class: "info-body",
contents: [
{
tag: "li",
contents: [
{ tag: "span", contents: t("Me contacter") },
{
tag: "a",
href: "mailto:contact@kuadrado-software.fr",
contents: "contact@kuadrado-software.fr",
}
]
},
{
tag: "li",
contents: [
{ tag: "span", contents: "" },
{
tag: "a",
href: "tel:+33475780872",
contents: "04 75 78 08 72",
property: "telephone",
},
]
},
]
}
]
}
]
}
]
},
], ],
}; };
} }
......
website/src/pages/education/education.scss
+ 245
− 175
View file @ 0a40115e
#education-page { #education-page {
h3 { h3 {
&.big { &.big {
font-size: 30px; font-size: 30px;
} }
} }
.title-banner { .title-banner {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
flex-direction: column; flex-direction: column;
height: 20vw; height: 20vw;
min-height: 250px; min-height: 250px;
background-image: url("/assets/images/popularization_banner.png"); background-image: url("/assets/images/popularization_banner.png");
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
h2 { h2 {
color: white; color: white;
font-size: 2.5em; font-size: 2.5em;
margin: 40px; margin: 40px;
text-shadow: 0 0 6px #0003; text-shadow: 0 0 6px #0003;
} }
} }
.special-announcement { .special-announcement {
background-color: $yellow_2; background-color: $yellow_2;
.page-contents-center { .page-contents-center {
padding: 0 20px; padding: 0 20px;
@include flex-center; @include flex-center;
p { p {
color: $dark_3; color: $dark_3;
font-size: 20px; font-size: 20px;
font-weight: 600; font-weight: 600;
margin: 0; margin: 0;
padding: 40px 0; padding: 40px 0;
} }
} }
} }
.edu-themes { .edu-section-title {
display: grid; color: $blue_2;
grid-template-columns: 1fr 1fr; margin: 40px auto;
gap: 50px; display: flex;
font-family: monospace; align-items: center;
padding: 70px 0; white-space: nowrap;
.edu-theme { gap: 15px;
display: grid; &::after {
grid-template-columns: auto 1fr; content: "";
* { display: block;
border-style: dashed; flex: 1;
border-color: $green; border: 1px solid;
border-width: 0 0 0 0; }
} }
h3 {
color: $green; .edu-themes {
grid-row: 1; display: grid;
margin: 0; grid-template-columns: 1fr 1fr;
padding: 10px; gap: 50px;
display: flex; font-family: monospace;
align-items: center; padding: 40px 0;
border-width: 0 0 0 1px; .edu-theme {
} display: grid;
img { grid-template-columns: auto 1fr;
width: 100%; h3 {
grid-row: 1 / span 2; color: $blue_2;
border-width: 1px 0 1px 1px; grid-row: 1;
} margin: 0;
p { padding: 10px;
text-align: justify; display: flex;
color: $blue_3; align-items: center;
* { }
color: $blue_3; img {
} width: 100%;
grid-row: 2; grid-row: 1 / span 2;
margin: 0; }
padding: 10px 30px 0 10px; p {
border-width: 1px 1px 1px 0; text-align: justify;
} grid-row: 2;
} margin: 0;
} padding: 10px 30px 0 10px;
}
.practical-info { }
padding: 50px 0; }
.page-contents-center {
display: grid; .edu-articles {
grid-template-columns: 1fr 1fr; display: flex;
gap: 50px; flex-direction: column;
.info-block { gap: 40px;
display: grid; margin: 20px auto;
grid-template-rows: auto 1fr; article.edu-article {
.info-title { display: grid;
color: $blue_2; grid-template-columns: auto 1fr auto;
margin: 0; gap: 10px 30px;
border-bottom: 1px dashed $light_2; ul {
border-left: 1px dashed $light_2; list-style-type: unset;
padding: 10px; margin-left: 30px;
} }
.info-body {
margin: 0; .edu-art-image {
padding: 20px 10px; padding: 20px;
border-right: 1px dashed $light_2; background-color: black;
border-bottom: 1px dashed $light_2; grid-column: 1;
} grid-row: 1 / span 3;
ul { @include flex-center;
display: flex; width: 150px;
flex-direction: column; height: 150px;
gap: 5px; overflow: hidden;
li:not(.fullwidth) { border-radius: 100%;
display: grid; img {
grid-template-columns: 1fr 1fr; max-width: 100%;
gap: 10px; max-height: 400px;
} }
&.tabled { }
li {
span { .edu-art-title {
padding: 3px 0; grid-column: 2 / span 3;
&:first-child { color: $light_2;
font-weight: bold; margin: 0;
color: $medium_grey; padding: 10px;
} }
&:last-child {
color: $blue_2; .edu-art-subtitle {
} grid-column: 2 / span 3;
} margin: 10px;
} color: $medium_grey;
} }
}
} .edu-art-description {
} grid-column: 2;
} text-align: justify;
margin: 10px;
@media screen and (max-width: 1200px) { }
.edu-themes {
grid-template-columns: 1fr; .edu-art-carousel {
gap: 30px; grid-column: 3;
padding: 70px 0; width: 30vw;
} max-width: 500px;
} .image-carousel {
width: 100%;
@media screen and (max-width: $screen_m) { height: 20vw;
.practical-info { max-height: 400px;
.page-contents-center { img {
grid-template-columns: 1fr; width: 100%;
gap: 30px; }
.info-block { }
.info-title { }
border-top: 1px dashed $light_2;
} .edu-art-details {
.info-body { grid-column: 1 / span 3;
border-bottom: none; }
}
} @media screen and (max-width: 1050px) {
} grid-template-columns: auto 1fr;
} .edu-art-title {
} grid-column: 2;
}
@media screen and (max-width: $screen_s) { .edu-art-image {
.edu-themes { grid-row: 1 / span 2;
.edu-theme { }
h3 { .edu-art-carousel {
border-width: 0 0 1px 1px; width: 100%;
} max-width: unset;
img { grid-column: 1 / span 2;
max-width: 150px; grid-row: 3;
height: auto; .image-carousel {
grid-row: 1; height: 40vw;
border-width: 1px 0 0 1px; max-height: 400px;
} }
p { }
grid-row: 2; .edu-art-subtitle {
grid-column: 1 / span 2; grid-column: 2;
padding: 20px 10px 30px 10px; grid-row: 2;
border-width: 0 1px 1px 1px; }
}
} .edu-art-description {
} grid-column: 1 / span 2;
} }
.edu-art-details {
grid-column: 1 / span 2;
}
}
@media screen and (max-width: $screen_l) {
.edu-art-title {
display: flex;
align-items: center;
}
.edu-art-subtitle {
grid-column: 1 / span 2;
}
.edu-art-image {
width: 100px;
height: 100px;
grid-row: 1;
}
// .edu-art-carousel {
// grid-column: 1 / span 2;
// }
}
}
article.placeholder {
display: grid;
grid-template-columns: 200px auto;
grid-template-rows: 100px 100px 200px;
gap: 10px;
margin: 30px;
* {
background-color: $light_0;
flex: 1;
&:first-child {
// image
grid-row: 1 / span 2;
}
&:last-child {
grid-column: 1 / span 2;
}
}
}
}
@media screen and (max-width: 1200px) {
.edu-themes {
grid-template-columns: 1fr;
gap: 30px;
padding: 0;
}
}
@media screen and (max-width: $screen_s) {
.edu-themes {
.edu-theme {
img {
max-width: 150px;
height: auto;
grid-row: 1;
}
p {
grid-row: 2;
grid-column: 1 / span 2;
padding: 20px 10px 30px 10px;
}
}
}
}
} }
website/src/style.scss
+ 1
− 0
View file @ 0a40115e
...@@ -413,6 +413,7 @@ main { ...@@ -413,6 +413,7 @@ main {
label { label {
font-weight: bold; font-weight: bold;
color: $medium_grey; color: $medium_grey;
white-space: nowrap;
} }
.detail-value { .detail-value {
text-align: right; text-align: right;
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Froggit est fièrement fabriqué avec amour par Lydra avec des Logiciels Libres et hébergé en France chez Scaleway | Status du service