Page 1 of 1
Control the generated html for a web app
Posted: Wed Dec 04, 2024 3:03 pm
by ricardo_sdl
How can I control the html file contents that encloses the game? Like in the picture below:
This is the current app generated with the "Create App" and choosing the "Web" option.
Let's say I want to add a banner on the top of the game, or links to the side of it. Or change the background.png image to something smaller and more related to the game in question.
Re: Control the generated html for a web app
Posted: Wed Dec 04, 2024 4:48 pm
by Peter
Personally, I would realise the design of the page completely with SpiderBasic in this case.
Example:
Code: Select all
EnableExplicit
Enumeration Windows
#Desktop
#GameWindow
EndEnumeration
Enumeration Gadgets
#Desktop_Header
#Desktop_Footer
#Desktop_LeftSideBar
#Desktop_RightSideBar
EndEnumeration
Define HeaderHeight = 100
Define FooterHeight = 100
Define LeftSideBarWidth = 100
Define RightSideBarWidth = 100
; #Desktop
OpenWindow(#Desktop, 0, 0, 0, 0, "", #PB_Window_Background)
SetWindowColor(#Desktop, #Green)
; #Desktop_Header
ContainerGadget(#Desktop_Header, 0, 0, WindowWidth(#Desktop), HeaderHeight)
CloseGadgetList()
SetGadgetColor(#Desktop_Header, #PB_Gadget_BackColor, #Blue)
; #Desktop_Footer
ContainerGadget(#Desktop_Footer, 0, WindowHeight(#Desktop) - FooterHeight, WindowWidth(#Desktop), FooterHeight)
CloseGadgetList()
SetGadgetColor(#Desktop_Footer, #PB_Gadget_BackColor, #Blue)
; #Desktop_LeftSideBar
ContainerGadget(#Desktop_LeftSideBar, 0, 0, LeftSideBarWidth, WindowWidth(#Desktop) - LeftSideBarWidth)
CloseGadgetList()
SetGadgetColor(#Desktop_LeftSideBar, #PB_Gadget_BackColor, #Yellow)
; #Desktop_RightSideBar
ContainerGadget(#Desktop_RightSideBar, WindowWidth(#Desktop) - RightSideBarWidth, 0, RightSideBarWidth, WindowHeight(#Desktop))
CloseGadgetList()
SetGadgetColor(#Desktop_RightSideBar, #PB_Gadget_BackColor, #Yellow)
; #GameWindow
OpenWindow(#GameWindow, #PB_Ignore, #PB_Ignore, 1000, 800, "", #PB_Window_BorderLess | #PB_Window_ScreenCentered)
SetWindowColor(#GameWindow, #Black)
Re: Control the generated html for a web app
Posted: Wed Dec 04, 2024 7:38 pm
by ricardo_sdl
I see, that's an alternative way to do it, thanks Peter!
One thing that I didn't try was to generate my own index.html file and include the generated js code on it, but I assume the js will try to change things around the html at runtime.
And another related question: Is there any way to define my own favicon.ico file?
Thanks again!