GLBasic forum

Main forum => GLBasic - en => Topic started by: loftcat on 2022-Sep-03

Title: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-03
I'm thinking of purchasing the HTML5 Compiler on Steam (I have the Steam version of GLB). I can't seem to find any documentation for it (apart from a few notes on the Steam site):

QuoteThis compiler, using Emscripten, results in an html webpage, that runs your GLBasic application/game in any modern webbrowser. You can also use it to export GLBasic function to JavaScript for other projects. Emscripten will compile a wasm (Web assembly) for you, that runs really fast.
There are two options included:

    HTML5-WebGL - This uses the webgl backend and allows fast graphics, using hardware accelleration
    HTML5 - This uses a builtin graphics engine, that renders the output per pixel. It's not as fast as webgl, but more compatible for older computers or computers with higher security limitations.


There are some limitations, though:

    You must run the main loop using SETLOOPSUB, instead of a classic WHILE TRUE; ...; WEND loop.
    File write access is quite limited
    The data must be loaded using a real webserver, or a local webserver (included for testing). Modern browsers will refuse to load graphics, if you just open the html file from the local drive.

I've had a nose around the forum and elsewhere for some more documentation but without luck. I'd be interested to know a bit more before buying it if possible (although might just take the plunge and have a play with it  =D )

If anyone knows of any guides, release note docs would be much appreciated! I did find a 9 year old thread testing html5 but nothing recent for the Steam release.
Title: Re: Steam HTML5 Compiler
Post by: Kitty Hello on 2022-Sep-05
There is not much documentation, but almost everything should work. My G.A.C.K. games run in HTML5.
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-05
Hi, thanks for the reply. I think I understand the need for a webserver and the SETLOOPSUB, but I wonder if you have any more detail about the restrictions around file write access? This is something I might like to try and do if possible, so I'd like to know what can't be done.
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-06
Ok I took the plunge and bought the HTML5 Compiler from Steam just to see where I could get to. It automatically installs it as DLC via Steam which is nice and start GLBasic is the usual way, through a desktop icon or Start menu in Windows 10.

I've made a really simple program with a SETLOOPSUB. I've then navigated to Project > Options and checked the Platform Configuration is set to 'HTML5', applied and exit. I've then gone to Compiler -> Build Multi-platform and clicked on HTML5.

The result is a .app project sub-folder containing a project.html file telling me it's a dummy file. In the Distribute folder an HTML5 sub-folder has been created containing 1 file: run_local_test.bat

The compile report contains the following:

Quote*** Configuration: HTML5 ***
precompiling:
GPC - GLBasic Precompiler V.17.312 SN:58f00c1b - 3D, NET
Wordcount:17 commands
compile+link:
Adding directories to PATH:
PATH += Q:\Compiler\platform\HTML5\emsdk\upstream\emscripten
PATH += Q:\Compiler\platform\HTML5\emsdk\node\12.18.1_64bit\bin
PATH += Q:\Compiler\platform\HTML5\emsdk\python\3.7.4-pywin32_64bit
PATH += Q:\Compiler\platform\HTML5\emsdk\java\8.152_64bit\bin

Setting environment variables:
PATH = Q:\Compiler\platform\HTML5\emsdk\upstream\emscripten;Q:\Compiler\platform\HTML5\emsdk\node\12.18.1_64bit\bin;Q:\Compiler\platform\HTML5\emsdk\python\3.7.4-pywin32_64bit;Q:\Compiler\platform\HTML5\emsdk\java\8.152_64bit\bin;Q:\Compiler\platform\HTML5\emsdk;Q:\Compiler\platform\HTML5\bin
EM_CONFIG = Q:\Compiler\platform\HTML5\emsdk\.emscripten
EM_CACHE = Q:/Compiler/platform/HTML5/emsdk/upstream/emscripten\cache
EMSDK_NODE = Q:\Compiler\platform\HTML5\emsdk\node\12.18.1_64bit\bin\node.exe
EMSDK_PYTHON = Q:\Compiler\platform\HTML5\emsdk\python\3.7.4-pywin32_64bit\python.exe
JAVA_HOME = Q:\Compiler\platform\HTML5\emsdk\java\8.152_64bit
emcc:WARNING: --js-opts ignored when using llvm backend
em++: error: Attempt to set a non-existent setting: 'OUTLINING_LIMIT'
- did you mean one of INLINING_LIMIT?
- perhaps a typo in emcc's  -s X=Y  notation?
- (see src/settings.js for valid values)
distribute HTML5 to: C:/GLB/GLBasic/htmltest4/distribute/HTML5
exit
success
_______________________________________
*** Finished ***
Elapsed: 5.7 sec. Time: 14:37
Build: 5 succeeded.

