B4J Tutorial [ABMaterial/ABMServer] Mini Template for absolute beginners (update 2024/05/17)

Hi all,

Since the lockdown everywhere, a lot of B4X users seem to want to learn ABM to make WebApps in B4J. That is great! :)

However, some seem to struggle a lot to get started. I understand, as even opening up the template can be quite overwhelming with those Cache, Root, Page etc classes thrown immediately at you.
Therefor, I've decided to wrap up a new 'TemplateMini' version that hopefully will be a lot clearer for all new beginners.

What I have done:
1. Next to the normal ABMaterial library, I created a new b4xlib library ABMServer (both will have to be loaded in your project). The ABMServer is similar to the BANanoServer, wrapping all cluttering of classes into a library.
2. The template does a simple thing: it shows an inputbox and a button. When pushing the button, a msgbox is shown.

NOTE: this 'Mini' version is also exactly what it is: Mini. Although it uses the full blown ABMaterial library, and you can use everything of it in the Mini, most of the fine-tuning of Caching and Filters is done in a fixed way and cannot be changed. But I guess for 80% of you, you wouldn't have bothered anyway. And if you find yourself familiar with Mini, you can always move on to the full Template.

GETTING STARTED:

Requirements:

B4J 10.00+

Installation:
1. Download the library and mini template: https://gorgeousapps.com/ABMMini240517.zip
2. Unzip
3. Copy all files from the /Library folder (NOT the /FilesForNewProjects subfolder) to your B4J Additional Libraries folder.
4. Open the template.b4j project in B4J and run
5. Open a browser and go to: localhost:51042/template

New project todos:
If you start a new project, copy the www folder from the /Library/FilesForNewProjects folder to your new projects /Objects folder so the path looks like:

/myProject/Objects/www
/myProject/Objects/www/js
/myProject/Objects/www/css
/myProject/Objects/www/font

NOTE: Always run your project at least once in Debug mode. This will generate the .needs files that you will need to copy next to your .jar file in release mode.

In the Modules Tab, you will notice there is very little in it :)

1588503728486.png


ABMCacheV3: ignore, do not change AND do NOT delete. This is needed to make ABMaterial believe you are running the full blown version of it.
Main: the main entry point to your B4J application
ABMPageTemplate: a template of an ABM Page that you can use to make new ones.

Things to study In Main and that are different from the 'normal' template:
1. Leave the ABM.SessionCacheControlV3 = "ABMCacheV3" ALWAYS in your project. Needed as stated above.
2. Initializing the Server (ABMServer), and there are some settings you can tune. The 'big' template does the same and more but those settings are more spread around the different source code files.
3. IMPORTANT is setting the first page the app should go to. In this example, it it the ABMPageTemplate page.
4. you build the theme directly in the Main class in BuildTheme(). For page specific themes, use the BuildPage() method in the page itself.
5. Add your pages to ABM, see further
6. Finally, the server is started

Snippet from Main:
B4X:
Sub AppStart (Args() As String)
    ' must be the first line in AppStart. DO NOT DELETE OR CHANGE!
    ' ------------------------------------------------------------
    ABM.SessionCacheControlV3 = "ABMCacheV3"
    ' ------------------------------------------------------------

    Dim DonatorKey As String = ""
    Server.Initialize("", DonatorKey, "template") ' Application = ' the handler that will be used in the url e.g. http://localhost:51042/template
    ' some parameters
    Server.Port = 51042
    ' the user needs to login, set to true. the CheckLogin() method will be called if one tries to login
    Server.NeedsAuthorization = False
    Server.StartPage = "ABMPageTemplate" ' the first page of your app
    Server.CacheScavengePeriodSeconds = 15 * 30 ' 15 minutes
    Server.SessionMaxInactiveIntervalSeconds = 30 * 60 ' 30 minutes
    Server.UploadFolder = "uploads"
    Server.UploadMaxSize = 1024 * 1024

    ' Build the Theme
    BuildTheme("mytheme")

    ' create the pages
    Dim myPage As ABMPageTemplate
    myPage.Initialize
    ' add the pages to the app
    Server.AddPage(myPage.page)
    ' do the same for your own pages: dim, initialize and Server.AddPage
    ' ...

    ' start the server
    If Server.PortSSL <> 0 Then
        Server.StartServerHTTP2("keystore.jks", "KeyStorePassword", "KeyManagerPassword")
    Else
        Server.StartServer
    End If

    ' redirect the output of the logs to a file if in release mode
    Server.RedirectOutput(File.DirApp, "logs.txt")
 
    Log("Open with:")
    LogError("localhost:" & Server.Port & "/template")
 
    StartMessageLoop
End Sub

How to create a new Page in your App:
1. Take a copy of the ABMPageTemplate and give the class a new name: e.g. MyNewPage
2. IMPORTANT: you MUST match the Name property EXACTLY to the name of you new class. In case of this example:
B4X:
Public Name As String = "MyNewPage"  '<-------------------------------------------------------- IMPORTANT
3. for EVERY page you make, you MUST let ABM know it exists. This is done by the following lines in AppStart in Main:
B4X:
' initialize your new page
Dim myNewPage As MyNewPage ' which is a copy of the ABMPageTemplate
myNewPage.Initialize
' add the pages to the app
Server.AddPage(myNewPage.page)
4. I've put as much code as possible in ABMServer so you would not be confused by it. e.g. The WebSocket_Connected/Disconnected and ParseEvent are reduced to this:
B4X:
#Region Always needed, no need to change anything at them
Private Sub WebSocket_Connected (WebSocket1 As WebSocket)
    Log("Connected")
    ws = WebSocket1
    ABMPageId = ABM.GetPageID(page, Name,ws)

    Main.Server.Connected(Me, ws, page, ABMPageId)

    Log(ABMPageId)
