Matching SpiderBasic Gadget ID to Dojo ID
Posted: Thu Jan 19, 2023 8:46 pm
Hey!
An SB program has some interesting Objects in the browser at runtime.
spider.DigitRegistry holds the Dojo Toolkit UI Elements.
I played around a little (and read the Dojo docs) and finally found the connection between SB and Dojo,
as each of the Elements in the DigitRegistry has a property called ''spiderId" that matches the gadgetID (= a number).
No need to call GadgetID()-Procedure, as it seems to return the JS Object (and not an Integer).
If you iterate over it, you can use the SB ID to match the DOM-Element at runtime:
For example one can set the maximum characters for an EditorGadget (or do some other stuff):
I'm confident this also can be easily achieved with JQuery, or a callback that listens to the keypress-event and then count the chars, but I feel quite comfortable with this solution (and I'm curious where this will lead me).
Cheers,
An SB program has some interesting Objects in the browser at runtime.
spider.DigitRegistry holds the Dojo Toolkit UI Elements.
I played around a little (and read the Dojo docs) and finally found the connection between SB and Dojo,
as each of the Elements in the DigitRegistry has a property called ''spiderId" that matches the gadgetID (= a number).
No need to call GadgetID()-Procedure, as it seems to return the JS Object (and not an Integer).
If you iterate over it, you can use the SB ID to match the DOM-Element at runtime:
Code: Select all
Enumeration
#Window
#Button
EndEnumeration
Procedure onButton()
buttonID = #Button
Debug "Button Pressed!"
! var arr = spider.DigitRegistry.toArray();
! arr.forEach(
! function(elem) {
! if(elem.spiderId == v_buttonid) {
! console.log("Match! -> Details:");
! console.log(elem);
! }
! }
! );
EndProcedure
OpenWindow(#Window, 0, 0, 100, 100, "MainWindow")
ButtonGadget(#Button, 10, 10, 80, 40, "Dings")
BindGadgetEvent(#Button, @onButton())
Code: Select all
Enumeration
#Window
#editor
EndEnumeration
Procedure SetEditor()
buttonID = #editor
! var arr = spider.DigitRegistry.toArray();
! arr.forEach(
! function(elem) {
! if(elem.spiderId == v_buttonid) {
! console.log("Setting Max Chars for Editor to 10");
! elem.maxLength = '10';
! }
! }
! );
EndProcedure
OpenWindow(#Window, 0, 0, 100, 100, "MainWindow")
EditorGadget(#editor, 10, 10, 80, 80, #PB_Editor_WordWrap)
SetEditor()
Cheers,