Share My Creation [BANanoWebix] An OpenSource Webix UX Wrapper for BANano

Ola

**NB: BANanoPostProcessor: The BP used in some of the examples is an updated version of what Kiffi did in the forum. The examples are old and have not been maintained due to time challenges as the focus has been to maintain the core library and other things. Due to enhancements in BANano, this means you can un-reference it and comment out the code that uses it for BANanoWebix. This will not have any effect on your app.

Here are the revised procedures...

Step 1:
Download BANano

Step 2:
Download Webix GPL License - OpenSource or
Download Webix Pro Trial Version

Step 3:
Download BANanoWebix

3.1 Copy the contents of the 1. Libraries folder to your B4J external libraries

3.2. From your Webix download, copy the webix.js and webix.css files to the Files folder of the BANanoWebix project folder

3.3 Open BANanoWebix project and run it in release mode (DO NOT COMPILE TO LIBRARY) and ensure BANanoWebix.b4xlib is created! This will be stored in your additional libraries folder

bananowebix.png


Step 4

Open BANanoWebixApp, this should have the project references established and run it in release mode.

bananowebixapp.png


5. On execution, the web-browser should be opened with the localhost file. Your b4j logs will have some details, this is normal. It might look like this..

logs.png


From the Demos, I have selected charts. I am running a laragon webserver. You can also publish to Xamp. The Chrome Web-browser does not support PHP thus Im not using it for tests.

DemoCharts.png


Congrats, you have setup BANanoWebix for use!

Using BANanoWebix

New: BANanoWebix App Creation Process

webix.png


Development Servers you can use

1. XAMPP
2. Laragon

The 32 bit version of laragon is available here, https://sourceforge.net/projects/laragon/files/releases/4.0/laragon-wamp.x86.exe

Reproduction:


If you are using XAMP, comment out the line that publishes to laragon on Main.AppStart

B4X:
Sub AppStart (Form1 As Form, Args() As String)
    Publish = "C:\xampp\htdocs"
    Publish = "C:\laragon\www"

Now Featuring a Form Designer that generates source code you can use in your B4J Project



An Object Oriented UX library for BANano [BANanoWebix]
Show a progressbar on long processes [BANanoWebix]
WixPivot on PRO [OffTopic] [BANanoWebix]
App Creation Process: The BackEnd with BANanoSQL [BANanoWebix]
App Creation Process: The UI [BANanoWebix]
Creating a Multi-Page Interface in a SPA [BANanoWebix]
Creating Multi-Page Apps - Part 1 [BANanoWebix]
Creating Multi-Page Apps - Part 2 [BANanoWebix]
Creating Multi-Page Apps - Part 3 [BANanoWebix]
Creating Multi-Page Apps - Part 4 [BANanoWebix]
Creating Multi-Page Apps - Part 5 [BANanoWebix]
Creating the Form Designer CRUD Backend BANanoSQL DB [BANanoWebix]
Dragging N Dropping Things with the Form Designer [BANanoWebix]
Form Builder / Designer [BANanoWebix]
Lesson 1 - Understanding the layout of a Webix SPA [BANanoWebix]
Lesson 2: Understanding the 6 layout types [BANanoWebix]
Lesson 3: Let's create some accordions [BANanoWebix]
Lesson 4: Carousels, MultiView & TabView [BANanoWebix]
Lesson 5: Creating ToolBars [BANanoWebix]
Lesson 6.X Form Validation [BANanoWebix]
Lesson 6: Form Data Entry Elements [BANanoWebix]
Lesson 7: Charts - Part 1 [BANanoWebix]
Lesson 8.1 The DataTable/DataGrid [BANanoWebix]
Lesson 8.2. The DataTable/DataGrid [BANanoWebix]
Lesson 8.3 Datatable Pagination & Exporting to XLSX, PNG, PDF and CSV [BANanoWebix]
Lesson 8.4 Enhanced Data-Table [BANanoWebix]
Lesson 9: DataView [BANanoWebix]
Lesson 10 Lists [BANanoWebix]
Lesson 11 Unit List [BANAnoWebix]
Lesson 12: Property Sheet [BANanoWebix]
Lesson 13 The TreeView [BANanoWebix]
Lesson 14 - The TreeTable [BANanoWebix]
Lesson 15 Menus & Windows [BANanoWebix]
Lesson 16 - The Sidebar [BANanoWebix]
Lesson 17 - Comments / Chat Widget [BANanoWebix]
Lesson 18 GroupList [BANanoWebix]
Lesson 19 Contexts [BANanoWebix]
Lesson 20 Google Map [BANAnoWebix]
Lesson 21 TabBar [BANanoWebix]
Lesson 22 - Method 3 [DropZone] [BANanoWebix]
Lesson 22 Uploader - Method 1 [BANanoWebix]
Lesson 22 Uploader Method 2 [BANanoWebix]
Lesson 23 WixVideo [BANanoWebix]
Lesson 24 ScrollView [BANanoWebix]
Lesson 25 Template [BANanoWebix]
Lesson 28 Suggestions [BANanoWebix]
Lesson 29 MessageBoxes [BANanoWebix]
Lesson 30 WixHints [BANanoWebix]
Lesson 31 WixImage [BANanoWebix]