End Sub

Private Sub WebSocket_Disconnected
    Log("Disconnected")
    Main.Server.Disconnected(ws)
End Sub

Sub Page_ParseEvent(Params As Map)
    Main.Server.Page_ParseEvent(Me, page, ABMPageId, Params)
End Sub
#end region
5. Your actual design and logic of you page is done in the following methods:
a. BuildPage
Here you design your grid (see the forum on how the grid works)
b. ConnectPage
Here you add your components to the grid previously made
c. Well and then the logic of your page of course.

NOTE: If you want your page to appear in the Navigation Bar on the left, you must also add it to the ConnectNavigationBar method in Main, just like the ABMPageTemplate example in there.

If the project is running, open your browser and go to http://localhost:51042/template

You should see this:

1588522443414.png


I hope this will get most of you started. I'm afraid I really can't make it any simpler than that.

Alwaysbusy
 

Attachments

  • 1588503676773.png
    1588503676773.png
    8.3 KB · Views: 4,469
  • 1588532671395.png
    1588532671395.png
    15 KB · Views: 4,390
Last edited:

vecino

Well-Known Member
Licensed User
Longtime User
Downloads that you need to get started:
1. Download the latest ABMaterial version (4.30 at the time of writing) from here
If you are a donator, you already have a later version 4.51.
2. Unzip and copy ALL .jar and .xml files to your B4J Libraries folder
3. Download the ABMServer.b4xlib and put it in your Additional Libraries folder from here
4. Donators download their 'Mini' version for v4.51 from here
The public 'Mini' version for v4.30 can be found here

Hi, should I look up all the .jar and .xml only?
Should I just discard everything else?

uno.png
 

vecino

Well-Known Member
Licensed User
Longtime User
Forgive my clumsiness, but some things are taken for granted, and not for those of us who don't know:
After copying all the .jar and .xml, is everything else useless? Should we delete it?

Another question:
"Unzip your downloaded mini version in start template.b4j"

What does that mean? Should we rename "TemplateMini" to "Template.b4j"?
Where should we unzip it?

Again, forgive my clumsiness, but it's ignorance, nothing more.
 

alwaysbusy

Expert
Licensed User
Longtime User
is everything else useless?
No, you should use the source code in there to study how all the components are used.

Should we rename "TemplateMini" to "Template.b4j"?
The project is already called Template.b4j so I don't see why you would rename anything.
1588521901753.png


some things are taken for granted, and not for those of us who don't know
You are just overthinking it. All the steps are described above. Just follow them, and don't try introduce new steps that are not in my list. If something had to be deleted or renamed, I would've mentioned it. ;)

Alwaysbusy
 

alwaysbusy

Expert
Licensed User
Longtime User
Unzip your downloaded mini version en start template.b4j
Ah, now I see it too! This should've been:

Unzip your downloaded mini version AND start template.b4j

EN is the dutch translation for AND and as dutch is my mother tongue, it must've slipped in.
 

OliverA

Expert
Licensed User
Longtime User
When you downloaded and unzipped ABMaterial 4.30, there should be a Library folder. Copy the files within that folder to the Additional Libraries folder that you should have set up as part of your B4J installation. For information on that (if not already set up), see https://www.b4x.com/guides/B4xGettingStarted/?page=8
 

alwaysbusy

Expert
Licensed User
Longtime User
Re-download the ABMServer.b4xlib from the first post and put it again in your Additional Libraries Folder.

I removed the dependencies from the manifest in the b4xlib library.

NOTE: It is possible when opening the Template.b4j file that it will say that the ABMaterial library is missing, but you just select it from the list (in your case ABMaterial4.30).

I updated the first post too to describe what one should do if that problem occurs. I don't have that problem on my machine as the latest version of ABM I use doesn't has a number in the jar/xml.
 
Last edited:

Gnappo jr

Active Member
Licensed User
Longtime User
Hi all,

Since the lockdown everywhere, a lot of B4X users seem to want to learn ABM to make WebApps in B4J. That is great! :)

However, some seem to struggle a lot to get started. I understand, as even opening up the template can be quite overwhelming with those Cache, Root, Page etc classes thrown immediately at you.
Therefor, I've decided to wrap up a new 'TemplateMini' version that hopefully will be a lot clearer for all new beginners.

What I have done:
1. Next to the normal ABMaterial library, I created a new b4xlib library ABMServer (both will have to be loaded in your project). The ABMServer is similar to the BANanoServer, wrapping all cluttering of classes into a library.
2. The template does a simple thing: it shows an inputbox and a button. When pushing the button, a msgbox is shown.

NOTE: this 'Mini' version is also exactly what it is: Mini. Although it uses the full blown ABMaterial library, and you can use everything of it in the Mini, most of the fine-tuning of Caching and Filters is done in a fixed way and cannot be changed. But I guess for 80% of you, you wouldn't have bothered anyway. And if you find yourself familiar with Mini, you can always move on to the full Template.

