Let me start by linking you to a guide: https://github.com/raysan5/raylib/wiki/Working-for-Web-(HTML5)
Now, time for a confession: I can't read it. Well, I can - but I don't want to. This makes for a difficult situation. Do I abandon the project or read a guide? I choose option 3 - AI.
Unfortunately, effectively using AI for tasks like this require 1 of 2 things:
I recommend trying option 1 and if it fails then trying option 2. Let me remind you that, as a last resort, the guide is available.
Now I have to retrace my steps. Originally I had planned on doing this in the background so I could share the dot game with you. But alas, it was a pain. So my machine is in a weird sort of in-between state where I'm about half (or more) of the way there and I now either have to reverse-engineer how I got to this point OR I need to start over from scratch.
Here's a lesson for you: avoid engineering ALWAYS.
Ha ha. Just kidding. I'll tell you where I'm at, nuke what I've got, and do it all over again. It'll be funner that way.
At the time of writing this I am 59% into compiling the html5 build of Raylib. I am 90% sure this step is necessary and am 12% sure of how any of this works. I guess I better back up. For my benefit and yours. I'll back WAAAYYY up.
Raylib is a game library. Actually maybe it's a game framework.
AI: Raylib is a game library. It provides tools for graphics, input, audio, and more, making it easier to build games without enforcing a specific structure.
Huh. So yeah, its a library. What's a framework then?
AI: A framework is like a library, but with more structure. It often dictates how your code should be organized and provides a predefined workflow. While a library gives you tools to use as you see fit, a framework sets the rules and expects you to build your project within its structure.
Huh. Makes you wonder if I shouldn't be using a framework - wouldn't I benefit from a structure set up by people with actual experience? Should I really be taking it upon myself to structure my game however I see fit? What If I make a mistake?
AI: Using a framework could indeed provide a solid structure and save you from reinventing the wheel, especially if you're new to game development. Frameworks are designed by experienced developers to handle common challenges, allowing you to focus on building your game rather than its foundation. However, building your own structure can be a valuable learning experience, helping you understand the underlying mechanics. It ultimately depends on whether you prioritize efficiency or learning in this project.
Yeah I'll go with the second part of that. I've tried engines before - I just can't stay stoked. Maybe it's from years of AutoCAD but I CANNOT get myself to learn other people's tools anymore. Not in my free time. Life is too short.
AI: Technically, using Raylib is still relying on someone else's tool. The difference is that libraries like Raylib are lightweight and flexible, letting you structure your project as you like, unlike frameworks or engines that impose stricter workflows.
Yeah whatever. The point is that I wanna drive the bus. Lets move on.
...yeah, about that...
This one started years ago - possibly as far back as the 90s. When I was a kid my dad had a book around called "Teach yourself C in 21 days".
I had followed along to a DOS book he had - tree
and dir
and batch files and the like - the late 90s sunshine, the Windows 98 geometric patterns on the desktop, the smell of clean hot attic plywood (I may be be messing up my timeline here, unsure) - I'm nostalgic just thinking about it.
I memorized the "Hello, World!" program but couldn't figure out what a compiler was. Give me a break, I was like 9.
Anyways, in the book they went on about how learning C would pave the way for the hot new exciting world of Object Oriented Programming - I HAD to get me some of that!
Well, that never happened. My enthusiasm for learning C and C++ and OOP got set aside for other things. Books and games mostly. Occasional forays into the woods. Kid stuff.
And so it went for years...
Yes it is actually, thanks for reminding me.
I guess I can't assume you know what compiling is - I sure didn't the first time I came across it (see what I did there?) - I'll give you the rundown:
Computers are a mess of wires and circuits and who knows what else. It's best not to think too much about it. Not that it isn't fascinating but because it's at LEAST a 4 month digression and when we get back to this paragraph you'd be no better equipped than you are now for what I'm about to tell you and I'd be even deeper into my mid 30s.
Now in order to tell a computer what to do we use "code" - magical runes that ferry our intentions from this world to the next - and before the computer can receive them they must be translated to machine language.
AI: While the metaphor of "magical runes" is poetic, code is simply a set of human-readable instructions written in a programming language. These instructions are translated into machine language—a series of binary commands the computer can execute—through a process called compilation, performed by a program called a compiler. It's more like converting a recipe into precise steps for a machine to follow.
Yeah, close enough. The point is that the code we write for our game needs to be compiled so the computer knows how to run it.
In my experience with Raylib (hint: that's not a lot of experience) getting things working for desktop is easy! Compile Raylib, make it available to your compiler, then compile - see your local AI for details.
But that has NOT been my experience with compiling Raylib for HTML5.
You know, I can barely answer that. I believe it's another name for web assembly, which is some sort of ultra-efficient computer language for browsers - I assume it has hardware access and extra layers of security to prevent bad actors from hijacking your computer.
AI: Yeah, pretty much. Though HTML5 is not "another name for WebAssembly." HTML5 refers to the latest version of the HTML standard, while WebAssembly (WASM) is a binary instruction format that can be used alongside HTML5.
Whatever. So for me to share my game with you I need to "Embed" it, if you will. And to do that it needs to be in HTML5, which is another name for web assembly.
Full disclosure? Right here:
user@k:~/Desktop/gamedev_progression/dot_game$ make dot_game.html
emcc -Wall -std=c++17 -I./build/include main.cpp -o dot_game.html ./build/libraylib_html5.a -s USE_GLFW=3 -s ASYNCIFY -s TOTAL_MEMORY=67108864 --shell-file shell_minimal.html
emcc: error: ./build/libraylib_html5.a: No such file or directory ("./build/libraylib_html5.a" was expected to be an input file, based on the commandline arguments provided)
make: *** [Makefile:25: dot_game.html] Error 1
AI: ...
AI: You aren't very good at this, are you.
Yeah yeah yeah. Pin it on me. A dozen prompts later and I get the blame. Now, as near as I can figure I'm getting close - just a few more prompts should do it.
user@k:~/Desktop/gamedev_progression/dot_game$ sudo rm -rf setup_raylib.sh setup_emsdk.sh shell_minimal.html build/ libraylib.a raylib/
[sudo] password for user:
user@k:~/Desktop/gamedev_progression/dot_game$ ls
dot_game main.cpp Makefile README.md
user@k:~/Desktop/gamedev_progression/dot_game$
Well, here we go again.