L’Editor risorse è la pagina che si apre quando si fa clic su una risorsa trovata tramite Condivisione risorse, consentendo all’utente di modificare aspetti della risorsa come metadati, miniature, titolo e tag.
La configurazione dell’editor utilizzando i componenti di modifica predefiniti è descritta in Creazione e configurazione di una pagina Editor risorse.
Oltre a utilizzare componenti editor preesistenti, Adobe Experience Manager gli sviluppatori possono anche creare i propri componenti.
Le pagine di esempio seguenti sono incluse in Geometrixx:
/content/geometrixx/en/press/asseteditor.html
/apps/geometrixx/templates/asseteditor
/apps/geometrixx/components/asseteditor
Assets I componenti utilizzano un’estensione della libreria client di modifica WCM. Le clientlibs vengono generalmente caricate in init.jsp
.
Rispetto al caricamento clientlib predefinito (in core init.jsp
), un Assets il modello deve presentare le seguenti caratteristiche:
Il modello deve includere cq.dam.edit
clientlib (anziché cq.wcm.edit
).
Per poter eseguire il rendering di predicati, azioni e obiettivi, clientlib deve essere incluso anche in modalità WCM disabilitata (ad esempio, caricata al momento della pubblicazione).
Nella maggior parte dei casi, la copia del campione esistente init.jsp
(/apps/geometrixx/components/asseteditor/init.jsp
) deve soddisfare queste esigenze.
Alcune delle Assets I componenti richiedono le funzioni JS definite in component.js
. Copia il file nella directory dei componenti e collegalo.
<script type="text/javascript" src="<%= component.getPath() %>/component.js"></script>
L’esempio carica questa origine JavaScript in head.jsp
(/apps/geometrixx/components/asseteditor/head.jsp
).
Alcune delle Assets i componenti utilizzano la libreria widget. Per eseguire correttamente il rendering nel contesto del contenuto, è necessario caricare un foglio di stile aggiuntivo. Il componente Azione tag ne richiede un altro.
<link href="/etc/designs/geometrixx/ui.widgets.css" rel="stylesheet" type="text/css">
I componenti della pagina di esempio richiedono che tutti i selettori inizino con .asseteditor
di static.css
(/etc/designs/geometrixx/static.css
). Best practice: copia tutto .asseteditor
selettori nel foglio di stile e regola le regole come desiderato.
L’Editor risorse utilizza il Selettore moduli, che consente di modificare le risorse, in questo caso le risorse, nella stessa pagina del modulo semplicemente aggiungendo un selettore di moduli e il percorso del modulo all’URL della risorsa.
Ad esempio:
Gli handle di esempio in head.jsp
(/apps/geometrixx/components/asseteditor/head.jsp
) effettuare le seguenti operazioni:
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();
}
Nella parte HTML, utilizza il set di titoli precedente (titolo della risorsa o della pagina):
<title><%= title %></title>
Questo esempio descrive come creare un componente che mostra e visualizza i metadati di una risorsa caricata.
Crea una cartella di componenti nella directory dei progetti, ad esempio: /apps/geometrixx/components/samplemeta
.
Aggiungi content.xml
con il seguente frammento:
<?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"/>
Aggiungi samplemeta.jsp
con il seguente frammento:
<%--
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 will be 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>
Per rendere disponibile il componente, devi essere in grado di modificarlo. Per rendere modificabile un componente, in CRXDE Lite aggiungi un nodo cq:editConfig
di tipo primario cq:EditConfig
. Per rimuovere i paragrafi, aggiungi una proprietà con più valori cq:actions
che presenta un singolo valore DELETE
.
Passa al browser e nella pagina di esempio (ad esempio, asseteditor.html
) passa alla modalità progettazione e attiva il nuovo componente per il sistema paragrafo.
Nella modalità Modifica, il nuovo componente, ad esempio, Metadati campione, è ora disponibile nella barra laterale (gruppo Editor risorse). Inserisci il componente. Per memorizzare i metadati, è necessario aggiungerli al modulo relativo.
È possibile modificare gli spazi dei nomi disponibili nella modulo metadati.
I metadati attualmente disponibili sono definiti in /libs/dam/options/metadata
:
Le opzioni possono essere sovrascritte in /apps/dam/options/metadata
:
Copia la directory da /libs
a /apps
.
Rimuovere, modificare o aggiungere elementi.
Se aggiungi nuovi spazi dei nomi, questi devono essere registrati nel tuo archivio/CRX. In caso contrario, l’invio del modulo di metadati genererà un errore.