Downloads that you need to get started:
1. Download the latest ABMaterial version (4.30 at the time of writing) from here
If you are a donator, you already have a later version 4.51.
2. Unzip and copy ALL .jar and .xml files from the \Library\ folder to your B4J Libraries folder
3. Download the ABMServer.b4xlib and put it in your Additional Libraries folder from here
4. Donators download their 'Mini' version for v4.51 from here
The public 'Mini' version for v4.30 can be found here

NOTE: Both are the same 'Mini' version, but they contain the CSS/JS/Font folders matching your ABM version.

5. Unzip your downloaded mini version en start template.b4j.

NOTE: if it says that the ABMaterial library is missing on opening the project, select ONE from your library list (may be called ABMaterial, or ABMaterial4.30 or another number but it must be 4.30 or higher).

For example on my computer, it looks like this:
View attachment 93186

After selecting a ABMaterial library, the Libraries Manager tab should then show something like this (ABMaterial version may vary)
View attachment 93154

In the Modules Tab, you will notice there is very little in it :)
View attachment 93155

ABMCacheV3: ignore, do not change AND do NOT delete. This is needed to make ABMaterial believe you are running the full blown version of it.
Main: the main entry point to your B4J application
ABMPageTemplate: a template of an ABM Page that you can use to make new ones.

Things to study In Main and that are different from the 'normal' template:
1. Leave the ABM.SessionCacheControlV3 = "ABMCacheV3" ALWAYS in your project. Needed as stated above.
2. Initializing the Server (ABMServer), and there are some settings you can tune. The 'big' template does the same and more but those settings are more spread around the different source code files.
3. IMPORTANT is setting the first page the app should go to. In this example, it it the ABMPageTemplate page.
4. you build the theme directly in the Main class in BuildTheme(). For page specific themes, use the BuildPage() method in the page itself.
5. Add your pages to ABM, see further
6. Finally, the server is started

Snippet from Main:
B4X:
Sub AppStart (Args() As String)
    ' must be the first line in AppStart. DO NOT DELETE OR CHANGE!
    ' ------------------------------------------------------------
    ABM.SessionCacheControlV3 = "ABMCacheV3"
    ' ------------------------------------------------------------

    Dim DonatorKey As String = ""
    Server.Initialize("", DonatorKey, "template") ' Application = ' the handler that will be used in the url e.g. http://localhost:51042/template
    ' some parameters
    Server.Port = 51042
    ' the user needs to login, set to true. the CheckLogin() method will be called if one tries to login
    Server.NeedsAuthorization = False
    Server.StartPage = "ABMPageTemplate" ' the first page of your app
    Server.CacheScavengePeriodSeconds = 15 * 30 ' 15 minutes
    Server.SessionMaxInactiveIntervalSeconds = 30 * 60 ' 30 minutes
    Server.UploadFolder = "uploads"
    Server.UploadMaxSize = 1024 * 1024

    ' Build the Theme
    BuildTheme("mytheme")

    ' create the pages
    Dim myPage As ABMPageTemplate
    myPage.Initialize   
    ' add the pages to the app
    Server.AddPage(myPage.page)
    ' do the same for your own pages: dim, initialize and Server.AddPage
    ' ...

    ' start the server
    If Server.PortSSL <> 0 Then
        Server.StartServerHTTP2("keystore.jks", "KeyStorePassword", "KeyManagerPassword")
    Else
        Server.StartServer
    End If

    ' redirect the output of the logs to a file if in release mode
    Server.RedirectOutput(File.DirApp, "logs.txt")
   
    StartMessageLoop
End Sub

How to create a new Page in your App:
1. Take a copy of the ABMPageTemplate and give the class a new name: e.g. MyNewPage
2. IMPORTANT: you MUST match the Name property EXACTLY to the name of you new class. In case of this example:
B4X:
Public Name As String = "MyNewPage"  '<-------------------------------------------------------- IMPORTANT
3. for EVERY page you make, you MUST let ABM know it exists. This is done by the following lines in AppStart in Main:
B4X:
' initialize your new page
Dim myNewPage As MyNewPage ' which is a copy of the ABMPageTemplate
myNewPage.Initialize   
' add the pages to the app
Server.AddPage(myNewPage.page)
4. I've put as much code as possible in ABMServer so you would not be confused by it. e.g. The WebSocket_Connected/Disconnected and ParseEvent are reduced to this:
B4X:
#Region Always needed, no need to change anything at them
Private Sub WebSocket_Connected (WebSocket1 As WebSocket)
    Log("Connected")
    ws = WebSocket1
    ABMPageId = ABM.GetPageID(page, Name,ws)

    Main.Server.Connected(Me, ws, page, ABMPageId)

    Log(ABMPageId)
End Sub

Private Sub WebSocket_Disconnected
    Log("Disconnected")
    Main.Server.Disconnected(ws)
End Sub

Sub Page_ParseEvent(Params As Map)
    Main.Server.Page_ParseEvent(Me, page, ABMPageId, Params)
End Sub
#end region
5. Your actual design and logic of you page is done in the following methods:
a. BuildPage
Here you design your grid (see the forum on how the grid works)
b. ConnectPage
Here you add your components to the grid previously made
c. Well and then the logic of your page of course.

NOTE: If you want your page to appear in the Navigation Bar on the left, you must also add it to the ConnectNavigationBar method in Main, just like the ABMPageTemplate example in there.