Any ideas what I'm doing wrong? Am I missing a component to make this work? There's clearly an error in the compile but I don't know if it's relevant. A search on the forum throws up a thread from 2020 about OUTLINING_LIMIT but doesn't conclude anything. Really hope I can get this working on some level.

Help appreciated!
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2022-Sep-07
OUTLINING_LIMIT is an error I get when compiling with HTML5.
If I compile with HTML5-WebGL everything is OK
Tried with version 16.947 and the latest html5 Steam version (not sure which version)
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2022-Sep-07
QuoteThere is not much documentation, but almost everything should work. My G.A.C.K. games run in HTML5.

Yet Gernot in HTLM5 the mouse test:

SETLOOPSUB "MainLoop1"
SUB MainLoop1:
    PRINT "X:" + MOUSEAXIS (0), 0, 0
    PRINT "Y:" + MOUSEAXIS (1), 0, 20
    PRINT "Z:" + MOUSEAXIS (2), 0, 40
    PRINT "A:" + MOUSEAXIS (3), 0, 60
    PRINT "B:" + MOUSEAXIS (4), 0, 80
    PRINT "C:" + MOUSEAXIS (5), 0.100
    SHOWSCREEN
ENDSUB

only the left mouse button works.
Any idea?

Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-07
Quote from: Qedo on 2022-Sep-07
OUTLINING_LIMIT is an error I get when compiling with HTML5.
If I compile with HTML5-WebGL everything is OK
Tried with version 16.947 and the latest html5 Steam version (not sure which version)

