Show Menu
TÓPICOS×

Sideload do componente

Visão geral

O sideload de componentes das Comunidades é útil quando uma página da Web é projetada como um aplicativo de página simples que altera dinamicamente o que é exibido, dependendo do que é selecionado pelo visitante do site.
Isso é realizado quando os componentes Comunidades não existem no modelo de página, mas são adicionados dinamicamente após a seleção de um visitante do site.
Como o SCF (Social Component Framework) tem uma presença leve, somente os componentes do SCF que existem no momento do carregamento da página inicial são registrados. Para que um componente SCF adicionado dinamicamente seja registrado após o carregamento da página, o SCF deve ser chamado para "sideload" do componente.
Quando uma página é projetada para fazer sideload dos componentes Comunidades, é possível fazer o cache de toda a página.
As etapas para adicionar dinamicamente componentes SCF são:
  1. Carregue o componente de maneira auxiliar usando um dos dois métodos:
Não há suporte para o sideload de recursos não existentes.

Adicionar componente dinamicamente ao DOM

Independentemente de o componente ser incluído dinamicamente ou carregado dinamicamente, ele deve primeiro ser adicionado ao DOM.
Ao adicionar o componente SCF, a tag mais comum a ser usada é a tag DIV, mas outras tags também podem ser usadas. Como o SCF examina somente o DOM quando a página é carregada inicialmente, essa adição ao DOM passará despercebida até que o SCF seja explicitamente chamado.
Seja qual for a tag usada, no mínimo, o elemento deve estar em conformidade com o padrão normal do elemento raiz SCF, contendo estes dois atributos:
  • data-component-id O caminho efetivo para o componente adicionado
  • data-scf-component O resourceType do componente
Veja a seguir um exemplo de um componente de comentários adicionados:
<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>

Sideload chamando SCF

Inclusão dinâmica

A inclusão dinâmica usa uma solicitação de inicialização que resulta em SCF examinando o DOM e inicializando todos os componentes do SCF encontrados na página.
Para inicializar componentes SCF a qualquer momento após o carregamento da página, basta disparar um evento JQuery como este:
$(document).trigger(SCF.events.BOOTSTRAP_REQUEST);

Carregamento dinâmico

O carregamento dinâmico fornece controle sobre o carregamento de componentes SCF.
Em vez de fazer o carregamento de todos os componentes SCF encontrados no DOM, é possível especificar um componente SCF específico para carregar usando este método JavaScript:
SCF.addComponent(document.getElementById( someId ));
Onde someId é o valor do atributo data-component-id .