If the project is running, open your browser and go to http://localhost:51042/template
You should see this:

View attachment 93173

I hope this will get most of you started. I'm afraid I really can't make it any simpler than that.

Alwaysbusy
Alain point four allows anyone to download the donator version. it's correct?
 

alwaysbusy

Expert
Licensed User
Longtime User
Yes, but it doesn't matter. As they do not have the ABMaterial 4.51 jar/xml and no DonatorKey it is pretty useless.

And the main idea has never been to prevent users from having the latest version just because they didn't donate. It was more for me to have a limited 'controlled' group of users that can test my new versions before releasing it to the public. I like to avoid getting a lot of people at the same time reporting bugs so I can't follow anymore. A small group doing the pre-testing helpes me to release more stable versions and react quicker to fatal errors.

It was more important in the early days of ABM than now, as it has been stable for quite some time now. I will probably at some point put the release for donators/non-donators equal.
 
Last edited:

j_o_h_n

Active Member
Licensed User
Hi
Sorry to be asking what must seem like stupid questions but I cannot seem to get this to work.


In step 2 it says:
2. Unzip and copy ALL .jar and .xml files from the \Library\ folder to your B4J Libraries folder
So this is the libraries folder for B4J itself, in my case C:\Program Files (x86)\Anywhere Software\B4J\Libraries.
Is this correct? Actually I have put them there and when that did not work I also tried them in the additional
libraries folder.
I also did an uninstall of b4J and installed the latest version.

Do I need to unzip and or put the ABMaterial4.30.zip file somewhere in particular?
I have tried different things with this. I left it out completely, unzipped it and put that in the additional
libraries, left it zipped in that folder. It doesn't seem to make any difference what I do with it.

Below I've put the logging information I'm getting. I would not expect anyone to examine that but maybe something obvious will jump out at you?
Thanks for any help you can give.

