VAR/GameLib
1
1
Fork 0
Code Issues 3 Pull Requests Packages Projects Releases Wiki Activity

Fixes for Emscripten

Browse Source
This commit is contained in:
Valeriano A.R.
2016-08-30 23:08:09 +02:00
committed by Valeriano A.R
parent a1f6657797
commit ea1a3b9d55
3 changed files with 136 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
Makefile.emscripten
View File

@@ -7,7 +7,7 @@ ECHO := echo
LIBS := LIBS :=
CFLAGS := -s FULL_ES2=1 -s ASM_JS=1 -O1 -Wno-implicit-function-declaration -DEMSCRIPTEN CFLAGS := -s FULL_ES2=1 -s ASM_JS=1 -O1 -Wno-implicit-function-declaration -DEMSCRIPTEN
LDFLAGS := --preload-file data LDFLAGS := --preload-file data -s TOTAL_MEMORY=134217728
RES_GAMELIB := libgame.a RES_GAMELIB := libgame.a
RES_GAME := game.html RES_GAME := game.html
@@ -16,7 +16,7 @@ BUILDDIR := build-emscripten
ifeq ($(target),release) ifeq ($(target),release)
CFLAGS := -s FULL_ES2=1 -s ASM_JS=1 -O1 --llvm-lto 1 -Wno-implicit-function-declaration -DEMSCRIPTEN CFLAGS := -s FULL_ES2=1 -s ASM_JS=1 -O1 --llvm-lto 1 -Wno-implicit-function-declaration -DEMSCRIPTEN
BUILDDIR := build-emscripten-release BUILDDIR := build-emscripten-release
LDFLAGS := --preload-file data LDFLAGS := --preload-file data -s TOTAL_MEMORY=134217728
endif endif
include Makefile.common include Makefile.common

17
web/play.html
View File

@@ -33,20 +33,24 @@
border-radius: 5px; border-radius: 5px;
padding: 5px; padding: 5px;
box-shadow: 0px 0px 5px #808080; box-shadow: 0px 0px 5px #808080;
width: 600px;
display: block;
margin: 0 auto;
} }
.progress-container progress{ .progress-container progress{
width:100%; width: 100%;
} }
.game-screen-container{ .game-screen-container{
margin:0 auto; display:block;
width:640px; width: 100%;
padding-top:10px; padding-top: 10px;
} }
.game-screen-container canvas{ .game-screen-container canvas{
border: 1px solid #808080; border: 1px solid #808080;
border-radius: 5px; border-radius: 5px;
padding: 5px; padding: 5px;
box-shadow: 0px 0px 5px #808080; box-shadow: 0px 0px 5px #808080;
margin: 0 auto;
} }
</style> </style>
<body> <body>
@@ -59,8 +63,11 @@
<span>Data:</span></br> <span>Data:</span></br>
<progress id="progress-data" max="1" value="0"></progress></br> <progress id="progress-data" max="1" value="0"></progress></br>
</div> </div>
<div style="width:0;height:0;position:absolute;display:block;overflow:hidden;">
<input type="button" id="btnFocus" value="focus" />
</div>
<canvas class="game-screen" id="canvas" style="display:none;" <canvas class="game-screen" id="canvas" style="display:none;"
oncontextmenu="event.preventDefault()"></canvas> oncontextmenu="event.preventDefault()" onclick="document.getElementById('btnFocus').focus();"></canvas>
</div> </div>
<script type='text/javascript'> <script type='text/javascript'>

122
web/playEmbbed.html Normal file
View File

@@ -0,0 +1,122 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Game</title>
</head>
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
font-family: Verdana,Arial,Helvetica,sans-serif;
background-color:#000000;
color: #777777;
font-size: 10pt;
}
h1{
text-align: left;
margin-top: 0;
margin-bottom: 1em;
font-size: 16pt;
font-weight: bold;
}
.header{
margin:0 auto;
width:600px;
padding-top:10px;
text-align:center;
}
.progress-container{
border: 1px solid #808080;
border-radius: 5px;
padding: 5px;
box-shadow: 0px 0px 5px #808080;
width: 600px;
display: block;
margin: 0 auto;
}
.progress-container progress{
width:100%;
}
</style>
<body>
<div id="progress-container" class="progress-container">
<h1>Loading...</h1>
<span>Code:</span></br>
<progress id="progress-code" max="1" value="0"></progress></br>
</br>
<span>Data:</span></br>
<progress id="progress-data" max="1" value="0"></progress></br>
</div>
<div style="width:0;height:0;position:absolute;display:block;overflow:hidden;">
<input type="button" id="btnFocus" value="focus" />
</div>
<canvas class="game-screen" id="canvas" style="display:none;"
oncontextmenu="event.preventDefault()" onclick="document.getElementById('btnFocus').focus();"></canvas>
<script type='text/javascript'>
var Module = {
preRun: [function (){
FS.mkdir('/saves');
FS.mount(IDBFS, {}, '/saves');
addRunDependency("SaveDir");
FS.syncfs(true, function (err) {
removeRunDependency("SaveDir");
});
}],
postRun: [],
canvas: document.getElementById('canvas'),
progressContainer: document.getElementById('progress-container'),
progressCode: document.getElementById('progress-code'),
progressData: document.getElementById('progress-data'),
print: function(text) {
if(console && console.log){
console.log(text);
}
},
printErr: function(text) {
this.print(text);
},
setStatus: function(text) {
this.print(text);
var m = text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/);
if(m){
this.progressData.value = parseInt(m[2]);
this.progressData.max = parseInt(m[4]);
}
},
totalDependencies: 0,
monitorRunDependencies: function(left) {
this.totalDependencies = Math.max(this.totalDependencies, left);
if(!left){
// All loaded
this.progressContainer.style.display="none";
this.canvas.style.display="block";
}
},
LaunchCode: function (){
var xhr = new XMLHttpRequest();
xhr.open('GET', "game.js", true);
xhr.responseType = 'text';
xhr.onprogress = function(event) {
this.progressCode.value = event.loaded;
this.progressCode.max = event.total;
}.bind(this);
xhr.onload = function(event) {
var packageData = xhr.response;
// Launch loaded code
eval.call(null,packageData);
};
xhr.onerror = function(event) {
alert(event);
};
xhr.send(null);
}
};
Module.LaunchCode();
</script>
<!-- <script async type="text/javascript" src="game.js"></script> -->
</body>
</html>