TheCloud/v
1
0
Fork 0
mirror of https://github.com/vlang/v.git synced 2025-09-08 14:51:53 -04:00
Code Issues Packages Projects Releases Wiki Activity

examples/tetris: add instructions, on how to compile the game through Emscripten and v -os wasm32_emscripten

Browse Source
This commit is contained in:
Delyan Angelov 2023-08-13 16:59:35 +03:00
parent 59f831059c
commit ca0f589310
No known key found for this signature in database
GPG Key ID: 66886C0F12D595ED
4 changed files with 54 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
examples/tetris/.gitignore vendored Normal file
View File

@ -0,0 +1,3 @@
tetris
tetris.wasm
main

34
examples/tetris/README.md
View File

@ -14,4 +14,36 @@ sudo apt install libgl-dev
v -b js_browser examples/tetris/tetris.js.v
```
And then open `index.html` with your favourite web browser.
And then open `index.html` with your favourite web browser.
## Compiling to WASM
1. Install Emscripten from https://emscripten.org/docs/getting_started/downloads.html
2. Make sure that the environment in your shell is setup correctly,
i.e. that `emcc --version` works.
```sh
. /opt/emsdk/emsdk_env.sh
emcc --version
```
3. Compile the game to WASM:
```sh
v -skip-unused -prod -os wasm32_emscripten examples/tetris/`
```
4. Copy the generated `tetris` file to `index.js`
This can be done once. Note that this step will be removed soon, when
the option `-os wasm32_emscripten` becomes better integrated:
```sh
cp examples/tetris/tetris examples/tetris/tetris.js
```
5. Run/test the game:
```sh
emrun examples/tetris/index.html
```
Once you have run the game, you can make changes,
then just recompile (step 3), and refresh the game in your browser.

15
examples/tetris/index.html
View File

@ -1,4 +1,17 @@
<!doctype html>
<html lang="en-us">
<head>
<meta charset=utf-8>
<meta content="text/html; charset=utf-8" http-equiv=Content-Type>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>V Tetris</title>
</head>
<body class="main">
<canvas width="200" height="400" id="canvas" style="border: 1px solid black;"></canvas>
<script src="tetris.js"></script>
</body>
<script>
const m = Module()
</script>
</body>
</head>

5
vlib/gg/gg.c.v
View File

@ -16,6 +16,8 @@ $if windows {
#include "windows.h"
}
#flag wasm32_emscripten --embed-file @VEXEROOT/examples/assets/fonts/RobotoMono-Regular.ttf@/assets/fonts/RobotoMono-Regular.ttf
// call Windows API to get screen size
fn C.GetSystemMetrics(int) int
@ -58,6 +60,7 @@ pub:
create_window bool
// window_user_ptr voidptr
window_title string
html5_canvas_name string = 'canvas'
borderless_window bool
always_on_top bool
bg_color gx.Color
@ -465,7 +468,7 @@ pub fn new_context(cfg Config) &Context {
fail_userdata_cb: gg_fail_fn
cleanup_userdata_cb: gg_cleanup_fn
window_title: &char(cfg.window_title.str)
html5_canvas_name: &char(cfg.window_title.str)
html5_canvas_name: &char(cfg.html5_canvas_name.str)
width: cfg.width
height: cfg.height
sample_count: cfg.sample_count