Composant de thème Reftagger

The Reftagger library allows you to convert bible references on your Discourse forum into links with a hover-preview.

By request of @outofthebox we made a theme component based on this code.

I’ve added a setting that allows you to select the translation you want to use, and the component extends the content security policy to allow for the reftagger library to be included.

Repository here.

13 « J'aime »

@RGJ, our community loves this feature. Thank you for developing in a secure and customizable manner. I appreciate your generosity in sharing this work back to the Discourse community.

5 « J'aime »

We’ve been using that for the last 18 months or so, and it’s worked like a charm. Happy to see it improved and made more easily available!

3 « J'aime »

Wow, that’s super cool.

I would love to see a similar component in which custom keywords and previews can be defined.
That would be super useful to create a glossary for example

1 « J'aime »

There is the auto abbrify words theme component which does such a thing.

3 « J'aime »

I really appreciate you and everyone who contributed to the original conversation on Meta about how to make this feature work!

2 « J'aime »

Hello everyone, Reftagger was working swimmingly for a few months, and then it just stopped. It will still automatically generate an external link for the book/chapter/verse format, but it will not load the hover preview.

It appears to be up to date too. Any ideas?

1 « J'aime »

What Discourse version are you running?

1 « J'aime »

How can I find this info?

It should be somewhere in the admin dashboard at /admin

It just says that it is up to date:

1 « J'aime »

Seems to be working fine on Discourse 2.7.7 (at least in Safari) for me.

It’s working again now.
Reftagger apparently switched to a different CDN (reftagger.bibliacdn.com) which had to be whitelisted in the content security policy. I have added it and pushed a new version of the theme component. All you need to do is update the component.

3 « J'aime »

There it is, thank you sir :slightly_smiling_face:

1 « J'aime »

Salut Richard,

Je déterre un vieux fil de discussion. J’ai installé ce composant de thème et deux choses se produisent.

Premièrement, le message indiquant que le composant doit être mis à jour.
[Avis d’administration] Le thème ‘Reftagger’ contient du code qui doit être mis à jour. (id:discourse.script-tag-discourse-plugin) (en savoir plus)

Deuxièmement, cela pourrait être lié à la première notification où le composant doit être mis à jour. Les références ne sont pas étiquetées et les pages semblent se bloquer en affichant le cercle de chargement dans l’onglet du navigateur.

Serait-il possible de faire mettre à jour ce composant ?

J’ai fait des progrès avec cela en utilisant ChatGPT et j’ai des reftaggers fonctionnels pour les deux en utilisant Logos RefTagger et Blue Letter Bible.

Si ceux-ci pouvaient être regroupés dans un composant de thème pour une utilisation par la communauté, c’est génial, sinon le composant de thème est simplement à faire. Il vous suffit de prendre le code de celui que vous préférez et de le mettre dans l’onglet JS d’un nouveau composant de thème. Vous devez supprimer le code par défaut qui se trouve dans l’onglet JS de Discourse.

Si quelqu’un a des commentaires sur la façon d’améliorer, c’est bienvenu. Mes compétences ne vont que jusqu’à guider le LLM.

Utilisation de Logos RefTagger :

import { apiInitializer } from "discourse/lib/api";
import loadScript from "discourse/lib/load-script";

export default apiInitializer("0.1", (api) => {
  // 1. Définir les paramètres de RefTagger dans window AVANT de charger le script
  window.refTagger = {
    settings: {
      bibleVersion: "ESV", // par exemple, version biblique par défaut
      tagChapters: true, // marquer également les références de chapitre
      convertHyperlinks: false, // ne pas retaguer les liens existants
      roundCorners: true,
      socialSharing: [],
    },
  };

  // 2. Se connecter au rendu des posts de Discourse :
  api.decorateCooked((element) => {
    // Charger le script externe RefTagger (s'il n'est pas déjà chargé)
    loadScript("https://api.reftagger.com/v2/RefTagger.js").then(() => {
      // Exécuter le marquage sur le nouvel élément de contenu
      window.refTagger.tag(element);
    });
  });
});

Utilisation de BLB ScriptTagger :

import { apiInitializer } from "discourse/lib/api";
import loadScript from "discourse/lib/load-script";

export default apiInitializer("0.1", (api) => {
  // Optionnellement, définir les paramètres de BLB ScriptTagger avant le chargement (valeurs par défaut indiquées)
  window.BLB ||= {}; // s'assurer que l'objet global BLB existe
  window.BLB.Tagger ||= {};
  window.BLB.Tagger.Translation = "NKJV"; // version de traduction par défaut
  window.BLB.Tagger.HyperLinks = "all"; // marquer même les références déjà liées
  window.BLB.Tagger.TargetNewWindow = true; // les liens s'ouvrent dans un nouvel onglet
  // ... (autres paramètres comme DarkTheme, etc., selon les besoins)

  api.decorateCooked((elem) => {
    loadScript("https://www.blueletterbible.org/assets/scripts/blbToolTip/BLB_ScriptTagger-min.js")
      .then(() => {
        if (window.BLB && window.BLB.Tagger) {
          window.BLB.Tagger.pageInit(); // réanalyser le nouveau contenu pour les versets
        }
      });
  });
});

Ceci est maintenant résolu.

Je ne peux pas reproduire cela, même avant de résoudre le problème ci-dessus - qui n’était qu’un avertissement, pas une erreur.

3 « J'aime »

Très reconnaissant pour la mise à jour !

2 « J'aime »