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 8ff332ad authored by Pierre Jarriges's avatar Pierre Jarriges
Browse files

simplify software article details display

parent 5fca1681
No related branches found
No related tags found
No related merge requests found
Showing with 87 additions and 255 deletions
...@@ -12,11 +12,11 @@ services: ...@@ -12,11 +12,11 @@ services:
- ./data/nginx:/etc/nginx/conf.d - ./data/nginx:/etc/nginx/conf.d
- ./data/certbot/conf:/etc/letsencrypt - ./data/certbot/conf:/etc/letsencrypt
- ./data/certbot/www:/var/www/certbot - ./data/certbot/www:/var/www/certbot
command: '/bin/sh -c ''while :; do sleep 6h & wait $${!}; nginx -s reload; done & nginx -g "daemon off;"''' command: /bin/sh -c 'while :; do sleep 6h & wait $${!}; nginx -s reload; done & nginx -g "daemon off;"'
certbot: certbot:
image: certbot/certbot image: certbot/certbot
restart: unless-stopped restart: unless-stopped
volumes: volumes:
- ./data/certbot/conf:/etc/letsencrypt - ./data/certbot/conf:/etc/letsencrypt
- ./data/certbot/www:/var/www/certbot - ./data/certbot/www:/var/www/certbot
entrypoint: "/bin/sh -c 'trap exit TERM; while :; do certbot renew; sleep 12h & wait $${!}; done;'" entrypoint: /bin/sh -c 'trap exit TERM; while :; do certbot renew; sleep 12h & wait $${!}; done;'
...@@ -2,7 +2,6 @@ ...@@ -2,7 +2,6 @@
"articles": [ "articles": [
"mentalo", "mentalo",
"object-to-html-renderer", "object-to-html-renderer",
"make_frames", "make_frames"
"watergun"
] ]
} }
\ No newline at end of file
...@@ -3,18 +3,28 @@ ...@@ -3,18 +3,28 @@
"date": "2021/02/21", "date": "2021/02/21",
"subtitle": "Outil en ligne de commande de manipulation d'animation", "subtitle": "Outil en ligne de commande de manipulation d'animation",
"body": "<file>make_frames.txt", "body": "<file>make_frames.txt",
"technical": { "details": [
"stack": ["Rust"], {
"license": "GNU-GPL v3", "label": "Stack",
"repository": "https://gitlab.com/kuadrado-software/make_frames", "value": "Rust"
"version": "0.1.1" },
}, {
"images": ["screen_make_frames.png"], "label": "License",
"value": "GNU-GPL v3"
},
{
"label": "Source",
"value": "<a href='https://gitlab.com/kuadrado-software/make_frames' target='_blank'>gitlab.com/kuadrado-software/make_frames</a>"
}
],
"images": [
"screen_make_frames.png"
],
"releases": [ "releases": [
{ {
"version": "0.1.1", "version": "0.1.1",
"platform": "Debian/Ubuntu - amd64", "platform": "Debian/Ubuntu - amd64",
"download": "make_frames_0.1.1_amd64.deb" "download": "make_frames_0.1.1_amd64.deb"
} }
] ]
} }
\ No newline at end of file
{ {
"title": "Mentalo", "title": "Mentalo",
"date": "2021/07/18", "date": "2021/07/18",
"subtitle": "Une application pour créer des jeux simples", "subtitle": "Une application pour développer la logique en créant des jeux.",
"body": "<file>mentalo.txt", "body": "<file>mentalo.txt",
"technical": { "details": [
"stack": [ {
"Javascript", "label": "Stack",
"Nodejs", "value": "Javascript, Rust, MongoDb"
"Sass" },
], {
"license": "GNU GPL v3", "label": "License",
"repository": "https://gitlab.com/kuadrado-software/mentalo-app", "value": "GNU GPL v3 / LGPL"
"version": "0.1.2" },
}, {
"label": "Source app",
"value": "<a href='https://gitlab.com/kuadrado-software/mentalo-app' target='_blank'>gitlab.com/kuadrado-software/mentalo-app</a>"
},
{
"label": "Source API",
"value": "<a href='https://gitlab.com/kuadrado-software/mentalo_api' target='_blank'>gitlab.com/kuadrado-software/mentalo_api</a>"
},
{
"label": "Source applet dessin",
"value": "<a href='https://gitlab.com/kuadrado-software/mentalo-drawing-tool' target='_blank'>gitlab.com/kuadrado-software/mentalo-drawing-tool</a>"
}
],
"images": [ "images": [
"mental-eau.png" "mental-eau.png"
] ]
......
Mentalo est une application éducative qui permet de construire un raisonnement logique à travers la création de jeux simples basés sur des écrans statiques et des choix texte. Mentalo est une application éducative qui permet de construire un raisonnement logique à travers la création de jeux simples basés sur des écrans statiques et des choix texte.
Sortie d'une version beta prévue pour Septembre 2021. Sortie d'une version beta prévue pour Novembre 2021.
\ No newline at end of file \ No newline at end of file
...@@ -3,15 +3,20 @@ ...@@ -3,15 +3,20 @@
"date": "2021/07/18", "date": "2021/07/18",
"subtitle": "Un moteur de rendu web dynamique", "subtitle": "Un moteur de rendu web dynamique",
"body": "<file>object-to-html-renderer.txt", "body": "<file>object-to-html-renderer.txt",
"technical": { "details": [
"stack": [ {
"Javascript", "label": "Stack",
"Nodejs" "value": "Javascript, NodeJs"
], },
"license": "LGPL-3.0", {
"repository": "https://gitlab.com/kuadrado-software/object-to-html-renderer", "label": "License",
"version": "1.0.3" "value": "LGPL-3.0"
}, },
{
"label": "Source",
"value": "<a href='https://gitlab.com/kuadrado-software/object-to-html-renderer' target='_blank'>gitlab.com/kuadrado-software/object-to-html-renderer</a>"
}
],
"images": [ "images": [
"obj-to-html-logo.png" "obj-to-html-logo.png"
] ]
......
public/articles/software/watergun/images/watergun-overview-light.jpg

101 KiB

{
"title": "Watergun",
"date": "2021/01/23",
"subtitle": "Un éditeur de site web ultra-light",
"body": "<file>watergun.txt",
"technical": {
"stack": ["Javascript", "Node.js", "Electron"],
"license": "Gnu gpl v3",
"repository": "https://gitlab.com/kuadrado-software/watergun-web-editor",
"version": "0.0.1"
},
"images": ["watergun-overview-light.jpg"]
}
Projet expérimental de logiciel de création web fonctionnant entièrement hors ligne et permettant de générer facilement un site web statique très léger, de le déployer en ligne et de le modifier.
\ No newline at end of file
...@@ -109,76 +109,6 @@ module.exports = { ...@@ -109,76 +109,6 @@ module.exports = {
},{}],4:[function(require,module,exports){ },{}],4:[function(require,module,exports){
"use strict"; "use strict";
const objectHtmlRenderer = require("object-to-html-renderer")
class ImageCarousel {
constructor(props) {
this.props = props;
this.id = performance.now();
this.state = {
showImageIndex: 0,
};
this.RUN_INTERVAL = 5000;
this.props.images.length > 1 && this.run();
}
run() {
this.runningInterval = setInterval(() => {
let { showImageIndex } = this.state;
const { images } = this.props;
this.state.showImageIndex = showImageIndex < images.length - 1 ? ++showImageIndex : 0;
this.refreshImage();
}, this.RUN_INTERVAL);
}
setImageIndex(i) {
clearInterval(this.runningInterval);
this.state.showImageIndex = i;
this.refreshImage();
}
refreshImage() {
objectHtmlRenderer.subRender(this.render(), document.getElementById(this.id), {
mode: "replace",
});
}
render() {
const { showImageIndex } = this.state;
const { images } = this.props;
return {
tag: "div",
id: this.id,
class: "image-carousel",
contents: [
{
tag: "img",
property: "image",
alt: `image carousel ${images[showImageIndex].replace(/\.[A-Za-z]+/, "")}`,
src: images[showImageIndex],
},
images.length > 1 && {
tag: "div",
class: "carousel-bullets",
contents: images.map((_, i) => {
const active = showImageIndex === i;
return {
tag: "span",
class: `bullet ${active ? "active" : ""}`,
onclick: this.setImageIndex.bind(this, i),
};
}),
},
],
};
}
}
module.exports = ImageCarousel;
},{"object-to-html-renderer":3}],5:[function(require,module,exports){
"use strict";
const { fetchjson, fetchtext } = require("./fetch"); const { fetchjson, fetchtext } = require("./fetch");
function getArticleBody(text) { function getArticleBody(text) {
...@@ -239,7 +169,7 @@ module.exports = { ...@@ -239,7 +169,7 @@ module.exports = {
populateArticles, populateArticles,
}; };
},{"./fetch":6}],6:[function(require,module,exports){ },{"./fetch":5}],5:[function(require,module,exports){
"use strict"; "use strict";
function fetchjson(url) { function fetchjson(url) {
...@@ -265,7 +195,7 @@ module.exports = { ...@@ -265,7 +195,7 @@ module.exports = {
fetchtext, fetchtext,
}; };
},{}],7:[function(require,module,exports){ },{}],6:[function(require,module,exports){
"use strict"; "use strict";
class WebPage { class WebPage {
...@@ -275,11 +205,10 @@ class WebPage { ...@@ -275,11 +205,10 @@ class WebPage {
} }
module.exports = WebPage; module.exports = WebPage;
},{}],8:[function(require,module,exports){ },{}],7:[function(require,module,exports){
"use strict"; "use strict";
const { articles_url } = require("../../../../constants"); const { articles_url } = require("../../../../constants");
const ImageCarousel = require("../../../generic-components/image-carousel");
const { loadArticles, getArticleBody, getArticleDate } = require("../../../lib/article-utils"); const { loadArticles, getArticleBody, getArticleDate } = require("../../../lib/article-utils");
const objectHtmlRenderer = require("object-to-html-renderer") const objectHtmlRenderer = require("object-to-html-renderer")
...@@ -289,7 +218,8 @@ class SoftwareArticle { ...@@ -289,7 +218,8 @@ class SoftwareArticle {
} }
render() { render() {
const { title, date, body, subtitle, images, path, technical, releases } = this.props; const { title, body, subtitle, images, path, details = [], releases } = this.props;
return { return {
tag: "article", tag: "article",
class: "software-article", class: "software-article",
...@@ -333,74 +263,19 @@ class SoftwareArticle { ...@@ -333,74 +263,19 @@ class SoftwareArticle {
{ {
tag: "ul", tag: "ul",
class: "technical-details", class: "technical-details",
contents: [ contents: details.map(detail => {
{ return {
tag: "li",
class: "detail",
contents: [
{ tag: "label", contents: "Stack" },
{
tag: "div",
contents: [
{
tag: "ul",
contents: technical.stack.map(tech => {
return {
tag: "li",
contents: tech,
property: "about",
};
}),
},
],
},
],
},
{
tag: "li",
class: "detail",
contents: [
{ tag: "label", contents: "Version actuelle" },
{
tag: "div",
contents: technical.version,
property: "version",
},
],
},
{
tag: "li", tag: "li",
class: "detail", class: "detail",
contents: [ contents: [
{ tag: "label", contents: "License" }, { tag: "label", contents: detail.label },
{ {
tag: "div", tag: "div",
contents: technical.license, contents: detail.value
property: "license",
},
],
},
{
tag: "li",
class: "detail",
contents: [
{
tag: "label",
contents: "Code source",
},
{
tag: "a",
href: technical.repository,
target: "_blank",
contents: technical.repository.replace(
/https?:\/\/(www\.)?/g,
""
),
property: "url",
}, },
], ],
}, };
], }),
}, },
releases && { releases && {
tag: "h2", tag: "h2",
...@@ -519,7 +394,7 @@ class SoftwareArticles { ...@@ -519,7 +394,7 @@ class SoftwareArticles {
module.exports = SoftwareArticles; module.exports = SoftwareArticles;
},{"../../../../constants":2,"../../../generic-components/image-carousel":4,"../../../lib/article-utils":5,"object-to-html-renderer":3}],9:[function(require,module,exports){ },{"../../../../constants":2,"../../../lib/article-utils":4,"object-to-html-renderer":3}],8:[function(require,module,exports){
"use strict"; "use strict";
const { images_url } = require("../../../constants"); const { images_url } = require("../../../constants");
...@@ -568,7 +443,7 @@ class SoftwareDevelopment extends WebPage { ...@@ -568,7 +443,7 @@ class SoftwareDevelopment extends WebPage {
module.exports = SoftwareDevelopment; module.exports = SoftwareDevelopment;
},{"../../../constants":2,"../../lib/web-page":7,"./components/software-articles":8}],10:[function(require,module,exports){ },{"../../../constants":2,"../../lib/web-page":6,"./components/software-articles":7}],9:[function(require,module,exports){
"use strict"; "use strict";
"use strict"; "use strict";
...@@ -576,7 +451,7 @@ const runPage = require("../../run-page"); ...@@ -576,7 +451,7 @@ const runPage = require("../../run-page");
const SoftwareDevelopment = require("./software-development"); const SoftwareDevelopment = require("./software-development");
runPage(SoftwareDevelopment); runPage(SoftwareDevelopment);
},{"../../run-page":11,"./software-development":9}],11:[function(require,module,exports){ },{"../../run-page":10,"./software-development":8}],10:[function(require,module,exports){
"use strict"; "use strict";
const objectHtmlRenderer = require("object-to-html-renderer") const objectHtmlRenderer = require("object-to-html-renderer")
...@@ -588,7 +463,7 @@ module.exports = function runPage(PageComponent) { ...@@ -588,7 +463,7 @@ module.exports = function runPage(PageComponent) {
objectHtmlRenderer.renderCycle(); objectHtmlRenderer.renderCycle();
}; };
},{"./template/template":13,"object-to-html-renderer":3}],12:[function(require,module,exports){ },{"./template/template":12,"object-to-html-renderer":3}],11:[function(require,module,exports){
"use strict"; "use strict";
const { images_url } = require("../../../constants"); const { images_url } = require("../../../constants");
...@@ -698,7 +573,7 @@ class NavBar { ...@@ -698,7 +573,7 @@ class NavBar {
module.exports = NavBar; module.exports = NavBar;
},{"../../../constants":2}],13:[function(require,module,exports){ },{"../../../constants":2}],12:[function(require,module,exports){
"use strict"; "use strict";
const { in_construction } = require("../../config"); const { in_construction } = require("../../config");
...@@ -800,4 +675,4 @@ class Template { ...@@ -800,4 +675,4 @@ class Template {
module.exports = Template; module.exports = Template;
},{"../../config":1,"../../constants":2,"./components/navbar":12}]},{},[10]); },{"../../config":1,"../../constants":2,"./components/navbar":11}]},{},[9]);
"use strict"; "use strict";
const { articles_url } = require("../../../../constants"); const { articles_url } = require("../../../../constants");
const ImageCarousel = require("../../../generic-components/image-carousel");
const { loadArticles, getArticleBody, getArticleDate } = require("../../../lib/article-utils"); const { loadArticles, getArticleBody, getArticleDate } = require("../../../lib/article-utils");
const objectHtmlRenderer = require("object-to-html-renderer") const objectHtmlRenderer = require("object-to-html-renderer")
...@@ -11,7 +10,8 @@ class SoftwareArticle { ...@@ -11,7 +10,8 @@ class SoftwareArticle {
} }
render() { render() {
const { title, date, body, subtitle, images, path, technical, releases } = this.props; const { title, body, subtitle, images, path, details = [], releases } = this.props;
return { return {
tag: "article", tag: "article",
class: "software-article", class: "software-article",
...@@ -55,74 +55,19 @@ class SoftwareArticle { ...@@ -55,74 +55,19 @@ class SoftwareArticle {
{ {
tag: "ul", tag: "ul",
class: "technical-details", class: "technical-details",
contents: [ contents: details.map(detail => {
{ return {
tag: "li", tag: "li",
class: "detail", class: "detail",
contents: [ contents: [
{ tag: "label", contents: "Stack" }, { tag: "label", contents: detail.label },
{ {
tag: "div", tag: "div",
contents: [ contents: detail.value
{
tag: "ul",
contents: technical.stack.map(tech => {
return {
tag: "li",
contents: tech,
property: "about",
};
}),
},
],
}, },
], ],
}, };
{ }),
tag: "li",
class: "detail",
contents: [
{ tag: "label", contents: "Version actuelle" },
{
tag: "div",
contents: technical.version,
property: "version",
},
],
},
{
tag: "li",
class: "detail",
contents: [
{ tag: "label", contents: "License" },
{
tag: "div",
contents: technical.license,
property: "license",
},
],
},
{
tag: "li",
class: "detail",
contents: [
{
tag: "label",
contents: "Code source",
},
{
tag: "a",
href: technical.repository,
target: "_blank",
contents: technical.repository.replace(
/https?:\/\/(www\.)?/g,
""
),
property: "url",
},
],
},
],
}, },
releases && { releases && {
tag: "h2", tag: "h2",
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment