Refonte de la page de services (fix #6).

assets/production/css/style.css

@@ -95,7 +95,8 @@ abbr {
   margin-bottom: 1em;
 }
 
-.Button {
+.button {
+  margin: 0 1em 0 1em;
   padding: 8px 24px;
   background: #373d3f;
   color: #fff;
@@ -108,6 +109,10 @@ abbr {
   display: inline-block;
 }
 
+.violet {
+  background: blueviolet;
+}
+
 .tac {
   text-align: center;
 }
@@ -179,6 +184,12 @@ nav section ul li {
   font-size: 1.5em;
 }
 
+.services {
+  border: lightblue 4px solid;
+  padding: 0.6em;
+
+}
+
 .services-title {
   position: relative;
   padding-left: 64px;
@@ -244,6 +255,33 @@ nav section ul li {
   background: #b9daf6 url(/images/uicons/key.svg) center center no-repeat;
 }
 
+.services-software {
+  margin-top: 2em;
+}
+
+.services-software div {
+  display: flex;
+  justify-content: space-evenly;
+  padding-top: 1em;
+  padding-bottom: 1em;
+}
+
+.services-link a {
+  align-self: center;
+}
+
+.services-link img {
+  height: 2em;
+}
+
+.services-link p {
+  align-self: center;
+  font-size: small;
+  font-weight: bold;
+  padding-left: 0.8em;
+  width: 4em;
+}
+
 .frame {
   border: 1px black solid;
   overflow: hidden;
@@ -331,7 +369,7 @@ nav section ul li {
     grid-template-columns: repeat(2, 1fr);
     grid-template-rows: 1fr;
     grid-column-gap: 64px;
-    grid-row-gap: 0;
+    grid-row-gap: 64px;
   }
 
   .Two-cols-Two-rows {

assets/production/images/uicons/copyright.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" id="Outline" viewBox="0 0 24 24" width="24" height="24"><path d="M12,0A12,12,0,1,0,24,12,12.013,12.013,0,0,0,12,0Zm0,22A10,10,0,1,1,22,12,10.011,10.011,0,0,1,12,22Z"/><path d="M15.536,8.464A1,1,0,0,0,16.95,7.05a7,7,0,1,0,0,9.9,1,1,0,0,0-1.414-1.414,5,5,0,1,1,0-7.072Z"/></svg>

assets/production/images/uicons/files.svg

@@ -0,0 +1 @@
+<svg id="Layer_1" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" data-name="Layer 1"><path d="m13 20a5.006 5.006 0 0 0 5-5v-8.757a3.972 3.972 0 0 0 -1.172-2.829l-2.242-2.242a3.972 3.972 0 0 0 -2.829-1.172h-4.757a5.006 5.006 0 0 0 -5 5v10a5.006 5.006 0 0 0 5 5zm-9-5v-10a3 3 0 0 1 3-3s4.919.014 5 .024v1.976a2 2 0 0 0 2 2h1.976c.01.081.024 9 .024 9a3 3 0 0 1 -3 3h-6a3 3 0 0 1 -3-3zm18-7v11a5.006 5.006 0 0 1 -5 5h-9a1 1 0 0 1 0-2h9a3 3 0 0 0 3-3v-11a1 1 0 0 1 2 0z"/></svg>

assets/production/images/uicons/home.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" id="Outline" viewBox="0 0 24 24" width="24" height="24"><path d="M23.121,9.069,15.536,1.483a5.008,5.008,0,0,0-7.072,0L.879,9.069A2.978,2.978,0,0,0,0,11.19v9.817a3,3,0,0,0,3,3H21a3,3,0,0,0,3-3V11.19A2.978,2.978,0,0,0,23.121,9.069ZM15,22.007H9V18.073a3,3,0,0,1,6,0Zm7-1a1,1,0,0,1-1,1H17V18.073a5,5,0,0,0-10,0v3.934H3a1,1,0,0,1-1-1V11.19a1.008,1.008,0,0,1,.293-.707L9.878,2.9a3.008,3.008,0,0,1,4.244,0l7.585,7.586A1.008,1.008,0,0,1,22,11.19Z"/></svg>

content/index.html

@@ -28,7 +28,7 @@ title: L'hébergeur associatif, transparent et solidaire
     <p>N'hésitez pas à découvrir <a href="https://www.chatons.org/chatons/all">les autres membres</a> ; tous proposent une palette particulière de services avec un coût et des garanties différentes. L'un d'eux pourrait être davantage adapté que Ti Nuage à vos besoins.</p>
   </div>
   <div class="tac mt32">
-    <a class="Button" href="/association.html">Découvrir l'association</a>
+    <a class="button" href="/association.html">Découvrir l'association</a>
   </div>
 </section>
 
@@ -53,6 +53,6 @@ title: L'hébergeur associatif, transparent et solidaire
     </div>
   </div>
   <div class="tac mt32">
-    <a class="Button" href="/services.html">Voir tous les services</a>
+    <a class="button" href="/services.html">Voir tous les services</a>
   </div>
 </section>

content/services.md

@@ -6,65 +6,3 @@ Les serveurs fournissant les services ci-dessous sont sous le seul contrôle de
 l'équipe technique de l'association.
 
 Nous sommes une petite structure et nous nous efforçons de donner le meilleur de nous même avec les moyens que nous avons à notre disposition. Malgré des sauvegardes quotidiennes et un suivi régulier de l'infrastructure, nous ne sommes pas à l'abris d'un incident. Nous ne garantissons donc pas une continuité de service permanente et nous ne nous assignons aucune obligation de résultat.
-
-<section class="Services">
-  <h2 class="tac mt128 mb64">Services réservés aux adhérents</h2>
-  <div class="Two-cols-Two-rows">
-    <div>
-      <h3 class="services-title services-icon-web">Hébergement web</h3>
-      <p>Nous ne le créons pas pour vous, mais nous pouvons vous apporter des conseils et nous hébergeons votre site internet. Vous pouvez utiliser votre propre noms de domaine où utiliser gratuitement un sous-domaine ti-nuage.fr</p>
-    </div>
-    <div>
-      <h3 class="services-title services-icon-cloud">Drive</h3>
-      <p>Partagez et collaborez sur des documents, gérez vos tâches et votre calendrier, synchronisez les contacts de votre téléphone, et bien plus encore.</p>
-      <p>Logiciel <a href="https://nextcloud.com/">NextCloud</a>.</p>
-    </div>
-    <div>
-      <h3 class="services-title services-icon-email">Adresse e-mail</h3>
-      <p>Une adresse email @ti-nuage.fr consultable par webmail ou avec votre client de messagerie habituel.</p>
-    </div>
-    <div>
-      <h3 class="services-title services-icon-ml">Liste de diffusion</h3>
-      <p>Une liste de diffusion nom@listes.ti-nuage.fr pour échanger avec les membres de votre groupe de travail et collaborateurs.</p>
-      <p>Addministration des listes avec le logiciel <a href="https://www.sympa.org/">Sympa</a>.
-    </div>
-    <div>
-      <h3 class="services-title services-icon-key">Coffre-fort numérique</h3>
-      <p>Un espace pour stocker vos notes et mots de passe de façon sécurisée et pouvoir y accéder depuis tous vos terminaux numériques.</p>
-      <p>Logiciel <a href="https://bitwarden.com/">Bitwarden</a>.</p>
-    </div>
-    <div>
-      <h3 class="services-title services-icon-gear">Forge logicielle</h3>
-      <p>Un environnement de développement Git pour héberger et partager vos projets.</p>
-      <p>Logiciel <a href="https://gitea.io/en-us/">Gitea</a>.</p>
-    </div>
-    <div>
-      <h3 class="services-title services-icon-messages">Discussion instantanée</h3>
-      <p>Une adresse sur le réseau de discussion <a href="https://fr.wikipedia.org/wiki/Fediverse">fédéré</a> XMPP.</p>
-      <p>Logiciel <a href="https://apps.ti-nuage.fr/converse/">Converse</a> sur votre navigateur, mais aussi <a href="https://conversations.im/">Conversations</a>, <a href="https://dino.im/">Dino</a>, <a href="https://gajim.org/">Gajim</a> ...</p>
-    </div>
-  </div>
-</section>
-
-<section class="Services">
-  <h2 class="tac mt128 mb64">Services en libre accès, sans adhésion</h2>
-  <div class="Two-cols-Two-rows">
-    <div>
-      <h3 class="services-title services-icon-edit">Édition collaborative</h3>
-      <p>Des outils pour organiser un document et le rédiger en groupe, avec la possibilité d'identifier les apports de chacun et de revenir en arrière.<p>
-      <p>Logiciel <a href="https://apps.ti-nuage.fr/pad">Etherpad</a>, pour l'édition d'un texte.</p>
-      <p>Logiciel <a href="https://calc.ti-nuage.fr">Ethercalc</a>, pour la création d'une feuille de calcul.</p>
-    </div>
-    <div>
-      <h3 class="services-title services-icon-list">Sondages</h3>
-      <p>Pour organiser des rendez-vous ou choisir parmi plusieurs options, au sein d'un groupe ou d'une association.</p>
-      <p>Logiciel <a href="https://apps.ti-nuage.fr/date">OpenSondage</a></p>
-    </div>
-    <div>
-      <h3 class="services-title services-icon-share">Partage de fichiers</h3>
-      <p>Pour partager des documents trop lourds pour un envoi par courriel, une gallerie de photos, ou même de simple extraits de texte ou de code, de manière sécurisée et temporaire.</p>
-      <p>Logiciel <a href="https://apps.ti-nuage.fr/privatebin">PrivateBin</a>, pour le partage d'extraits de textes.</p>
-      <p>Logiciel <a href="https://send.ti-nuage.fr/">Send</a>, pour l'envoi de fichiers.</p>
-    </div>
-  </div>
-</section>

layouts/front.njk

@@ -14,7 +14,7 @@
        {% else %}
        {% endfor %}
       <div class="tac mt32">
-        <a class="Button" href="/blog">Voir les archives</a>
+        <a class="button" href="/blog">Voir les archives</a>
       </div>
     </section>
   </article>

scripts/metalsmith-tinuage-services.js

@@ -0,0 +1,176 @@
+const { Buffer } = require('node:buffer')
+const debug = require('debug')('metalsmith-tinuage-services')
+const config = require('./config.js')
+const fs = require('node:fs')
+const path = require('path')
+
+module.exports = plugin
+
+/**
+ * Un plugin pour Metalsmith qui lit une collection de fichiers JSON décrivant
+ * les services de l'association pour composer la page services.html du site.
+ *
+ * @return {Function}
+ */
+function plugin () {
+  const Sections = Object.freeze({
+    OPEN: Symbol('open'),
+    MEMBERS: Symbol('members')
+  })
+
+  const PageFiller = {
+    setup: function (page, services) {
+      this.page = page
+      this.registry = services.reduce((registry, service) => {
+        registry[service.section].push(service)
+        return registry
+      }, {
+        [Sections.OPEN]: [],
+        [Sections.MEMBERS]: []
+      })
+
+      return this
+    },
+
+    fill: function () {
+      let html = ''
+
+      html += this.createSection('Services réservés aux adhérents', Sections.MEMBERS)
+      html += this.createSection('Services en libre accès, sans adhésion', Sections.OPEN)
+
+      this.page.contents = Buffer.concat([
+        this.page.contents,
+        Buffer.from(html)
+      ])
+    },
+
+    createSection: function (title, section) {
+      let html = '<section class="Services">\n' +
+          '<h2 class="tac mt128 mb64">' + title + '</h2>\n' +
+          '<div class="Two-cols-One-row">\n'
+
+      this.registry[section].forEach((service) => { html += service.html })
+      html += '</section>'
+
+      return html
+    }
+  }
+
+  const Parser = {
+    /**
+     * Traduit la description JSON du service donné en paramètre en un extrait
+     * HTML.
+     */
+    parseService: function (service) {
+      let html = '<div class="services">\n' +
+          '<h3 class="services-title services-icon-' + service.icon + '">' + service.title + '</h3>\n' +
+          '<p>' + service.description + '</p>\n'
+
+      if (service.buttons !== undefined) {
+        html += '<p class="tac">\n'
+        service.buttons.forEach((b) => { html += this.createButton(b) })
+        html += '</p>'
+      }
+
+      if (service.softwares !== undefined) {
+        html += '<div class="services-software">\n'
+        service.softwares.forEach((s) => { html += this.createSoftwareDescription(s) })
+        html += '</div>\n'
+      }
+
+      if (service.links !== undefined) {
+        html += '<div><p>Autres liens :</p>\n<ul>'
+        service.links.forEach((l) => { html += this.createListLink(l) })
+        html += '</ul></div>\n'
+      }
+      html += '</div>'
+
+      debug('Parsed ' + service.title + '(' + service.order + ')')
+      service.html = html
+      service.section = service.open ? Sections.OPEN : Sections.MEMBERS
+
+      return service
+    },
+
+    createButton: function (button) {
+      const cls = button.class || ''
+      return '<a class="button ' + cls + '" href="' + button.url + '">' + button.label + '</a>\n'
+    },
+
+    createListLink: function (link) {
+      return '<li><a class="external" href="' + link.url + '">' + link.label + '</a></li>\n'
+    },
+
+    createSoftwareDescription: function (soft) {
+      let html = '<p>' + soft.description + '</p>\n' +
+          '<div>'
+
+      if (soft.url !== undefined) {
+        html += this.createSoftwareLink('home.svg', 'Page Web', soft.url)
+      }
+      if (soft.sources !== undefined) {
+        html += this.createSoftwareLink('files.svg', 'Sources du logiciel', soft.sources)
+      }
+      soft.licenses.forEach((l) => { html += this.createSoftwareLink('copyright.svg', 'Licence', l.url, l.name) })
+
+      html += '</div>\n'
+
+      return html
+    },
+
+    createSoftwareLink: function (icon, alt, url, title) {
+      let element = '<div class="services-link">\n' +
+        '<a href="' + url + '"><img src="/images/uicons/' + icon + '" alt="' + alt + '"/></a>\n'
+
+      if (title !== undefined) {
+        element += '<br><p>' + title + '</p>'
+      }
+
+      element += '</div>'
+
+      return element
+    }
+  }
+
+  /**
+   * Lit de manière asynchrone l'ensemble des fichiers JSON décrivant les services.
+   *
+   * Seuls les fichiers ayant .json comme extension sont chargés depuis le répertoire fourni.
+   */
+  function loadServices (root, filenames) {
+    const promises = filenames
+      .filter(f => { return f.indexOf('.json') !== -1 })
+      .map(function (f) {
+        debug('Loading ' + f)
+        return fs.promises
+          .readFile(path.join(root, f), 'utf8')
+          .then((data) => { return JSON.parse(data) })
+      })
+
+    return Promise.all(promises)
+  }
+
+  return function (files, metalsmith, done) {
+    const root = path.join(config.paths.projectRoot, 'services')
+
+    debug('Looking for services in ' + root)
+    fs.readdir(root, (err, filenames) => {
+      if (err) {
+        console.error('%s: %s', root, err)
+      } else {
+        loadServices(root, filenames)
+          .then(function (services) {
+            const p = Object.create(Parser)
+            const parsed = services
+              .sort((a, b) => { return a.order - b.order })
+              .map((s) => p.parseService(s))
+            Object.create(PageFiller).setup(files['services.html'], parsed).fill()
+            done()
+          })
+          .catch(function (err) {
+            console.log(err)
+          })
+      }
+    })
+  }
+}

scripts/metalsmith.js

@@ -12,6 +12,7 @@ const marked = require('marked')
 const moment = require('moment')
 const permalinks = require('@metalsmith/permalinks')
 const rename = require('metalsmith-rename')
+const services = require('./metalsmith-tinuage-services')
 const sitemap = require('metalsmith-sitemap')
 const slug = require('slug')
 const statistics = require('./metalsmith-statistics-plugin')
@@ -70,6 +71,7 @@ module.exports = new Metalsmith(config.paths.projectRoot)
     smartypants: true,
     xhtml: true
   }))
+  .use(services())
   .use(excerpts())
   .use(permalinks({
     pattern: 'blog/:date/:title',

services/calc.json

@@ -0,0 +1,26 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://calc.ti-nuage.fr"}
+  ],
+  "description": "Un tableur collaboratif éditable en temps réel qui dispose des fonctionnalités de base : mise en forme, fonctions mathématiques, graphiques, ajout de commentaires, historique des versions, export en HTML ou en CSV. L'historique complet du document est conservé et les modifications de chacun sont identifiées.",
+  "icon": "edit",
+  "links": [
+    {"label": "Documentation et autres instances", "url": "https://wiki.chatons.org/doku.php/services/bureautique_en_ligne/ethercalc"}
+  ],
+  "open": true,
+  "order": 2,
+    "softwares": [
+      {
+        "description": "Ce service est fournit par le logiciel <b>EtherCalc</b>.",
+        "licenses": [
+          {
+            "name": "Licences multiples",
+            "url": "https://github.com/audreyt/ethercalc/blob/master/LICENSE.txt"
+          }
+        ],
+        "sources": "https://github.com/audreyt/ethercalc",
+        "url": "https://ethercalc.net/"
+      }
+    ],
+  "title": "Tableur collaboratif"
+}

services/code.json

@@ -0,0 +1,27 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://apps.ti-nuage.fr/gitea"}
+  ],
+  "description": "Un environnement de développement Git pour héberger et partager vos projets.",
+  "icon": "gear",
+  "links" : [
+    {"label": "Documentation du logiciel", "url": "https://docs.gitea.io/fr-fr/"},
+    {"label": "Le livre Pro Git", "url": "https://git-scm.com/book/fr/v2"}
+  ],
+  "open": false,
+  "order": 6,
+  "softwares": [
+    {
+      "description": "<b>Gitea</b> est une forge logicielle légère mais complète, avec une gestion des sources basée sur <b>git</b>, une interface pour les demandes de fusion, un suivi de tickets, ou un module Wiki.",
+      "licenses": [
+        {
+          "name": "Licence MIT",
+          "url": "https://mit-license.org"
+        }
+      ],
+      "sources": "https://github.com/go-gitea/gitea",
+      "url": "https://gitea.io"
+    }
+  ],
+  "title": "Forge logicielle"
+}

services/email.json

@@ -0,0 +1,11 @@
+{
+  "buttons": [
+    {"label": "Consulter", "url": "https://webmail.ti-nuage.fr"},
+    {"label": "Documentation", "class": "violet", "url": "https://wiki.ti-nuage.fr/fr/Services/Communication/Courriel"}
+  ],
+  "description": "Une adresse de courrier électronique avec le domaine <em>ti-nuage.fr</em> utilisable en ligne ou avec votre client de messagerie habituel.",
+  "icon": "email",
+  "open": false,
+  "order": 2,
+  "title": "Adresse de courriel"
+}

services/im.json

@@ -0,0 +1,44 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://apps.ti-nuage.fr/converse"},
+    {"label": "Documentation", "class": "violet", "url": "https://wiki.ti-nuage.fr/fr/Services/Communication/DiscussionInstantan%C3%A9e"}
+  ],
+  "description": "Une adresse sur le réseau de discussion <a href=\"https://fr.wikipedia.org/wiki/Fediverse\">fédéré</a> XMPP. Ce protocole standardisé permet à chacun d'utiliser le logiciel qui lui plaît sur l'appareil de son choix. Par exemple, <a href=\"https://conversations.im/\">Conversations</a>, <a href=\"https://dino.im/\">Dino</a>, ou <a href=\"https://gajim.org/\">Gajim</a>. D'autres encore sont proposés sur <a href=\"https://xmpp.org/software/clients/\">cette page</a>.",
+  "icon": "messages",
+  "links": [
+    {"label": "Détails et autres instances", "url": "https://wiki.chatons.org/doku.php/services/messagerie_instantanee/xmpp"},
+    {"label": "Le standard XMPP, ses actualités", "url": "https://xmpp.org"}
+
+  ],
+  "open": false,
+  "order": 7,
+  "softwares": [
+    {
+      "description": "Ce service est actuellement servi par le serveur <b>Metronome</b>.",
+      "licenses": [
+        {
+          "name": "License MIT",
+          "url": "https://mit-license.org"
+        },
+        {
+          "name": "License ISC",
+          "url": "https://www.isc.org/licenses/"
+        }
+      ],
+      "sources": "https://github.com/maranda/metronome",
+      "url": "https://metronome.im"
+    },
+    {
+      "description": "Le portail des utilisateurs propose l'interface en ligne <b>Converse</b>.",
+      "licenses": [
+        {
+          "name": "License publique Mozilla",
+          "url": "https://www.mozilla.org/en-US/MPL/"
+        }
+      ],
+      "sources": "https://github.com/conversejs/converse.js",
+      "url": "https://conversejs.org/"
+    }
+  ],
+  "title": "Messagerie instantanée"
+}

services/ml.json

@@ -0,0 +1,24 @@
+{
+  "buttons": [
+    {"label": "Consulter", "url": "https://webmail.ti-nuage.fr"},
+    {"label": "Documentation", "class": "violet", "url": "https://wiki.ti-nuage.fr/fr/Services/Communication/Courriel"}
+  ],
+  "description": "Une liste de diffusion nom@listes.ti-nuage.fr pour échanger avec les membres de votre groupe de travail et collaborateurs.",
+  "icon": "ml",
+  "open": false,
+  "order": 4,
+  "softwares": [
+    {
+      "description": "La gestion des listes est réalisée à l'aide du logiciel <b>Sympa</b>. Son interface Web permet une configuration fine des paramètres de chaque liste de diffusion et la gestion de ses membres.",
+      "licenses": [
+        {
+          "name": "Licence GPLv2",
+          "url": "https://www.gnu.org/licenses/old-licenses/gpl-2.0.html"
+        }
+      ],
+      "sources": "https://github.com/sympa-community/sympa",
+      "url": "https://sympa.org"
+    }
+  ],
+  "title": "Listes de diffusion"
+}

services/nextcloud.json

@@ -0,0 +1,27 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://cloud.ti-nuage.fr"},
+    {"label": "Documentation", "class": "violet", "url": "https://wiki.ti-nuage.fr/fr/Services/TravailCollaboratif/NextCloud"}
+  ],
+  "description": "Stockez vos fichiers, mais aussi vos contacts, vos images ou vos pistes de musique. Synchronisez-les avec votre ordinateur de bureau ou votre mobile. Partagez-les et travaillez en collaboration",
+  "icon": "cloud",
+  "links": [
+    {"label": "Autres instances et documentation externe", "url": "https://wiki.chatons.org/doku.php/services/nextcloud"}
+  ],
+  "open": false,
+  "order": 3,
+  "softwares": [
+    {
+      "description": "Ce service est basé sur le logiciel <b>NextCloud</b>, une plateforme de collaboration utilisée par des entreprises ou associations de toutes tailles dans le monde entier.",
+      "licenses": [
+        {
+          "name": "Licence AGPLv3",
+          "url": "https://www.gnu.org/licenses/agpl-3.0.html"
+        }
+      ],
+      "sources": "https://github.com/nextcloud",
+      "url": "https://nextcloud.com"
+    }
+  ],
+  "title": "Stockage de fichiers"
+}

services/pads.json

@@ -0,0 +1,36 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://apps.ti-nuage.fr/pad"}
+  ],
+  "description": "Un outil pour organiser et rédiger un document en groupe avec un canal de discussion écrite. L'édition conserve l'historique complet du document et les modifications de chacun sont identifiées.",
+  "icon": "edit",
+  "links": [
+    {"label": "Documentation et autres instances", "url": "https://wiki.chatons.org/doku.php/services/bureautique_en_ligne/etherpad"}
+  ],
+  "open": true,
+  "order": 1,
+  "softwares": [
+    {
+      "description": "Ce service est fournit par le logiciel <b>Etherpad</b>.",
+      "licenses": [
+        {
+          "name": "Licence Apache-2.0",
+          "url": "https://www.apache.org/licenses/LICENSE-2.0.html"
+        }
+      ],
+      "sources": "https://github.com/ether/etherpad-lite",
+      "url": "https://etherpad.org/"
+    },
+    {
+      "description": "Le portail avec la connexion des utilisateurs et la gestion des <em>pads</em> est offerte par <b>MyPads</b> un plugin financé sur Ulule et porté par l’association Framasoft.",
+      "licenses": [
+        {
+          "name": "Licence Apache-2.0",
+          "url": "https://www.apache.org/licenses/LICENSE-2.0.html"
+        }
+      ],
+      "sources": "https://framagit.org/framasoft/Etherpad/ep_mypads"
+    }
+  ],
+  "title": "Rédaction collaborative"
+}

