Migration de la génération des Preview avec la Pandoc API #1022

thom4parisot · 2024-09-30T11:30:24Z

suppression du sous-module git templates-stylo
repose sur stylo-export pour générer le HTML de preview
supprime pandoc du module export (vitesse d'installation ++)
typage de configuration pour que le plantage arrive le plus rapidement possible au démarrage (plutôt que pendant son fonctionnement)

based on #1064 (pas obligé ceci dit)

fixes #987
fixes #907

netlify · 2024-09-30T11:30:48Z

✅ Deploy Preview for stylo-docs canceled.

Name	Link
🔨 Latest commit	`1cb1a89`
🔍 Latest deploy log	https://app.netlify.com/sites/stylo-docs/deploys/6720fbd01608510007812aa0

export/src/export.js

davidbgk

So many trailing spaces 🙈

thom4parisot · 2024-09-30T18:39:39Z

@RochDLY après vérification, c'est pas un souci pour les books : le fonctionnement actuel était déjà de concaténer les contenus et de prendre la biblio du premier article venu. Le fait de se brancher sur le nouveau module d'export ne change rien au mécanisme.

graphql/config.js

ggrossetie · 2024-10-09T07:12:00Z

Afin de limiter le "risque", est-ce que ça vaut le coup de déployer une nouvelle version avec l'ajout de convict afin de gérer la configuration applicative puis de basculer la génération de la preview sur l'API Pandoc ?

thom4parisot · 2024-10-14T09:58:05Z

@ggrossetie oui c'est une bonne idée de séparer les deux changements :)

Je suggère une démo de la fonctionnalité lors du point hebdo du 15 octobre pour recueillir des retours sans déployer en dév. (je crois qu'on n'utilise pas le bon template de preview, et ça peut peut-être avoir un impact sur l'intégration des annotations Hypothesis).

cc @RochDLY

export/src/export.js

netlify · 2024-10-28T10:52:25Z

✅ Deploy Preview for stylo-dev ready!

Name	Link
🔨 Latest commit	`1cb1a89`
🔍 Latest deploy log	https://app.netlify.com/sites/stylo-dev/deploys/6720fbd06665250008a32292
😎 Deploy Preview	https://deploy-preview-1022--stylo-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

thom4parisot · 2024-10-28T10:56:16Z

export/src/export.js

+  if (preview) {
+    const previewStylesheet = await readFile(join(__dirname, 'assets', 'preview.css'), { encoding: 'utf8' })

-    res.send(html5)
-  } finally {
-    if (tmpDirectory) {
-      await fs.rm(tmpDirectory, { recursive: true, maxRetries: 3 })
+    html5 = html5.replace(/(<\/head>\s?)/gs, `<meta name="robots" content="noindex, nofollow"/>
+  <style type="text/css">${previewStylesheet}</style>
+  $1`
+    )
+
+    html5 = html5.replace(/<\/body>/, `<script type="application/json" class="js-hypothesis-config">
+    {
+      "openSidebar": true
    }
+  </script>
+  <script src="https://hypothes.is/embed.js" async></script>
+  </body>`)


La "magie" de la preview repose sur :

l'injection du script Hypothesis

l'ajout d'une balise de non-référencement dans les moteurs de recherche

l'injection des styles CSS

thom4parisot · 2024-10-28T11:04:35Z

export/src/export.js

+    md_content: md,
+    bib_content: bib,
+    yaml_content: yaml,
+    with_toc: preview,


@davidbgk la seule différence avec le rendu "legacy", c'est l'absence de la table des matières.

J'ai tenté de passer with_toc en argument et j'interprète qu'il n'est pas lu mais réglé en dur dans pandocapi.py#L75.

C'est bien ça ?

On avait évoqué l'idée de passer un template pandoc… et en fait passer une feuille de style ça serait pas mal aussi.

Qu'est-ce que t'en penses ?

Bonne investigation, c'est effectivement en dur pour l'instant 👍

Pour la feuille de style, quel serait le besoin ? Que faites-vous du retour de l'API ? Est-ce que le body est extrait ou vous reprenez tout tel quel ?

Edit : ah mais on parle de CSS ou de CSL en fait ? 🙃

Actuellement on "hacke" la sortie HTML en y injectant du CSS inliné dans une balise HTML. Et deux-trois autres balises aussi d'ailleurs (la config Hypothesis et une balise <meta>).

Avant cette PR, c'était la commande Pandoc qui incluait les CSS dans le template (preview.css finissait dans la variable highlight-css par je ne sais quel procédé).

Enfin, à terme j'imagine qu'on récupèrera le HTML et qu'on l'injectera/stylera dans l'interface Stylo directement (peut-être sous forme de WebComponent, ça dépend comment on arrive à gérer l'intégration avec Hypothesis).

Partant pour y aller pas à pas ; d'abord un truc qui marche et ensuite on voit où on peut améliorer sans que ça soit casse-gueule.

thom4parisot · 2024-10-28T11:28:29Z

export/src/export.js

+
+    html5 = html5.replace(/<\/body>/, `<script type="application/json" class="js-hypothesis-config">
+    {
+      "openSidebar": false


@RochDLY écrit en privé (parce que dans les transports) :

A priori ce [l'ouverture du panneau latéral] n'est pas un comportement souhaité, certains utilisateurs ont demandé à ce que le volet soit fermé par défaut et que l'ouverture soit une action manuelle (en cliquant sur le petit bouton en haut à droite de l'écran de la preview)

Retour intégré !

…export

…o-export

…-export

thom4parisot marked this pull request as ready for review September 30, 2024 14:25

thom4parisot requested review from ggrossetie and davidbgk September 30, 2024 14:29

davidbgk reviewed Sep 30, 2024

View reviewed changes

export/src/export.js Outdated Show resolved Hide resolved

davidbgk approved these changes Sep 30, 2024

View reviewed changes

thom4parisot force-pushed the feature/export-refactor branch 2 times, most recently from cbc72ed to b541045 Compare September 30, 2024 18:38

thom4parisot changed the title ~~Supprime la référence au submodule git des templates d'export~~ Migration de la génération des Preview avec la Pandoc API Oct 1, 2024

ggrossetie reviewed Oct 9, 2024

View reviewed changes

graphql/config.js Outdated Show resolved Hide resolved

thom4parisot commented Oct 14, 2024

View reviewed changes

export/src/export.js Outdated Show resolved Hide resolved

thom4parisot force-pushed the feature/export-refactor branch 2 times, most recently from dba5beb to 2f30af6 Compare October 14, 2024 11:27

thom4parisot modified the milestones: v3.1, v3.1 Refonte du volet des métadonnées Oct 21, 2024

thom4parisot force-pushed the feature/export-refactor branch from 2f30af6 to 7668759 Compare October 28, 2024 10:50

thom4parisot commented Oct 28, 2024

View reviewed changes

thom4parisot force-pushed the feature/export-refactor branch from 7668759 to 277cecb Compare October 28, 2024 11:13

thom4parisot commented Oct 28, 2024

View reviewed changes

thom4parisot added the decision necessary when it need a meet-up (with or without the devs) label Oct 28, 2024

thom4parisot removed the decision necessary when it need a meet-up (with or without the devs) label Oct 29, 2024

thom4parisot added [domain] export-legacy 📜 Ancien module d'export multi-formats (pre Stylo v2) [domain] export 📜 Module d'export multi-formats par défaut (depuis Stylo v2) labels Oct 29, 2024

thom4parisot added 3 commits October 29, 2024 16:14

feat(export): supprime la référence au submodule git des templates d'…

0914143

…export

feat(export): supprime l'utilisation de Pandoc pour se baser sur styl…

962b168

…o-export

docs(export): mise à jour de la documentation sur les templates stylo…

1cb1a89

…-export

thom4parisot force-pushed the feature/export-refactor branch from 277cecb to 1cb1a89 Compare October 29, 2024 15:14

thom4parisot merged commit b76e6c0 into master Oct 29, 2024
15 checks passed

thom4parisot deleted the feature/export-refactor branch October 29, 2024 16:18

thom4parisot had a problem deploying to github-pages October 29, 2024 16:19 — with GitHub Actions Failure

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Migration de la génération des Preview avec la Pandoc API #1022

Migration de la génération des Preview avec la Pandoc API #1022

thom4parisot commented Sep 30, 2024 •

edited

Loading

netlify bot commented Sep 30, 2024 •

edited

Loading

davidbgk left a comment

thom4parisot commented Sep 30, 2024

ggrossetie commented Oct 9, 2024

thom4parisot commented Oct 14, 2024 •

edited

Loading

netlify bot commented Oct 28, 2024 •

edited

Loading

thom4parisot Oct 28, 2024

thom4parisot Oct 28, 2024

davidbgk Oct 28, 2024 •

edited

Loading

thom4parisot Oct 28, 2024

thom4parisot Oct 28, 2024 •

edited

Loading

Migration de la génération des Preview avec la Pandoc API #1022

Migration de la génération des Preview avec la Pandoc API #1022

Conversation

thom4parisot commented Sep 30, 2024 • edited Loading

netlify bot commented Sep 30, 2024 • edited Loading

✅ Deploy Preview for stylo-docs canceled.

davidbgk left a comment

Choose a reason for hiding this comment

thom4parisot commented Sep 30, 2024

ggrossetie commented Oct 9, 2024

thom4parisot commented Oct 14, 2024 • edited Loading

netlify bot commented Oct 28, 2024 • edited Loading

✅ Deploy Preview for stylo-dev ready!

thom4parisot Oct 28, 2024

Choose a reason for hiding this comment

thom4parisot Oct 28, 2024

Choose a reason for hiding this comment

davidbgk Oct 28, 2024 • edited Loading

Choose a reason for hiding this comment

thom4parisot Oct 28, 2024

Choose a reason for hiding this comment

thom4parisot Oct 28, 2024 • edited Loading

Choose a reason for hiding this comment

thom4parisot commented Sep 30, 2024 •

edited

Loading

netlify bot commented Sep 30, 2024 •

edited

Loading

thom4parisot commented Oct 14, 2024 •

edited

Loading

netlify bot commented Oct 28, 2024 •

edited

Loading

davidbgk Oct 28, 2024 •

edited

Loading

thom4parisot Oct 28, 2024 •

edited

Loading