Show Menu
SUJETS×

Chargement partiel des composants

Présentation

Le téléchargement local des composants de communautés est utile lorsqu’une page Web est conçue comme une application simple d’une seule page qui modifie dynamiquement ce qui s’affiche en fonction de ce qui est sélectionné par le du site.
Cela se produit lorsque les composants Communautés n’existent pas dans le modèle de page, mais qu’ils sont dynamiquement ajoutés après une sélection de de site.
Etant donné que le cadre des composants sociaux (SCF) présente une présence légère, seuls les composants SCF existants au moment du chargement initial de la page sont enregistrés. Pour qu’un composant SCF ajouté dynamiquement soit enregistré après le chargement de la page, SCF doit être appelé pour "télécharger localement" le composant.
Lorsqu’une page est conçue pour télécharger localement des composants de communautés, il est possible de mettre en cache la page entière.
Pour ajouter dynamiquement des composants SCF, procédez comme suit :
  1. Téléchargez le composant en utilisant l’une des deux méthodes suivantes :
Le téléchargement de ressources non existantes n’est pas pris en charge.

Ajouter dynamiquement le composant au modèle DOM

Que le composant soit inclus dynamiquement ou chargé dynamiquement, il doit d’abord être ajouté au modèle DOM.
Lors de l’ajout du composant SCF, la balise la plus courante à utiliser est la balise DIV, mais d’autres balises peuvent également être utilisées. Etant donné que SCF examine uniquement le DOM au chargement initial de la page, cet ajout au DOM passe inaperçu jusqu’à ce que SCF soit explicitement appelé.
Quelle que soit la balise utilisée, l’élément doit au minimum se conformer au modèle d’élément racine SCF normal en contenant les deux attributs suivants :
  • data-component-id
    Chemin d’accès effectif au composant ajouté.
  • data-scf-component
    Type de ressource du composant.
Voici un exemple de composant de commentaires ajouté :
<div
    class="scf-commentsystem scf translation-commentsystem"
    data-component-id="<%= currentPage.getPath()%>/jcr:content/content-left/comments"
    data-scf-component="social/commons/components/hbs/comments"
>
</div>

Téléchargement partiel par appel de SCF

Inclusion dynamique

L’inclusion dynamique utilise une requête d’amorçage qui entraîne l’examen par SCF du modèle DOM et l’amorçage de tous les composants SCF trouvés sur la page.
Pour initialiser les composants SCF à tout moment après le chargement de la page, il vous suffit de déclencher un JQuery comme suit :
$(document).trigger(SCF.events.BOOTSTRAP_REQUEST);

Chargement dynamique

Le chargement dynamique permet de contrôler le chargement des composants SCF.
Au lieu d’amorcer tous les composants SCF trouvés dans le modèle DOM, il est possible de spécifier un composant SCF spécifique à charger à l’aide de cette méthode JavaScript :
SCF.addComponent(document.getElementById(*someId*));
someId est la valeur de l’ data-component-id attribut.