Le code AddEvent ne fonctionne pas dans Discourse

J’essaie d’ajouter du code dans Discourse pour un calendrier d’événements. J’ai utilisé l’indentation de quatre espaces, mais cela ne semble pas fonctionner.

Voici l’extrait de code :

image

Voici ce que j’obtiens…

Je ne suis pas un développeur habitué, donc si vous pouviez simplifier le jargon, je vous en serais très reconnaissant. :pray:

La raison ici est que Discourse filtre les entrées des utilisateurs dans les publications en tant que mesure de sécurité. Vous ne voudriez pas que des utilisateurs aléatoires exécutent des scripts sur votre site, nous les filtrons donc.

Vous pouvez utiliser un composant de thème pour rendre cela fonctionnel. Si vous ajoutez quelque chose comme ceci dans un nouveau composant de thème – sous l’onglet En-tête – et que vous l’ajoutez ensuite à votre thème actif, vous pourrez utiliser cette intégration.

<script type="text/discourse-plugin" version="0.8">
  const  loadScript  = require("discourse/lib/load-script").default;
  const { next } = require("@ember/runloop");

  api.decorateCookedElement(
    post => {
      const calendars = post.querySelectorAll(`[data-wrap="addEvent"]`);
      if (!calendars.length) return;

      calendars.forEach(calendar => {
        const wrapper = document.createElement("div");
        wrapper.dataset.calendar = calendar.dataset.calendar;
        wrapper.dataset.configure = false;
        wrapper.classList.add("ae-emd-cal");
        calendar.append(wrapper);
      });

      next(() =>
        loadScript("https://addevent.com/js/cal.embed.t1.init.js")
      );
    },
    { id: "AddEvent decorator", onlyStream: true }
  );
</script>

Une fois cela fait, vous pouvez ajouter le calendrier AddEvent à une publication en ajoutant quelque chose comme ceci dans votre publication.

[wrap=addEvent calendar=bJ306355][/wrap]

Vous pouvez modifier l’attribut calendar=bJ306355 pour ajouter l’identifiant spécifique du calendrier que vous souhaitez intégrer.

La dernière chose à faire est de mettre le script AddEvent sur la liste blanche dans les paramètres de votre site (c’est une autre couche de sécurité).

Recherchez content_security_policy_script_src dans l’administration et ajoutez ce lien à cet endroit :

https://addevent.com

Faites-moi savoir si cela fonctionne pour vous, et je peux l’empaqueter en tant que composant de thème.

Bonjour @Johani,

Ta solution me convient. Je voulais simplement te le faire savoir.

Merci !

J’ai donc créé un nouveau composant de thème pour afficher un calendrier AddEvent.

:link: GitHub - graydenshand/discourse_upcoming_addevent: Replace the DiscourseEvent "upcoming events" calendar with an AddEvent embed · GitHub

Plutôt que d’intégrer le calendrier dans un message, ce qui est trop étroit pour afficher la version bureau de l’intégration, ce composant de thème détourne la page « Événements à venir » du plugin DiscourseCalendar.

Notez que pour ce faire, j’ai dû personnaliser le script AddEvent (https://addevent.com/js/cal.embed.t1.init.js) afin de permettre des réaffichages entre les transitions de page.