2013-11-10 04:00:20 +00:00
<!doctype html>
2016-08-03 00:37:01 +00:00
< html lang = "en" >
< head >
< meta charset = "utf-8" >
< title > RetroArch Web Player< / title >
< script type = "text/javascript" src = "browserfs.js" > < / script >
< style >
2016-08-03 06:20:35 +00:00
.emscripten { padding-right: 0; margin-left: auto; margin-right: auto; display: block; }
textarea.emscripten { border: 0px; font-family: 'Share Tech Mono'; font-size: 12px; width: 100%; overflow:hide; resize:none; color:black; }
div.emscripten, h1 { text-align: left; }
2016-08-03 00:37:01 +00:00
div.canvas_border { background-color:gray; width:800px; height:600px; margin-left: auto; margin-right: auto; }
2016-08-03 06:20:35 +00:00
canvas.emscripten { border: 0px none; }
2016-08-03 00:37:01 +00:00
< / style >
< / head >
< body >
< hr / >
2016-08-03 06:20:35 +00:00
< div class = "emscripten_border" id = "canvas_div" style = "display: none" >
< canvas class = "emscripten" id = "canvas" tabindex = "1" oncontextmenu = "event.preventDefault()" > < / canvas >
2016-08-03 00:37:01 +00:00
< / div >
2016-08-03 06:20:35 +00:00
< div class = "emscripten emscripten_border" id = "openrom" >
2016-08-03 00:38:46 +00:00
< button id = "btnLoad" onclick = "document.getElementById('rom').click()" > Upload Content< / button >
2016-08-03 06:20:35 +00:00
< input style = "display: none" type = "file" id = "rom" name = "upload" onclick = "document.getElementById('btnLoad').click();" onchange = "runEmulator(event.target.files);" multiple / >
2016-08-03 00:38:46 +00:00
< button id = "btnStart" onclick = "startRetroArch()" > Start RetroArch< / button >
2016-08-03 00:37:01 +00:00
< / div >
< hr / >
2016-08-03 06:20:35 +00:00
< div class = "emscripten" >
2013-11-10 04:00:20 +00:00
< input type = "checkbox" id = "resize" > < label for = "resize" > Resize canvas< / label >
< input type = "checkbox" id = "pointerLock" checked > < label for = "pointerLock" > Lock/hide mouse pointer< / label >
2016-08-03 00:37:01 +00:00
< input type = "button" value = "Fullscreen" onclick = "Module.requestFullScreen(document.getElementById('pointerLock').checked, document.getElementById('resize').checked)" > < br >
2013-11-10 04:00:20 +00:00
< input type = "checkbox" id = "vsync" > < label for = "vsync" id = "vsync-label" > Enable V-sync (can only be done before loading game)< / label > < br >
2016-07-31 18:48:32 +00:00
< input type = "checkbox" id = "sdl2" > < label for = "sdl2" id = "sdl2-label" > Enable SDL2< / label > < br >
2013-11-10 04:00:20 +00:00
< input type = "textbox" id = "latency" size = "3" maxlength = "3" value = "96" > < label for = "latency" id = "latency-label" > Audio latency (ms) (increase if you hear pops at fullspeed, can only be done before loading game)< / label >
2016-08-03 00:37:01 +00:00
< / div >
< hr / >
2016-08-03 06:20:35 +00:00
< textarea class = "emscripten" id = "output" rows = "8" > < / textarea >
2016-08-03 00:37:01 +00:00
< hr >
2016-08-03 06:20:35 +00:00
< div class = "emscripten" id = "controls" >
Controls:< br >
< br >
A button (OK in menu): X< br >
B button (Back in menu): Z< br >
X Button: S< br >
Y Button: A< br >
L Button: Q< br >
R Button: W< br >
D-pad: Arrow Keys< br >
Start Button: Enter< br >
Select Button: Shift< br >
Toggle Menu: F1< br >
Fast forward: Spacebar (toggle)< br >
Slow motion: E (hold)< / br >
Save state: F2< br >
Load state: F4
< / div >
2016-08-03 00:37:01 +00:00
< / body >
< / html >
< script type = 'text/javascript' >
var count = 0;
2016-08-03 06:20:35 +00:00
function runEmulator(files)
2016-08-03 00:37:01 +00:00
{
2016-08-03 06:20:35 +00:00
count = files.length;
document.getElementById("openrom").innerHTML = '';
document.getElementById("openrom").style.display = 'none';
for (var i = 0; i < files.length ; i + + )
{
filereader = new FileReader();
filereader.file_name = files[i].name;
filereader.onload = function(){uploadData(this.result, this.file_name)};
filereader.readAsArrayBuffer(files[i]);
}
}
function startRetroArch()
{
2016-08-03 00:37:01 +00:00
Module.FS_createFolder('/', 'etc', true, true);
Module.FS_createFolder('/', 'config', true, true);
Module.FS_createFolder('/', 'content', true, true);
Module.FS_createFolder('/', 'savefiles', true, true);
Module.FS_createFolder('/', 'savestates', true, true);
var config = 'input_player1_select = shift\n';
var latency = parseInt(document.getElementById('latency').value, 10);
if (isNaN(latency)) latency = 96;
config += 'audio_latency = ' + latency + '\n'
if (document.getElementById('vsync').checked)
config += 'video_vsync = true\n';
else
config += 'video_vsync = false\n';
Module.FS_createDataFile('/etc', 'retroarch.cfg', config, true, true);
document.getElementById('canvas_div').style.display = 'block';
document.getElementById('vsync').disabled = true;
document.getElementById('vsync-label').style.color = 'gray';
document.getElementById('latency').disabled = true;
document.getElementById('latency-label').style.color = 'gray';
Module['callMain'](Module['arguments']);
2016-08-03 06:20:35 +00:00
}
2016-08-03 00:37:01 +00:00
function uploadData(data, name)
{
var dataView = new Uint8Array(data);
Module.FS_createDataFile('/', name, dataView, true, false);
}
var Module =
{
noInitialRun: true,
arguments: ["-v", "--menu"],
preRun: [],
postRun: [],
print: (function()
{
var element = document.getElementById('output');
element.value = ''; // clear browser cache
return function(text)
{
2013-11-10 04:00:20 +00:00
text = Array.prototype.slice.call(arguments).join(' ');
element.value += text + "\n";
element.scrollTop = 99999; // focus on bottom
2016-08-03 00:37:01 +00:00
};
})(),
printErr: function(text)
{
var text = Array.prototype.slice.call(arguments).join(' ');
var element = document.getElementById('output');
element.value += text + "\n";
element.scrollTop = 99999; // focus on bottom
},
canvas: document.getElementById('canvas'),
totalDependencies: 0,
monitorRunDependencies: function(left)
{
this.totalDependencies = Math.max(this.totalDependencies, left);
}
};
< / script >
< script type = "text/javascript" src = "browserfs.js" > < / script >
2016-08-03 00:38:46 +00:00
< script type = "text/javascript" src = "gambatte.js" > < / script >
