-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathbuild-wasm.sh
126 lines (111 loc) · 3.55 KB
/
build-wasm.sh
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
#!/usr/bin/env bash
set -e
HELP_STRING=$(cat <<- END
usage: build_wasm.sh
Build script for combining a Macroquad project with wasm-bindgen,
allowing integration with the greater wasm-ecosystem.
example: ./build_wasm.sh
This'll go through the following steps:
1. Build as target 'wasm32-unknown-unknown'.
2. Create the directory 'dist' if it doesn't already exist.
3. Run wasm-bindgen with output into the 'dist' directory.
4. Apply patches to the output js file (detailed here: https://github.com/not-fl3/macroquad/issues/212#issuecomment-835276147).
5. Generate coresponding 'index.html' file.
Author: Tom Solberg <[email protected]>
Edit: Nik codes <[email protected]>
Edit: Nobbele <[email protected]>
Edit: profan <[email protected]>
Version: 0.3
END
)
die () {
echo >&2 "Error: $@"
echo >&2
echo >&2 "$HELP_STRING"
exit 1
}
# Parse primary commands
while [[ $# -gt 0 ]]
do
key="$1"
case $key in
--release)
RELEASE=yes
shift
;;
-h|--help)
echo "$HELP_STRING"
exit 0
;;
*)
POSITIONAL+=("$1")
shift
;;
esac
done
# Restore positionals
set -- "${POSITIONAL[@]}"
PROJECT_NAME=$1
echo ${PROJECT_NAME}
HTML=$(cat <<- END
<html lang="en">
<head>
<meta charset="utf-8">
<title>${PROJECT_NAME}</title>
<style>
html,
body,
canvas {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
z-index: 0;
}
</style>
</head>
<body style="margin: 0; padding: 0; height: 100vh; width: 100vw;">
<canvas id="glcanvas" tabindex='1' hidden></canvas>
<script src="https://not-fl3.github.io/miniquad-samples/mq_js_bundle.js"></script>
<script type="module">
import init, { set_wasm } from "./${PROJECT_NAME}.js";
async function impl_run() {
let wbg = await init();
miniquad_add_plugin({
register_plugin: (a) => (a.wbg = wbg),
on_init: () => set_wasm(wasm_exports),
version: "0.0.1",
name: "wbg",
});
load("./${PROJECT_NAME}_bg.wasm");
}
window.run = function() {
document.getElementById("run-container").remove();
document.getElementById("glcanvas").removeAttribute("hidden");
document.getElementById("glcanvas").focus();
impl_run();
}
</script>
<div id="run-container" style="display: flex; justify-content: center; align-items: center; height: 100%; flex-direction: column;">
<p>Game can't play audio unless a button has been clicked.</p>
<button onclick="run()">Run Game</button>
</div>
</body>
</html>
END
)
# Build
cargo build --package $PROJECT_NAME --target wasm32-unknown-unknown
# Generate bindgen outputs
mkdir -p dist
wasm-bindgen target/wasm32-unknown-unknown/debug/$PROJECT_NAME.wasm --out-dir dist --target web --no-typescript
# Shim to tie the thing together
sed -i "s/import \* as __wbg_star0 from 'env';//" dist/$PROJECT_NAME.js
sed -i "s/let wasm;/let wasm; export const set_wasm = (w) => wasm = w;/" dist/$PROJECT_NAME.js
sed -i "s/imports\['env'\] = __wbg_star0;/return imports.wbg\;/" dist/$PROJECT_NAME.js
sed -i "s/const imports = __wbg_get_imports();/return __wbg_get_imports();/" dist/$PROJECT_NAME.js
# Create index from the HTML variable
echo "$HTML" > dist/index.html
cp -r ./assets ./dist/assets