Page 1 of 1

VL_WEB - pop up

Posted: Mon Aug 07, 2017 11:08 pm
by kno_dk
Hi

I have a vl web pager where I have text label in a list. When I move the mouse over the label I show a pop up (a LANSA RP ) with stock information. I have a position on the pop up which is okay when I have a "normal" screen (just a few pixel left of the label). When I have a large screen the pop up is shown in the middle of the screen not beside the label. Is there a way I can calculate the posistion so the pop up will be to the left of the label ( start position of label - 80 pixel.)
/Klaus

Re: VL_WEB - pop up

Posted: Tue Aug 08, 2017 12:52 am
by jyoung
I think you can hook into the Popup's Prepare event and then you can adjust the top and left points.

http://docs.lansa.com/14/en/lansa016/PR ... repare.htm

Code: Select all

begin_com role(*EXTENDS #PRIM_WEB)
define_com class(#PRIM_PPNL) name(#Popup1) closebutton(True) left(399) titlebar(True) top(216) caption('My Popup')
define_com class(#PRIM_LABL) name(#Label1) caption('Label1') displayposition(1) ellipses(Word) height(25) left(279) parent(#COM_OWNER) tabposition(1) tabstop(False) top(216) verticalalignment(Center) width(120) popup(#Popup1)

evtroutine handling(#Com_owner.Initialize)

endroutine

evtroutine handling(#Popup1.Prepare) top(#top) left(#left)
#top := #Label1.ScreenTop
#left := #Label1.ScreenLeft + #Label1.Width
endroutine

end_com

Re: VL_WEB - pop up

Posted: Tue Aug 08, 2017 1:44 pm
by Stewart Marshall
As per Joe's previous reply, but the popup has been associated with the label via the HintPopup property which will show the popup when the mouse hovers of the label

Regards

Code: Select all

Begin_Com Role(*EXTENDS #PRIM_WEB) Height(544) Width(640) Layoutmanager(#Layout1) Theme(#SYS_THEME<2015Blue>)
Define_Com Class(#PRIM_TBLO) Name(#Layout1)
Define_Com Class(#PRIM_TBLO.Column) Name(#Column1) Displayposition(1) Parent(#Layout1)
Define_Com Class(#PRIM_TBLO.Column) Name(#Column2) Displayposition(2) Parent(#Layout1) Width(2)
Define_Com Class(#PRIM_TBLO.Column) Name(#Column3) Displayposition(3) Parent(#Layout1)
Define_Com Class(#PRIM_TBLO.Row) Name(#Row1) Displayposition(1) Parent(#Layout1)
Define_Com Class(#PRIM_TBLO.Row) Name(#Row2) Displayposition(2) Parent(#Layout1) Height(2)
Define_Com Class(#PRIM_TBLO.Row) Name(#Row3) Displayposition(3) Parent(#Layout1)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutItem1) Column(#Column2) Manage(#Label1) Parent(#Layout1) Row(#Row2) Sizing(None)

Define_Com Class(#PRIM_LABL) Name(#Label1) Caption('Hover Here') Displayposition(1) Ellipses(Word) Height(85) Left(260) Parent(#COM_OWNER) Tabposition(1) Tabstop(False) Top(230) Verticalalignment(Center) Width(120) Alignment(Center) Themedrawstyle('Title+DarkTitle') Hintpopup(#Popup)
Define_Com Class(#PRIM_PPNL) Name(#Popup) Closebutton(True) Left(380) Titlebar(True) Top(221)

Evtroutine Handling(#Popup.Prepare) Top(#Top) Left(#Left)

#Top := #Label1.ScreenTop
#Left := #Label1.ScreenLeft - #Popup.width

Endroutine

End_Com

Re: VL_WEB - pop up

Posted: Thu Aug 10, 2017 12:18 am
by kno_dk
Hi.

I got the pop up working with the code below. It works in Chrome, EDGE and explore, but not in Firefox. I have tested on 2 pc's - same result. Does anybody had the same issue? any solution?

Evtroutine Handling(#Label22.MouseHover)
#Popup2.ShowDetails( #Vare2ONL )
Endroutine

Evtroutine Handling(#Popup2.Prepare) Top(#Top2) Left(#Left2)

#Top2 := #Label22.ScreenTop
#Left2 Æi1 := #Label22.ScreenLeft - #Popup2.width

Endroutine

Re: VL_WEB - pop up

Posted: Thu Aug 10, 2017 8:45 am
by Stewart Marshall
I've just tried the following code in a 14 Sp1 system.

As far as I can see it works as expected in all browsers.

You say it doesn't work in Firefox. What actually happens?

Code: Select all

Begin_Com Role(*EXTENDS #PRIM_WEB) Height(448) Width(640) Theme(#SYS_THEME<2015Blue>)
Define_Com Class(#PRIM_LABL) Name(#Label1) Caption('Label1') Displayposition(1) Ellipses(Word) Height(25) Left(480) Parent(#COM_OWNER) Tabposition(1) Tabstop(False) Top(80) Verticalalignment(Center) Width(120) Themedrawstyle('MediumTitle')
Define_Com Class(#PRIM_PPNL) Name(#Popup1) Closebutton(True) Left(153) Parent(#COM_OWNER) Titlebar(True) Top(155)

Evtroutine Handling(#Label1.MouseHover)
#Popup1.ShowPopup
Endroutine

Evtroutine Handling(#Popup1.Prepare) Top(#Top) Left(#Left)

#Top := #Label1.ScreenTop
#Left := #Label1.ScreenLeft - #Popup1.Width

Endroutine

End_Com

Re: VL_WEB - pop up

Posted: Thu Aug 10, 2017 6:06 pm
by kno_dk
Hi.

I have put a ThemeDrawstyle= Link on the label so I can see that it respond on the hover over the label. I get the finger when I hover over the label and so that is fine, but nothing else is happening. 2 times I have been able to get apop up but it was only when I clicked on the label. But when i got the pop up window it was never closed () on so I have to type in the url to get the browser working again.
I have a MouseLeave on the label, like this:
Evtroutine Handling(#Label1.MouseLeave)
#PopUp1.ClosePopup
Endroutine

Re: VL_WEB - pop up

Posted: Fri Aug 11, 2017 10:19 am
by Stewart Marshall
There is an inherent risk when using MouseHover and MouseLeave to control the appearance of a popup. If the popup appears beneath the mouse, it can cause the MouseLeave to fire immediately. This will make it seems as though the popup is never shown.

This sample demonstrates the issue. Note how the behaviour is subtly different in Firefox and Chrome. This is because the two browsers fire their events slightly differently.

Code: Select all

Begin_Com Role(*EXTENDS #PRIM_WEB) Height(448) Width(640) Theme(#SYS_THEME<2015Blue>)
Define_Com Class(#PRIM_VS.Style) Name(#Style1) Cursor(Hand)

Define_Com Class(#PRIM_LABL) Name(#Label1) Caption('Label1') Displayposition(1) Ellipses(Word) Height(25) Left(80) Parent(#COM_OWNER) Tabposition(1) Tabstop(False) Top(56) Verticalalignment(Center) Width(120) Themedrawstyle('MediumTitle') Alignment(Center) Mouseoverstyle(#Style1)
Define_Com Class(#PRIM_PPNL) Name(#Popup1) Left(152) Parent(#COM_OWNER) Top(155) Autoclose(False)

Evtroutine Handling(#Label1.MouseHover)
#Popup1.ShowPopup
Endroutine

Evtroutine Handling(#Label1.MouseLeave)
#Popup1.ClosePopup
Endroutine

Evtroutine Handling(#Popup1.Prepare) Top(#Top) Left(#Left)

#Top := #Label1.ScreenTop
#Left := #Label1.ScreenLeft - #Popup1.Width

Endroutine

End_Com
Given this, there are a couple of features that you may consider as an alternative. The HintPopup property will show the popup when the user hovers over a control and it will close after a given amount of time as all hints do.

The other option is to remove the MouseLeave processing and set AutoClose to True on the popup. This means that it will go away the moment the user clicks on something else.

Regards

Re: VL_WEB - pop up

Posted: Fri Aug 11, 2017 6:49 pm
by kno_dk
Hi
I sat the AutoClose to True on the popup and removed the mouseleave and the it works the same way on all the browsers I have tested with. But it is not the best way, the user have to make a extra click each time they move the mouse over the label.

Re: VL_WEB - pop up

Posted: Mon Aug 14, 2017 10:16 am
by Stewart Marshall
You want to display the popup on hover and have it disappear on mouse leave.
You want to position the popup at a specific place.

Given this second requirement, your only choice is to write logic to make sure the popup is not going to get in the way when it pops up.

The alternative is to let LANSA position the popup for you. By default, all popups with a *Null parent will be positioned 1 pixel to the right of and below the cursor position. But even this runs in to problems when the control is on the bottom right corner as the popup will likely cover the control causing the same problem you have today.

Code: Select all

Begin_Com Role(*EXTENDS #PRIM_WEB) Height(448) Width(640) Theme(#SYS_THEME<2015Blue>)
Define_Com Class(#PRIM_LABL) Name(#Label1) Caption('Hover Here') DisplayPosition(1) Ellipses(Word) Height(33) Left(480) Parent(#COM_OWNER) TabPosition(1) TabStop(False) Top(400) VerticalAlignment(Center) Width(145) ThemeDrawStyle('MediumTitle') Alignment(Center)
Define_Com Class(#PRIM_PPNL) Name(#Popup1) Left(153) Top(155) AutoClose(False)

Evtroutine Handling(#Label1.MouseHover)
#Popup1.ShowPopup
Endroutine

Evtroutine Handling(#Label1.MouseLeave)
#Popup1.ClosePopup
Endroutine

End_Com