You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@myfaces.apache.org by "Javier Alperte (JIRA)" <de...@myfaces.apache.org> on 2005/11/10 12:51:03 UTC
[jira] Created: (MYFACES-804) Popup windows: bad position on screen ( and components)
Popup windows: bad position on screen (<t:popup> and <x:inputSuggest> components)
---------------------------------------------------------------------------------
Key: MYFACES-804
URL: http://issues.apache.org/jira/browse/MYFACES-804
Project: MyFaces
Type: Bug
Components: Tomahawk, Sandbox
Versions: 1.1.1
Environment: Windows XP Pro SP2, Tomcat 4.1.30, JDK 1.4.2_09
Reporter: Javier Alperte
Error positioning the popup windows shown by the components: <t:popup> and <x:inputSuggest>
They don't have in consideration the relative position of the component in the page, and it's a problem if you place the component inside a DIV, where the positions must be relatives and not globals.
Solution: calculate the popup position based on component relative positions. For do that we need to assign an ID to the component in order to get the Document Element associated with it, and then we can use the HTML Object Position to calculate where to show the popup.
Ej: Our component must generate a function like this:
function showMenu_<COMPONENT_ID>(event) {
var menuDiv = document.getElementById(<MENU_DIV_ID>);
var componentElement = document.getElementById(<COMPONENT_ID>);
if (menudiv.style.visibility == 'hidden' && event) { //Show menu
menudiv.style.visibility = 'visible';
menudiv.style.display = 'block';
menudiv.style.zIndex = 3000;
menudiv.style.top = componentElement.offsetTop + 10;
var left = componentElement.offsetLeft + componentElement.offsetWidth - menudiv.offsetWidth;
if (left < 0) //Move menu to the right side if it is too close to the left
left += menudiv.offsetWidth;
menudiv.style.left = left;
} else {
menudiv.style.visibility = 'hidden';
}
}
--
This message is automatically generated by JIRA.
-
If you think it was sent incorrectly contact one of the administrators:
http://issues.apache.org/jira/secure/Administrators.jspa
-
For more information on JIRA, see:
http://www.atlassian.com/software/jira
[jira] Commented: (TOMAHAWK-51) Popup windows: bad position on
screen ( and components)
Posted by "Werner Punz (JIRA)" <de...@myfaces.apache.org>.
[ http://issues.apache.org/jira/browse/TOMAHAWK-51?page=comments#action_12367390 ]
Werner Punz commented on TOMAHAWK-51:
-------------------------------------
This is a work in progress which partially will make it into 1.1.2.
As we move towards dojo the problem will go away, due to the fact that
the inputsuggest popup in dojo calculates the positions correctly (and also does the internal scroller
recalculation)
As for the popup itself this one will be one of the first components moved to dojo after the 1.1.2 release once the dojo codebase is established in tomahawk.
> Popup windows: bad position on screen (<t:popup> and <x:inputSuggest> components)
> ---------------------------------------------------------------------------------
>
> Key: TOMAHAWK-51
> URL: http://issues.apache.org/jira/browse/TOMAHAWK-51
> Project: MyFaces Tomahawk
> Type: Bug
> Components: Popup
> Environment: Windows XP Pro SP2, Tomcat 4.1.30, JDK 1.4.2_09
> Reporter: Javier Alperte
> Assignee: Werner Punz
>
> Error positioning the popup windows shown by the components: <t:popup> and <x:inputSuggest>
> They don't have in consideration the relative position of the component in the page, and it's a problem if you place the component inside a DIV, where the positions must be relatives and not globals.
> Solution: calculate the popup position based on component relative positions. For do that we need to assign an ID to the component in order to get the Document Element associated with it, and then we can use the HTML Object Position to calculate where to show the popup.
> Ej: Our component must generate a function like this:
> function showMenu_<COMPONENT_ID>(event) {
> var menuDiv = document.getElementById(<MENU_DIV_ID>);
> var componentElement = document.getElementById(<COMPONENT_ID>);
> if (menudiv.style.visibility == 'hidden' && event) { //Show menu
> menudiv.style.visibility = 'visible';
> menudiv.style.display = 'block';
> menudiv.style.zIndex = 3000;
> menudiv.style.top = componentElement.offsetTop + 10;
> var left = componentElement.offsetLeft + componentElement.offsetWidth - menudiv.offsetWidth;
> if (left < 0) //Move menu to the right side if it is too close to the left
> left += menudiv.offsetWidth;
> menudiv.style.left = left;
> } else {
> menudiv.style.visibility = 'hidden';
> }
> }
--
This message is automatically generated by JIRA.
-
If you think it was sent incorrectly contact one of the administrators:
http://issues.apache.org/jira/secure/Administrators.jspa
-
For more information on JIRA, see:
http://www.atlassian.com/software/jira
[jira] Updated: (TOMAHAWK-51) Popup windows: bad position on screen
( and components)
Posted by "David Paterson (JIRA)" <de...@myfaces.apache.org>.
[ http://issues.apache.org/jira/browse/TOMAHAWK-51?page=all ]
David Paterson updated TOMAHAWK-51:
-----------------------------------
Status: Patch Available (was: Open)
> Popup windows: bad position on screen (<t:popup> and <x:inputSuggest> components)
> ---------------------------------------------------------------------------------
>
> Key: TOMAHAWK-51
> URL: http://issues.apache.org/jira/browse/TOMAHAWK-51
> Project: MyFaces Tomahawk
> Issue Type: Bug
> Components: Popup
> Environment: Windows XP Pro SP2, Tomcat 4.1.30, JDK 1.4.2_09
> Reporter: Javier Alperte
> Assigned To: Werner Punz
> Attachments: HtmlPopupRenderer.diff, JSPopup.diff
>
>
> Error positioning the popup windows shown by the components: <t:popup> and <x:inputSuggest>
> They don't have in consideration the relative position of the component in the page, and it's a problem if you place the component inside a DIV, where the positions must be relatives and not globals.
> Solution: calculate the popup position based on component relative positions. For do that we need to assign an ID to the component in order to get the Document Element associated with it, and then we can use the HTML Object Position to calculate where to show the popup.
> Ej: Our component must generate a function like this:
> function showMenu_<COMPONENT_ID>(event) {
> var menuDiv = document.getElementById(<MENU_DIV_ID>);
> var componentElement = document.getElementById(<COMPONENT_ID>);
> if (menudiv.style.visibility == 'hidden' && event) { //Show menu
> menudiv.style.visibility = 'visible';
> menudiv.style.display = 'block';
> menudiv.style.zIndex = 3000;
> menudiv.style.top = componentElement.offsetTop + 10;
> var left = componentElement.offsetLeft + componentElement.offsetWidth - menudiv.offsetWidth;
> if (left < 0) //Move menu to the right side if it is too close to the left
> left += menudiv.offsetWidth;
> menudiv.style.left = left;
> } else {
> menudiv.style.visibility = 'hidden';
> }
> }
--
This message is automatically generated by JIRA.
-
If you think it was sent incorrectly contact one of the administrators: http://issues.apache.org/jira/secure/Administrators.jspa
-
For more information on JIRA, see: http://www.atlassian.com/software/jira
[jira] Commented: (TOMAHAWK-51) Popup windows: bad position on
screen ( and components)
Posted by "David Paterson (JIRA)" <de...@myfaces.apache.org>.
[ http://issues.apache.org/jira/browse/TOMAHAWK-51?page=comments#action_12448598 ]
David Paterson commented on TOMAHAWK-51:
----------------------------------------
We were having a similar problem as mentioned with the main body of the page being rendered inside a relative positioned DIV. Also this DIV is aligned center which makes the problem worse in IE 7. In IE 7 even if I find the correct adjustment based on the relative position of the parent DIV the offset is based on the center of the rendered DIV not the top and left coordinates. So after the correction the pop up still gets rendered a mile off to the right of the page.
My fix was a bit of a hack but it's working well for us. What I did was modify the JavaScript constructor function that is first called when the t:popup is rendered. At the end of this function I create a new DIV outside the main content DIV to serve a container for my Popup DIVs and then subsequently move each of my new Popup DIV into this container as they are created. This then allows me to simple use absolute positioning for the Popup based on cursor position as was originally intended.
I also had to make a change to HtmlPopupRenderer.encodeEnd() so that the DIV is rendered first, before the JavaScript, otherwise the above JavaScript mod doesn't work.
> Popup windows: bad position on screen (<t:popup> and <x:inputSuggest> components)
> ---------------------------------------------------------------------------------
>
> Key: TOMAHAWK-51
> URL: http://issues.apache.org/jira/browse/TOMAHAWK-51
> Project: MyFaces Tomahawk
> Issue Type: Bug
> Components: Popup
> Environment: Windows XP Pro SP2, Tomcat 4.1.30, JDK 1.4.2_09
> Reporter: Javier Alperte
> Assigned To: Werner Punz
>
> Error positioning the popup windows shown by the components: <t:popup> and <x:inputSuggest>
> They don't have in consideration the relative position of the component in the page, and it's a problem if you place the component inside a DIV, where the positions must be relatives and not globals.
> Solution: calculate the popup position based on component relative positions. For do that we need to assign an ID to the component in order to get the Document Element associated with it, and then we can use the HTML Object Position to calculate where to show the popup.
> Ej: Our component must generate a function like this:
> function showMenu_<COMPONENT_ID>(event) {
> var menuDiv = document.getElementById(<MENU_DIV_ID>);
> var componentElement = document.getElementById(<COMPONENT_ID>);
> if (menudiv.style.visibility == 'hidden' && event) { //Show menu
> menudiv.style.visibility = 'visible';
> menudiv.style.display = 'block';
> menudiv.style.zIndex = 3000;
> menudiv.style.top = componentElement.offsetTop + 10;
> var left = componentElement.offsetLeft + componentElement.offsetWidth - menudiv.offsetWidth;
> if (left < 0) //Move menu to the right side if it is too close to the left
> left += menudiv.offsetWidth;
> menudiv.style.left = left;
> } else {
> menudiv.style.visibility = 'hidden';
> }
> }
--
This message is automatically generated by JIRA.
-
If you think it was sent incorrectly contact one of the administrators: http://issues.apache.org/jira/secure/Administrators.jspa
-
For more information on JIRA, see: http://www.atlassian.com/software/jira