For a long long long while I have been very curios about Webix, It reminded me of my days when I was doing ASP.Net with Ext.JS many many moons aho. That helped me create my first web database application with SQL as a backend back in 2009. A lot of VB.Net code that was... It was marvelous and I was the happiest man in the world, king of the world. It so amazing how the excitement of achieving something as a first "Hellow World" app running without hurdles. Just like when I first wrote my first Android app with B4A many years back.

So today I spent time time to feed that curiosity and with my question being can I achieve this with BANano? I am happily surprised and satisfied that I was able to pull it off, and I had to take everything I tend to think about HTML out of the window for a while to Object Orientation.

I made mistakes, rewrote stuff, debugged a lot, but hey, ended up with a single component class to rule them all.

What I liked most was that all this was done without a single HTML element being created by me. I'm basically using Lists and Maps all the way. Everything is an object and Webix just renders, creates the datasource links automatically. Basically I just had to worry about the look and feel of the app.

So I followed their example, tried to understand the logic of what they did things and came up with my own flavor of implementation.

Webix.png

As their lib is quiet huge, this just for me meant that its possible and if I want to explore more of their candy, I continue on the trend, there are a lot of things I like about it though and well, their price is not as welcoming. Yes for internal company apps and open source apps, the moon is no longer the limit. Anything commercial should be licensed.

Exporting Offline: BANanoWebix 1.04+

The current implementation of BANanoWebix is able to export to excel, pdf etc only when you are connected to the internet.

To be able to export offline without an internet connection there is about 6MB of resources needed as discussed here.

In BANanoWebix, this is how this has been implemented..

1. Unzip the extras folders to your project build folder.

B4X:
BP.UnzipFonts
    BP.UnzipFile("extras.zip")

2. On the page where you will use exporting, after page initialize

B4X:
pg.Initialize("wp", pgContainer).SetHeader("Lesson 8.3 Datatable Pager").SetResponsive("master")
    pg.SetExtrasFolder("http://localhost/bananowebixdemo/extras")
    '

Execute .SetExtrasFolder

Use your own PROJECTNAME for bananowebixdemo

Developing an app

In their example, this is the structure of the Basic App.

B4X:
webix.ui({
    width:500,
    rows:[
        {
            view:"toolbar", elements:[
                { view:"button", value:"Add", width:100 },
                { view:"button", value:"Delete", width:100 }
            ]
        },
        {
            height:120, cols:[
                {
                    view:"form", elements:[
                        { view:"text", placeholder:"Title" },
                        { view:"text", placeholder:"Year" }
                    ]
                },
                {
                    view:"list",
                    template:"#title# - #year#", // which data to show
                    select:true, //enables selection
                    height:400,
                    data:[
                        { id:1, title:"The Shawshank Redemption", year:1994 },
                        { id:2, title:"The Godfather", year:1972 },
                        { id:3, title:"The Godfather: Part II", year:1974 },
                        { id:4, title:"The Good, the Bad and the Ugly", year:1966 },
                        { id:5, title:"My Fair Lady", year:1964 },
                        { id:6, title:"12 Angry Men", year:1957 }
                    ]
                }
            ]
        }
    ]
});


So here is my BANano_Ready to generate same...

B4X:
Sub BANano_Ready()
    Dollar.Initialize("$$")
    pg.Initialize("mashy")
    pg.Content.TypeOf = "line"
    '*** define row 1
    'add toolbar
    Dim R1 As WixRow
    R1.Initialize("R1")
    'R1.Template = R1.ID

    Dim hdr As WixHeader
    hdr.Initialize("hdr", "My First Webix App")
    R1.AddItem(hdr.Item)

    Dim tblBar As WixToolBar
    tblBar.Initialize("tblBar")
    tblBar.AddButton("btnSave","Save",70, BANano.CallBack(Me,"save_row",Null))
    tblBar.AddButton("btnDelete", "Delete", 70, BANano.CallBack(Me,"delete_row",Null))
    tblBar.AddButton("btnClear", "Clear", 95, BANano.CallBack(Me,"clear_form",Null))
    R1.AddItem(tblBar.Item)
    'add rows to the page
    pg.AddRow(R1)

    Dim R2 As WixRow
    R2.Initialize("R2")

    Dim R2C1 As WixColumn
    R2C1.Initialize("R2C1")
    'R2C1.Template = R2C1.ID

    'add form
    myForm.Initialize(Dollar, "myform",300)
    myForm.AddTextBox("title","Title",280,"left")
    myForm.AddTextBox("year", "Year",280,"left")
    R2C1.AddItem(myForm.Item)
    'add r2c1 to row
    R2.AddColumn(R2C1)

    Dim R2C2 As WixColumn
    R2C2.Initialize("R1C2")
    'R2C2.Template = R2C2.id
    'add a list

    Dim filmset As List
    filmset.Initialize
    filmset.Add(CreateMap("id":1, "title":"The Shawshank Redemption", "year":1994))
    filmset.Add(CreateMap("id":2, "title":"The Godfather", "year":1972))
    filmset.Add(CreateMap("id":3, "title":"The Godfather: Part II", "year":1974))
    filmset.Add(CreateMap("id":4, "title":"The Good, the Bad and the Ugly", "year":1966))
    filmset.Add(CreateMap("id":5, "title":"My Fair Lady", "year":1964))
    filmset.Add(CreateMap("id":6, "title":"12 Angry Men", "year":1957))

    Dim recID As String
    myList.Initialize(Dollar, "myList")
    myList.Template = "#title# - #year#"
    myList.EnableSelect = True
    myList.Height = 400
    myList.data = filmset
    myList.onAfterSelect = BANano.CallBack(Me,"record_selected",Array(recID))
    '
    R2C2.AddItem(myList.Item)
    '
    R2.AddColumn(R2C2)
    '
    pg.AddRow(R2)
    '
    pg.UI
    'attach the select event
    myList.AttachAfterSelectEvent
End Sub
 
Last edited:

Mashiane

Expert
Licensed User
Spinnet: Responsive Form Demo, Setting Styles, Rows and Columns

The project below shows how to create a responsive form in a multi-page application. What we do is to create an app with 2 pages. One has a form and the other has a label. We also use a toolbar and add a header to it that we style to have a bigger font and add an image to the right side of the toolbar using a spacer.

For this exercise we are not using a grid.

Responsive.gif


modSideBar - the code in this module creates the sidebar of the application. This has the various navigation buttons for our app on the far left.

In the other modules there are 2 very important methods.

B4X:
Sub AddPage(pg As WixPage, mv As WixMultiView)
    Page = pg
    'create a page
    Dim a As WixLayout
    a.Initialize("mv_companies").SetTemplate("Almacena información de Compañías").SetTypeLine("")
    'add a form to the row
    a.AddRows(CreateForm.Item)
    'add page to multiview
    mv.AddItem(a.Item)
End Sub

Sub ShowPage(pg As WixPage)
    Page = pg
    Page.Show("mv_companies")
    Page.Clear("formcompanies")
    Page.ClearValidation("formcompanies")
End Sub

One method is to add a page i.e. to the multi-view component and the other method to show it whenever a navigation button is clicked. In the sidebar code, we assigned a click event to the sidebar. Each time an element is clicked, we detect its 'identifier' and then show the appropriate page in the multi-view component.

B4X:
Sub sm_click(meid As String)
    Select Case meid
    Case "arc_clienti"
        modClient.ShowPage(Page)
    Case "arc_prodotti"
        modArchivi.ShowPage(Page)
    Case "utility_backup"
    Case "utility_restore"
    End Select
End Sub

The main method that does everything here is in pgIndex.init("body")

B4X:
Sub Init(pgContainer As String)
    pg.Initialize("index", pgContainer)
    '
    Dim tblBar As WixToolBar
    tblBar.Initialize("tblBar")
    tblBar.SetHeight(100)
    tblBar.SetStyles(CreateMap("background": "#ffffff !important"))
    tblBar.CreateIcon("menuopen").SetIcon("mdi mdi-menu").SetStyles(CreateMap("background": "#eeeeee")).SetClick(BANano.CallBack(Me, "OpenMenu", Null)).Pop
    tblBar.CreateHeader("heading").SetBorderless(True).SetTemplate("My Webix App").SetStyles(CreateMap("height":"100%","vertical-align":"middle !important","font-size": "32px !important")).Pop
    tblBar.AddColumns(CreateMap())
    tblBar.CreateImage("logo").SetWidth(150).SetValue("./assets/pexels-photo-2879991.jpeg").pop
    
    Log(pg.Map2JsonPretty(tblBar.Item))
    
    
    pg.AddRows(tblBar.Item)
    '
    Dim R2 As WixRow
    R2.Initialize("R2")
    R2.AddColumns(modSideBar.Create(pg))
    'master multi page view to host all other pages
    'create a multiview pager
    Dim mv As WixMultiView
    mv.Initialize("mymv")
    modClient.AddPage(pg, mv)
    modArchivi.AddPage(pg, mv)
    
    
    'add multiview pager to the page
    R2.AddColumns(mv.item)
    pg.AddRow(R2)
    '
    'build the ui
    pg.UI
    '
    modClient.showpage(pg)
End Sub

1. When this starts the contents of the module are rendered in the "body" element of the page.
2. A toolbar is created and we use the .SetStyles() method to change the background of the toolbar.
3. An icon is added that when clicked it will toggle the sidebar
4. We then add a header to the toolbar and then add a spacer and then
5. Add an image.

We then add the toolbar to the first row in our page.

We then create another row and in this column we add the sidebar and then add the multi-view control to the second row. We add the details of the row to the page row collection.

We build the UI and then show the necessary starting page.

PS: this also demonstrates the latest methodology in creating multi-page apps using the Multiview element.

Ta!
 

Attachments

  • ResponsiveForm.zip
    272.3 KB · Views: 228

Mashiane

Expert
Licensed User
BANanoWebix 2.28

Important Additions to the library

1. SetStyles(Map) - this is used to set multiple css styles of any element.

B4X:
.SetStyles(CreateMap("height":"100%","vertical-align":"middle !important","font-size": "32px !important"))

2. SetAttributes(Map) - used to set multiple attributes for any element. Usage is same as .SetStyles (without the '!important' word)

Other bug fixes and improvement

Get it here, https://github.com/Mashiane/BANanoWebix
 

Mashiane

Expert
Licensed User
BANanoWebix 2.32

A Reminder:


1. If you don't have Webix, download webix standard from here, https://webix.com/get-webix-gpl/. After registration they will send you an email.
2. From that email locate webix.js and webix.min.css.
3. Copy these to the BANanoWebix\Files folder
4. Rename the webix.js file to webix.min.js
5. Open the BANanoWebix project and run it in B4J. This will compile the BANanoWebix Library. It should be 2.32
6. Open the BANanoWebixApp project and run it in B4J, select Demos to explore the demos.

