ICEfaces
  1. ICEfaces
  2. ICE-4674

Add focus support to the panelCollapsible component

    Details

    • Type: Improvement Improvement
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 1.8.2-RC1
    • Fix Version/s: 1.8.2
    • Component/s: ICE-Components
    • Labels:
      None
    • Environment:
      panelCollapsible + focus

      Description

      Add focus support to the panelCollapsible component

        Issue Links

          Activity

          Adnan Durrani created issue -
          Adnan Durrani made changes -
          Field Original Value New Value
          Salesforce Case []
          Fix Version/s 1.8.2 [ 10190 ]
          Adnan Durrani made changes -
          Assignee Adnan Durrani [ adnan.durrani ]
          Adnan Durrani made changes -
          Status Open [ 1 ] In Progress [ 3 ]
          Repository Revision Date User Message
          ICEsoft Public SVN Repository #19035 Fri Jul 03 15:57:15 MDT 2009 adnan.durrani Fix for ICE-4674 (Add focus support to the panelCollapsible component)
          Files Changed
          Commit graph MODIFY /icefaces/trunk/icefaces/component/src/com/icesoft/faces/component/panelcollapsible/PanelCollapsibleRenderer.java
          Commit graph MODIFY /icefaces/trunk/icefaces/bridge/lib/extras/extras.js
          Hide
          Adnan Durrani added a comment -

          Fixed:

          Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js
          Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java
          Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java
          Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js
          Completed: At revision: 19035

          Show
          Adnan Durrani added a comment - Fixed: Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js Completed: At revision: 19035
          Adnan Durrani made changes -
          Status In Progress [ 3 ] Resolved [ 5 ]
          Resolution Fixed [ 1 ]
          Hide
          Joanne Bai added a comment -

          Tested successfully using component showcase JSP on trunk revision 19035 + Tomcat6 + FF3

          IE7 and IE8 has styling problem displaying the collapsible title bars (see the attached screen shot).

          Show
          Joanne Bai added a comment - Tested successfully using component showcase JSP on trunk revision 19035 + Tomcat6 + FF3 IE7 and IE8 has styling problem displaying the collapsible title bars (see the attached screen shot).
          Joanne Bai made changes -
          Attachment IE7-stylingProblem.JPG [ 11829 ]
          Hide
          Adnan Durrani added a comment -

          The styling problem has been fixed under the following JIRA: ICE-4738

          Show
          Adnan Durrani added a comment - The styling problem has been fixed under the following JIRA: ICE-4738
          Ken Fyten made changes -
          Fix Version/s 1.8.2-RC1 [ 10210 ]
          Hide
          Ken Fyten added a comment -

          I've noticed that when the panelCollapsible header gets focus, the focus indicator is displayed in the browser. This is causing the header contents to shift 1 pixel because of the indicator. It would be nicer if the contents didn't shift when the focus ind. is displayed.

          Video: http://screencast.com/t/w7587OFUZNQY

          Show
          Ken Fyten added a comment - I've noticed that when the panelCollapsible header gets focus, the focus indicator is displayed in the browser. This is causing the header contents to shift 1 pixel because of the indicator. It would be nicer if the contents didn't shift when the focus ind. is displayed. Video: http://screencast.com/t/w7587OFUZNQY
          Ken Fyten made changes -
          Resolution Fixed [ 1 ]
          Status Resolved [ 5 ] Reopened [ 4 ]
          Assignee Priority P2
          Ken Fyten made changes -
          Salesforce Case []
          Fix Version/s 1.8.2-RC1 [ 10210 ]
          Affects Version/s 1.8.2-RC1 [ 10210 ]
          Ken Fyten made changes -
          Salesforce Case []
          Assignee Adnan Durrani [ adnan.durrani ] Yip Ng [ yip.ng ]
          Ken Fyten made changes -
          Assignee Yip Ng [ yip.ng ] Adnan Durrani [ adnan.durrani ]
          Ken Fyten made changes -
          Salesforce Case []
          Assignee Priority P2 P3
          Hide
          yip.ng added a comment -

          The focus mechanism is simulated by modifying the borders of the header. This affects the header's dimensions and thus the flow and layout of the page. I have tried various positioning approaches. No luck. Because the shift is caused by the appearance and disappearance of the simulated focus border itself, repositioning the header and/or content div before or after the fact won't help much. It also introduces a lot of complexity associated with positioning.

          If we use hide and redisplay, there will be flickering and you will still see the shift if you pay close attention.

          What's more, in at least one case the behavior of IE is different from FF. So even if we could find some approach that works there may still also be cross-browser headaches to deal with.

          Show
          yip.ng added a comment - The focus mechanism is simulated by modifying the borders of the header. This affects the header's dimensions and thus the flow and layout of the page. I have tried various positioning approaches. No luck. Because the shift is caused by the appearance and disappearance of the simulated focus border itself, repositioning the header and/or content div before or after the fact won't help much. It also introduces a lot of complexity associated with positioning. If we use hide and redisplay, there will be flickering and you will still see the shift if you pay close attention. What's more, in at least one case the behavior of IE is different from FF. So even if we could find some approach that works there may still also be cross-browser headaches to deal with.
          Repository Revision Date User Message
          ICEsoft Public SVN Repository #19313 Mon Sep 28 21:01:05 MDT 2009 adnan.durrani Fix related to ICE-4674 (Add focus support to the panelCollapsible component)
          Clipping and resizing fixed.
          Files Changed
          Commit graph MODIFY /icefaces/trunk/icefaces/samples/component-showcase/common-web/css/showcase_style.css
          Commit graph MODIFY /icefaces/trunk/icefaces/component/src/com/icesoft/faces/component/panelcollapsible/PanelCollapsibleRenderer.java
          Commit graph MODIFY /icefaces/trunk/icefaces/bridge/lib/extras/extras.js
          Commit graph MODIFY /icefaces/trunk/icefaces/core/src/com/icesoft/faces/resources/css/rime/rime.css
          Hide
          Adnan Durrani added a comment -

          Resizing and clipping has been fixed.

          Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js
          Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java
          Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\core\src\com\icesoft\faces\resources\css\rime\rime.css
          Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\samples\component-showcase\common-web\css\showcase_style.css
          Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java
          Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js
          Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\core\src\com\icesoft\faces\resources\css\rime\rime.css
          Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\samples\component-showcase\common-web\css\showcase_style.css
          Completed: At revision: 19313

          Show
          Adnan Durrani added a comment - Resizing and clipping has been fixed. Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\core\src\com\icesoft\faces\resources\css\rime\rime.css Modified: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\samples\component-showcase\common-web\css\showcase_style.css Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\component\src\com\icesoft\faces\component\panelcollapsible\PanelCollapsibleRenderer.java Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\bridge\lib\extras\extras.js Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\core\src\com\icesoft\faces\resources\css\rime\rime.css Sending content: D:\work\development\head\svn\ossrepo\icefaces\trunk\icefaces\samples\component-showcase\common-web\css\showcase_style.css Completed: At revision: 19313
          Adnan Durrani made changes -
          Status Reopened [ 4 ] Resolved [ 5 ]
          Resolution Fixed [ 1 ]
          Hide
          Joanne Bai added a comment -

          Tested on ICEfaces trunk revision 19313
          Server: Tomcat 6.0
          Browsers: FF3.5, IE7

          panelCollapisble related test cases as follows are all PASS:

          ICE-4674
          ICE-4059
          ICE-2193
          ICE-2146
          ICE-1882
          ICE-1816

          Show
          Joanne Bai added a comment - Tested on ICEfaces trunk revision 19313 Server: Tomcat 6.0 Browsers: FF3.5, IE7 panelCollapisble related test cases as follows are all PASS: ICE-4674 ICE-4059 ICE-2193 ICE-2146 ICE-1882 ICE-1816
          Repository Revision Date User Message
          ICEsoft Public SVN Repository #19932 Thu Dec 10 09:02:04 MST 2009 adnan.durrani 1.8.2EE panelCollapsible changes moved to Compat panelCollapsible towards ICE-4481. The changes include the fix of following JIRAs: ICE-4674, ICE-4738
          Files Changed
          Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/components/src/main/java/com/icesoft/faces/component/panelcollapsible/PanelCollapsibleRenderer.java
          Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/core/src/main/resources/META-INF/resources/ice-extras.js
          Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/samples/component-showcase/web/css/showcase_style.css
          Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/components/src/main/java/com/icesoft/faces/component/panelcollapsible/PanelCollapsible.java
          Commit graph MODIFY /icefaces/scratchpads/glimmer/compat/core/src/main/java/com/icesoft/faces/util/CoreUtils.java
          Ken Fyten made changes -
          Status Resolved [ 5 ] Closed [ 6 ]
          Assignee Priority P3
          Hide
          Krashan Brahmanjara added a comment -

          File PanelCollapsibleRenderer.java updated with revision 19313 changed some views in IE browsers.
          In complex pages with collapisble panel unexpected bottom scrollbar appears.

          The problem is in line 79 with content
          div.setAttribute(HTML.STYLE_ATTR, "padding:1px;background-image:none;width:100%;");

          padding 0px resolve scrollbars problem.

          Patch

          Index: PanelCollapsibleRenderer.java
          ===================================================================
          — PanelCollapsibleRenderer.java (revision 20162)
          +++ PanelCollapsibleRenderer.java (working copy)
          @@ -76,7 +76,7 @@
          panelCollapsible.isExpanded()+"'; " +
          "iceSubmit(document.forms['"+ form.getClientId(facesContext) +"'],this,event); return false;");
          Element div = domContext.createElement(HTML.DIV_ELEM);

          • div.setAttribute(HTML.STYLE_ATTR, "padding:1px;background-image:none;width:100%;");
            + div.setAttribute(HTML.STYLE_ATTR, "padding:0px;background-image:none;width:100%;");
            header.appendChild(div);
            //this anchor should be known by the component only, so we are defining style to the component level
            Element anchor = domContext.createElement(HTML.ANCHOR_ELEM);
          Show
          Krashan Brahmanjara added a comment - File PanelCollapsibleRenderer.java updated with revision 19313 changed some views in IE browsers. In complex pages with collapisble panel unexpected bottom scrollbar appears. The problem is in line 79 with content div.setAttribute(HTML.STYLE_ATTR, "padding:1px;background-image:none;width:100%;"); padding 0px resolve scrollbars problem. Patch Index: PanelCollapsibleRenderer.java =================================================================== — PanelCollapsibleRenderer.java (revision 20162) +++ PanelCollapsibleRenderer.java (working copy) @@ -76,7 +76,7 @@ panelCollapsible.isExpanded()+"'; " + "iceSubmit(document.forms ['"+ form.getClientId(facesContext) +"'] ,this,event); return false;"); Element div = domContext.createElement(HTML.DIV_ELEM); div.setAttribute(HTML.STYLE_ATTR, "padding:1px;background-image:none;width:100%;"); + div.setAttribute(HTML.STYLE_ATTR, "padding:0px;background-image:none;width:100%;"); header.appendChild(div); //this anchor should be known by the component only, so we are defining style to the component level Element anchor = domContext.createElement(HTML.ANCHOR_ELEM);
          Krashan Brahmanjara made changes -
          Link This issue blocks ICE-5308 [ ICE-5308 ]

            People

            • Assignee:
              Adnan Durrani
              Reporter:
              Adnan Durrani
            • Votes:
              1 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved: