Watch
2
0
Fork
You've already forked raylib-cs
0

WASM examples (+ backports of new official examples) (#344)

* chg: New build system that uses the officially distributed binaries, bumped version to 8.0.0, simplified git workflow, removed deprecated OpenGL 1.1 functionality.

* chg: Modernize CI workflow, enable SourceLink

- Bump workflow actions to latest majors (Node 24); drop deprecated softprops/action-gh-release@v1
- Trigger push builds on main instead of master
- Create local nuget feed dir before pack (fixes NU1301)
- Enable Microsoft.SourceLink.GitHub for debugging symbols (ref PR #340)

* fix: centralized version data in Directory.build.props, and fixed various interop details that had incorrect function signatures

* chore: updated readme

* fix: version the native extract marker and chain download via DependsOnTargets

The .extracted marker now includes the raylib package name, so bumping
TargetRaylibTag re-extracts the new archive instead of silently keeping
(and packing/copying) the previous version's files.

_PrepareNativeLibrary and _StageWasmNative now depend directly on
_DownloadAndExtractInternal instead of CallTarget-ing it; dependency
targets run in the same project instance, so the resolved properties
(RaylibPackageName etc.) propagate naturally.

* fix: let the binding build for browser-wasm on both net8.0 and net10.0

The net8-era wasm workload (Microsoft.NET.Runtime.WebAssembly.Sdk 8.0.x,
auto-imported for RID browser-wasm) treats every browser-wasm project as
a wasm app: it forces OutputType=Exe after project evaluation (CS5001
for a classlib) and hooks its app-bundle build after Build, which errors
because a library has no assemblies to bundle. Opt Raylib-cs out via
DisableAutoWasmBuildApp (props time, before the workload defaults its
trigger) and pin OutputType back to Library in Directory.Build.targets
(evaluated after the workload props, so the assignment wins). net10's
wasm SDK needs neither workaround.

* chore: readme updated

* chg: simplifying build logic - a simple line in the documentation should save us the code here

* fix: Wrong signature of FrameBufferComplete

* chore: readme update

* feat: samples default to local project reference, and can optionally use the nuget package

* feat: backporting existing raylib-cs examples and new official raylib examples to WASM, adopting raylib's original code style

* chore: readme, gitignore, and targets backport.

* fix: Examples.csproj runs the download task when building locally

* feat: backporting existing raylib-cs examples and new official raylib examples to WASM, adopting raylib's original code style

* chore: readme, gitignore, and targets backport.

* chore: clean up linter warnings

* feat: html harness focuses the example and allows quick navigation with J/K instead.

* chore: readme mentions the property to use nuget vs. the local project reference

* feat: replaced the J/K navigation with good old HTML buttons

* chore: run dotnet format scoped default (was previously scoped to just 'style')
This commit is contained in:
tiger tiger tiger 2026-07-30 19:34:34 +02:00 committed by GitHub
commit 8c22e68c2a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
236 changed files with 40405 additions and 10896 deletions

91
Examples/Web/README.md Normal file
View file

@ -0,0 +1,91 @@
# Examples/Web — raylib-cs in the browser (WebAssembly)
Runs the raylib examples in the browser via WebAssembly, with a dropdown and Prev/Next buttons
to switch between them.
It proves the `Raylib-cs` NuGet package's `browser-wasm` support end-to-end: the package's
`buildTransitive` targets link the shipped `raylib.a` into the .NET wasm runtime.
The browser-wasm configuration only activates when publishing with
`RuntimeIdentifier=browser-wasm`; normal solution builds don't need the `wasm-tools` workload.
## Prerequisites
- .NET 10 SDK
- `dotnet workload install wasm-tools`
- Raylib-cs (works with the local project, or nuget if MSBuild property `<UseRaylibCsPackage>` is `true`
## Build
```bash
dotnet publish Examples -f net10.0 -r browser-wasm -c Release
# -> Examples/bin/Release/net10.0/browser-wasm/AppBundle/
```
### Toolchain caveat
If the link step fails with `wasm-opt: Unknown option '--enable-bulk-memory-opt'`, the installed
`wasm-tools` workload is out of sync with the SDK (stale workload band or a system EMSDK on
PATH); fix with `dotnet workload update`. As a safety net, `Examples.csproj` defaults
browser-wasm publishes to unoptimized native linking; an optimized publish can override those
properties.
## Run
WebAssembly must be served over HTTP (not `file://`):
```bash
dotnet serve -d Examples/bin/Release/net10.0/browser-wasm/AppBundle # dotnet tool install -g dotnet-serve
# or: npx http-server Examples/bin/Release/net10.0/browser-wasm/AppBundle
```
Open the printed URL and use the **Example** dropdown or **Prev**/**Next** buttons to switch examples.
## Canvas scaling modes
The render buffer stays fixed at `800x450`; display scaling is CSS-only. Pick with the **Scale**
dropdown (or `?scale=` query param):
- `native` (default): exact `800x450` CSS pixels.
- `integer`: largest whole-number multiple that fits, centered with letterboxing (pixel-perfect).
- `fit`: fills the viewport preserving aspect ratio (can be fractional, less crisp).
Scaling is computed in device pixels and converted back to CSS via `devicePixelRatio`, so the
modes behave consistently across OS scale and browser zoom. The status bar shows the live numbers
(`DPR`, CSS size, backing size, scale): `integer` should stay crisp at any OS scale or zoom, and
`native` should always report `Scale 1.00`.
## How it works
A browser can't run raylib's blocking `while (!WindowShouldClose())` loop (it would freeze the
page), so frames are driven from JavaScript:
- `Host.Main()` calls `InitWindow` once; `main.js` then populates the dropdown and selects the
first example via `Host.SetExample`, so init failures surface in the on-page error banner.
- `main.js` binds the page `<canvas>` to the runtime and calls `Host.UpdateFrame()` from a
`requestAnimationFrame` loop paced to the current example's `TargetFps` (raylib's own limiter
busy-waits and would peg the main thread). The `Host` methods it calls are `[JSExport]`.
- On switch, `Host.SetExample` unloads the previous example, resets the cursor to visible, and
applies the next `TargetFps`. Cursor hiding and `ConfigFlags` are not honored in the browser.
If `Init` or `Update` throws, the example is unloaded and an error banner is shown.
- Each example is a single `.cs` file implementing `IExample` (`Init` / `Update` / `Unload`); the
host owns the window, so examples never call `InitWindow`/`CloseWindow`. Platform differences
(e.g. GLSL 100 vs 330) are handled inline with `#if BROWSER` guards, not separate files.
## Adding more examples
Examples are **auto-discovered by reflection** (`ExampleRegistry.DiscoverAll`) — no list to edit.
Drop a new `.cs` file in the matching category folder implementing `IExample`, splitting the
original monolithic `Main` as:
```
Main() { <setup>; while(!WindowShouldClose()){ <body> } <cleanup> }
-> Init() { <setup, minus InitWindow/SetTargetFPS> } // loop-spanning locals become fields
Update(){ <body> } // keep BeginDrawing..EndDrawing
Unload(){ <cleanup, minus CloseWindow> }
```
Keep the standalone `static Main()` as a thin driver so the example still runs on its own.
If an example can't run on single-threaded wasm, add its type to `DesktopExcludedFromBrowser` in
`ExampleRegistry.cs`; `BrowserOnly` is the inverse list. Assets under `resources/` are bundled
into the wasm virtual filesystem automatically.