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

CR de l'AG du 6 octobre.
2022-10-15 19:10:31 +02:00 · 2022-10-10 19:11:29 +02:00
24 changed files with 739 additions and 68 deletions
--- a/assets/production/css/style.css
+++ b/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 {
--- a/assets/production/images/uicons/copyright.svg
+++ b/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>
--- a/assets/production/images/uicons/files.svg
+++ b/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>
--- a/assets/production/images/uicons/home.svg
+++ b/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>
--- a/content/blog/2022/cr_06_octobre.md
+++ b/content/blog/2022/cr_06_octobre.md
@@ -0,0 +1,10 @@
+---
+title: Compte-rendu de l'Assemblée Générale du 6 octobre
+date: 2022-10-10
+author: David Soulayrol
+---
+Le compte-rendu de l'Assemblée Générale qui s'est déroulée le 6 octobre à la Hutte à Vieux-Marché est [disponible ici](/cr/2022/cr-ag-20221006.pdf). La réunion a vu la présence de sept adhérents, quatre autres s'étant excusés. Les activités menées cette année ont été passées en revue, puis la discussion s'est portée sur l'année à venir.
+
+Le faible nombre d'administrateurs reste le point le plus inquiétant. L'association se porte sinon très bien, avec de multiples contacts et une progression d'un ou deux adhérents tous les mois. Le bureau a été renouvelé et se trouve aujourd'hui consolidé avec deux nouveaux volontaires.
+
+La fin d'année sera occupée par la conclusion des deux principales actions réalisées cette année ; notre adhésion aux [CHATONS](https://chatons.org) et les résultats de notre réponse à l'appel à projets *Construire le numérique dans les Côtes d'Armor*. Par la suite, nous envisagerons les premières étapes pour installer nos propres serveurs dans la région.
--- a/content/cr/2022/cr-ag-20221006.mm
+++ b/content/cr/2022/cr-ag-20221006.mm
@@ -0,0 +1,185 @@
+.ND 06/10/2022
+.TL
+Compte-rendu de l'Assemblée Générale
+.br
+du jeudi 6 octobre 2022 à Vieux-Marché
+.AU "David, Mathias"
+.MT 4
+Les membres de l'association
+.B "Ti Nuage"
+ont été convoqués par courrier électronique le 12 septembre 2022 pour une Assemblée Générale ce jeudi 6 octobre, à 20 heures à la Hutte, 24 place Anjela Duval à Vieux-Marché.
+L'objet de cette réunion est de discuter du bilan de l'année écoulée et de dresser les objectifs pour la suivante. Cette réunion voit aussi l'arrivée d'un nouveau mambre : Gilles.
+.P
+Le Président de séance est Nourdine, le secrétaire ; Mathias.
+.hl
+.PRESENCE "Présent(e)s" "7 membres physiques (David, Gilles, Julie, Mathias, Nourdine, René, Vincent L.), 1 membre moral : Liratouva (représenté par Julie)"
+.PRESENCE "Excusé(e)s" "Emmanuelle, Franck, Gérard, Mélina"
+.PRESENCE "Absent(e)s" "Amicale laïque de Bégard, La Convergence des Loutres, Tous en scène, Antoine, Thomas, Grégoire, Sara, Jaques, Annia, Cécile, Tristan, Ninon, Luc, Michael, Jean-Luc, Vincent T."
+.HU "Modification des statuts"
+Selon le souhait du Président de permettre à tous de pouvoir participer à la vie de l'association sans restriction, il est tout d'abord proposé d'amender l'article 8 des statuts afin de supprimer certaines limites quant au vote des membres.
+Précisément, la proposition consiste à supprimer, au sous-titre
+.I "Électeurs" ,
+la phrase : «
+.I "Seuls les membres adhérents depuis plus de 6 mois à l’association sont autorisés à voter" ».
+.P
+La proposition, soumise au vote, est approuvée par quatre voix.
+Trois membres s'abstiennent, n'ayant pas d'avis arrêté sur la question et faisant remarquer avec justesse qu'il faudra à l'avenir remplacer cette mention par une mesure permettant de protéger l'association de toute prise de pouvoir intempestive.
+.HU "Bilan moral"
+L'association, déclarée à la sous-préfecture de Lannion le 18 octobre 2021, a presque un an d'existence.
+Nourdine informe l'Assemblée que
+.B "Ti Nuage"
+compte désormais 22 adhérents physiques et 4 adhérents moraux (chacun de ces derniers ayant 2 comptes en moyenne), soit un total de 30 comptes.
+David précise que la taille de l'association croît lentement et régulièrement, avec environ deux nouveaux adhérents chaque mois, ce qui est tout à fait soutenable pour un futur proche prévisible au regard de la situation technique actuelle.
+.P
+Durant l'annéee écoulée, l'association a participé aux rencontres publiques suivantes :
+.BL
+.LI
+.I "Libre en fête"
+\*F
+.FS
+.URL "https://libre-en-fete.net"
+.FE
+le 20 mars à Vieux Marché, pour laquelle quelque membres ont assuré une permanence durant l'après-midi ;
+.LI
+une rencontre à l'initiative du FabLab de Lannion le 26 mars pour
+.I "Libre en fête"
+encore, afin de discuter des services numériques libres et présenter
+.B "Ti Nuage"
+;
+.LI
+le forum des associations à Plouaret le 3 septembre 2022.
+.LE
+.P
+En début d'année, elle a été présente dans les média suivant :
+.BL
+.LI
+le Télégramme du 3 février 2022 ;
+.LI
+dans une pastille sur Océane FM le 2 mars 2022 ;
+.LI
+le Trégor le 17 mars à l'occasion de
+.I "Libre en fête" .
+.LE
+.P
+La première moitié de l'année a été largement consacrée à la stabilisation de l'offre de services, à la mise en place du site, à la documentation des procédures pour les administrateurs.
+Deux grands dossiers ont ensuite occupé l'essentiel du temps du bureau.
+.P
+Le premier est notre candidature aux CHATONS\*F
+.FS
+.URL "https://www.chatons.org"
+.FE
+qui est en passe d'être revue.
+Nous aurons en novembre une période pour prendre en considération les commentaires faits sur notre candidature, puis les votes auront lieu en décembre.
+.P
+Le second dossier est la réponse à l'Appel à projets
+.I "Construire le numérique dans les Côtes d'Armor"
+\*F
+.FS
+.URL "https://cotesdarmor.fr/numerique"
+.FE
+du département.
+Le budget est voté ce mois d'octobre et les résultats seront annoncés le 25 novembre, durant une cérémonie à laquelle nous sommes invités.
+.P
+À l'occasion du dossier pour le département, il a été nécessaire de réaliser une courte vidéo pour présenter notre projet.
+La vidéo, réalisée par Vincent, s'avère être un remarquable document pour communiquer au sujet de l'association.
+.B "Ti Nuage"
+a donc adhéré à
+.B "TeDomum"
+\*F
+.FS
+.URL "https://www.tedomum.net"
+.FE
+qui propose une instance
+.I "Peer Tube"
+afin de publier cette vidéo, et potentiellement d'autres à l'avenir.
+\R'Hu +1'
+.HU "Perspectives"
+Nourdine soumet l'idée d'ouvrir des comptes de courrier électroniques (courrier et agenda pour un stockage de l'ordre de 100Mo) à certains non adhérents et Mathias expose un cas pratique.
+L'idée est accueillie favorablement.
+.P
+Les efforts immédiats visent à améliorer la vitrine de l'association et sa documentation pour satisfaire au mieux la charte des CHATONS et répondre à toute remarque de leur part.
+.P
+Si le déploiement de la fibre se poursuit comme attendu, les prochains investissements de l'association devraient avoir lieu en début d'année prochaine pour commencer à installer du matériel à la Hutte.
+.P
+Nous espérons pour cela beaucoup du dossier remis au département.
+Cependant, le dossier ne couvre pas tout le financement, et il convient de toutes manières de chercher encore des subventions, car si le budget est équilibré pour la maintenance des services l'association ne dispose pas de moyens forts d'investissement.
+L'organisme public le plus concerné par nos activités et le plus à même de nous répondre rapidement est Lannion Trégor-Communauté.
+Il convient de réunir les possibilités de contact de la part de Nourdine, de Julie ou de Vincent T. et de les rencontrer dans les mois qui viennent.
+.P
+.B "Ti Nuage"
+est invitée à une manifestation publique à Plougrescant le 4 mars 2023 :
+.I "Faites du numérique" .
+Cet événement doit être organisé par une personne qui comme nous a répondu à l'appel du département.
+Sa tenue dépendra donc du résultat de l'attribution des budgets.
+.P
+Nourdine fait part de son souhait de se rendre au prochain Camp CHATONS durant l'été 2023, et peut-être de prélever un budget pour cela sur le compte de l'association.
+Ces camps sont l'occasion de discuter durant un week-end de technique, de communication, d'éthique, de legislation, de sensibilisation au libre, etc.
+L'Association est favorable à l'idée.
+.HU "Vote"
+Le bilan moral est approuvé à l'unanimité.
+\R'Hu -1'
+.HU "Rapport financier"
+Les finances de l'association sont saines, l'année se termine par un (petit) bénéfice d'environ 550€.
+Il convient de noter que ce
+.I "bénéfice"
+n'est pas dû à un trop gros montant des cotisations, mais devrait s'atténuer avec la montée en charge des services, toutes choses égales par ailleurs.
+.TS
+allbox centre tab(|);
+lw(8cm)nene.
+Adhésions|27|968,00
+Assurance|1|87,53
+Dépenses diverses|3|59,01
+Dons|2|105,00
+Frais bancaires|13|109,60
+Frais postaux|1|13,92
+Hébergeur|11|251,27
+.TE
+\R'Hu +1'
+.HU "Vote"
+Le rapport financier est approuvé à l'unanimité.
+.P
+Il est également voté de reconduire le montant actuel des cotisations.
+\R'Hu -1'
+.HU "Axes de réflexion"
+L'assemblée soulève la question de la pérennité de
+.B "Ti Nuage"
+dans le confort de tous, en particulier de son Président sur lequel repose l'essentiel des tâches.
+Celui-ci explique que l'association a besoin d'un administrateur supplémentaire pour les opérations de maintenance ordinaire, en particulier la surveillance de l'infrastructure de courriel qui nécessite une certaine réactivité.
+.P
+Si aucun nouvel adhérent n'est prêt à s'investir, les possibilités entrevues sont l'ouverture d'un poste d'administrateur système à temps partiel ou la facturation de services supplémentaires.
+Ces services pourraient rémunérer les administrateurs ou être réalisés par des auto-entrepreneurs locaux, qui participeraient alors à la maintenance des services.
+Toutes ces idées ont déjà fait l'objet de discussions, et il est d'avis qu'elles nécessitent d'être encore mûries.
+.P
+Gilles propose de réfléchir à l'idée de postes détachés d'entreprise : un type de poste non rémunéré par l'association bénéficiaire et pouvant apporter un temps de travail assez important.
+La proposition mérite d'être davantage débattue sur le principe (Sommes-nous prêt à risquer de promouvoir du
+.I "social-washing"
+?
+Comment doit être encadré le partenariat ?), et sur les implications en terme de travail pour les membres ; constitution du dossier de candidature, définition de la mission du salarié, suivi des activités, etc.
+.P
+Gilles enfin nous invite à contacter l'association
+.B "Code d'Armor"
+\*F
+.FS
+.URL "https://codedarmor.fr"
+.FE
+qui, au delà de sa vitrine de
+.I "Google Developers Group" ,
+constitue un réseau local de personnes propres à nous aider peut-être en terme de visibilité, d'organisation ou de matériel.
+.HU "Renouvellement du Bureau"
+L'Assemblée vote à l'unanimité la reconduction de Nourdine en tant que Président.
+David, unique candidat au poste de secrétaire est élu également à l'unanimité.
+Mathias, unique candidat au poste de trésorier est enfin aussi élu à l'unanimité.
+Gilles et Vincent L. font part de leur intérêt à intégrer le Bureau qui se compose donc maintenant comme suit :
+.BL
+.LI
+Président : Nourdine Gernelle
+.LI
+Secrétaire : David Soulayrol
+.LI
+Trésorier : Mathias Mantello
+.LI
+Membres ordinaires : Gilles Falcon, Vincent Lhoutellier
+.LE
+.SP 4
+.P
+L'Assemblée est levée à 22h30 par épuisement de l'ordre du jour.
--- a/content/index.html
+++ b/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>
--- a/content/services.md
+++ b/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>
--- a/layouts/front.njk
+++ b/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>
--- a/scripts/metalsmith-tinuage-services.js
+++ b/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)
+          })
+      }
+    })
+  }
+}
--- a/scripts/metalsmith.js
+++ b/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')
@@ -60,7 +61,8 @@ module.exports = new Metalsmith(config.paths.projectRoot)
  }))
  .use(groff({
    macroPackages: ['mm', 'tinuage'],
-    macroPaths: [join(config.paths.projectRoot, 'scripts/tmac')]
+    macroPaths: [join(config.paths.projectRoot, 'scripts/tmac')],
+    preprocessors: ['tbl']
  }))
  .use(markdown({
    gfm: false,
@@ -69,6 +71,7 @@ module.exports = new Metalsmith(config.paths.projectRoot)
    smartypants: true,
    xhtml: true
  }))