Download BANanoWebix

Important: Using MSSQL as a backend for your BANanoWebix Apps.

This update includes the BANanoMSSQL class file so that one can use the form designer for BANanoWebix. So an option to use MSSQL as a backend for your BANAnoWebix projects is now available when selecting databases on the form designer.

WixCalendar

WixCalendar.gif


With the calendar one is able to select a single / multiple dates. This is lesson 32 in the Demo. Here is an example..

B4X:
Dim isHoliday As BANanoObject = pg.IsHoliday
    Dim df As BANanoObject = pg.NewDate(2016, 3, 16)
    Dim dt As BANanoObject = pg.NewDateTime(2019, 10, 28, 8, 10)

B4X:
Dim dp1 As WixCalendar
    dp1.Initialize("dp1").SetTimePicker(True).SetWeekHeader(True).SetDate(df)
    Dim value1 As Object
    dp1.OnChange(Me, "dp1_change", value1)
    dp1.SetEvents(isHoliday).AddToRows(frm.Form)

B4X:
Dim dp7 As WixCalendar
    dp7.initialize("dp7").SetWeekHeader(True).SetWeekNumber(True).SetEvents(isHoliday)
    dp7.SetDate(nd)
    dp7.SetMinDate("2015-04-05")
    dp7.SetMaxDate(md)
    dp7.SetWidth(290)
    dp7.SetIcons(True)
    dp7.SetTimePicker(True)
    dp7.SetMultiSelect("touch")
    Dim value2 As Object
    dp7.OnChange(Me, "dp7_change", value2)
    dp7.AddToRows(frm.Form)

Trapping the events

B4X:
Sub dp1_change(value As Object)
    Dim ds As String = pg.GetValueDate(value)
    Log(ds)
End Sub

Sub dp7_change(value As Object)
    Dim dates As String = pg.GetValueDates("dp7")
    Log(dates)
End Sub

You can also pre-select dates for the calendar (after pg.UI)

B4X:
pg.ui
    
    pg.SelectDate("dp1", pg.NewDate(2016, 3, 20), True)
    pg.SelectDates("dp7", Array("2015-04-13", "2015-04-14", "2015-04-15"))

VERY VERY IMPORTANT: CleanUp

Due to the structure of BANano, some cleanups on the resources included in this library was necessary. This sadly requires some manual intervention on your side. This affects the font files and cannot be done on my side as the css and js files you need to obtain from webix yourself for use.

