Mouse over gadget

[Peter]

I have since discovered that it is due to the command: "usegadgetlist(#window)" and "closegadgetlist()" that I use.

you mean OpenGadgetList() and CloseGadgetList()?

But anyway. No matter if OpenGadgetList() or CloseGadgetList() or UseGadgetList(): It works

Code: Select all

Enumeration Windows
  #Window1
  #Window2
EndEnumeration

Enumeration Gadgets
  #Window1_Button1
  #Window1_Container
  #Window1_Button2
  #Window2_Button1
  #Window2_Container
  #Window2_Button2
EndEnumeration

Procedure MouseOver(Element)
  Protected GadgetID
  ! v_gadgetid = v_element.target.GadgetID
  Debug "MouseOver GadgetID: " + GadgetID
  SetGadgetText(GadgetID, "MouseOver")
EndProcedure

Procedure MouseLeave(Element)
  Protected GadgetID
  ! v_gadgetid = v_element.target.GadgetID
  Debug "MouseLeave GadgetID: " + GadgetID
  SetGadgetText(GadgetID, "MouseLeave")
EndProcedure

Procedure AddMouseOverAndMouseLeaveToGadget(GadgetID)
  
  ! var element = spider.gadget.objects.map[v_gadgetid].gadget.containerNode;
  ! element.GadgetID = v_gadgetid;
  ! element.addEventListener("mouseover", f_mouseover);
  ! element.addEventListener("mouseleave", f_mouseleave);
  
EndProcedure

OpenWindow(#Window1, 100, 100, 300, 110, "Window 1")
OpenWindow(#Window2, 500, 200, 300, 110, "Window 2")

UseGadgetList(WindowID(#Window1))
ButtonGadget(#Window1_Button1, 10, 10, 280, 30, "Button")
AddMouseOverAndMouseLeaveToGadget(#Window1_Button1)
ContainerGadget(#Window1_Container, 10, 50, 280, 50, #PB_Container_Single) : CloseGadgetList()

UseGadgetList(WindowID(#Window2))
ButtonGadget(#Window2_Button1, 10, 10, 280, 30, "Button")
AddMouseOverAndMouseLeaveToGadget(#Window2_Button1)
ContainerGadget(#Window2_Container, 10, 50, 280, 50, #PB_Container_Single) : CloseGadgetList()

OpenGadgetList(#Window1_Container)
ButtonGadget(#Window1_Button2, 10, 10, 260, 30, "Button inside Panel")
AddMouseOverAndMouseLeaveToGadget(#Window1_Button2)
CloseGadgetList()

OpenGadgetList(#Window2_Container)
ButtonGadget(#Window2_Button2, 10, 10, 260, 30, "Button inside Panel")
AddMouseOverAndMouseLeaveToGadget(#Window2_Button2)
CloseGadgetList()

Please have a look at the developer console of your browser. If there is any red indication, then something is wrong in your code.

[Stefan]

Did you really test it with an imagegadget? I don't see it.
Your Code doesn't work with Imagegadgets.
And I use UseGadgetList()

Code: Select all

    If IsWindow(#mainw)
    UseGadgetList(WindowID(#mainw))
    ...
   CloseGadgetList()   
 EndIf

[Peter]

Did you really test it with an imagegadget? I don't see it.

It should be clear that I don't test all gadget types in order to offer you a free solution. To be honest, I don't find your expectations reasonable. For this reason, this is my last post in this thread.

Code: Select all

Procedure AddMouseOverAndMouseLeaveToGadget(GadgetID)
  
  ! var element = spider.gadget.objects.map[v_gadgetid].gadget.containerNode;
  ! if (typeof(element)=="undefined") element = spider.gadget.objects.map[v_gadgetid].gadget;
  ! element.GadgetID = v_gadgetid;
  ! element.addEventListener("mouseover", f_mouseover);
  ! element.addEventListener("mouseleave", f_mouseleave);
  
EndProcedure

And I use UseGadgetList()

CloseGadgetList() is only used in conjunction with OpenGadgetList(). If you use UseGadgetList(), you need no CloseGadgetList().

[plouf]

.....
Can you please give an example of image gadgets?

my approach is different that peter but there more than 1 "correct ways"

anyway since we "cheat" practically exposing custom code over SpiderBasic, what i would do is transform image in base64 and make a "textgadget" a "imagegadget"
Note that the step of transforming to base64 in NOT necessary if your images are external loaded from the server.
In that case "src=" of img tag, can direct use http://image which is clearer, simpler, and less code and memory consuming

here is the example

Code: Select all

Procedure buttonalert(id.l)
  MessageRequester("MouseOver "+Str(id))
EndProcedure

CreateImage(1,50,50)
  StartDrawing(ImageOutput(1))
    Circle(10,10,5,#Red)
  StopDrawing()
  image_in_base64_1$ = EncodeImage(1)
  
  
  
If OpenWindow(0, 0, 0, 222, 200, "ButtonGadgets", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  
  ButtonGadget(1, 10, 10, 200, 20, "<span onmouseover= "+Chr(34)+"f_buttonalert('1');"+Chr(34)+"> Standard Button 1</span>")
  ButtonGadget(2, 10, 40, 200, 20, "<span onmouseover= "+Chr(34)+"f_buttonalert('2');"+Chr(34)+"> Standard Button 2</span>")
  
  TextGadget(3,10,70,200,20,"<span onmouseover= "+Chr(34)+"f_buttonalert('3');"+Chr(34)+"> <img src="+Chr(34)+image_in_base64_1$+Chr(34)+"> </span>")
EndIf

[Stefan]

I didn't realize you had to pay for help here.
I just pointed out that the code doesn't work with Imagegadgets. This wasn't an accusation, but a hint so that other readers don't have to search for hours to find out exactly that.
As you can see, this solution is good if you are looking for a solution for button gadgets.
Thank you for your help, Peter

Also many thanks to plouf, who also brought a very interesting approach.