ICEfaces
  1. ICEfaces
  2. ICE-4578

Cannot specify css position with modal panelPopup

          Details

          • Type: Improvement Improvement
          • Status: Closed
          • Priority: Major Major
          • Resolution: Fixed
          • Affects Version/s: 1.8.1
          • Fix Version/s: 1.8.2-RC1, 1.8.2
          • Component/s: ICE-Components
          • Labels:
            None
          • Environment:
            Jboss Portal 2.7.2-GA (JBoss AS 4.2.3), FF 3.0.10, IE7

            Description

            Setting the css position attribute (ie. fixed, relative, etc. )on a panelPopup style in a Portlet has no effect and looks as if it's being hard coded as absolute. Here is the jspx code:

            <ice:panelPopup style="position: fixed; z-index:999; top: 10px;left: 400px; width: 400px; height: 200px;background: #FFFFFF;" autoCenter="false" modal="true" rendered="#{backingBean.rendered}">

            which renders out the following :

            <div class="icePnlPop" ..... style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; z-index: 25001; top: 135.5px; left: 399px; width: 400px; height: 200px; visibility: visible; position: absolute;">

            Notice the position:absolute set at the very end. Inspecting the css using Firebug yields the following curious styleclass:

            element.style {
            background-attachment:scroll;
            background-color:#FFFFFF;
            background-image:none;
            background-position:0 0;
            background-repeat:repeat;
            height:200px;
            left:399px;
            position:absolute;
            top:135.5px;
            visibility:visible;
            width:400px;
            z-index:25001;
            }

            This is also happening with IE7.
                           

              Activity

              Descending order - Click to sort in ascending order
              Ken Fyten made changes -
              Status Resolved [ 5 ] Closed [ 6 ]
              Assignee Priority P2
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #19949 Thu Dec 10 15:45:41 MST 2009 judy.guglielmin ICE-4481, update PanelPopup for ICE-5062, ICE-4778, ICE-4781, ICE-4700, ICE-4710, ICE-4578, ICE-4595, ICE-4475, ICE-3356, ICE-4495,ICE-4450
              Files Changed
              Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/components/src/main/java/com/icesoft/faces/component/panelpopup/PanelPopup.java
              Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/component-metadata/src/main/resources/conf/ice_cust_properties/cust-panelpopup-props.xml
              Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/core/src/main/resources/META-INF/resources/ice-extras.js
              Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/components/src/main/java/com/icesoft/faces/component/panelpopup/PanelPopupRenderer.java
              Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/components/src/main/java/com/icesoft/faces/component/outputconnectionstatus/OutputConnectionStatusRenderer.java
              Ken Fyten made changes -
              Fix Version/s 1.8.2-RC1 [ 10210 ]
              Ken Fyten made changes -
              Issue Type Bug [ 1 ] Improvement [ 4 ]
              yip.ng made changes -
              Status Reopened [ 4 ] Resolved [ 5 ]
              Resolution Fixed [ 1 ]
              Hide
              Permalink
              yip.ng added a comment -

              Changed to allow CSS positioning for modal popup:

              <ice:panelPopup autoPosition="manual" style="top: 10px;left: 400px;" ... >

              Show
              yip.ng added a comment - Changed to allow CSS positioning for modal popup: <ice:panelPopup autoPosition="manual" style="top: 10px;left: 400px;" ... >
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #18999 Thu Jun 25 17:23:31 MDT 2009 yip.ng ICE-4578
              Changed to allow specifying position using CSS for modal popup.
              Files Changed
              Commit graph MODIFY /icefaces/trunk/icefaces/component/src/com/icesoft/faces/component/panelpopup/PanelPopupRenderer.java
              Commit graph MODIFY /icefaces/trunk/icefaces/component-metadata/src/main/resources/conf/ice_cust_properties/cust-panelpopup-props.xml
              Commit graph MODIFY /icefaces/trunk/icefaces/bridge/lib/extras/style.js
              yip.ng made changes -
              Attachment ScreenHunter_03.jpg [ 11803 ]
              yip.ng made changes -
              Attachment ScreenHunter_02.jpg [ 11802 ]
              Ken Fyten made changes -
              Resolution Fixed [ 1 ]
              Status Resolved [ 5 ] Reopened [ 4 ]
              yip.ng made changes -
              Status Open [ 1 ] Resolved [ 5 ]
              Resolution Fixed [ 1 ]
              Hide
              Permalink
              yip.ng added a comment -

              Modal dialog fixed to allow positioning. To position the dialog, use the existing autoPosition attribute:

              <ice:panelPopup autoCenter="false" modal="true" autoPosition="400,10" ... >

              See the attached screenshot.

              Show
              yip.ng added a comment - Modal dialog fixed to allow positioning. To position the dialog, use the existing autoPosition attribute: <ice:panelPopup autoCenter="false" modal="true" autoPosition="400,10" ... > See the attached screenshot.
              yip.ng made changes -
              Attachment ScreenHunter_01.jpg [ 11801 ]
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #18984 Thu Jun 18 15:00:49 MDT 2009 yip.ng ICE-4578
              Changed to allow positioning of modal dialog.
              Files Changed
              Commit graph MODIFY /icefaces/trunk/icefaces/bridge/lib/extras/style.js
              Hide
              Permalink
              Ken Fyten added a comment -

              It seems that the component requires the absolute positioning to work, but it may be possible to make it so the modal popup supports the same flexibility as the non-modal dialog (with the addition of "modality" blocking DIV, etc.).

              Please investigate the scope and feasibility of this.

              Show
              Ken Fyten added a comment - It seems that the component requires the absolute positioning to work, but it may be possible to make it so the modal popup supports the same flexibility as the non-modal dialog (with the addition of "modality" blocking DIV, etc.). Please investigate the scope and feasibility of this.
              Hide
              Permalink
              yip.ng added a comment -

              Modal popups are always centered. (On the document, not the viewport. ) Autocenter is for non-modal popups only.

              Position (absolute), z index, top, left are all required by the JavaScript to do the positioning and iframe shimming. If the user wants to have their own values, they have to write their own JavaScript to do the modal popup functionality.

              Show
              yip.ng added a comment - Modal popups are always centered. (On the document, not the viewport. ) Autocenter is for non-modal popups only. Position (absolute), z index, top, left are all required by the JavaScript to do the positioning and iframe shimming. If the user wants to have their own values, they have to write their own JavaScript to do the modal popup functionality.
              Hide
              Permalink
              Ken Fyten added a comment -

              Is the rendered "position: absolute;" only required for "centered=true" mode, or is it required in all cases? Maybe we can only render it when "autocenter=true".

              Show
              Ken Fyten added a comment - Is the rendered "position: absolute;" only required for "centered=true" mode, or is it required in all cases? Maybe we can only render it when "autocenter=true".
              Ken Fyten made changes -
              Fix Version/s 1.8.2 [ 10190 ]
              Assignee Priority P2
              Assignee Yip Ng [ yip.ng ]
              Tyler Johnson made changes -
              Attachment SC8326.war [ 11783 ]
              Hide
              Permalink
              Tyler Johnson added a comment -

              Attaching a test case intended for deployment on Jboss Portal 2.7.2 GA but you can also use component showcase portlet panel popup sample.

              Show
              Tyler Johnson added a comment - Attaching a test case intended for deployment on Jboss Portal 2.7.2 GA but you can also use component showcase portlet panel popup sample.
              Tyler Johnson made changes -
              Environment Jboss Portal 2.7.2-GA, FF 3.0.10, IE7 Jboss Portal 2.7.2-GA (JBoss AS 4.2.3), FF 3.0.10, IE7
              Tyler Johnson made changes -
              Description Setting the css position attribute (ie. fixed, relative, etc. )on a panelPopup in a Portlet has no effect and looks as if it's being hard coded as absolute. Here is the jspx code:

              <ice:panelPopup style="position: fixed; z-index:999; top: 10px;left: 400px; width: 400px; height: 200px;background: #FFFFFF;" autoCenter="false" modal="true" rendered="#{backingBean.rendered}">

              which renders out the following :

              <div class="icePnlPop" ..... style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; z-index: 25001; top: 135.5px; left: 399px; width: 400px; height: 200px; visibility: visible; position: absolute;">

              Notice the position:absolute set at the very end. Inspecting the css using Firebug yields the following curious styleclass:

              element.style {
              background-attachment:scroll;
              background-color:#FFFFFF;
              background-image:none;
              background-position:0 0;
              background-repeat:repeat;
              height:200px;
              left:399px;
              position:absolute;
              top:135.5px;
              visibility:visible;
              width:400px;
              z-index:25001;
              }

              This is also happening with IE7.
                                            		Setting the css position attribute (ie. fixed, relative, etc. )on a panelPopup style in a Portlet has no effect and looks as if it's being hard coded as absolute. Here is the jspx code:

              <ice:panelPopup style="position: fixed; z-index:999; top: 10px;left: 400px; width: 400px; height: 200px;background: #FFFFFF;" autoCenter="false" modal="true" rendered="#{backingBean.rendered}">

              which renders out the following :

              <div class="icePnlPop" ..... style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; z-index: 25001; top: 135.5px; left: 399px; width: 400px; height: 200px; visibility: visible; position: absolute;">

              Notice the position:absolute set at the very end. Inspecting the css using Firebug yields the following curious styleclass:

              element.style {
              background-attachment:scroll;
              background-color:#FFFFFF;
              background-image:none;
              background-position:0 0;
              background-repeat:repeat;
              height:200px;
              left:399px;
              position:absolute;
              top:135.5px;
              visibility:visible;
              width:400px;
              z-index:25001;
              }

              This is also happening with IE7.
                             
              Tyler Johnson made changes -
              Field Original Value New Value
              Salesforce Case [50070000008o2GG]
              Tyler Johnson created issue -

                People

                • Assignee:
                  yip.ng
                  Reporter:
                  Tyler Johnson
                • Votes:
                  1 Vote for this issue
                  Watchers:
                  0 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved: