MasterDetailLevel onshow
Posted: 14 Jun 2014, 14:59
Hi,
I'm using a MasterDeatailLevel where in the first level users upload a profile picture, then when the picture is uploaded, we detect the face and compute the bounding box. Now in the second MasterDetailLevel, we use a pe:imageSelectArea so that users can crop the picture as they wish. The crop area should be initialised before the user clicks in the image. The code we have so far: Please note the <!-- comments -->
So basically, I think the the oncomplete of the fileUpload is called too early, because when the code is executed on a button click when the imageSelectArea is already renders, it works as expected. How can I make that code (PF('ias').setSelection(#{imagecropperbb.iasStr});PF('ias').update();) run at the correct time? Is there something like an onshow for pe:masterDetailLevel or pe:imageSelectArea? Thanks!
I'm using a MasterDeatailLevel where in the first level users upload a profile picture, then when the picture is uploaded, we detect the face and compute the bounding box. Now in the second MasterDetailLevel, we use a pe:imageSelectArea so that users can crop the picture as they wish. The crop area should be initialised before the user clicks in the image. The code we have so far: Please note the <!-- comments -->
Code: Select all
<pe:masterDetailLevel level="1">
<p:panel header="#{firstTabPanelHeader}">
<h:form id="uploadForm" enctype="multipart/form-data">
<p:fileUpload
....
<! -- Line below does not execute or too early?? -->
oncomplete="PF('ias').setSelection(#{imagecropperbb.iasStr});PF('ias').update();"/>
</h:form>
</p:panel>
</pe:masterDetailLevel>
<pe:masterDetailLevel level="2">
<p:graphicImage value="#{sessionManager.tmpStreamedContent}" id="imgToCrop"
height="#{imagecropperbb.newHeight}" width="#{imagecropperbb.newWidth}"
cache="false"/>
<!-- Click button below initialises the crop area -->
<p:commandButton type="button" onclick="PF('ias').setSelection(#{imagecropperbb.iasStr});PF('ias').update();"/>
<pe:imageAreaSelect for="imgToCrop" handles="true"
imageHeight="#{imagecropperbb.orgHeight}" imageWidth="#{imagecropperbb.orgWidth}"
aspectRatio="#{asRat}" widgetVar="ias" show="true" >
<p:ajax event="selectEnd" listener="#{imagecropperbb.selectEndListener}"/>
</pe:imageAreaSelect>
</pe:masterDetailLevel>