1. Open webix.min.css in the BANanoWebix folder
2. Locate all URL(fonts text, and replace with URL(../fonts
3. Save the file, refresh your list files in B4X
4. Compile the BANanoWebix library.

For now that's all. Ta!

 

Mashiane

Expert
Licensed User
BANanoWebix now compiled with version 4.07 of BANano and B4J 8 Beta. Works as expected.

Get it here.

Some updates about using themes/skins

Webix comes with different themes that you can use. Go to the webix skin builder, https://webix.com/skin-builder/

themes.png


1. Select the skin you need in the Skin column and customize it as you need.
2. Click Download. This will download everything you need to work with your app.
3. Your download will have the webix.js and some other files as depicted below.

skinfiles.png


The version of webix.cs and webix.js files included here will be the latest versions of webix, currently 7.01.

4. Copy the files in your download to the BANanoWebix Library folder and compile the BANanoWebix library. This will replace the webix.css and webix.js files there

Using the BANAnoWebix 2.33 Library with a theme.

BANanoWebix has already been bundled with these theme files with the exception of the webix.js and webix.css files that you will get from your licensed version or from the download above. To use the themes, your code SHOULD be

Using the Contrast Theme

B4X:
BANano.Header.AddCSSFile("materialdesignicons.min.css")
    BANano.Header.AddCSSFile("contrast.min.css")
    BANano.Header.AddJavascriptFile("webix.js")
    BANano.Header.addjavascriptfile("contrast.skin.js")

Using the Material Theme

B4X:
BANano.Header.AddCSSFile("materialdesignicons.min.css")
    BANano.Header.AddCSSFile("material.min.css")
    BANano.Header.AddJavascriptFile("webix.js")
    BANano.Header.addjavascriptfile("material.skin.js")

Using the Compact Theme


B4X:
BANano.Header.AddCSSFile("materialdesignicons.min.css")
    BANano.Header.AddCSSFile("compact.min.css")
    BANano.Header.AddJavascriptFile("webix.js")
    BANano.Header.addjavascriptfile("compact.skin.js")

etc

Enjoy!
 

roberto64

Active Member
Licensed User
Hi Mashine, I'm trying BANanoWebixApp, I've done all the steps but give me all these errors how can I fix them?
regards

Waiting for debugger to connect...
Program started.
Reading B4J INI in C:\Users\roberto\AppData\Roaming\Anywhere Software\B4J to find Additional Libraries folder...
Found Additional Libraries folder: Z:\ANDROIDUT\AdditionalLibs
Building C:\laragon\www\BANanoWebixApp\scripts\app1574410770371.js
Loading library: Z:\ANDROIDUT\AdditionalLibs\B4J\bananopostprocessor.xml
Library: Z:\ANDROIDUT\AdditionalLibs\B4J\bananopostprocessor.xml is not a BANano library!
Loading library: Z:\ANDROIDUT\AdditionalLibs\B4J\bananowebix.xml
Z:\ANDROIDUT\AdditionalLibs\B4J\bananowebix.js is missing!
Z:\ANDROIDUT\AdditionalLibs\B4J\bananowebix.dependsOn is missing!
java.io.FileNotFoundException: Z:\ANDROIDUT\AdditionalLibs\B4J\bananowebix.dependsOn (Impossibile trovare il file specificato)
at java.base/java.io.FileInputStream.open0(Native Method)
at java.base/java.io.FileInputStream.open(FileInputStream.java:219)
at java.base/java.io.FileInputStream.<init>(FileInputStream.java:157)
at java.base/java.io.FileReader.<init>(FileReader.java:75)
at com.ab.banano.BANano.a(Unknown Source)
at com.ab.banano.BANano.a(Unknown Source)
at com.ab.banano.BANano.b(Unknown Source)
at com.ab.banano.BANano.Build(Unknown Source)
at b4j.example.main._appstart(main.java:264)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.base/java.lang.reflect.Method.invoke(Method.java:566)
at anywheresoftware.b4a.shell.Shell.runMethod(Shell.java:632)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:234)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:167)
at jdk.internal.reflect.GeneratedMethodAccessor1.invoke(Unknown Source)
at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.base/java.lang.reflect.Method.invoke(Method.java:566)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:91)
at anywheresoftware.b4a.shell.ShellBA.raiseEvent2(ShellBA.java:98)
at anywheresoftware.b4a.BA.raiseEvent(BA.java:78)
at b4j.example.main.start(main.java:38)
at javafx.graphics/com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$9(LauncherImpl.java:846)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runAndWait$12(PlatformImpl.java:455)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$10(PlatformImpl.java:428)
at java.base/java.security.AccessController.doPrivileged(Native Method)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$11(PlatformImpl.java:427)
at javafx.graphics/com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:96)
at javafx.graphics/com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
at javafx.graphics/com.sun.glass.ui.win.WinApplication.lambda$runLoop$3(WinApplication.java:174)
at java.base/java.lang.Thread.run(Thread.java:834)
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CheckInternetConnectionWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CheckInternetConnectionWait will not work in old browsers!
[WARNING]: The method CallAjaxWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
WARNING: The method cleardatabase in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
cleardatabaseWait()
[WARNING]: The method cleardatabase will not work in old browsers!
WARNING: The method foreignkeyregister in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
foreignkeyregisterWait()
[WARNING]: The method foreignkeyregister will not work in old browsers!
WARNING: The method localize in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
localizeWait()
[WARNING]: The method localize will not work in old browsers!
WARNING: The method importfk in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importfkWait()
[WARNING]: The method importfk will not work in old browsers!
WARNING: The method importfd in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importfdWait()
[WARNING]: The method importfd will not work in old browsers!
WARNING: The method importdb in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importdbWait()
[WARNING]: The method importdb will not work in old browsers!
WARNING: The method importfielddescriptions in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importfielddescriptionsWait()
[WARNING]: The method importfielddescriptions will not work in old browsers!
WARNING: The method importforeignkeys in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importforeignkeysWait()
[WARNING]: The method importforeignkeys will not work in old browsers!
WARNING: The method importsqlite in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importsqliteWait()
[WARNING]: The method importsqlite will not work in old browsers!
[WARNING]: The method refreshtreewait will not work in old browsers!
[WARNING]: The method addprimarykeywait will not work in old browsers!
[WARNING]: The method prop_savewait will not work in old browsers!
[WARNING]: The method saveelementwait will not work in old browsers!
[WARNING]: The method clearform1wait will not work in old browsers!
[WARNING]: The method clearform2wait will not work in old browsers!
[WARNING]: The method deletepropwait will not work in old browsers!
[WARNING]: The method tree_clickwait will not work in old browsers!
WARNING: The method updateforeignlinks in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
updateforeignlinksWait()
[WARNING]: The method updateforeignlinks will not work in old browsers!
WARNING: The method tablevuemobile in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
tablevuemobileWait()
[WARNING]: The method tablevuemobile will not work in old browsers!
WARNING: The method tableschema in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
tableschemaWait()
[WARNING]: The method tableschema will not work in old browsers!
WARNING: The method field_edit in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
field_editWait()
[WARNING]: The method field_edit will not work in old browsers!
[WARNING]: The method formcodewait will not work in old browsers!
[WARNING]: The method collabwait will not work in old browsers!
[WARNING]: The method sidebar_clickwait will not work in old browsers!
[WARNING]: The method btnmulti_clickwait will not work in old browsers!
[WARNING]: The method btnmulti1_clickwait will not work in old browsers!
[WARNING]: The method collabwait will not work in old browsers!
[WARNING]: The method updatelist1wait will not work in old browsers!
WARNING: The method cleardatabase in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
cleardatabaseWait()
WARNING: The method foreignkeyregister in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
foreignkeyregisterWait()
WARNING: The method localize in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
localizeWait()
WARNING: The method importfk in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importfkWait()
WARNING: The method importfd in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importfdWait()
WARNING: The method importdb in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importdbWait()
WARNING: The method importfielddescriptions in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importfielddescriptionsWait()
WARNING: The method importforeignkeys in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importforeignkeysWait()
WARNING: The method importsqlite in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
importsqliteWait()
WARNING: The method updateforeignlinks in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
updateforeignlinksWait()
WARNING: The method tablevuemobile in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
tablevuemobileWait()
WARNING: The method tableschema in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
tableschemaWait()
WARNING: The method field_edit in (MODULE: pgFD) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
field_editWait()
Copying CSS files to WebApp assets...
Copying Javascript files to WebApp assets...
Building C:\laragon\www\BANanoWebixApp\index.html