Waiting for debugger to connect...
Program started.
2020-05-05 15:42:07.470:INFO::main: Logging initialized @869ms to org.eclipse.jetty.util.log.StdErrLog
Start B4J Analyse!
When an error occurs, check the B4JAnalyse.log file in the Objects folder to see the last B4J line it was working on.
Collecting data from B4J source files... (1/2)
ABMCacheV3.bas
ABMPageTemplate.bas
Template.b4j
Analysing data from B4J source files... (2/2)
loading C:\temp\TEMPLA~1.30\Objects: copymewithjar.needs...
Using cache system: 3.0
Needs material/awesome icons
Building C:\temp\TEMPLA~1.30\Objects\copymewithjar.js.needs
Building core.min.1588689727254.css...
2020-05-05 15:42:08.027:INFO:eek:ejs.Server:main: jetty-9.4.z-SNAPSHOT; built: 2018-05-03T15:56:21.710Z; git: daa59876e6f384329b122929e70a80934569428c; jvm 11.0.1+13
2020-05-05 15:42:08.158:INFO:eek:ejs.session:main: DefaultSessionIdManager workerName=node0
2020-05-05 15:42:08.158:INFO:eek:ejs.session:main: No SessionScavenger set, using defaults
2020-05-05 15:42:08.159:INFO:eek:ejs.session:main: node0 Scavenging every 660000ms
2020-05-05 15:42:08.207:INFO:eek:ejsh.ContextHandler:main: Started o.e.j.s.ServletContextHandler@429bffaa{/,file:///C:/temp/TemplateMiniV4.30/Objects/www/,AVAILABLE}
2020-05-05 15:42:08.211:INFO:eek:ejs.AbstractNCSARequestLog:main: Opened C:\temp\TemplateMiniV4.30\Objects\logs\b4j-2020_05_05.request.log
2020-05-05 15:42:08.376:INFO:eek:ejs.AbstractConnector:main: Started ServerConnector@51e69659{HTTP/1.1,[http/1.1]}{0.0.0.0:51042}
2020-05-05 15:42:08.377:INFO:eek:ejs.Server:main: Started @1798ms

Emulated network latency: 100ms
2020-05-05 15:42:08.409:INFO:eek:ejs.AbstractConnector:main: Stopped ServerConnector@51e69659{HTTP/1.1,[http/1.1]}{0.0.0.0:51042}
2020-05-05 15:42:08.409:INFO:eek:ejs.session:main: node0 Stopped scavenging
2020-05-05 15:42:08.411:INFO:eek:ejsh.ContextHandler:main: Stopped o.e.j.s.ServletContextHandler@429bffaa{/,file:///C:/temp/TemplateMiniV4.30/Objects/www/,UNAVAILABLE}
2020-05-05 15:42:08.421:INFO:eek:ejs.Server:main: jetty-9.4.z-SNAPSHOT; built: 2018-05-03T15:56:21.710Z; git: daa59876e6f384329b122929e70a80934569428c; jvm 11.0.1+13
2020-05-05 15:42:08.425:INFO:eek:ejsh.ContextHandler:main: Started o.e.j.s.ServletContextHandler@429bffaa{/,file:///C:/temp/TemplateMiniV4.30/Objects/www/,AVAILABLE}
2020-05-05 15:42:08.427:INFO:eek:ejs.AbstractNCSARequestLog:main: Opened C:\temp\TemplateMiniV4.30\Objects\logs\b4j-2020_05_05.request.log
2020-05-05 15:42:08.427:INFO:eek:ejs.session:main: DefaultSessionIdManager workerName=node0
2020-05-05 15:42:08.427:INFO:eek:ejs.session:main: No SessionScavenger set, using defaults
2020-05-05 15:42:08.427:INFO:eek:ejs.session:main: node0 Scavenging every 600000ms
2020-05-05 15:42:08.428:INFO:eek:ejs.AbstractConnector:main: Started ServerConnector@51e69659{HTTP/1.1,[http/1.1]}{0.0.0.0:51042}
2020-05-05 15:42:08.429:INFO:eek:ejs.Server:main: Started @1850ms
2020-05-05 15:42:08.430:INFO:eek:ejs.session:main: node0 Scavenging every 495000ms

Scavenger running... (0 page(s) cached)
Scavenger running... (0 page(s) cached)

The B4JAnalyse.log file looks like this:
Analysing: ABMCacheV3.bas
ABMCacheV3.bas[0] B4J=true
ABMCacheV3.bas[0] Group=Default Group
ABMCacheV3.bas[0] ModulesStructureVersion=1
ABMCacheV3.bas[0] Type=Class
ABMCacheV3.bas[0] Version=8.1
ABMCacheV3.bas[0] @EndOfDesignText@
ABMCacheV3.bas[1] Sub Class_Globals
ABMCacheV3.bas[2] ' DO NOT DELETE OR LEAVE THIS CLASS AS IS!!!!!!!!!!!!!!!!!
ABMCacheV3.bas[3] End Sub
ABMCacheV3.bas[4]
ABMCacheV3.bas[5] 'Initializes the object. You can add parameters to this method if needed.
ABMCacheV3.bas[6] Public Sub Initialize
ABMCacheV3.bas[7]
ABMCacheV3.bas[8] End Sub
Analysing: ABMPageTemplate.bas
ABMPageTemplate.bas[0] B4J=true
ABMPageTemplate.bas[0] Group=Default Group
ABMPageTemplate.bas[0] ModulesStructureVersion=1
ABMPageTemplate.bas[0] Type=Class
ABMPageTemplate.bas[0] Version=5.9
ABMPageTemplate.bas[0] @EndOfDesignText@
ABMPageTemplate.bas[1] 'Class module
ABMPageTemplate.bas[2] Sub Class_Globals
ABMPageTemplate.bas[3] Private ws As WebSocket 'ignore
ABMPageTemplate.bas[4] ' will hold our page information
ABMPageTemplate.bas[5] Public page As ABMPage
ABMPageTemplate.bas[6] ' page theme
ABMPageTemplate.bas[7] Private theme As ABMTheme
ABMPageTemplate.bas[8] ' to access the constants
ABMPageTemplate.bas[9] Private ABM As ABMaterial 'ignore
ABMPageTemplate.bas[10] ' name of the page, must be the same as the class name (case sensitive!)
ABMPageTemplate.bas[11] Public Name As String = {0} '<-------------------------------------------------------- IMPORTANT
ABMPageTemplate.bas[12] ' will hold the unique browsers window id
ABMPageTemplate.bas[13] Private ABMPageId As String = {1}
ABMPageTemplate.bas[14]
ABMPageTemplate.bas[15] ' your own variables
ABMPageTemplate.bas[16] Dim ToastId As Int
ABMPageTemplate.bas[17]
ABMPageTemplate.bas[18] End Sub
ABMPageTemplate.bas[19]
ABMPageTemplate.bas[20] 'Initializes the object. You can add parameters to this method if needed.
ABMPageTemplate.bas[21] Public Sub Initialize
ABMPageTemplate.bas[22] ' build the local structure IMPORTANT!
ABMPageTemplate.bas[23] BuildPage
ABMPageTemplate.bas[24] End Sub
ABMPageTemplate.bas[25]
ABMPageTemplate.bas[26] #Region Always needed, no need to change anything at them
ABMPageTemplate.bas[27] Private Sub WebSocket_Connected (WebSocket1 As WebSocket)
ABMPageTemplate.bas[28] Log( {2} )
ABMPageTemplate.bas[29] ws = WebSocket1
ABMPageTemplate.bas[30] ABMPageId = ABM.GetPageID(page, Name,ws)
ABMPageTemplate.bas[31]
ABMPageTemplate.bas[32] Main.Server.Connected(Me, ws, page, ABMPageId)
ABMPageTemplate.bas[33]
ABMPageTemplate.bas[34] Log(ABMPageId)
ABMPageTemplate.bas[35] End Sub
ABMPageTemplate.bas[36]
ABMPageTemplate.bas[37] Private Sub WebSocket_Disconnected
ABMPageTemplate.bas[38] Log( {3} )
ABMPageTemplate.bas[39] Main.Server.Disconnected(ws)
ABMPageTemplate.bas[40] End Sub
ABMPageTemplate.bas[41]
ABMPageTemplate.bas[42] Sub Page_ParseEvent(Params As Map)
ABMPageTemplate.bas[43] Main.Server.Page_ParseEvent(Me, page, ABMPageId, Params)
ABMPageTemplate.bas[44] End Sub
ABMPageTemplate.bas[45] #end region
ABMPageTemplate.bas[46]
ABMPageTemplate.bas[47] ' MUST be in here
ABMPageTemplate.bas[48] public Sub BuildTheme()
ABMPageTemplate.bas[49] ' start with the base theme defined in ABMShared
ABMPageTemplate.bas[50] theme.Initialize( {4} )
ABMPageTemplate.bas[51] theme.AddABMTheme(Main.MyTheme)
ABMPageTemplate.bas[52]
ABMPageTemplate.bas[53] ' add page specific theme elements
ABMPageTemplate.bas[54] theme.AddInputTheme( {5} )
ABMPageTemplate.bas[55] theme.Input( {6} ).BackColor = ABM.COLOR_GREEN
ABMPageTemplate.bas[56] theme.Input( {7} ).BackColorIntensity = ABM.INTENSITY_LIGHTEN4
ABMPageTemplate.bas[57] End Sub
ABMPageTemplate.bas[58]
ABMPageTemplate.bas[59] ' MUST be in here
ABMPageTemplate.bas[60] public Sub BuildPage()
ABMPageTemplate.bas[61] ' initialize the theme
ABMPageTemplate.bas[62] BuildTheme
ABMPageTemplate.bas[63]
ABMPageTemplate.bas[64] ' initialize this page using our theme
ABMPageTemplate.bas[65] page.InitializeWithTheme(Name, {8} & Main.Server.AppName & {9} & Name, False, Main.Server.SessionMaxInactiveIntervalSeconds, theme)
ABMPageTemplate.bas[66] page.ShowLoader=True
ABMPageTemplate.bas[67] page.PageHTMLName = {10}
ABMPageTemplate.bas[68] page.PageTitle = {11}
ABMPageTemplate.bas[69] page.PageDescription = {12}
ABMPageTemplate.bas[70] page.PageKeywords = {13}
ABMPageTemplate.bas[71] page.PageSiteMapPriority = {14}
ABMPageTemplate.bas[72] page.PageSiteMapFrequency = ABM.SITEMAP_FREQ_YEARLY
ABMPageTemplate.bas[73]
ABMPageTemplate.bas[74] page.ShowConnectedIndicator = True
ABMPageTemplate.bas[75]
ABMPageTemplate.bas[76] ' adding a navigation bar
ABMPageTemplate.bas[77] Main.BuildNavigationBar(page, {15} , {16} , {17} , {18} , {19} )
ABMPageTemplate.bas[78]
ABMPageTemplate.bas[79] ' create the page grid, here we create 5 rows, each with one cell of 12 columns wide.
ABMPageTemplate.bas[80] page.AddRowsM(5,True,0,0, {20} ).AddCells12MP(1,0,0,0,0, {21} )
ABMPageTemplate.bas[81] page.BuildGrid 'IMPORTANT once you loaded the complete grid AND before you start adding components
ABMPageTemplate.bas[82]
ABMPageTemplate.bas[83] End Sub
ABMPageTemplate.bas[84]
ABMPageTemplate.bas[85] ' MUST be in here
ABMPageTemplate.bas[86] public Sub ConnectPage()
ABMPageTemplate.bas[87] ' connecting the navigation bar
ABMPageTemplate.bas[88] Main.ConnectNavigationBar(page)
ABMPageTemplate.bas[89]
ABMPageTemplate.bas[90] ' ----------- do your stuff like adding components to your grid, created in BuildPage
ABMPageTemplate.bas[91] Dim input As ABMInput
ABMPageTemplate.bas[92] input.Initialize(page, {22} , ABM.INPUT_TEXT, {23} , False, {24} )
ABMPageTemplate.bas[93] page.Cell(1,1).AddComponent(input)
ABMPageTemplate.bas[94]
ABMPageTemplate.bas[95] Dim button As ABMButton
ABMPageTemplate.bas[96] button.InitializeFlat(page, {25} , {26} , {27} , {28} , {29} )
ABMPageTemplate.bas[97] page.Cell(2,1).AddComponent(button)
ABMPageTemplate.bas[98] ' -----------
ABMPageTemplate.bas[99]
ABMPageTemplate.bas[100] ' refresh the page
ABMPageTemplate.bas[101] page.Refresh
ABMPageTemplate.bas[102] ' Tell the browser we finished loading
ABMPageTemplate.bas[103] page.FinishedLoading
ABMPageTemplate.bas[104] ' restoring the navigation bar position
ABMPageTemplate.bas[105] page.RestoreNavigationBarPosition
ABMPageTemplate.bas[106] End Sub
ABMPageTemplate.bas[107]
ABMPageTemplate.bas[108] Sub button_Clicked(Target As String)
ABMPageTemplate.bas[109] ' get the input compoent
ABMPageTemplate.bas[110] Dim input As ABMInput = page.Component( {30} )
ABMPageTemplate.bas[111] If input.Text = {31} Then
ABMPageTemplate.bas[112] ToastId = ToastId + 1
ABMPageTemplate.bas[113] page.ShowToast(ToastId, {32} , {33} , 5000, False)
ABMPageTemplate.bas[114] Return
ABMPageTemplate.bas[115] End If
ABMPageTemplate.bas[116]
ABMPageTemplate.bas[117] page.Msgbox( {34} , {35} & input.Text & {36} , {37} , {38} , False, ABM.MSGBOX_POS_CENTER_CENTER, {39} )
ABMPageTemplate.bas[118] End Sub
ABMPageTemplate.bas[119]
ABMPageTemplate.bas[120] ' result of clicking the close button on the messagebox
ABMPageTemplate.bas[121] Sub Page_MsgboxResult(returnName As String, result As String)
ABMPageTemplate.bas[122] Select Case returnName
ABMPageTemplate.bas[123] Case {40}
ABMPageTemplate.bas[124] Dim input As ABMInput = page.Component( {41} )
ABMPageTemplate.bas[125] input.Text = {42}
ABMPageTemplate.bas[126] input.Refresh
ABMPageTemplate.bas[127] End Select
ABMPageTemplate.bas[128] End Sub
ABMPageTemplate.bas[129]
ABMPageTemplate.bas[130] ' clicked on the navigation bar
ABMPageTemplate.bas[131] Sub Page_NavigationbarClicked(Action As String, Value As String)
ABMPageTemplate.bas[132] ' saving the navigation bar position
ABMPageTemplate.bas[133] page.SaveNavigationBarPosition
ABMPageTemplate.bas[134] If Action = {43} Then
ABMPageTemplate.bas[135] Main.LogOff(page)
ABMPageTemplate.bas[136] Return
ABMPageTemplate.bas[137] End If
ABMPageTemplate.bas[138]
ABMPageTemplate.bas[139] Main.Server.NavigateToPage(ws, ABMPageId, Value)
ABMPageTemplate.bas[140] End Sub
ABMPageTemplate.bas[141]
ABMPageTemplate.bas[142] Sub Page_FileUploaded(FileName As String, success As Boolean)
ABMPageTemplate.bas[143]
ABMPageTemplate.bas[144] End Sub
ABMPageTemplate.bas[145]
Analysing: Template.b4j
Template.b4j[0] AppType=StandardJava
Template.b4j[0] Build1=Default,com.ab.template
Template.b4j[0] Group=Default Group
Template.b4j[0] Library1=jcore
Template.b4j[0] Library2=jserver
Template.b4j[0] Library3=javaobject
Template.b4j[0] Library4=jsql
Template.b4j[0] Library5=abmaterial4.30
Template.b4j[0] Library6=abmserver
Template.b4j[0] Module1=ABMCacheV3
Template.b4j[0] Module2=ABMPageTemplate
Template.b4j[0] NumberOfFiles=0
Template.b4j[0] NumberOfLibraries=6
Template.b4j[0] NumberOfModules=2
Template.b4j[0] Version=8.1
Template.b4j[0] @EndOfDesignText@
Template.b4j[1] 'Non-UI application (console / server application)
Template.b4j[2] #Region Project Attributes
Template.b4j[3] #CommandLineArgs:
Template.b4j[4] #MergeLibraries: True
Template.b4j[5] #End Region
Template.b4j[6]
Template.b4j[7] Sub Process_Globals
Template.b4j[8] Public Server As ABMServer
Template.b4j[9] Public MyTheme As ABMTheme
Template.b4j[10] Public ABM As ABMaterial 'ignore
Template.b4j[11] End Sub
Template.b4j[12]
Template.b4j[13] Sub AppStart (Args() As String)
Template.b4j[14] ' must be the first line in AppStart. DO NOT DELETE OR CHANGE!
Template.b4j[15] ' ------------------------------------------------------------
Template.b4j[16] ABM.SessionCacheControlV3 = {0}
Template.b4j[17] ' ------------------------------------------------------------
Template.b4j[18]
Template.b4j[19] Dim DonatorKey As String = {1}
Template.b4j[20] Server.Initialize( {2} , DonatorKey, {3} ) ' Application = ' the handler that will be used in the url e.g. http://localhost:51042/template
Template.b4j[21] ' some parameters
Template.b4j[22] Server.Port = 51042
Template.b4j[23] ' the user needs to login, set to true. the CheckLogin() method will be called if one tries to login
Template.b4j[24] Server.NeedsAuthorization = False
Template.b4j[25] Server.StartPage = {4} ' the first page of your app
Template.b4j[26] Server.CacheScavengePeriodSeconds = 15 * 30 ' 15 minutes
Template.b4j[27] Server.SessionMaxInactiveIntervalSeconds = 30 * 60 ' 30 minutes
Template.b4j[28] Server.UploadFolder = {5}
Template.b4j[29] Server.UploadMaxSize = 1024 * 1024
Template.b4j[30]
Template.b4j[31] ' Build the Theme
Template.b4j[32] BuildTheme( {6} )
Template.b4j[33]
Template.b4j[34] ' create the pages
Template.b4j[35] Dim myPage As ABMPageTemplate
Template.b4j[36] myPage.Initialize
Template.b4j[37] ' add the pages to the app
Template.b4j[38] Server.AddPage(myPage.page)
Template.b4j[39] ' do the same for your own pages: dim, initialize and Server.AddPage
Template.b4j[40] ' ...
Template.b4j[41]
Template.b4j[42] ' start the server
Template.b4j[43] If Server.PortSSL <> 0 Then
Template.b4j[44] Server.StartServerHTTP2( {7} , {8} , {9} )
Template.b4j[45] Else
Template.b4j[46] Server.StartServer
Template.b4j[47] End If
Template.b4j[48]
Template.b4j[49] ' redirect the output of the logs to a file if in release mode
Template.b4j[50] Server.RedirectOutput(File.DirApp, {10} )
Template.b4j[51]
Template.b4j[52] StartMessageLoop
Template.b4j[53] End Sub
Template.b4j[54]
Template.b4j[55] #region If NeedsAuthorization = true
Template.b4j[56] public Sub CheckLogin(login As String, Password As String) As Boolean
Template.b4j[57] ' check if the login is valid and return true if it does
Template.b4j[58] If login = {11} And Password = {12} Then
Template.b4j[59] Return True
Template.b4j[60] End If
Template.b4j[61]
Template.b4j[62] Return False
Template.b4j[63] End Sub
Template.b4j[64]
Template.b4j[65] Sub LogOff(page As ABMPage) 'ignore
Template.b4j[66] ' do whatever you have to do to log off your user
Template.b4j[67]
Template.b4j[68] page.ws.Session.SetAttribute( {13} , {14} )
Template.b4j[69] Server.NavigateToPage(page.ws, page.GetPageID, {15} )
Template.b4j[70] End Sub
Template.b4j[71] #end region
Template.b4j[72]
Template.b4j[73] ' build global themes for ABM objects
Template.b4j[74] #region Themes
Template.b4j[75] Sub BuildTheme(themeName As String)
Template.b4j[76] MyTheme.Initialize(themeName)
Template.b4j[77]
Template.b4j[78] ' the page theme
Template.b4j[79] MyTheme.Page.BackColor = ABM.COLOR_WHITE
Template.b4j[80]
Template.b4j[81] ' the navigation bar theme
Template.b4j[82] MyTheme.AddNavigationBarTheme( {16} )
Template.b4j[83] MyTheme.NavigationBar( {17} ).TopBarZDepth = ABM.ZDEPTH_1
Template.b4j[84] End Sub
Template.b4j[85] #end region
Template.b4j[86]
Template.b4j[87] #Region Navigation Bar
Template.b4j[88]
Template.b4j[89] Sub BuildNavigationBar(page As ABMPage, Title As String, logo As String, ActiveTopReturnName As String, ActiveSideReturnName As String, ActiveSideSubReturnName As String) 'ignore
Template.b4j[90] ' we have to make an ABMImage from our logo url
Template.b4j[91] Dim sbtopimg As ABMImage
Template.b4j[92] sbtopimg.Initialize(page, {18} , logo, 1)
Template.b4j[93] sbtopimg.SetFixedSize(236, 49)
Template.b4j[94]
Template.b4j[95] page.NavigationBar.Initialize(page, {19} , ABM.SIDEBAR_MANUAL_HIDEMEDIUMSMALL, Title, True, True, 330, 48, sbtopimg, ABM.COLLAPSE_ACCORDION, {20} )
Template.b4j[96]
Template.b4j[97] page.NavigationBar.TopBarDropDownConstrainWidth = False
Template.b4j[98] page.NavigationBar.ActiveTopReturnName = ActiveTopReturnName
Template.b4j[99] page.NavigationBar.ActiveSideReturnName = ActiveSideReturnName
Template.b4j[100] page.NavigationBar.ActiveSideSubReturnName = ActiveSideSubReturnName
Template.b4j[101]
Template.b4j[102] ' you must add at least ONE dummy item if you want to add items to the topbar in ConnectNaviagationBar
Template.b4j[103] page.NavigationBar.AddTopItem( {21} , {22} , {23} , {24} , False)
Template.b4j[104]
Template.b4j[105] ' you must add at least ONE dummy item if you want to add items to the sidebar
Template.b4j[106] page.NavigationBar.AddSideBarItem( {25} , {26} , {27} , {28} )
Template.b4j[107]
Template.b4j[108] End Sub
Template.b4j[109]
Template.b4j[110] Sub ConnectNavigationBar(page As ABMPage) 'ignore
Template.b4j[111] ' Clear the dummies we created in BuildNavigationBar
Template.b4j[112] page.NavigationBar.Clear
Template.b4j[113]
Template.b4j[114] ' add the menus to your sidebar
Template.b4j[115] ' examples
Template.b4j[116] page.NavigationBar.AddSideBarItem( {29} , {30} , {31} , {32} )
Template.b4j[117] 'page.NavigationBar.AddSideBarItem( {33} , {34} , {35} , {36} )
Template.b4j[118] 'page.NavigationBar.AddSideBarItem( {37} , {38} , {39} , {40} )
Template.b4j[119] 'page.NavigationBar.AddSideBarItem( {41} , {42} , {43} , {44} )
Template.b4j[120] 'page.NavigationBar.AddTopItemWithSideBar( {45} , {46} , {47} , {48} , ABM.VISIBILITY_ALL, sb)
Template.b4j[121]
Template.b4j[122] page.NavigationBar.Refresh ' IMPORTANT
Template.b4j[123] End Sub
Template.b4j[124] #End Region
Template.b4j[125]
Template.b4j[126]
Template.b4j[127]
Template.b4j[128]
Template.b4j[129]
Template.b4j[130]
Template.b4j[131]
Template.b4j[132]
 

OliverA

Expert
Licensed User
Longtime User
2. Unzip and copy ALL .jar and .xml files from the \Library\ folder to your B4J Libraries folder
So this is the libraries folder for B4J itself, in my case C:\Program Files (x86)\Anywhere Software\B4J\Libraries.
Is this correct? Actually I have put them there and when that did not work I also tried them in the additional
libraries folder.
Put them in you additional libraries folder
Do I need to unzip and or put the ABMaterial4.30.zip file somewhere in particular?
No
 
Top