Same observation for me Qedo, no OUTLINING_LIMIT error when compiling to HTML5_GL which is good, but unfortunately for me no luck getting an html5 program to launch :(   I am compiling and getting the attached report, the tail of which shows:

QuoteNothing to do!
em++: error: 'Q:\Compiler\platform\HTML5\emsdk\upstream\emscripten\tools\file_packager.bat C:\Users\tonyk\AppData\Local\Temp\glbasic\Hello_world.data --from-emcc --export-name=Module --preload Media' failed (1)
distribute HTML5 to: C:/GLB/GLBasic/helloworld/distribute/HTML5
exit
success
_______________________________________
*** Finished ***
Elapsed: 20.5 sec. Time: 11:25
Build: 5 succeeded.

In the Hello_world app folder it has generated a single file, Hello_world.html which appears to be a dummy file. The \distribute\HTML5 folder contains 2 files:

Hello_world.wasm
run_local_test.bat

When I open the bat file it briefly launches a command window which promptly closes itself, and the browser opens a tab telling me it cannot launch localhost:8000.

I'm not certain if the problem is the local server failing to launch or the program files haven't generated properly. I was expecting more files to be generated but maybe the above is correct?
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-19
Anyone at all seen this error...?
Title: Re: Steam HTML5 Compiler
Post by: dreamerman on 2022-Sep-20
Sorry for late reply, there were some newer topics about HTML5, generally for me it always had some issues, tutorials and other such small things were compiled ok, but normal projects, with OpenGL inline had some issues, from v16 HTML5 looked broken for me completely, scripts were based on older emscripten and there was some version / arguments conflict.
I don't have HTML5 dlc for current GLB version, so can't test anything.
HTML5_WebGL was referred target as it supports more advanced rendering routines.

What file size has that *wasm file?
Generally browsers will not launch wasm normally, you need some local webserver to make them available (security reasons), one of most popular is XAMPP, if wasm file is good, put it to local server htdocs (or whatever directory for document will be called) and run it with something like this: "localhost://Hello_world.wasm"
No idea what with that media packing error that you got.
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-23
Thanks for the advice. I've downloaded XAMPP and installed. Seems to be running ok as I can create a simple html file in the htdocs folder and open it fine.

I've tried recompiling to HTML5 webGL once again with a brand new simple three line program to display hello world. The good news I think is I'm no longer getting the OUTLINING_LIMIT error, but still getting an odd error at the end of the compiling:

Quoteem++: error: 'Q:\Compiler\platform\HTML5\emsdk\upstream\emscripten\tools\file_packager.bat C:\Users\tonyk\AppData\Local\Temp\glbasic\HelloAgain.data --from-emcc --export-name=Module --preload Media' failed (1)
distribute HTML5 to: C:/GLB/GLBasic/HelloAgain/distribute/HTML5
exit
success
_______________________________________
*** Finished ***
Elapsed: 11.1 sec. Time: 23:10
Build: 5 succeeded.

The wasm file is 235kb and along with run_local_test.bat are the only files generated. If I drop the wasm file into the XAMPP htdocs folder and try opening https://localhost/HelloAgain.wasm from a web browser it prompts to download the wasm file. It then does something odd where it automatically keeps opening multiple browser tabs until I force close the browser.  It's a bit odd and slightly inconsistent which isn't helping. Hoping Gernot might see this when he's feeling better and can help  =D
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2022-Sep-23
If the "Media" folder is empty this is probably the problem.
Put any file in it and recompile.
Once compiled, forget XAMPP and run "run_local_test.bat" instead
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2022-Sep-23
try this:

SETLOOPSUB "MainLoop1"
SUB MainLoop1:
   PRINT "Hello World",10,10
     SHOWSCREEN
ENDSUB
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-23
Thank you so much for the help. Still no luck with running the bat file to run the local webserver, but my good news is that I can now compile, copy the content of the folder to XAMPP and it works! It now produces an html file which I can call from the web browser via localhost.

Main change I made was simply to add a file to a media folder. It's also imperative to use a SETLOOPSUB as you mentioned (Gernot sets that out in the pre-reqs to be fair although I did need reminding). When I get a few more minutes I'll put together an idiots guide to getting started with the HTML Compiler (mainly for me so I don't forget  =D, but for anyone in the future that might need it).

Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-23
QuoteYet Gernot in HTLM5 the mouse test:

SETLOOPSUB "MainLoop1"
SUB MainLoop1:
    PRINT "X:" + MOUSEAXIS (0), 0, 0
    PRINT "Y:" + MOUSEAXIS (1), 0, 20
    PRINT "Z:" + MOUSEAXIS (2), 0, 40
    PRINT "A:" + MOUSEAXIS (3), 0, 60
    PRINT "B:" + MOUSEAXIS (4), 0, 80
    PRINT "C:" + MOUSEAXIS (5), 0.100
    SHOWSCREEN
ENDSUB

only the left mouse button works.
Any idea?

When testing today I noticed if I put a mousewait into my MainLoop1 the HTML5 compiled but failed to run. But I could call out to a procedure to do it and it works.
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2022-Sep-23
about the local web server not working but are you sure you have python installed?
To check this, open a cmd and run python.exe
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-24
Quote from: Qedo on 2022-Sep-23
about the local web server not working but are you sure you have python installed?
To check this, open a cmd and run python.exe

Aha! Installed Python and it works  :booze:
So simple when you know how. I'm going to do a little getting started guide for sure!
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2022-Sep-24
we never think about simple things :D
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Sep-26
First cut of some steps for another GLBASIC-HTML5 newbie like myself...  what do you think? Anything to add or amend ?

GLBASIC v16 (Steam edition) - Getting started with the HTML Compiler (Windows 10)

Pre-requisites: GLBASIC v16 Steam Edition

1. Purchase the HTML Compiler from Steam as GLBASIC DLC. Once purchased, the HTML Compiler should automatically install via Steam.
There isn't an obvious change to GLBASIC when you launch it, but under Project->Options on the menu, HTML5 and HTML5-webGL options should be available.

2. Install Python. This is not mandatory for the compiler to work, but is needed if you want to test your compiled html5 program in the simplest way. You can install the latest version of Python from the Microsoft App Store.

3. Create a new project with the following code:

SETLOOPSUB "MainLoop1"
SUB MainLoop1:
   PRINT "Hello World",10,10
   SHOWSCREEN
ENDSUB

The key thing is a SETLOOPSUB should be used for main loops when compiling to HTML5.

4. On the menu go to Project->Options and set Platform Configuration to 'HTML5-WebGL' and click OK.

5. Go to Compile->Build Multiplatform. Click on HTML5-WebGL to compile your project.

6. Locate your project folder in your GLBasic home folder. Navigate to the ..\<projectName>.app sub-folder of your project. If there isn't a Media folder, create one. Inside your Media folder, if you do not have any files, create a simple dummy text file. It doesn't matter what it is called, as long as a file exists here.

7. Go to Compile->Build Multiplatform. Click on HTML5-WebGL to re-compile your project

8. Navigate to the ..\distribute\HTML5 folder and you should see several files of these types: .data, .html, .js, .wasm and .bat. Providing you have installed Python in step 2, you should be able to click on the run_local_test.bat file to run your project in a browser using a local web server.
Title: Re: Steam HTML5 Compiler
Post by: erico on 2022-Sep-27
Thanks for the heads up, I will sure be trying web compile this year and this will help.
Title: Re: Steam HTML5 Compiler
Post by: dreamerman on 2022-Oct-02
I completely forgot about Python requirement, but wasn't it included with older (v14 / v15) instllation of html5 target, hm not sure about that. Any specific Python version is required, like 2.x or newer 3.x?
Good job for testing this, few new question comes to my mind, for example what about simple OpenGL inline like glTranslate etc, will something like that work in WebGL?
It would be great to see additional platforms as such DLC, Linux should be first.
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2022-Oct-03
it seems so, see https://www.glbasic.com/forum/index.php?topic=6569.msg52954#msg52954
I tried to compile Opengl.bas and compile it though the result does not seem correct to me
My Python version is 3.8.3
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2022-Oct-07
My Python version is 3.10.7
Title: Re: Steam HTML5 Compiler
Post by: svenart on 2022-Oct-15
hey everyone. I just have bought steam glbasic and the html5 compiler and got very frustrated because it was not working "right from the start". However, after reading this thread I followed the instructions and now my first game runs almost perfectly in a browser yiehhhaaa.....

Only 2 problems are there right now.

1. The right mouse button is not working :( Is there a way to fix this?
2. it seems that getscreensize is not working correct.

However, can´t wait now to finish a first working demo for browser and upload it on Itch.IO or my own website. Great!
Title: Re: Steam HTML5 Compiler
Post by: svenart on 2022-Oct-15
Tried to compile 4 of my 4 games for html5, 1 of them worked fine without much changes needed.  =D

Uploaded a first version for testing on Itch.io.

My most important question now: How can I get rid of this annoying blue menu in the bottom area?

When using playsound, the volume seems not to. Samples will always be played at 100% volume.

Title: Re: Steam HTML5 Compiler
Post by: Kitty Hello on 2022-Oct-16
The blue menu is in the template html page. I have to check the volume thing.
Title: Re: Steam HTML5 Compiler
Post by: hardyx on 2022-Nov-02
Quote from: loftcat on 2022-Sep-26
...
Good guide for GLB HTML5, is good to know all this things.
You can download Python in the offlicial page too, but I think in MS Store is easier for begginers.
https://www.python.org/downloads
Title: Re: Steam HTML5 Compiler
Post by: svenart on 2023-Jan-05
Is there any hope to get a solution for the mouseproblem in html5?

Tried everything but can´t get it to work

- Mouseposition is only available when button is clicked. (no mouseover effects)
- Mousbutton 2 is not working
- mousewheel (button3) is not working
- also input and some keys are not working as they should.

Honestly, this html5 compiler is quite useless without proper mouse and keyboard controls. Please, PLEASSSE fix it.
Title: Re: Steam HTML5 Compiler
Post by: loftcat on 2023-Jan-09
Hope we see some improvements too. An updated HTML version of GLBASIC will really help extend it's life and make it worth purchasing on Steam.
Title: Re: Steam HTML5 Compiler
Post by: Kitty Hello on 2023-Jan-09
I'll try to update the HTML5 libraries. Did you try the "fulscreen" option and/or the MOUSEAXIS instead MOUSESTATE?
Title: Re: Steam HTML5 Compiler
Post by: svenart on 2023-Jan-10
I tried Mousestate but it is not working. My HTML Games are all running in window mode, have not tried fullscreen.
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Feb-08
im can finally confirm as MOUSEAXIS and MOUSESTATE, any mouse buttons sends to the first button.

Its howover possible to detect you using touch or mouse, so when on mouse, its would been nice to uses rightclick for sure as rightclick menu is disabled for the canvas anyway.

etc if you can move the mouse without click, then its a mouse, you cant do that with touch, which x and y is allways is 0 when no button clicked.....

etc code like this:

Code (glbasic) Select

MOUSESTATE mx, my, b1, b2
IF i=0 AND b1=0 AND (mx>0 OR my>0) THEN ISAMOUSE=1



So im will confirm its a bug.

Im is recently fully doing a html5 port for one of the game.
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Feb-11
im just finally got right mouse click working. Im have sent the changes to Gernot. The changes required is in lib_glb_plus.js...... of course if a user uses touch, rightclick wont work. MouseState does still not works yet. but that part was not important really.

Im think html5 is a cool platform, much more fun than Android for me, so im might take a full focus on this platform rather than Android me think.

Im should have take a look much eailer. so sorry about it.
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Apr-15
I'm back, didn't really go, always checked in to see new developments.
Had a bit of a career change from working on Fire and Security systems to teaching apprentices to be qualified to do the same.
My spare time was limited so never really had a GLBasic project to work on.
Now that I can see HTML5-GL looks stable, I decided to jump to the steam version.(still worth paying twice)
After a lot of compile error and messing about I managed to get a few projects working.
I love it that things like grabsprite work, but mousewait crashes.

I've tasked myself with writing some code for teaching apps but before I start have to work everything out.

does anyone have the minimal HTML that is required to run .js / wasm. I was messing with the generated one and removed about 60% of the code, but removing code that looks irrelevant sometimes kill it.

File access is limited, will HTML5 in GLBasic be able save an image. I am thinking of certificates being downloaded for the learners.


Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Apr-15
MOUSEWAIT would newer work on that platform as its will more or less just freeze the game, due how that platform works, which is heavy tied to GLB_ON_LOOP. You cant also load assest in one go, but need to go throught  GLB_ON_LOOP as well.

So nothing im can do here.

Uses MOUSESTATE instead. That command works fine.

So if you ask me, MOUSEWAIT should been depreacted completly.
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Apr-15
the main thing also dont uses loops without GLB_ON_LOOP. (called once per frame/gameupdate). GLB_ON_LOOP is automatic called by the language on new frame on the framerate you choice.
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Apr-15
Wasn't really complaining about MOUSEWAIT, I used it a lot on previous project so parts of my code could be paused so I could check it was doing the right thing.
Started doing testing, I have a Zyxel NAS that allows me to web publish. I converted my old unlimited sprites demo and put it up. funny thing is it only plays music if you touch  the screen on my android phone, but OK on PC, runs fast and smooth.

I use a  4k Screen and the IDE icons are so small, luckily I can increase the font size for code.

I want to add the projects to my own web pages, any one know of a tutorial or tool that can do this?, As I said previous the GLBasic html adds 3 weird symbols at the start and the blue button menu, removing it with a text editor works to a point, but you can easily mess it up. 


Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Apr-15
its simply due that whay Android and WebGl is pretty much the same.

MOUSEWAIT is a bad command, because its does not show any graphics in meantimes and also halt GLB_ON_LOOP operation in meantime (very bad idea). Due that, the system thinks the app is gonna to been in crash, due its does not repons as GLB_ON_LOOP was newer finished in time. MOUSEWAIT was orignally only meant to been a debug command.

That is due SHOWSCREEN is now required to been used with GLB_ON_LOOP calls. GLB_ON_LOOP should been in the main loop and glbasic automatic call it when the functions ens with the desirered framerate.

Old projects might not uses it, but need to been changed to only uses GLB_ON_LOOP as main function. Some of my games diddent do that either back in the time.

Remember Android/Webgl behaiver quite different than Windows.

For the Cave Heroes project, here is what my function is to give it idea:

Code (glbasic) Select

SUB GLB_ON_LOOP:
?IFDEF HTML5
LOCAL x,y
GETSCREENSIZE x,y
LOCAL changed=CheckCanvasSize()
IF changed=TRUE
OS_Default_Settings()
ENDIF
?ENDIF

IF S_Status$="load"
LOADGAME()
PaintLogo()
LOADER=LOADER+1
ENDIF
IF S_Status$="pause"
UpdateTicks=update_Delay()
Ctrl()
GamePaint()
ENDIF
IF S_Status$="show" OR S_Status$="menu"
UpdateTicks=update_Delay()

IF UpdateTicks<1
GameUpdate()
ELSE
LOCAL updat=INTEGER(UpdateTicks)
UpdateTicks=UpdateTicks/updat
FOR i=1 TO updat
GameUpdate()
NEXT
UpdateTicks=UpdateTicks*updat
ENDIF
GamePaint()
ENDIF
IF S_Status$="menu"
GameMenu()
ENDIF
SHOWSCREEN
IF S_Status$="show" OR S_Status$="menu" OR S_Status$="pause"
IF GAMEFADE=0 AND GAMEON=0 //AND Objectdata[0].dat[16]=1
RESET(1)
POWER=1
Map_LoadXML()
UpdateTicks=update_Delay()
UpdateTicks=0.1
GAMEON=1
DoRandomLevels=0
ENDIF
IF GAMEON=1
GAMEFADE=GAMEFADE+0.05*UpdateTicks
IF GAMEFADE>1 THEN GAMEFADE=1
ELSEIF GAMEON=0
GAMEFADE=GAMEFADE-0.05*UpdateTicks
IF GAMEFADE<0
GAMEFADE=0
ENDIF
ENDIF
ENDIF
ENDSUB
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Apr-18
If anyone needs the minimal HTML code to run compiled Emscripten .js. I got totally lost looking at the HTLM code generated when compiling to HTLM5. Hope this helps

Code (glbasic) Select

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>

<body>
<center>
    <canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
    <script type='text/javascript'>
        var Module = {
            canvas: (function() { return document.getElementById('canvas'); })()
        };
    </script>
    <script src="Insert File Name.js"></script>
</center>
</body>

</html>
Title: Re: Steam HTML5 Compiler
Post by: Qedo on 2023-Apr-18
 great very useful Paul
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Apr-18
you should checkout this post with the changes im did:
https://www.glbasic.com/forum/index.php?topic=11576.msg102262#msg102262

This also include a tool, that does adds icons etc after compiling and canvas resize checking and more.

This minimal version would sadly not work with the tool and fixes im did, that also have a loading presentation with loading status (which take some time, before the canvas actuelly starts) and canvas, saving (which was a pain to get working correctly), resize etc and... yes fixed the right click issue.

And yep, that version im did was designed to been more release presentation. Just checkout any of my games. All my games using this tool and code. And yep. The logs in the textarea used is nonesense as.... browsers can showup the logcat if needed anyway.
Title: Re: Steam HTML5 Compiler
Post by: MrPlow on 2023-Apr-19
Hi, Just to mention i did notice a slight screen tear issue when trying Greedy Mouse - on my browser..?
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Apr-19
its could have fails to deviver 60fps? since im was aware webgl is slower, that why im added back 30 fps and graphics settings for that game, a game that is quite fillrate hungry (its now only uses the 200px tileset, that property got downscaled). and a game that diddent uses systemtimer, but frameskips, something im wont change. Lucky its not a action game at all.

Im does do vsync in that game.....
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Apr-25
I've written loads of programs that handle the b1 on MOUSESTATE so that it only records one press at a time. however I cant get any of my code to work with HTML5-GL
without it doing nothing or crashing, all work under win32.  Every touch records about 3-5 loops. Any pointers anyone.
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Apr-25
dont uses MOUSESTATE variable directly as its just checking or should checking its either held down or not. You should uses something like this?

Code (glbasic) Select

MOUSESTATE mx, my, mba, mbb
IF mba=1
PRESSED=PRESSED+1
ELSE
PRESSED=0
ENDIF


Remember the main loop for webgl is allways GLB_ON_LOOP, so using GOTO for looping is a very bad idea and might crash (im did removed comply of those in my own games when that got changed). Hence MOUSEWAIT would newer work....
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Apr-25
Thanks this worked. So simple, I started off with something similar but it got out of hand with frustration. :nw:
Going to add it to the playsound so its not  being called 3-5 times a push.
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Apr-25
Just to mention. SOUNDPLAYING() is not working, but ISMUSICPLAYING() do. In this case, not sure why..... Also if you play a sound that does not exists, all sounds stops its seen (like a HUSH).
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Aug-18
Hi Spacefractal

How do you get the phone browser to force rotation and full screen in your games?
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Aug-19
sorry for no replay as im was on vaccation (twice). Anyway checkout the posttool im posted (see link from first post).

For getting fullscreen etc, this is done from the itch.io site. To doing fullscreen, you must do this outside the game as a user interaction by a buton as the site does actuelly that, include on mobile as well (which looks like a app). Hence its being fullscreen as im choosen it to do that.

Same with rotation. Here im actuelly only checking when the resolution is changed in the loop. If you implements resize automatic when you change the browser size, then its would works on mobile too.
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Aug-22
Thanks Spacefractal. 

I spent 15min messing with the Itch.io settings and it allows apps other then games to be hosted which is what I need.. I am going to have to re-write most of my program due to using a fixed resolution and general poor programming. I find writing for HTML5 far more difficult, having no examples to learn from doesn't help. I even don't understand the code I wrote years ago :o
Title: Re: Steam HTML5 Compiler
Post by: Kitty Hello on 2023-Aug-23
If you have a fixed resolution, take a look at the command PRESCALER?
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Aug-28
Some of my games also does uses fixed resolution, but used virtual screen rather than PRESCALER instead. Im think im did a example in years ago in the code example how to do that.

Howover the main canvat when doing html games is, you are forced to uses GLB_ON_LOOP as the main loop with anything you doing. Its called once per frame. Because of that there is some commands that newer work with this platform, like MOUSEWAIT.

Also can you get resize to working when you resize the browser window (its looks insane great when done right), then rotation would works on mobile.
Title: Re: Steam HTML5 Compiler
Post by: Paul Smith on 2023-Aug-30
Thanks guys, I selected 800x480 in the project options. used Itch.io to force landscape mode and fullscreen.
Android rotates the screen and goes into fullscreen, Ios just rotates the screen. Browsers show the 800x480, android and Ios show 800x360.
I just rewrote the bit of code and made sure is all fits 800x360.

Just struggling re-writings the same code multiple ways. Its the same buffer problem I had that spacefractal solved for me last time to stop multiple clicks. However its not working for this.
Im making a menu with numbers you click, it require 4 numbers to be entered, but if I press 7 i get four 7s.

I miss my while/wend loops.

Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2023-Sep-01
yep, using while / wend that include SHOWSCREEN does not work in HTML5/Java games, nor its newer will. Im wont fix that. This is just how the how the inner code works with this platform. Its similar with Android really.

You could write a status and a variable.

etc for enter, you need a extra counter variables for that and its should been in integer and not float.

Also in 2016 im did this rutine, using a fixed resolution, that scaling to any resolution used. Howover PRESCALER might also works too in this case:
https://www.glbasic.com/forum/index.php?topic=9848.0

Im choosen not uses PRESCALER (as all my games was coded before that command was in, but im just prefer my own thing, hihi).
Title: Re: Steam HTML5 Compiler
Post by: Dabz on 2024-Feb-15
So, after purchasing GLBasicSDK [I also bought the none steam one donkeys ago, but thought I'd support it and not to hassle Kitty for a steam key] and the HTML5 platform DLC, and discovering, well, the problems regarding HTML5 input in response to this thread are still there...

Can someone confirm that this is deader then a-line flares with pockets on the front?

I've tried all sorts, from using js keycodes when e.g. normal 'Key(200)' was failing, I've tried MouseAxis instead of MouseState... And yet, cannot get anything to work as it should... And... It's a little annoying, and I do have patience as well, but it seems broke, and, I may be wrong, I may have missed something... But you cannot sell broken stuff, or at least not highlight fixes/workarounds in the docs, as an example, do I have to use something other then 'Key()'?! :D

I say this without hopefully coming across as a t[beep]t, but I made a few things in GLBasic and really enjoyed it, now, looking at tinkering around with a few prototypes, and, it's all a bit of a faff really.

Kind regards

Dabz
Title: Re: Steam HTML5 Compiler
Post by: spacefractal on 2024-Feb-18
has been away recently due the Head over Heels remake. Yep. Anything im fixed is covered in the other thread, when im began to port my own games to it. Not anything is fixed, but all the worst one is.

HTMLKey() was added after those arrows keys was extractly failed as the reason.