The total size of your local CSS and JS files is 2.9MB and another 9.6MB in other assets.
It is very important to only load the JS and CSS files from components that you actually use in your website/webapp!

If you are using public frameworks (like jQuery, Bootstrap, etc...), consider using their CDN so the browser can use already buffered versions.
Done!
 

Mashiane

Expert
Licensed User
Hi Mashine, I'm trying BANanoWebixApp, I've done all the steps but give me all these errors how can I fix them?
regards
Please always start a new thread with your issues and questions as its much easier. This thread is for posting anything that is BANanoWebix related. Please prefix your question with [BANanoWebix].

NB:

1. To compile BANanoWebix to a library, you need to run the BANanoWebix project. DO NOT "Compile to Library". It is a BANano b4xlib file and not a jar. That is how BANano works. If you have a BANanoWebix.jar file in your additional libraries folder, delete it.
 
Last edited:

roberto64

Active Member
Licensed User
Now I have created the BANanoWebix b4xlibs lib as per the instruction of the first pos, but still it tells me that it doesn't find Library: Z: ANDROIDUT Additional Libs B4J bananaopostprocessor.xml is not a BANano library! "Instead talelib exists, and also java. io.FileNotFoundException: C: Users Roberto Desktop BANANO ~ 2 444C6 ~ 1.BAN Objects b4xlibs_BANano bananowebix B4J manifest.txt (The path specified could not be found) "but also this lib exists in the project Objects ", what am I wrong now?
thanks for your commitment.
 

roberto64

Active Member
Licensed User
Hi, are all these errors possible? the page starts but it remains completely blank nothing appears.
regards
Reading B4J INI in C:\Users\Eoby\AppData\Roaming\Anywhere Software\B4J to find Additional Libraries folder...
Found Additional Libraries folder: D:\AdditionalLibs
Building C:\Users\Eoby\Desktop\usbwebserver_v8.6.2\root\WareHouse\scripts\app1575788023491.js
Loading library: D:\AdditionalLibs\B4J\bananopostprocessor.xml
Processing b4xlib: bananowebix
Library: D:\AdditionalLibs\B4J\bananopostprocessor.xml is not a BANano library!
java.io.FileNotFoundException: C:\Users\Eoby\Desktop\BANANO~1\444C6~1.BAN\Objects\b4xlibs_BANano\bananowebix\B4J\manifest.txt (Impossibile trovare il percorso specificato)
at java.base/java.io.FileInputStream.open0(Native Method)
at java.base/java.io.FileInputStream.open(FileInputStream.java:219)
at java.base/java.io.FileInputStream.<init>(FileInputStream.java:157)
at java.base/java.io.FileInputStream.<init>(FileInputStream.java:112)
at java.base/java.io.FileReader.<init>(FileReader.java:60)
at com.ab.banano.BANano.ProcessB4XLib(Unknown Source)
at com.ab.banano.BANano.a(Unknown Source)
at com.ab.banano.BANano.b(Unknown Source)
at com.ab.banano.BANano.Build(Unknown Source)
at b4j.example.main._appstart(main.java:101)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.base/java.lang.reflect.Method.invoke(Method.java:566)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:91)
at anywheresoftware.b4a.BA.raiseEvent(BA.java:78)
at b4j.example.main.start(main.java:37)
at javafx.graphics/com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$9(LauncherImpl.java:846)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runAndWait$12(PlatformImpl.java:455)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$10(PlatformImpl.java:428)
at java.base/java.security.AccessController.doPrivileged(Native Method)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$11(PlatformImpl.java:427)
at javafx.graphics/com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:96)
at javafx.graphics/com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
at javafx.graphics/com.sun.glass.ui.win.WinApplication.lambda$runLoop$3(WinApplication.java:174)
at java.base/java.lang.Thread.run(Thread.java:834)
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method CallInlinePHPWait will not work in old browsers!
[WARNING]: The method OpenWait will not work in old browsers!
[WARNING]: The method ExecuteWait will not work in old browsers!
WARNING: The method btnnewgodown_click in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
btnnewgodown_clickWait()
[WARNING]: The method btnnewgodown_click will not work in old browsers!
WARNING: The method btnsavegodown_click in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
btnsavegodown_clickWait()
[WARNING]: The method btnsavegodown_click will not work in old browsers!
WARNING: The method readgodown in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
readgodownWait()
[WARNING]: The method readgodown will not work in old browsers!
WARNING: The method godown_delete in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
godown_deleteWait()
[WARNING]: The method godown_delete will not work in old browsers!
WARNING: The method dtgodown_afteredit in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
dtgodown_aftereditWait()
[WARNING]: The method dtgodown_afteredit will not work in old browsers!
WARNING: The method loaddatatable in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
loaddatatableWait()
[WARNING]: The method loaddatatable will not work in old browsers!
WARNING: The method btnnewgodown_click in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
btnnewgodown_clickWait()
WARNING: The method btnsavegodown_click in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
btnsavegodown_clickWait()
WARNING: The method readgodown in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
readgodownWait()
WARNING: The method godown_delete in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
godown_deleteWait()
WARNING: The method dtgodown_afteredit in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
dtgodown_aftereditWait()
WARNING: The method loaddatatable in (MODULE: pgGoDown) uses Wait functions, but doesn't end itself with wait()
This will not work if compiled to a libray. You should call the method:
loaddatatableWait()
Copying CSS files to WebApp assets...
Problem copying all.min.css
java.io.FileNotFoundException: all.min.css
at anywheresoftware.b4a.objects.streams.File.OpenInput(File.java:209)
at anywheresoftware.b4a.objects.streams.File.Copy(File.java:336)
at com.ab.banano.BANano.Build(Unknown Source)
at b4j.example.main._appstart(main.java:101)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.base/java.lang.reflect.Method.invoke(Method.java:566)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:91)
at anywheresoftware.b4a.BA.raiseEvent(BA.java:78)
at b4j.example.main.start(main.java:37)
at javafx.graphics/com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$9(LauncherImpl.java:846)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runAndWait$12(PlatformImpl.java:455)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$10(PlatformImpl.java:428)
at java.base/java.security.AccessController.doPrivileged(Native Method)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$11(PlatformImpl.java:427)
at javafx.graphics/com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:96)
at javafx.graphics/com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
at javafx.graphics/com.sun.glass.ui.win.WinApplication.lambda$runLoop$3(WinApplication.java:174)
at java.base/java.lang.Thread.run(Thread.java:834)
Copying Javascript files to WebApp assets...
java.io.FileNotFoundException: webix.min.js
at anywheresoftware.b4a.objects.streams.File.OpenInput(File.java:209)
at anywheresoftware.b4a.objects.streams.File.Copy(File.java:336)
at com.ab.banano.BANano.Build(Unknown Source)
at b4j.example.main._appstart(main.java:101)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.base/java.lang.reflect.Method.invoke(Method.java:566)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:91)
at anywheresoftware.b4a.BA.raiseEvent(BA.java:78)
at b4j.example.main.start(main.java:37)
at javafx.graphics/com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$9(LauncherImpl.java:846)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runAndWait$12(PlatformImpl.java:455)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$10(PlatformImpl.java:428)
at java.base/java.security.AccessController.doPrivileged(Native Method)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$11(PlatformImpl.java:427)
at javafx.graphics/com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:96)
at javafx.graphics/com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
at javafx.graphics/com.sun.glass.ui.win.WinApplication.lambda$runLoop$3(WinApplication.java:174)
at java.base/java.lang.Thread.run(Thread.java:834)
Problem copying webix.min.js
Building C:\Users\Eoby\Desktop\usbwebserver_v8.6.2\root\WareHouse\index.html

