Ampliar editor de recursos extending-asset-editor
El editor de recursos es la página que se abre cuando se hace clic en un recurso encontrado a través del uso compartido de recursos, lo que permite al usuario editar aspectos del recurso, como metadatos, miniaturas, títulos y etiquetas.
La configuración del editor mediante los componentes de edición predefinidos se explica en Creación y configuración de una página del editor de recursos.
Además de utilizar componentes de editor preexistentes, Adobe Experience Manager los desarrolladores también pueden crear sus propios componentes.
Crear una plantilla del editor de recursos creating-an-asset-editor-template
En Geometrixx se incluyen las siguientes páginas de muestra:
- Página de muestra de Geometrixx:
/content/geometrixx/en/press/asseteditor.html
- Plantilla de ejemplo:
/apps/geometrixx/templates/asseteditor
- Componente de página de muestra:
/apps/geometrixx/components/asseteditor
Configurar Clientlib configuring-clientlib
Assets Los componentes de utilizan una extensión de la biblioteca de cliente de edición de WCM. Los clientlibs generalmente se cargan en init.jsp
.
En comparación con la carga clientlib predeterminada (en las init.jsp
), un Assets La plantilla debe tener lo siguiente:
-
La plantilla debe incluir el
cq.dam.edit
clientlib (en lugar decq.wcm.edit
). -
La clientlib también debe incluirse en el modo WCM desactivado (por ejemplo, cargado en la publicación) para poder procesar los predicados, las acciones y las lentes.
En la mayoría de los casos, copiar la muestra existente init.jsp
(/apps/geometrixx/components/asseteditor/init.jsp
) debe satisfacer estas necesidades.
Configuración de acciones de JS configuring-js-actions
Algunos de los Assets componentes requieren funciones JS definidas en component.js
. Copie este archivo en el directorio de componentes y vincúlelo.
<script type="text/javascript" src="<%= component.getPath() %>/component.js"></script>
El ejemplo carga esta fuente JavaScript en head.jsp
(/apps/geometrixx/components/asseteditor/head.jsp
).
Hojas de estilos adicionales additional-style-sheets
Algunos de los Assets Los componentes de utilizan la biblioteca de widgets. Para que se represente correctamente en el contexto de contenido, se debe cargar una hoja de estilo adicional. El componente de acción de etiqueta requiere uno más.
<link href="/etc/designs/geometrixx/ui.widgets.css" rel="stylesheet" type="text/css">
Hoja de estilos de Geometrixx geometrixx-style-sheet
Los componentes de página de muestra requieren que todos los selectores empiecen por .asseteditor
de static.css
(/etc/designs/geometrixx/static.css
). Práctica recomendada: Copiar todo .asseteditor
Seleccione los selectores en la hoja de estilo y ajuste las reglas como desee.
FormChooser: Ajustes para los recursos cargados finalmente formchooser-adjustments-for-eventually-loaded-resources
El editor de recursos utiliza el selector de formularios, que permite editar recursos (en este caso recursos) en la misma página de formulario simplemente añadiendo un selector de formulario y la ruta del formulario a la URL del recurso.
Por ejemplo:
- Página de formulario sin formato: http://localhost:4502/content/geometrixx/en/press/asseteditor.html
- Recurso cargado en la página del formulario: http://localhost:4502/content/dam/geometrixx/icons/diamond.png.form.html/content/geometrixx/en/press/asseteditor.html
El ejemplo se gestiona en head.jsp
(/apps/geometrixx/components/asseteditor/head.jsp
) haga lo siguiente:
- Detectan si se carga un recurso o si debe mostrarse el formulario sin formato.
- Si se carga un recurso, se desactiva el modo WCM, ya que parsys solo se puede editar en una página de formulario sin formato.
- Si se carga un recurso, utiliza su título en lugar del de la página del formulario.
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();
}
En la parte HTML, utilice el conjunto de títulos anterior (recurso o título de página):
<title><%= title %></title>
Crear un componente de campo de formulario simple creating-a-simple-form-field-component
En este ejemplo se describe cómo generar un componente que muestra y muestra los metadatos de un recurso cargado.
-
Cree una carpeta de componentes en el directorio de proyectos, por ejemplo,
/apps/geometrixx/components/samplemeta
. -
Añadir
content.xml
con el siguiente fragmento:code language-xml <?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"/>
-
Añadir
samplemeta.jsp
con el siguiente fragmento:code language-javascript <%-- 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 que el componente esté disponible, hace falta poder editarlo. Para que un componente se pueda editar, en CRXDE Lite, agregue un nodo
cq:editConfig
de tipo principalcq:EditConfig
. Para poder eliminar párrafos, agregue una propiedad de varios valorescq:actions
con un solo valor deDELETE
. -
Vaya al explorador y, en la página de muestra (por ejemplo,
asseteditor.html
) cambie al modo de diseño y habilite el nuevo componente para el sistema de párrafos. -
En el modo de edición, el nuevo componente (por ejemplo, Metadatos de muestra) ya está disponible en la barra de tareas (que se encuentra en el grupo Editor de recursos). Inserte el componente. Para poder almacenar los metadatos, estos se deben agregar al formulario de metadatos.
Modificar opciones de metadatos modifying-metadata-options
Puede modificar los espacios de nombres disponibles en la variable formulario de metadatos.
Los metadatos disponibles actualmente se definen en /libs/dam/options/metadata
:
- El primer nivel dentro de este directorio contiene los espacios de nombres.
- Los elementos dentro de cada área de nombres representan un metadato, como los resultados en un elemento de elemento local.
- El contenido de los metadatos contiene la información del tipo y las opciones de varios valores.
Las opciones se pueden sobrescribir en /apps/dam/options/metadata
:
-
Copie el directorio de
/libs
hasta/apps
. -
Quitar, modificar o agregar elementos.