B4J Question BaNano JavaScript

[walterf25]

Hello everyone, first of all i apologize if this question is somewhat stupid, i honestly don't have much experience with HTML or JavaScript, i started playing around with BaNano library, I started wrapping the WebRTC library for android, but I wanted to see if i could create the WebRTC server with B4J to test the library, basically i would just make a call from my phone and have the WebRTC server running on B4J answer the video call, i have found many examples online including the javascripts which take care of all the communication.

Ok, that was just some background so that I can ask this question.
I created a small project which consists of a few buttons and a video object, at first I used the BananoSkeleton library and created a layout with the B4J Designer where i included the buttons etc.

I then added the script file used on a project I found online here, this example as you can see basically just gets your laptop's/pc's video camera and audio and shows the video in the video container, anyhow i recreated that page using BaNano library but for some reason i saw some differences when running the JavaScript file "main.js" for example when the project is ran on the following lines:

const vgaButton = document.getElementById('vga');
console.log('found vgaButton ' + vgaButton);

When the console.log line is printed out I see a null value, this tells me that the Element was not found even though the element is in the index.html file i created. I have attached two screenshots one of the buttons and another one of the html part where you can clearly see that the button with id=vga is there.

My question is this, why is it that when I run the project and i try to get the ElementById it can't find it, as I mentioned at the beginning i am not an expert in HTML or JavaScript but trying to learn, I downloaded the project i found online and when I run it on my laptop everything runs smooth including the javascript file and all the Elements are found, what is the difference?

Thanks all, hope this makes sense, by the way I think this BaNano library is absolutely awesome based on some of the examples i have seen others in the forum have been able to create, thanks @alwaysbusy for this great contribution as well.

I've also created a small example to show what i am referring to, it's just a small example with one button, the main.js file only includes one line of javascript code to try to find the button.

Walter

 

[Kiffi]

First you run main.js (where you search for the button) and then app.js (where the button is created). Do you see the problem?

My suggestion: Remove the main.js (you don't need it anymore) and write in the init the following:

Sub init()
    banano.GetElement("#body").Append($"<button id="start">start</button>"$)
    Dim StartButton As BANanoElement = banano.GetElement("#start")
End Sub

Greetings ... Peter