O Editor de ativos é a página que abre quando um ativo encontrado por meio do Compartilhamento de ativos é clicado, permitindo que o usuário edite esses aspectos do ativo como metadados, miniatura, título e tags.
A configuração do editor usando os componentes de edição predefinidos é abordada em Criação e configuração de uma página do Editor de ativos.
Além de usar componentes de editor pré-existentes, Adobe Experience Manager os desenvolvedores também podem criar seus próprios componentes.
As seguintes páginas de exemplo estão incluídas no Geometrixx:
/content/geometrixx/en/press/asseteditor.html
/apps/geometrixx/templates/asseteditor
/apps/geometrixx/components/asseteditor
Assets Os componentes do usam uma extensão da biblioteca WCM edit clientlib. Normalmente, as clientlibs são carregadas no init.jsp
.
Comparado ao carregamento padrão do clientlib (nas init.jsp
), um Assets O modelo deve ter o seguinte:
O template deve incluir o cq.dam.edit
clientlib (em vez de cq.wcm.edit
).
A clientlib também deve ser incluído no modo WCM desativado (por exemplo, carregado na publicação) para poder renderizar os predicados, as ações e as lentes.
Na maioria dos casos, copiar a amostra existente init.jsp
(/apps/geometrixx/components/asseteditor/init.jsp
) devem atender a essas necessidades.
Alguns dos Assets componentes exigem funções JS definidas em component.js
. Copie este arquivo para o diretório do componente e vincule-o.
<script type="text/javascript" src="<%= component.getPath() %>/component.js"></script>
A amostra carrega essa origem de JavaScript no head.jsp
(/apps/geometrixx/components/asseteditor/head.jsp
).
Alguns dos Assets componentes usam a biblioteca de widgets. Para ser renderizada corretamente no contexto de conteúdo, uma folha de estilos adicional deve ser carregada. O componente de ação de tag requer mais um.
<link href="/etc/designs/geometrixx/ui.widgets.css" rel="stylesheet" type="text/css">
Os componentes de página de exemplo exigem que todos os seletores comecem com .asseteditor
de static.css
(/etc/designs/geometrixx/static.css
). Prática recomendada: Copiar tudo .asseteditor
seletores para sua folha de estilos e ajuste as regras conforme desejado.
O Editor de ativos usa o Seletor de formulários, que permite editar recursos — neste caso, ativos — na mesma página de formulário simplesmente adicionando um seletor de formulários e o caminho do formulário para o URL do ativo.
Por exemplo:
A amostra lida com head.jsp
(/apps/geometrixx/components/asseteditor/head.jsp
) faça o seguinte:
List<Resource> resources = FormsHelper.getFormEditResources(slingRequest);
if (resources != null) {
if (resources.size() == 1) {
// single resource
FormsHelper.setFormLoadResource(slingRequest, resources.get(0));
} else if (resources.size() > 1) {
// multiple resources
// not supported by CQ 5.3
}
}
Resource loadResource = (Resource) request.getAttribute("cq.form.loadresource");
String title;
if (loadResource != null) {
// an asset is loaded: disable WCM
WCMMode.DISABLED.toRequest(request);
String path = loadResource.getPath();
Asset asset = loadResource.adaptTo(Asset.class);
try {
// it might happen that the adobe xmp lib creates an array
Object titleObj = asset.getMetadata("dc:title");
if (titleObj instanceof Object[]) {
Object[] titleArray = (Object[]) titleObj;
title = (titleArray.length > 0) ? titleArray[0].toString() : "";
} else {
title = titleObj.toString();
}
}
catch (NullPointerException e) {
title = path.substring(path.lastIndexOf("/") + 1);
}
}
else {
title = currentPage.getTitle() == null ? currentPage.getName() : currentPage.getTitle();
}
Na parte HTML, use o conjunto de títulos anterior (título de ativo ou página):
<title><%= title %></title>
Este exemplo descreve como criar um componente que mostra e exibe os metadados de um ativo carregado.
Crie uma pasta de componentes no diretório de projetos, por exemplo, /apps/geometrixx/components/samplemeta
.
Adicionar content.xml
com o seguinte trecho:
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="https://sling.apache.org/jcr/sling/1.0" xmlns:cq="https://www.day.com/jcr/cq/1.0" xmlns:jcr="https://www.jcp.org/jcr/1.0"
jcr:primaryType="cq:Component"
jcr:title="Image Dimension"
sling:resourceSuperType="foundation/components/parbase"
allowedParents="[*/parsys]"
componentGroup="Asset Editor"/>
Adicionar samplemeta.jsp
com o seguinte trecho:
<%--
Sample metadata field component
--%><%@ page import="com.day.cq.dam.api.Asset,
java.security.AccessControlException" %><%
%><%@include file="/libs/foundation/global.jsp"%><%
String value = "";
String name = "dam:sampleMetadata";
boolean readOnly = false;
// If the form page is requested for an asset loadResource is the asset.
Resource loadResource = (Resource) request.getAttribute("cq.form.loadresource");
if (loadResource != null) {
// Determine if the loaded asset is read only.
Session session = slingRequest.getResourceResolver().adaptTo(Session.class);
try {
session.checkPermission(loadResource.getPath(), "set_property");
readOnly = false;
}
catch (AccessControlException ace) {
// checkPermission throws exception if asset is read only
readOnly = true;
}
catch (RepositoryException re) {}
// Get the value of the metadata.
Asset asset = loadResource.adaptTo(Asset.class);
try {
value = asset.getMetadata(name).toString();
}
catch (NullPointerException npe) {
// no metadata dc:description available
}
}
%>
<div class="form_row">
<div class="form_leftcol">
<div class="form_leftcollabel">Sample Metadata</div>
</div>
<div class="form_rightcol">
<%
if (readOnly) {
%><c:out value="<%= value %>"/><%
}
else {
%><input class="text" type="text" name="./jcr:content/metadata/<%= name %>" value="<c:out value="<%= value %>" />"><%
}%>
</div>
</div>
Para disponibilizar o componente, é necessário editá-lo. Para tornar um componente editável, no CRXDE Lite, adicione um nó cq:editConfig
do tipo primário cq:EditConfig
. Para que possa remover parágrafos, adicione uma propriedade de vários valores cq:actions
com um único valor DELETE
.
Navegue até o navegador e, na página de exemplo (por exemplo, asseteditor.html
) alternar para o modo de design e ativar o novo componente para o sistema de parágrafos.
No modo Editar, o novo componente (por exemplo, Metadados de amostra) agora está disponível no sidekick (encontrado no grupo Editor de ativos). Insira o componente. Para poder armazenar os metadados, eles devem ser adicionados ao formulário de metadados.
Você pode modificar os namespaces disponíveis na formulário de metadados.
Os metadados disponíveis no momento estão definidos em /libs/dam/options/metadata
:
As opções podem ser substituídas em /apps/dam/options/metadata
:
Copiar o diretório de /libs
para /apps
.
Remover, modificar ou adicionar itens.
Se você adicionar novos namespaces, eles deverão ser registrados no repositório/CRX. Caso contrário, o envio do formulário de metadados resultará em um erro.