[SOLVED] Clear imageAreaSelect when p:graphicImage changes

[gernan]

Hi guys!

I want to know if there's anyway to clear or reload the area of a imageAreaSelect when a image changes.
The image is loaded dynamically, users can upload a image and select a area in the same page (something like Facebook photo change, that's exactly what I'm trying to implement), but if a new image is loaded, even when I update the components, the imageAreaSelect still stands in the old picture area.

Thank you!

[tandraschko]

Please post your code with code quotes.

[gernan]

Please post your code with code quotes.

Ok!

Code: Select all

<h:form id="upload" enctype="multipart/data">
                            <p:fileUpload fileUploadListener="#{fotoBean.handleFileUploadPerfil}"
                                          onstart="PF('statusDialog').show()" onerror="PF('statusDialog').hide()"
                                          mode="advanced" auto="true" label="#{msgs.selecionar_foto}"
                                          oncomplete="PF('statusDialog').hide(), areaSelect.reload()"
                                          invalidFileMessage="#{erros.arquivo_invalido}"
                                          allowTypes="/(\.|\/)(jpg|jpeg|png)$/" multiple="false"
                                          update=":panelRecortar" sizeLimit="131072"
                                          invalidSizeMessage="#{erros.tamanho_invalido}">
                            </p:fileUpload>
                        </h:form>
                        <p:spacer />
                        <p:outputPanel id="panelRecortar">
                            <center>
                                <p:graphicImage id="recortar" value="#{fotoBean.foto}" cache="false" styleClass="img-polaroid" />
                                <pe:imageAreaSelect for="recortar" handles="true" aspectRatio="200:200" widgetVar="areaSelect" />
                            </center>
                        </p:outputPanel>

That's the components, when I upload happens, panelRecortar is updated with the new image from Bean.

Code: Select all

public void handleFileUploadPerfil(FileUploadEvent event) {
        try {
            imagem = "/resources/tempimages/" + socialBean.getPerfil().getId() + ".png";
            File arquivo = new File(StringUtils.getDiretorioCompleto("") + imagem);
            FileUtils.copyInputStreamToFile(event.getFile().getInputstream(), arquivo);
        } catch (Exception e) {
            imprimirErro(ErroUtil.getMessage(ErroUtil.RENDIZAR_FOTO));
        }
    }

    public StreamedContent getFoto() {
        if (imagem == null) {
            imagem = FOTO_PADRAO_PERFIL;
        }
        return getStreamedContent(imagem);
    }

When a upload happens, I save the image in resources/tempimages, imagem receives the directory to the new image.
FOTO_PADRAO_PERFIL is a constant to render a default image.
getStreamedContent just load the image from some directory and returns a StreamedContent.

[tandraschko]

I fixed this for the upcoming releases, for now you can use:

Code: Select all

oncomplete="PF('statusDialog').hide(); PF('areaSelect').cancelSelection(); PF('areaSelect').reload();"

[gernan]

I fixed this for the upcoming releases, for now you can use:

Code: Select all

oncomplete="PF('statusDialog').hide(); PF('areaSelect').cancelSelection(); PF('areaSelect').reload();"

I tried but it did not work. The same problem occours. =\

[tandraschko]

Then please try a trunk build, i tested it with the showcase and it worked.

[gernan]

Then please try a trunk build, i tested it with the showcase and it worked.

I solved the problem doing this in p:fileUpload:

Code: Select all

onstart="PF('statusDialog').show(), PF('areaSelect').cancelSelection(), PF('areaSelect').reload()"

Thank you for your help!