B4J Tutorial [BANano] Exploring BANanoEvents

Hi there

This is just my method (without abstract designer views) of adding and binding events to elements.

1. Elements are added to the page
2. After the page content is updated, events are added to a map that keeps record of events, events can be click, change etc.
3. Events are bound to the elements whether through a global sub that will handle all events or individual subs per element.

Case 1: events handled by own subs using HandleEvents.
When binding events to individual subs, the binding method should be

'BindEvents("",Me)

 

[Mashiane]

Case 2: Binding events to a global sub.

The binding method should be:

BindEvents("globalEvent",Me)

First in our process_globals of our code module, we define a few things...

Type EventObject(ElementName As String, EventType As String, CallBackMethod As String)
    'the map will hold all events for elements
    Public Events As Map

And then add some subs to AddEvents and then BindEvents

''add an event to the collection
Sub AddEvent(ElementID As String, EventType As String,CallBackMethod As String)
    ElementID = ElementID.ToLowerCase
    ElementID = ElementID.Trim
    Dim evnt As EventObject
    evnt.Initialize
    evnt.ElementName = ElementID
    evnt.EventType = EventType
    evnt.CallBackMethod = CallBackMethod
    Events.Put(ElementID,evnt)
    Dim em As List
    em.Initialize
    em.Add("icon")
    em.Add("img")
    em.Add("badge")
    em.Add("title")
    em.Add("span")
    Dim lTot As Int = em.Size - 1
    Dim lCnt As Int
    For lCnt = 0 To lTot
        Dim strsuffix As String = em.Get(lCnt)
        Dim strkey As String = $"${ElementID}-${strsuffix}"$
        Dim evnt As EventObject
        evnt.Initialize
        evnt.ElementName = strkey
        evnt.EventType = EventType
        evnt.CallBackMethod = CallBackMethod
        Events.Put(strkey,evnt)
    Next
End Sub

As per above code, if you add an elementid of 'btnok', 4 event handlers will be added for btnok, btnok-icon, btnok-img etc.

Then we bind events

'banano bind the events to elements
Sub BindEvents(elMethod As String, EventHandler As Object)
    Dim mTot As Int = Events.Size - 1
    Dim mCnt As Int
    For mCnt = 0 To mTot
        Dim elID As String = Events.GetKeyAt(mCnt)
        Dim elEvent As EventObject = Events.Get(elID)
        Dim btnEvent As String = elEvent.CallBackMethod
        Dim evType As String = elEvent.EventType
        Dim elKey As String = $"#${elID}"$
        'these call a universal method
        If elMethod <> "" Then
            btnEvent = elMethod.tolowercase
        End If
        If EventHandler <> Null Then
            Dim eExist As Boolean = BANAno.Exists(elKey)
            If eExist = True Then
                Dim elm As BANanoElement = BANAno.GetElement(elKey)
'elm.off(evType)
                elm.HandleEvents(evType, EventHandler, btnEvent)
            End If
        End If
    Next
End Sub

This loops through the events map and then add all necessary events for the page..

Then to demo lets add some page content and add and bind the events..

Sub Init()
    BANAno.GetElement("#body").Empty
    BANAno.GetElement("#body").Append($"<button id="btnok">Button Itself</button><br>"$)
    BANAno.GetElement("#body").Append($"<button id="btnok-icon">Assumed Icon</button><br>"$)
    BANAno.GetElement("#body").Append($"<button id="btnok-span">Assumed Span</button><br>"$)
    BANAno.GetElement("#body").Append($"<button id="btnok-img">Assumed Img</button><br>"$)
    BANAno.GetElement("#body").Append($"<a id="btnhave">Anchor</a><br>"$)
    'add events for each element
    ' clear events
    ' Events.Initialize
    AddEvent("btnok","click","btnok_click")
    AddEvent("btnhave","click","btnhave_click")
    'bind the events to each element
    BindEvents("globalEvent",Me)
    'BindEvents("",Me)
End Sub

With this example a global sub 'globalEvent' is used to handle all events, inside that one can parse the event ids and process whetever is needed per element clicked.

Sub btnok_click(event As BANanoEvent)
    Log(event.ID)
End Sub


Sub btnhave_click(event As BANanoEvent)
    Log(event.ID)
End Sub

Sub globalEvent(event As BANanoEvent)
    Log(" ** global event handler ***")
    Log(event.ID)
End Sub

Ta!