Closable (& disableable) PanelGadget-Items with Callback

Share your advanced knowledge/code with the community.
User avatar
Peter
Posts: 875
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Closable (& disableable) PanelGadget-Items with Callback

Post by Peter »

Hello,

here is a code for implementing a Close-Button for PanelGadget-Items:

Image

Code: Select all

EnableExplicit

Procedure PanelGadgetSetItemCloseCallback(Gadget, Position, Callback)
  
  If GadgetType(Gadget) <> #PB_GadgetType_Panel : ProcedureReturn : EndIf
  If Position < 0 : Position = 0 : EndIf
  If Position > CountGadgetItems(Gadget) - 1 : Position = CountGadgetItems(Gadget) - 1 : EndIf
  
  Protected GID = GadgetID(Gadget)
  
  ! dijit.byId(v_gid.gadget.id).getChildren()[v_position].set("onClose", function() { v_callback(v_gadget, v_position); } )
  
EndProcedure

Procedure PanelGadgetSetItemClosable(Gadget, Position, Closable)
  
  If GadgetType(Gadget) <> #PB_GadgetType_Panel : ProcedureReturn : EndIf
  If Position < 0 : Position = 0 : EndIf
  If Position > CountGadgetItems(Gadget) - 1 : Position = CountGadgetItems(Gadget) - 1 : EndIf
  
  Protected GID = GadgetID(Gadget)
  
  ! dijit.byId(v_gid.gadget.id).getChildren()[v_position].set("closable", v_closable)
  
EndProcedure

Procedure PanelGadgetSetItemDisabled(Gadget, Position, Disabled)
  
  If GadgetType(Gadget) <> #PB_GadgetType_Panel : ProcedureReturn : EndIf
  If Position < 0 : Position = 0 : EndIf
  If Position > CountGadgetItems(Gadget) - 1 : Position = CountGadgetItems(Gadget) - 1 : EndIf
  
  Protected GID = GadgetID(Gadget)
  
  ! dijit.byId(v_gid.gadget.id).getChildren()[v_position].set("disabled", v_disabled)
  
EndProcedure

; Example:

Procedure Panel_onClose(Gadget, Position)
  
  Protected PanelText.s = GetGadgetItemText(Gadget, Position)
  Protected ItemCounter

  ! if (confirm('Do you really want to close ' + v_paneltext + '?')) {
  RemoveGadgetItem(Gadget, Position)
  ; Reset the Callback with the new indices:
  For ItemCounter = 0 To CountGadgetItems(Gadget) -1
  	PanelGadgetSetItemCloseCallback(Gadget, ItemCounter, @Panel_onClose())
  Next
  !  }
  
EndProcedure

Enumeration
  #myWindow
  #myPanelGadget
EndEnumeration

If OpenWindow(#myWindow, 0, 0, 600, 400, "PanelGadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  
  PanelGadget  (#myPanelGadget, 10, 10, 580, 380)
  AddGadgetItem(#myPanelGadget, -1, "Panel 1")
  AddGadgetItem(#myPanelGadget, -1, "Panel 2")
  AddGadgetItem(#myPanelGadget, -1, "Panel 3")
  AddGadgetItem(#myPanelGadget, -1, "Panel 4")
  AddGadgetItem(#myPanelGadget, -1, "Panel 5 (disabled)")
  CloseGadgetList()
  
  PanelGadgetSetItemCloseCallback(#myPanelGadget, 0, @Panel_onClose())
  PanelGadgetSetItemClosable     (#myPanelGadget, 0, #True)
  
  PanelGadgetSetItemCloseCallback(#myPanelGadget, 2, @Panel_onClose())
  PanelGadgetSetItemClosable     (#myPanelGadget, 2, #True)
  
  PanelGadgetSetItemCloseCallback(#myPanelGadget, 4, @Panel_onClose())
  PanelGadgetSetItemClosable     (#myPanelGadget, 4, #True)
  
  PanelGadgetSetItemDisabled     (#myPanelGadget, 4, #True) ; disable Panel 5
  
EndIf
v_greetings ... Peter

// Edit: Code improved
Last edited by Peter on Fri May 05, 2017 4:03 pm, edited 2 times in total.
bbanelli
Posts: 107
Joined: Mon Jul 13, 2015 7:40 am

Re: Closable PanelGadget-Items with Callback

Post by bbanelli »

Fantastic, as always!

Image

Is this bug in Chrome?
"If you lie to the compiler, it will get its revenge."
Henry Spencer
http://www.pci-z.com/
User avatar
Peter
Posts: 875
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: Closable PanelGadget-Items with Callback

Post by Peter »

bbanelli wrote:Is this bug in Chrome?
i guess, this is a bug in the Dijit Flat-CSS (the Aeroglass-CSS seems to be ok).

The first posting is updated with an improved code.

Greetings ... Peter

// Edit: Ups! There is a bug in the code above. Stay tuned... :ugeek:

// Edit2: Code improved again. Should work now... :P
skinkairewalker
Posts: 88
Joined: Tue Jun 14, 2016 7:17 pm

Re: Closable (& disableable) PanelGadget-Items with Callback

Post by skinkairewalker »

have a way to remove this black border on click in tab ?

https://prnt.sc/zvkwkj
User avatar
Peter
Posts: 875
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: Closable (& disableable) PanelGadget-Items with Callback

Post by Peter »

skinkairewalker wrote:have a way to remove this black border on click in tab ?
The border does not appear for me.

Image

Have you integrated another CSS? Which browser are you using?

Perhaps this one will help:

Code: Select all

! $("head").append("<style>.dijitTab:focus{outline: none;}</style>");
skinkairewalker
Posts: 88
Joined: Tue Jun 14, 2016 7:17 pm

Re: Closable (& disableable) PanelGadget-Items with Callback

Post by skinkairewalker »

Have you integrated another CSS?
i do not think so ...
but, when mouse over or mouse click near to black border, show this events : https://prnt.sc/zxbm9z
Which browser are you using?
Chrome v88.0.4324.182 (oficial) 64 bits
Perhaps this one will help:

Code: Select all

! $("head").append("<style>.dijitTab:focus{outline: none;}</style>");
[/quote]

is there any specific location that i need to put the line on? because it didn’t work by putting it inside the functions or in the main flow ...
User avatar
Peter
Posts: 875
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: Closable (& disableable) PanelGadget-Items with Callback

Post by Peter »

@skinkairewalker: Can you provide a small test web page? Then I could identify the corresponding element relatively quickly.
Post Reply