The total size of your local CSS and JS files is 2.0MB and another 2.9MB in other assets.
It is very important to only load the JS and CSS files from components that you actually use in your website/webapp!

If you are using public frameworks (like jQuery, Bootstrap, etc...), consider using their CDN so the browser can use already buffered versions.
Done!
 

Mashiane

Expert
Licensed User
@roberto64 Can you please start a new thread about your issue and please explain how I can reproduce it the issues. Please post this under B4J questions and prefix it with [BANanoWebix]. This is the 3rd time I am requesting you to please not post questions and problems on this thread as this thread is for updates about the library and not questions.
 
Last edited:

Mashiane

Expert
Licensed User
Upcoming Changes: Detecting CheckBox changes with onItemClick

Procurement.gif


Just added the onItemClick event for the Checkbox. This helps when one wants to detect the changes in the checkbox. Please note there is an onChange event also.

The function added to BANanoWebix is...

B4X:
Sub SetOnItemClick(module As Object, MethodName As String) As WixCheckBox
    MethodName = MethodName.tolowercase
    Dim value As String
    Dim e As BANanoEvent
    Dim cb As BANanoObject = BANano.CallBack(module, MethodName, Array(value, e))
    On.Put("onItemClick", cb)
    Return Me
End Sub

Usage:

We first define the CheckBox.

B4X:
Dim stepdone As WixCheckBox
        stepdone.Initialize($"procprocess.${chkID}"$).SetName(chkID).SetLabelPosition("left").SetLabelWidth(250)
        stepdone.SetLabel(chkLabel).SetValue(False).SetCheckValue("Yes").SetUncheckValue("No")
        stepdone.SetOnItemClick(Me, "ppchange")
        r1.AddColumns(stepdone.Item)

Above there are multiple checkboxes and dates that I am defining based on steps that I have defined.

What ppChange does is to detect the value of the checkbox, if Yes, set today's date on the corresponding date control.

B4X:
Sub ppchange(id As String, e As BANanoEvent)
    'get the value
    Dim chkValue As String = Page.getvalue(id)
    'define the date value to update
    Dim datID As String = id.replace("done", "date")
    Select Case chkValue
    Case "yes","Yes"
        'set the date
        Page.setvalue(datID, Page.datenow)
    Case Else
        Page.setvalue(datID, "")
    End Select
End Sub

Let's look at the steps I'm talking about.

