156 lines
3.9 KiB
HTML
156 lines
3.9 KiB
HTML
<!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%;
|
|
}
|
|
|
|
.game-screen-container {
|
|
display: block;
|
|
width: 100%;
|
|
padding-top: 10px;
|
|
}
|
|
|
|
.game-screen-container canvas {
|
|
border: 1px solid #808080;
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
box-shadow: 0px 0px 5px #808080;
|
|
margin: 0 auto;
|
|
}
|
|
</style>
|
|
|
|
<body>
|
|
<div class="game-screen-container">
|
|
<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>
|
|
</div>
|
|
|
|
<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: [],
|
|
progressContainer: document.getElementById('progress-container'),
|
|
progressCode: document.getElementById('progress-code'),
|
|
progressData: document.getElementById('progress-data'),
|
|
printErr: function (text) {
|
|
if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');
|
|
if (console && console.log) {
|
|
console.log(text);
|
|
}
|
|
},
|
|
canvas: (function () {
|
|
var canvas = document.getElementById('canvas');
|
|
|
|
// As a default initial behavior, pop up an alert when webgl context is lost. To make your
|
|
// application robust, you may want to override this behavior before shipping!
|
|
// See http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.15.2
|
|
canvas.addEventListener("webglcontextlost", function (e) { alert('WebGL context lost. You will need to reload the page.'); e.preventDefault(); }, false);
|
|
|
|
return canvas;
|
|
})(),
|
|
setStatus: function (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
|
|
try {
|
|
eval.call(null, packageData);
|
|
} catch (e) {
|
|
alert("Error " + parent + " " + e);
|
|
parent.postMessage("Error", "");
|
|
}
|
|
};
|
|
xhr.onerror = function (event) {
|
|
alert(event);
|
|
};
|
|
xhr.send(null);
|
|
}
|
|
};
|
|
Module.LaunchCode();
|
|
</script>
|
|
</body>
|
|
|
|
</html> |