Create New Page

Using Code Module

1. Click on Project > Add New > Code Module. Add a new module.

2. Enter the code for Page2.

'Static code module
Sub Process_Globals
	Private App As BANano 'ignore
End Sub

Sub Show
	' Get the body element of the page
	Dim body As BANanoElement = App.GetElement("#body")
	
	' Clear the body
	body.Empty
	
	' Add the Title
	body.Append("< h1>Page 2< /h1>")
	
	' Add a button
	Dim btn2 As BANanoElement = body.Append("< button id="btn2">Back to Main< /button>").Get("#btn2")
	
	' Add a click event to the button
	btn2.HandleEvents("click", Me, "btn2_click")
End Sub

Sub btn2_click(e As BANanoEvent)
	Main.Show
End Sub

3. Modify the code in Main module.

Sub Process_Globals
	Private App As BANano
	Private fx As JFX
End Sub

Sub AppStart (Form1 As Form, Args() As String)
	' Initialize banano object with event, appname (must not have space) and version
	App.Initialize("BANano", "www", 1)
	
	' The name of the html file
	App.HTML_NAME = "index.html"
	
	' The title of the page
	App.Header.Title = "My BANano App"

	' Add a Bootstrap CSS
	App.Header.AddCSSFile("bootstrap.min.css")
	
	' Transpile B4J code to html, css and javascript and store output in File.DirApp
	App.Build(File.DirApp)
	
	' The website will be loaded in \Objects\App where you saved your project
	Dim URL As String = File.GetUri(File.Combine(File.dirapp, "www"), "index.html")
	fx.ShowExternalDocument(URL)
	
	ExitApplication
End Sub

Sub BANano_Ready
	Show
End Sub

Sub Show
	' Get the body element of the page
	Dim body As BANanoElement = App.GetElement("#body")
	
	' Clear the body
	body.Empty
	
	body.AddClass("text-center")
	
	' Add the Title
	body.Append("< h1>Main Page< /h1>")
	' Add a button
	Dim btn1 As BANanoElement = body.Append("< button id="btn1">Go to Page 2< /button>").Get("#btn1")
	' Add a click event to the button
	btn1.HandleEvents("click", Me, "btn1_click")
End Sub

Sub btn1_click(e As BANanoEvent)
	Page2.Show
End Sub

4. Press F5 to run.

Leave a comment

Your email address will not be published. Required fields are marked *