[
https://issues.jboss.org/browse/RF-13616?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
]
Brian Leathem updated RF-13616:
-------------------------------
Description:
PopupPanel doesn't autosize correctly after move. Moving a PopupPanel with
'autosized' attribute enabled causes the width properties of its inner
container div, content div, srcoller div, and shadow div to be hard-set such
that a subsequent content change doesn't trigger the auto-resize of the
PopupPanel any longer. The PopupPanel height is apparently unaffected.
Attached is a testcase to demonstrate the problem, see the attached zip file
containing a minimal JSF application which reproduces the undesired behavior.
{code}
<ui:define name="body"
onload="#{rich:component('popup')}.hide(); return false;">
<h:outputStylesheet>
.rf-tgp-itm {
border: 1px solid #{richSkin.panelBorderColor};
padding: 5px;
}
.tabDiv {
margin: 0 5px 5px 0;
border: 1px solid #{richSkin.panelBorderColor};
background-color: #{richSkin.headerBackgroundColor};
cursor: pointer;
padding: 0 5px;
float: left;
}
</h:outputStylesheet>
<h:form>
<h:commandButton value="Open the popup">
<rich:componentControl target="popup"
operation="show" />
</h:commandButton>
</h:form>
<rich:popupPanel id="popup" modal="false" autosized="true"
resizeable="false">
<f:facet name="header">
<h:outputText value="Demo PopupPanel" />
</f:facet>
<f:facet name="controls">
<h:outputLink value="#"
onclick="#{rich:component('popup')}.hide(); return false;">X</h:outputLink>
</f:facet>
<h:form>
<rich:togglePanel id="panel1"
activeItem="item1" render="tabs"
itemChangeListener="#{panelMenuBean.processItemChange}">
<rich:togglePanelItem name="item1">
<h3>Panel Item 1</h3>
<p>Steps to reproduce:</p>
<p>1. Without moving the
PopupPanel directly switch to Panel
Item 2.</p>
<p>3. Now move the PopupPanel
around and then switch back to
Panel Item 2.</p>
</rich:togglePanelItem>
<rich:togglePanelItem name="item2"
style="width:777px">
<h3>Panel Item 2</h3>
<p>2. The PopupPanel is
autosized, correctly adjusting to the
size difference between
its previous and its current content. Now
switch back to Panel
Item 1.</p>
<p>4. As you notice, the
PopupPanel isn't properly autosized
anymore after first
moving it but is now stuck to the smaller
width of Panel Item 1,
its previous content.</p>
</rich:togglePanelItem>
</rich:togglePanel>
<a4j:outputPanel id="tabs" layout="block">
<a4j:outputPanel layout="block"
styleClass="tabDiv">
<rich:toggleControl
event="click" targetPanel="panel1"
targetItem="item1" />
<h:outputText value="Toggle
Panel Item 1"
style="#{rich:findComponent('panel1').activeItem == 'item1' ?
'font-weight:bold' : 'font-weight:normal'}" />
</a4j:outputPanel>
<a4j:outputPanel layout="block"
styleClass="tabDiv">
<rich:toggleControl
event="click" targetPanel="panel1"
targetItem="item2" />
<h:outputText value="Toggle
Panel Item 2"
style="#{rich:findComponent('panel1').activeItem == 'item2' ?
'font-weight:bold' : 'font-weight:normal'}" />
</a4j:outputPanel>
</a4j:outputPanel>
</h:form>
</rich:popupPanel>
<h:outputScript name="js/patch-popup-panel.js" />
{code}
was:
PopupPanel doesn't autosize correctly after move. Moving a PopupPanel with
'autosized' attribute enabled causes the width properties of its inner
container div, content div, srcoller div, and shadow div to be hard-set such
that a subsequent content change doesn't trigger the auto-resize of the
PopupPanel any longer. The PopupPanel height is apparently unaffected.
Attached is a testcase to demonstrate the problem, see the attached zip file
containing a minimal JSF application which reproduces the undesired behavior.
> PopupPanel autosize with togglePanel doesn't resize
> ---------------------------------------------------
>
> Key: RF-13616
> URL: https://issues.jboss.org/browse/RF-13616
> Project: RichFaces
> Issue Type: Bug
> Security Level: Public(Everyone can see)
> Components: component
> Affects Versions: 4.2.3.Final, 4.3.6
> Reporter: abhishek vijra
> Labels: gss
> Fix For: 4.3.7
>
> Attachments: popupPanel.zip
>
> Original Estimate: 4 hours
> Remaining Estimate: 4 hours
>
> PopupPanel doesn't autosize correctly after move. Moving a PopupPanel with
> 'autosized' attribute enabled causes the width properties of its inner
> container div, content div, srcoller div, and shadow div to be hard-set such
> that a subsequent content change doesn't trigger the auto-resize of the
> PopupPanel any longer. The PopupPanel height is apparently unaffected.
> Attached is a testcase to demonstrate the problem, see the attached zip file
> containing a minimal JSF application which reproduces the undesired behavior.
> {code}
> <ui:define name="body"
> onload="#{rich:component('popup')}.hide(); return false;">
> <h:outputStylesheet>
> .rf-tgp-itm {
> border: 1px solid #{richSkin.panelBorderColor};
> padding: 5px;
> }
>
> .tabDiv {
> margin: 0 5px 5px 0;
> border: 1px solid #{richSkin.panelBorderColor};
> background-color: #{richSkin.headerBackgroundColor};
> cursor: pointer;
> padding: 0 5px;
> float: left;
> }
> </h:outputStylesheet>
> <h:form>
> <h:commandButton value="Open the popup">
> <rich:componentControl target="popup"
> operation="show" />
> </h:commandButton>
> </h:form>
> <rich:popupPanel id="popup" modal="false" autosized="true"
> resizeable="false">
> <f:facet name="header">
> <h:outputText value="Demo PopupPanel" />
> </f:facet>
> <f:facet name="controls">
> <h:outputLink value="#"
>
> onclick="#{rich:component('popup')}.hide(); return false;">X</h:outputLink>
> </f:facet>
> <h:form>
> <rich:togglePanel id="panel1"
> activeItem="item1" render="tabs"
>
> itemChangeListener="#{panelMenuBean.processItemChange}">
> <rich:togglePanelItem name="item1">
> <h3>Panel Item 1</h3>
> <p>Steps to reproduce:</p>
> <p>1. Without moving the
> PopupPanel directly switch to Panel
> Item 2.</p>
> <p>3. Now move the PopupPanel
> around and then switch back to
> Panel Item 2.</p>
> </rich:togglePanelItem>
> <rich:togglePanelItem name="item2"
> style="width:777px">
> <h3>Panel Item 2</h3>
> <p>2. The PopupPanel is
> autosized, correctly adjusting to the
> size difference between
> its previous and its current content. Now
> switch back to Panel
> Item 1.</p>
> <p>4. As you notice, the
> PopupPanel isn't properly autosized
> anymore after first
> moving it but is now stuck to the smaller
> width of Panel Item 1,
> its previous content.</p>
> </rich:togglePanelItem>
> </rich:togglePanel>
> <a4j:outputPanel id="tabs" layout="block">
> <a4j:outputPanel layout="block"
> styleClass="tabDiv">
> <rich:toggleControl
> event="click" targetPanel="panel1"
> targetItem="item1" />
> <h:outputText value="Toggle
> Panel Item 1"
>
> style="#{rich:findComponent('panel1').activeItem == 'item1' ?
> 'font-weight:bold' : 'font-weight:normal'}" />
> </a4j:outputPanel>
> <a4j:outputPanel layout="block"
> styleClass="tabDiv">
> <rich:toggleControl
> event="click" targetPanel="panel1"
> targetItem="item2" />
> <h:outputText value="Toggle
> Panel Item 2"
>
> style="#{rich:findComponent('panel1').activeItem == 'item2' ?
> 'font-weight:bold' : 'font-weight:normal'}" />
> </a4j:outputPanel>
> </a4j:outputPanel>
> </h:form>
> </rich:popupPanel>
> <h:outputScript name="js/patch-popup-panel.js" />
> {code}
--
This message was sent by Atlassian JIRA
(v6.2.3#6260)
_______________________________________________
richfaces-issues mailing list
[email protected]
https://lists.jboss.org/mailman/listinfo/richfaces-issues
