I'm trying to create a component with two images and some information, i have created the dialog, managed to create the nodes and upload the image. Everything works fine but i can't find a way to get the image's path or render it.
This is what i have so far:
<%@ page import="com.day.text.Text,
com.day.cq.wcm.foundation.Image,
com.day.cq.commons.Doctype" %>
<%@include file="/apps/platform/aem-core/global/global.jsp"%>
<%
Image image = new Image(resource, "image1");
out.println(image);
image.draw(out);
%>
<h2><%=image.getSrc()%></h2>
This gives me: /content/region-growth/brazil/brazil-poc/pt-br/home/jcr:content/leadmachine-new/image1/file.jpg/1456255696906.jpg and if i go to this folder there is a node called image1 > file. The image is there, if i try to download it using crxde i can open it so i believe my problem is with the path.
This is the dialog XML:
<dialog jcr:primaryType="cq:Dialog"
title="Lead Machine"
xtype="dialog">
<items jcr:primaryType="cq:TabPanel">
<items jcr:primaryType="cq:WidgetCollection">
<generalTab jcr:primaryType="cq:Panel"
title="Geral">
<items jcr:primaryType="cq:WidgetCollection">
<campanhaID jcr:primaryType="nt:unstructured"
allowBlank="false"
fieldLabel="Campanha ID"
name="./jcr:campanhaid"
xtype="textfield" />
<titulo jcr:primaryType="nt:unstructured"
allowBlank="false"
fieldLabel="Título"
name="./jcr:titulo"
xtype="textfield" />
<corFundo jcr:primaryType="nt:unstructured"
allowBlank="false"
fieldLabel="Cor de Fundo"
name="./jcr:corfundo"
xtype="colormenu" />
<corBotao jcr:primaryType="nt:unstructured"
allowBlank="false"
fieldLabel="Cor do Botão"
name="./jcr:corbotao"
xtype="colormenu" />
<txtBotao jcr:primaryType="nt:unstructured"
allowBlank="false"
fieldLabel="Texto do Botão"
ame="./jcr:txtBotao"
xtype="textfield" />
<texto jcr:primaryType="nt:unstructured"
allowBlank="true"
fieldLabel="Texto"
name="./jcr:texto"
xtype="richtext" />
<observacao jcr:primaryType="nt:unstructured"
allowBlank="true"
fieldLabel="Observação"
name="./jcr:observacao"
xtype="richtext" />
<layoutForm jcr:primaryType="cq:Widget"
fieldDescription="LM com formato simples"
fieldLabel="Layout Form"
inputValue="true"
name="./layoutForm"
type="checkbox"
xtype="selection" />
<agendamento jcr:primaryType="cq:Widget"
fieldDescription="LM com agendamento"
fieldLabel="Agendamento"
inputValue="true"
name="./agendamento"
type="checkbox"
xtype="selection" />
<ativo jcr:primaryType="cq:Widget"
fieldLabel="Ativo"
inputValue="true"
name="./ativo"
type="checkbox"
xtype="selection" />
</items>
</generalTab>
<tab1 jcr:primaryType="cq:Panel" title="Image Properties">
<image1ResType jcr:primaryType="cq:Widget" ignoreData="{Boolean}true" name="./image1/sling:resourceType" value="foundation/components/image" xtype="hidden"/>
<image2ResType jcr:primaryType="cq:Widget" ignoreData="{Boolean}true" name="./image2/sling:resourceType" value="foundation/components/image" xtype="hidden"/>
</tab1>
<tab2 jcr:primaryType="cq:Widget"
cropParameter="./imageCrop"
fileNameParameter="./fileName"
fileReferenceParameter="./fileReference"
mapParameter="./imageMap"
name="./file"
requestSuffix="/img.jpg"
rotateParameter="./imageRotate"
title="Image 1"
xtype="html5smartimage" />
<tab3 jcr:primaryType="cq:Widget"
cropParameter="./mdImageCrop"
fileNameParameter="./mdFileName"
fileReferenceParameter="./mdFileReference"
mapParameter="./mdImageMap"
name="./mdFile"
requestSuffix="/mdImage.img.jpg"
rotateParameter="./mdImageRotate"
title="Image 2"
xtype="html5smartimage" />
</items>
</items>
</dialog>
Node childNode = currentNode.getNode("file");
if (childNode != null) {
if (childNode.hasProperty("fileReferenceParameter")) {
return childNode.getProperty("fileReferenceParameter").getString();
}
}
And why do you use hidden imageResType in tab1?
Also you may use the following using image object:
<%
Image image = new Image(resource, "file");
%>
<img src='<%=image.getSrc()'/>