B4X:
Sub CreateProcurementProcess As WixForm
    Dim pp As WixForm
    pp.Initialize("procprocess")
    pp.SetScroll("y")
    pp.SetName("procprocess")
    pp.SetResponsive("true")
    pp.SetDefaultLabelWidth("120")
    pp.SetDefaultLabelPosition("top")
    '
    Dim steps As List
    steps.Initialize
    steps.add("Need analysis")
    steps.Add("Budget confirmation")
    steps.add("Preliminary relocation timelines")
    steps.add("Bid specification")
    steps.Add("RFQ")
    steps.add("Decision to proceed to RFP")
    steps.add("RFP evaluation")
    steps.Add("RFP adjudication")
    steps.add("Relocation team confirmation")
    steps.add("Final relocation plan")
    steps.add("Relocation")
        
    Dim cnt As Int = 0
    For Each ppstep As String In steps
        cnt = cnt + 1
        Dim chkLabel As String = $"${cnt}. ${ppstep} done"$
        Dim datLabel As String = $"${cnt}. ${ppstep} date"$
        Dim chkID As String = $"step${cnt}done"$
        Dim datID As String = $"step${cnt}date"$
        'create the control
        Dim r1 As WixLayout
        r1.initialize($"r${cnt}"$)
        Dim stepdone As WixCheckBox
        stepdone.Initialize($"procprocess.${chkID}"$).SetName(chkID).SetLabelPosition("left").SetLabelWidth(250)
        stepdone.SetLabel(chkLabel).SetValue(False).SetCheckValue("Yes").SetUncheckValue("No")
        stepdone.SetOnItemClick(Me, "ppchange")
        r1.AddColumns(stepdone.Item)
        '
        Dim stepdate As WixDatePicker
        stepdate.Initialize($"procprocess.${datID}"$).SetDisabled(True)
        stepdate.SetName(datID).SetType("text").SetFormat("%Y-%m-%d")
        stepdate.SetEditable(True).SetStringResult(True).SetLabel(datLabel)
        r1.AddColumns(stepdate.Item)
        pp.AddRows(r1.Item)
    Next
    '
    Dim procplannotes As WixTextArea
    procplannotes.Initialize("procprocess.procplannotes")
    procplannotes.SetName("procplannotes").SetLabel("Notes").SetHeight(200)
    pp.AddRows(procplannotes.Item)
    pp.AddRowsSpacer("")
    Return pp
End Sub

So for each checkbox we have procprocess.step1done and procprocess.step1date, procprocess.step2done and procprocess.step2date etc.

Watch this space!
 

Mashiane

Expert
Licensed User
Upcoming: Detecting CheckBox changes with onChange

The onchange event works the same way with the onItemClick event however it should be linked to 1 component unlike the onItemClick event.

Reference: https://docs.webix.com/api__link__ui.checkbox_onchange_event.html

BANanoWebix Change

B4X:
'expects id of element and event
Sub SetOnChange(module As Object, MethodName As String) As WixCheckBox
    MethodName = MethodName.tolowercase
    Dim newv As Object
    Dim oldv As Object
    Dim cb As BANanoObject = BANano.CallBack(module, MethodName, Array(newv, oldv))
    On.Put("onChange", cb)
    Return Me
End Sub

Implementation

B4X:
stepdone.SetOnChange(Me, "ppchange1")

Event

B4X:
Sub ppchange1(newv As String, oldv As String)
    Log(newv)
    Log(oldv)
End Sub
 

Toky Olivier

Active Member
Licensed User
Thank you for this huge work.
Just wondering, is it not possible to add something like Pace (https://github.hubspot.com/pace/docs/welcome/) while loading the page. On slow connections, there is only a blank page while downloading js and css.

EDIT: It was possible, I just created small library for it
B4X:
Sub AppStart (Form1 As Form, Args() As String)
    Publish = "C:\xampp\htdocs"
    Publish = "E:\SOFTS\UwAmpPortable\www"
    Dim version As String = DateTime.now
    Dim appFile As String = $"app${version}.js"$
    BANano.Initialize("BANano", AppName,1)
    BANano.HTML_NAME = "index.html"
    BANano.Header.Title = AppName
    BANano.JAVASCRIPT_NAME = appFile
    BANano.TranspilerOptions.UseServiceWorker = False
    BANano.Header.AddCSSFile("https://fonts.googleapis.com/css?family=Inconsolata:400,700|Poppins:400,400i,500,700,700i&amp;subset=latin-ext")
    BANano.Header.AddCSSFile("mini.min.css")
    BANano.Build(Publish)
   
    Pace.Initialize(File.Combine(Publish, AppName), BANano.HTML_NAME, BANano.SCRIPTS_FOLDER, BANano.STYLES_FOLDER)
    Pace.InstallPace(CreateMap("ajax": "true", "eventLag": "true"), Pace.PACE_CENTER_ATOM_THEME, "#EAA928")
    ExitApplication
End Sub
 

Attachments

  • BANanoPace B4J lib.zip
    13.2 KB · Views: 146
Last edited:

Mashiane

Expert
Licensed User
BANanoWebix already has a loader built into it. Identify the component you want the loader to be put in and call 2 methods, 1 to show and one to hide it.

For example, lets assume you have defined a component called "gridxx1" on your page. You want to show a loader for a long process.

On your button click

B4X:
Sub me_click(e as bananoevent)

pg.WorkingOnIt("gridxx1")   ' this will show a progress bar

.... a long process running

pg.DoneWorking("gridxx1")  ' this will hide a progressbar

End Sub

For more details also see this: https://docs.webix.com/desktop__progress.html
 
Top