B4J Library [BANano] Website/App/PWA library with Abstract Designer support

Toky Olivier

Active Member
Licensed User
No, you will need to write this yourself. All it does is make sure it runs offline by caching the assets.
Thank you. There is no thread about it in the forums. It will be good if there is some tutorial.
There is some resources here: https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/offline-for-pwa and here: https://codelabs.developers.google.com/codelabs/workbox-indexeddb/index.html?index=../..index#0
I'll try to understand...
Again thank you.
 

Toky Olivier

Active Member
Licensed User
It seems that there are some background sync plugin that will be used with the service worker. Is it possible to implement it in BANano please? No idea for now how to do in the code.
 

soyVB6

Active Member
Licensed User
How can i achieve this
JavaScript:
document.getElementById("myId").focus();
?

I tried without success

B4X:
BANano.RunJavascriptMethod("hacerFocus",Array As String())
#if JAVASCRIPT
function hacerFocus(){   
    document.getElementById("SKTextBox1").focus();
    };
 #End If
SKTextBox1 was created in the designer, I only saw the classes field not the ID field
 

alwaysbusy

Expert
Licensed User
Please start a new thread with your question
Yes please

However, I'll answer this one once here because part of the question is an important concept in BANano:

SKTextBox1 was created in the designer, I only saw the classes field not the ID field
All components created in the designer have their ID (in B4X terms, this is the Name in the Abstract Designer) lowercased. So probaby doing this would've worked:
B4X:
BANano.RunJavascriptMethod("hacerFocus",Array As String())
#if JAVASCRIPT
   function hacerFocus() {
        document.getElementById("sktextbox1").focus(); // lowercased id
   };
#End If
A much cleaner thing to do is make some changes to the BANanoSkeletonCSS library by adding a couple of properties to each component:
B4X:
' returns the BANanoElement
public Sub getElement() As BANanoElement
    Return mElement
End Sub

' returns the tag id
public Sub getID() As String
    Return mName
End Sub
And to make the 'lowercased' ID to be consistent also for dynamically added components, we could lowercase the Name in the initialize method:
B4X:
Public Sub Initialize (CallBack As Object, Name As String, EventName As String)
    mName = Name.ToLowerCase '<--------- to make it also lowercase for dynamically added components
    mEventName = EventName.ToLowerCase
    mCallBack = CallBack   
End Sub
Now we have access to the inner BANano component, which allows us to do this without having to use Javascript:
B4X:
BANano.GetElement("#" & SKTextBox1.ID).RunMethod("focus", Null)
And even simpler:
B4X:
SKTextBox1.Element.RunMethod("focus", Null)
You can download an updated SkeletonCSS library where these changes are implemented here: http://gorgeousapps.com/BANanoSkeletonCSS1.05.zip

If it is a much used method, you can make it part of the component in the library:
B4X:
' set focus
Public Sub Focus()
     mElement.RunMethod("focus", Null)
End Sub
Now we would be able to do just this:
B4X:
SKTextBox1.Focus
Alwaysbusy
 
Last edited:

Toky Olivier

Active Member
Licensed User
I haven't forgotten you for the PWA ;) But it takes a lot more work to make the needed changes to BANano for syncing via a Service Worker. Fascinating stuff though and it will be great if it is in build-in. I'm trying, as always, to hide all the difficult stuff from you so it is simple to use.
Thank you for your good and hard work :)
B4X + BANano are more powerfull than ever
 
Top