+  .use(services())
  .use(excerpts())
  .use(permalinks({
    pattern: 'blog/:date/:title',
--- a/scripts/tmac/tinuage.tmac
+++ b/scripts/tmac/tinuage.tmac
@@ -8,6 +8,15 @@
 .LP
 \fIPr\[u00E9]sent(e)s : \\$1\fI
 ..
+.\" La même, avec un titre comme premier paramètre, afin de pouvoir
+.\" lister aussi bien la liste des présents que celle des absents
+.\" ou des excusés.
+.de PRESENCE
+.P
+.sp .4
+.LP
+\fI\\$1 : \\$2\fI
+..
 .\" Une macro pour afficher les URLs dans un style habituel.
 .de URL
 .I \m[blue]\\$1\m[]
--- a/services/calc.json
+++ b/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"
+}
--- a/services/code.json
+++ b/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"
+}
--- a/services/email.json
+++ b/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"
+}
--- a/services/im.json
+++ b/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"
+}
--- a/services/ml.json
+++ b/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"
+}
--- a/services/nextcloud.json
+++ b/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"
+}
--- a/services/pads.json
+++ b/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"
+}
--- a/services/polls.json
+++ b/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"
+}
--- a/services/share_bin.json
+++ b/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"
+}
--- a/services/share_file.json
+++ b/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"
+}
--- a/services/vault.json
+++ b/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"
+}
--- a/services/web.json
+++ b/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"
+}
Author	SHA1	Message	Date
David Soulayrol	0f85790dbc	Refonte de la page de services (fix #6 ).	2022-10-15 19:10:31 +02:00
David Soulayrol	fb10373252	CR de l'AG du 6 octobre.	2022-10-10 19:11:29 +02:00
				`@@ -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>