services/polls.json

@@ -0,0 +1,26 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://apps.ti-nuage.fr/date"}
+  ],
+  "description": "Pour organiser des rendez-vous ou choisir parmi plusieurs options, au sein d'un groupe ou d'une association.",
+  "icon": "list",
+  "links": [
+    {"label": "Autres instances et documentation externe", "url": "https://wiki.chatons.org/doku.php/services/sondage/framadate"}
+  ],
+  "open": true,
+  "order": 3,
+  "softwares": [
+    {
+      "description": "Ce service est fournit par le logiciel <b>Framadate</b>.",
+      "licenses": [
+        {
+          "name": "Licence CeCILL-B",
+          "url": "https://cecill.info/licences/Licence_CeCILL-B_V1-fr.html"
+        }
+      ],
+      "sources": "https://framagit.org/framasoft/framadate/framadate",
+      "url": "https://framadate.org/abc/fr/"
+    }
+  ],
+  "title": "Sondages"
+}

services/share_bin.json

@@ -0,0 +1,26 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://apps.ti-nuage.fr/privatebin"}
+  ],
+  "description": "Pour partager de simple extraits de texte ou de code, de manière sécurisée et temporaire.",
+  "icon": "share",
+  "links": [
+    {"label": "Documentation et autres instances", "url": "https://wiki.chatons.org/doku.php/services/partage_chiffre/privatebin"}
+  ],
+  "open": true,
+  "order": 5,
+  "softwares": [
+    {
+      "description": "Cet outil se base sur <b>PrivateBin</b>.",
+      "licenses": [
+        {
+          "name": "Licence Zlib/libpng",
+          "url": "https://opensource.org/licenses/zlib-license.php"
+        }
+      ],
+      "sources": "https://github.com/PrivateBin/PrivateBin",
+      "url": "https//privatebin.info/"
+    }
+  ],
+  "title": "Partage d'extraits de texte"
+}

