[gatein-issues] [JBoss JIRA] (GTNPORTAL-2811) The portlet modes are sometimes displayed selected in latest versions of FF and Chrome

[Vu Viet Phuong (JIRA)]

     [ https://issues.jboss.org/browse/GTNPORTAL-2811?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]

Vu Viet Phuong updated GTNPORTAL-2811:
--------------------------------------

              Status: Pull Request Sent  (was: Open)
    Git Pull Request: https://github.com/gatein/gatein-portal/pull/423


The problem caused by double click on the wrapper of the popup menu. The solution is follow the design of twitter bootstrap dropdown component
                
> The portlet modes are sometimes displayed selected in latest versions of FF and Chrome
> --------------------------------------------------------------------------------------
>
>                 Key: GTNPORTAL-2811
>                 URL: https://issues.jboss.org/browse/GTNPORTAL-2811
>             Project: GateIn Portal
>          Issue Type: Bug
>      Security Level: Public(Everyone can see) 
>          Components: User Interface
>    Affects Versions: 3.2.0-GA, 3.5.0.Final
>         Environment: GateIn-3.5.0.Final-tomcat7/GateIn-3.2.0.Final-tomcat6
> Java 1.6.0_37
> Firefox 16.0.2/17.0.1/18.0.1 and Chrome 24.0.1312.56
>            Reporter: Nicolas Filotto
>            Assignee: Vu Viet Phuong
>            Priority: Minor
>              Labels: portal-s70
>         Attachments: Portlet-Modes.jpg
>
>   Original Estimate: 5 hours
>  Remaining Estimate: 5 hours
>
> It seems that there is a display issue on latest versions of FF and Chrome when we show the portlet modes, indeed sometimes the labels are selected by default as you can see in the screenshot and sometimes it appears normally. After a deeper investigation it seems to be due to the fact that FF believes that we want to select the content by left clicking on the arrow, one way to fix it is to use the trick described here http://stackoverflow.com/questions/69430/is-there-a-way-to-make-text-unselectable-on-an-html-page. By simply adding the css attributes of the class {{unselectable}} in the div of class {{ControlIcon}}, I could fix the issue on chrome and FF (did not test on other browsers). In other words, I modified the file webapps/portal/groovy/portal/webui/application/UIPortlet.gtmpl to replace
> {code}
> <div class="ControlIcon ArrowDownIcon" title="<%=_ctx.appRes("UIPortlet.tooltip.PortletMode");%>" style="position: relative;">
> {code}
> with
> {code}
> <div class="ControlIcon ArrowDownIcon" title="<%=_ctx.appRes("UIPortlet.tooltip.PortletMode");%>" style="position: relative;-moz-user-select: -moz-none;-khtml-user-select: none;-webkit-user-select: none;-ms-user-select: none;user-select: none;" unselectable="on">
> {code}

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators
For more information on JIRA, see: http://www.atlassian.com/software/jira