2013-11-09 23:00:20 -05:00
<!doctype html>
2016-08-02 19:37:01 -05: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 01:20:35 -05:00
. emscripten { padding-right : 0 ; margin-left : auto ; margin-right : auto ; display : block ; }
textarea . emscripten { border : 0 px ; font-family : 'Share Tech Mono' ; font-size : 12 px ; width : 100 % ; overflow : hide ; resize : none ; color : black ; }
div . emscripten , h1 { text-align : left ; }
2016-08-02 19:37:01 -05:00
div . canvas_border { background-color : gray ; width : 800 px ; height : 600 px ; margin-left : auto ; margin-right : auto ; }
2016-08-03 01:20:35 -05:00
canvas . emscripten { border : 0 px none ; }
2016-08-02 19:37:01 -05:00
< / style >
< / head >
< body >
< hr / >
2016-08-03 01:20:35 -05:00
< div class = "emscripten_border" id = "canvas_div" style = "display: none" >
< canvas class = "emscripten" id = "canvas" tabindex = "1" oncontextmenu = "event.preventDefault()" > < / canvas >
2016-08-02 19:37:01 -05:00
< / div >
2016-08-03 01:20:35 -05:00
< div class = "emscripten emscripten_border" id = "openrom" >
2016-08-02 19:38:46 -05:00
< button id = "btnLoad" onclick = "document.getElementById('rom').click()" > Upload Content< / button >
2016-08-03 01:20:35 -05:00
< input style = "display: none" type = "file" id = "rom" name = "upload" onclick = "document.getElementById('btnLoad').click();" onchange = "runEmulator(event.target.files);" multiple / >
2016-08-02 19:38:46 -05:00
< button id = "btnStart" onclick = "startRetroArch()" > Start RetroArch< / button >
2016-08-02 19:37:01 -05:00
< / div >
< hr / >
2016-08-03 01:20:35 -05:00
< div class = "emscripten" >
2013-11-09 23:00:20 -05: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-02 19:37:01 -05:00
< input type = "button" value = "Fullscreen" onclick = "Module.requestFullScreen(document.getElementById('pointerLock').checked, document.getElementById('resize').checked)" > < br >
2013-11-09 23:00:20 -05: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 21:48:32 +03:00
< input type = "checkbox" id = "sdl2" > < label for = "sdl2" id = "sdl2-label" > Enable SDL2< / label > < br >
2013-11-09 23:00:20 -05: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-02 19:37:01 -05:00
< / div >
2016-08-03 01:20:35 -05: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-02 19:37:01 -05:00
< / body >
< / html >
< script type = 'text/javascript' >
var count = 0 ;
2016-08-03 01:20:35 -05:00
function runEmulator ( files )
2016-08-02 19:37:01 -05:00
{
2016-08-03 01:20:35 -05:00
count = files . length ;
document . getElementById ( "openrom" ) . innerHTML = '' ;
document . getElementById ( "openrom" ) . style . display = 'none' ;
2018-01-15 10:03:50 -05:00
for ( var i = 0 ; i < files . length ; i ++ )
2016-08-03 01:20:35 -05:00
{
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-02 19:37:01 -05: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 01:20:35 -05:00
}
2016-08-02 19:37:01 -05:00
function uploadData ( data , name )
{
var dataView = new Uint8Array ( data ) ;
Module . FS _createDataFile ( '/' , name , dataView , true , false ) ;
}
2018-01-15 10:03:50 -05:00
var Module =
2016-08-02 19:37:01 -05:00
{
noInitialRun : true ,
arguments : [ "-v" , "--menu" ] ,
preRun : [ ] ,
postRun : [ ] ,
2018-01-15 10:03:50 -05:00
print : ( function ( )
2016-08-02 19:37:01 -05:00
{
2018-01-15 10:03:50 -05:00
return function ( text )
2016-08-02 19:37:01 -05:00
{
2018-01-15 10:06:06 -05:00
text = Array . prototype . slice . call ( arguments ) . join ( ' ' ) ;
console . log ( text ) ;
2016-08-02 19:37:01 -05:00
} ;
} ) ( ) ,
printErr : function ( text )
{
2018-01-15 10:03:50 -05:00
var errArgs = Array . prototype . slice . call ( arguments ) . join ( ' ' ) ;
2018-01-15 10:06:06 -05:00
console . error ( errArgs ) ;
2016-08-02 19:37:01 -05:00
} ,
canvas : document . getElementById ( 'canvas' ) ,
totalDependencies : 0 ,
2018-01-15 10:03:50 -05:00
monitorRunDependencies : function ( left )
2016-08-02 19:37:01 -05:00
{
this . totalDependencies = Math . max ( this . totalDependencies , left ) ;
}
} ;
< / script >
< script type = "text/javascript" src = "browserfs.js" > < / script >
2018-01-15 10:03:50 -05:00
< script type = "text/javascript" src = "gambatte.js" > < / script >