services/share_file.json

@@ -0,0 +1,22 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://send.ti-nuage.fr"}
+  ],
+  "description": "Pour partager des documents trop lourds pour un envoi par courriel, une gallerie de photos, de manière sécurisée et temporaire.",
+  "icon": "share",
+  "open": true,
+  "order": 4,
+  "softwares": [
+    {
+      "description": "Ce service est servi par une version dérivée de <b>Firefox Send</b>.",
+      "licenses": [
+        {
+          "name": "Licence MPL",
+          "url": "https://www.mozilla.org/en-US/MPL/2.0"
+        }
+      ],
+      "sources": "https://gitlab.com/timvisee/send"
+    }
+  ],
+  "title": "Partage de fichiers"
+}

services/vault.json

@@ -0,0 +1,28 @@
+{
+  "buttons": [
+    {"label": "Utiliser", "url": "https://vault.ti-nuage.fr"},
+    {"label": "Documentation", "class": "violet", "url": "https://wiki.ti-nuage.fr/fr/Services/Outils/CoffreFortNum%C3%A9rique"}
+  ],
+  "description": "Un espace pour stocker vos notes et mots de passe de façon sécurisée et pouvoir y accéder depuis tous vos terminaux numériques.",
+  "icon": "key",
+  "open": false,
+  "order": 5,
+  "softwares": [
+    {
+      "description": "<b>Bitwarden</b> est un gestionnaire de mot de passe en ligne. Il permet de générer facilement mot ou phrases de passe et de partager notes et secrets ",
+      "licenses": [
+        {
+          "name": "Licence AGPLv3",
+          "url": "https://www.gnu.org/licenses/agpl-3.0.html"
+        },
+        {
+          "name": "Licence Bitwarden",
+          "url": "https://github.com/bitwarden/server/blob/master/LICENSE_BITWARDEN.txt"
+        }
+      ],
+      "sources": "https://github.com/bitwarden",
+      "url": "https://bitwarden.com/open-source"
+    }
+  ],
+  "title": "Coffre-fort numérique"
+}

services/web.json

@@ -0,0 +1,10 @@
+{
+  "buttons": [
+    {"label": "Nous contacter", "url": "https://ti-nuage.fr/mentions_legales.html"}
+  ],
+  "description": "Nous ne le créons pas pour vous, mais nous pouvons vous apporter des conseils et nous hébergeons votre site internet. Vous pouvez utiliser votre propre noms de domaine où utiliser gratuitement un sous-domaine ti-nuage.fr",
+  "icon": "web",
+  "open": false,
+  "order": 1,
+  "title": "Hébergement Web"
+}