Merge pull request #6110 from fr500/master

cut down duplication
This commit is contained in:
Twinaphex 2018-01-15 04:51:56 +01:00 committed by GitHub
commit d2a0046f23
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 103 additions and 1348 deletions

View File

@ -1,99 +0,0 @@
/**
* RetroArch Web Player
*
* This provides the basic styling for the RetroArch web player.
*/
/**
* Make sure the background of the player is black.
*/
.webplayer-container {
background-color: black;
}
/**
* Webplayer Preview when not loaded.
*/
.webplayer-preview {
margin: 0 auto;
cursor: wait;
opacity: 0.2;
transition: all 0.8s;
-webkit-animation: loading 0.8s ease-in-out infinite alternate;
-moz-animation: loading 0.8s ease-in-out infinite alternate;
animation: loading 0.8s ease-in-out infinite alternate;
}
.webplayer-preview.loaded {
cursor: pointer;
opacity: 1;
-webkit-animation: loaded 0.8s ease-in-out;
-moz-animation: loaded 0.8s ease-in-out;
animation: loaded 0.8s ease-in-out;
}
@keyframes loaded {
from {
opacity: 0.2;
}
to {
opacity: 1;
}
}
@-moz-keyframes loaded {
from {
opacity: 0.2;
}
to {
opacity: 1;
}
}
@-webkit-keyframes loaded {
from {
opacity: 0.2;
}
to {
opacity: 1;
}
}
@keyframes loading{
from {
opacity: 0.2;
}
to {
opacity: 0.35;
}
}
@-moz-keyframes loading{
from {
opacity: 0.2;
}
to {
opacity: 0.35;
}
}
@-webkit-keyframes loading {
from {
opacity: 0.2;
}
to {
opacity: 0.35;
}
}
/**
* Disable the border around the player.
*/
canvas.webplayer {
border: none;
outline: none;
}
textarea {
font-family: monospace;
font-size: 0.7em;
height: 95%;
width: 95%;
border-style: none;
border-color: transparent;
overflow: auto;
resize: none;
}

View File

@ -1,429 +0,0 @@
/**
* RetroArch Web Player
*
* This provides the basic JavaScript for the RetroArch web player.
*/
var client = new Dropbox.Client({ key: "--your-api-key--" }); /* setup key*/
var BrowserFS = BrowserFS;
var afs;
var showError = function(error) {
switch (error.status) {
case Dropbox.ApiError.INVALID_TOKEN:
// If you're using dropbox.js, the only cause behind this error is that
// the user token expired.
// Get the user through the authentication flow again.
break;
case Dropbox.ApiError.NOT_FOUND:
// The file or folder you tried to access is not in the user's Dropbox.
// Handling this error is specific to your application.
break;
case Dropbox.ApiError.OVER_QUOTA:
// The user is over their Dropbox quota.
// Tell them their Dropbox is full. Refreshing the page won't help.
break;
case Dropbox.ApiError.RATE_LIMITED:
// Too many API requests. Tell the user to try again later.
// Long-term, optimize your code to use fewer API calls.
break;
case Dropbox.ApiError.NETWORK_ERROR:
// An error occurred at the XMLHttpRequest layer.
// Most likely, the user's network connection is down.
// API calls will not succeed until the user gets back online.
break;
case Dropbox.ApiError.INVALID_PARAM:
case Dropbox.ApiError.OAUTH_ERROR:
case Dropbox.ApiError.INVALID_METHOD:
default:
// Caused by a bug in dropbox.js, in your application, or in Dropbox.
// Tell the user an error occurred, ask them to refresh the page.
}
};
function cleanupStorage()
{
localStorage.clear();
if (BrowserFS.FileSystem.IndexedDB.isAvailable())
{
var req = indexedDB.deleteDatabase("RetroArch");
req.onsuccess = function () {
console.log("Deleted database successfully");
};
req.onerror = function () {
console.log("Couldn't delete database");
};
req.onblocked = function () {
console.log("Couldn't delete database due to the operation being blocked");
};
}
document.getElementById("btnClean").disabled = true;
}
function dropboxInit()
{
//document.getElementById("btnDrop").disabled = true;
//$('#icnDrop').removeClass('fa-dropbox');
//$('#icnDrop').addClass('fa-spinner fa-spin');
client.authDriver(new Dropbox.AuthDriver.Redirect());
client.authenticate({ rememberUser: true }, function(error, client)
{
if (error)
{
return showError(error);
}
dropboxSync(client, dropboxSyncComplete);
});
}
function dropboxSync(dropboxClient, cb)
{
var dbfs = new BrowserFS.FileSystem.Dropbox(dropboxClient);
// Wrap in afsFS.
afs = new BrowserFS.FileSystem.AsyncMirror(
new BrowserFS.FileSystem.InMemory(), dbfs);
afs.initialize(function(err)
{
// Initialize it as the root file system.
//BrowserFS.initialize(afs);
cb();
});
}
function dropboxSyncComplete()
{
//$('#icnDrop').removeClass('fa-spinner').removeClass('fa-spin');
//$('#icnDrop').addClass('fa-check');
console.log("WEBPLAYER: Dropbox sync successful");
setupFileSystem("dropbox");
preLoadingComplete();
}
function idbfsInit()
{
document.getElementById("btnLocal").disabled = true;
$('#icnLocal').removeClass('fa-globe');
$('#icnLocal').addClass('fa-spinner fa-spin');
var imfs = new BrowserFS.FileSystem.InMemory();
if (BrowserFS.FileSystem.IndexedDB.isAvailable())
{
afs = new BrowserFS.FileSystem.AsyncMirror(imfs,
new BrowserFS.FileSystem.IndexedDB(function(e, fs)
{
if (e)
{
//fallback to imfs
afs = new BrowserFS.FileSystem.InMemory();
console.log("WEBPLAYER: error: " + e + " falling back to in-memory filesystem");
setupFileSystem("browser");
preLoadingComplete();
}
else
{
// initialize afs by copying files from async storage to sync storage.
afs.initialize(function (e)
{
if (e)
{
afs = new BrowserFS.FileSystem.InMemory();
console.log("WEBPLAYER: error: " + e + " falling back to in-memory filesystem");
setupFileSystem("browser");
preLoadingComplete();
}
else
{
idbfsSyncComplete();
}
});
}
},
"RetroArch"));
}
}
function idbfsSyncComplete()
{
$('#icnLocal').removeClass('fa-spinner').removeClass('fa-spin');
$('#icnLocal').addClass('fa-check');
console.log("WEBPLAYER: idbfs setup successful");
setupFileSystem("browser");
preLoadingComplete();
}
function preLoadingComplete()
{
/* Make the Preview image clickable to start RetroArch. */
$('.webplayer-preview').addClass('loaded').click(function () {
startRetroArch();
return false;
});
document.getElementById("btnRun").disabled = false;
$('#btnRun').removeClass('disabled');
}
function setupFileSystem(backend)
{
/* create a mountable filesystem that will server as a root
mountpoint for browserfs */
var mfs = new BrowserFS.FileSystem.MountableFileSystem();
/* setup this if you setup your server to serve assets or core assets,
you can find more information in the included README */
/* create an XmlHttpRequest filesystem for the bundled data
uncomment this section if you want XMB assets, Overlays, Shaders, etc.
var xfs1 = new BrowserFS.FileSystem.XmlHttpRequest
("--your-assets-index-file-name--", "--your-index-url--");*/
/* create an XmlHttpRequest filesystem for content
uncomment this section if you want to serve content
var xfs2 = new BrowserFS.FileSystem.XmlHttpRequest
("--your-content-index-file-name--", "--your-index-url--");*/
console.log("WEBPLAYER: initializing filesystem: " + backend);
mfs.mount('/home/web_user/retroarch/userdata', afs);
/* setup this if you setup your server to serve assets or core assets,
you can find more information in the included README */
/*
mfs.mount('/home/web_user/retroarch/bundle', xfs1);
mfs.mount('/home/web_user/retroarch/userdata/content/', xfs2);
*/
BrowserFS.initialize(mfs);
var BFS = new BrowserFS.EmscriptenFS();
FS.mount(BFS, {root: '/home'}, '/home');
console.log("WEBPLAYER: " + backend + " filesystem initialization successful");
}
/**
* Retrieve the value of the given GET parameter.
*/
function getParam(name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (results) {
return results[1] || null;
}
}
function startRetroArch()
{
$('.webplayer').show();
$('.webplayer-preview').hide();
//document.getElementById("btnDrop").disabled = true;
document.getElementById("btnRun").disabled = true;
$('#btnFullscreen').removeClass('disabled');
$('#btnMenu').removeClass('disabled');
$('#btnAdd').removeClass('disabled');
$('#btnRom').removeClass('disabled');
document.getElementById("btnAdd").disabled = false;
document.getElementById("btnRom").disabled = false;
document.getElementById("btnMenu").disabled = false;
document.getElementById("btnFullscreen").disabled = false;
Module['callMain'](Module['arguments']);
document.getElementById('canvas').focus();
}
function selectFiles(files)
{
$('#btnAdd').addClass('disabled');
$('#icnAdd').removeClass('fa-plus');
$('#icnAdd').addClass('fa-spinner spinning');
var count = files.length;
for (var i = 0; i < files.length; i++)
{
filereader = new FileReader();
filereader.file_name = files[i].name;
filereader.readAsArrayBuffer(files[i]);
filereader.onload = function(){uploadData(this.result, this.file_name)};
filereader.onloadend = function(evt)
{
console.log("WEBPLAYER: file: " + this.file_name + " upload complete");
if (evt.target.readyState == FileReader.DONE)
{
$('#btnAdd').removeClass('disabled');
$('#icnAdd').removeClass('fa-spinner spinning');
$('#icnAdd').addClass('fa-plus');
}
}
}
}
function uploadData(data,name)
{
var dataView = new Uint8Array(data);
FS.createDataFile('/', name, dataView, true, false);
var data = FS.readFile(name,{ encoding: 'binary' });
FS.writeFile('/home/web_user/retroarch/userdata/content/' + name, data ,{ encoding: 'binary' });
FS.unlink(name);
}
var Module =
{
noInitialRun: true,
arguments: ["-v", "--menu"],
preRun: [],
postRun: [],
print: (function()
{
var element = document.getElementById('output');
element.value = ''; // clear browser cache
return function(text)
{
text = Array.prototype.slice.call(arguments).join(' ');
element.value += text + "\n";
element.scrollTop = 99999; // focus on bottom
};
})(),
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);
}
};
function switchCore(corename) {
localStorage.setItem("core", corename);
}
function switchStorage(backend) {
if (backend != localStorage.getItem("backend"))
{
localStorage.setItem("backend", backend);
location.reload();
}
}
// When the browser has loaded everything.
$(function() {
/**
* Attempt to disable some default browser keys.
*/
var keys = {
9: "tab",
13: "enter",
16: "shift",
18: "alt",
27: "esc",
33: "rePag",
34: "avPag",
35: "end",
36: "home",
37: "left",
38: "up",
39: "right",
40: "down",
112: "F1",
113: "F2",
114: "F3",
115: "F4",
116: "F5",
117: "F6",
118: "F7",
119: "F8",
120: "F9",
121: "F10",
122: "F11",
123: "F12"
};
window.addEventListener('keydown', function (e) {
if (keys[e.which]) {
e.preventDefault();
}
});
// Switch the core when selecting one.
$('#core-selector a').click(function () {
var coreChoice = $(this).data('core');
switchCore(coreChoice);
});
// Find which core to load.
var core = localStorage.getItem("core", core);
if (!core) {
core = 'gambatte';
}
// Make the core the selected core in the UI.
var coreTitle = $('#core-selector a[data-core="' + core + '"]').addClass('active').text();
$('#dropdownMenu1').text(coreTitle);
// Load the Core's related JavaScript.
$.getScript(core + '_libretro.js', function ()
{
$('#icnRun').removeClass('fa-spinner').removeClass('fa-spin');
$('#icnRun').addClass('fa-play');
if (localStorage.getItem("backend") == "dropbox")
{
$('#lblDrop').addClass('active');
$('#lblLocal').removeClass('active');
dropboxInit();
}
else
{
$('#lblDrop').removeClass('active');
$('#lblLocal').addClass('active');
idbfsInit();
}
});
});
function keyPress(k)
{
kp(k, "keydown");
setTimeout(function(){kp(k, "keyup")}, 50);
}
kp = function(k, event) {
var oEvent = document.createEvent('KeyboardEvent');
// Chromium Hack
Object.defineProperty(oEvent, 'keyCode', {
get : function() {
return this.keyCodeVal;
}
});
Object.defineProperty(oEvent, 'which', {
get : function() {
return this.keyCodeVal;
}
});
if (oEvent.initKeyboardEvent) {
oEvent.initKeyboardEvent(event, true, true, document.defaultView, false, false, false, false, k, k);
} else {
oEvent.initKeyEvent(event, true, true, document.defaultView, false, false, false, false, k, 0);
}
oEvent.keyCodeVal = k;
if (oEvent.keyCode !== k) {
alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")");
}
document.dispatchEvent(oEvent);
document.getElementById('canvas').focus();
}

View File

@ -1,153 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>RetroArch Web Player</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap core CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.3/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
<!-- Material Design Bootstrap -->
<link href="//cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.1.1/css/mdb.min.css" rel="stylesheet">
<link href="embed.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="media/retroarch.ico" />
</head>
<body>
<!--Navbar-->
<nav class="navbar navbar-dark bg-warning">
<div class="container">
<!--Collapse content-->
<div class="collapse navbar-toggleable-xs" id="collapseEx2">
<!--Links-->
<ul class="nav navbar-nav">
<div class="dropdown">
<li class="nav-item dropdown">
<button class="btn btn-warning dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Core Selection</button>
<div class="dropdown-menu dropdown-warning" aria-labelledby="dropdownMenu1" data-dropdown-in="fadeIn" data-dropdown-out="fadeOut" id="core-selector">
<a class="dropdown-item" href="." data-core="2048">2048</a>
<a class="dropdown-item" href="." data-core="4do">4DO</a>
<a class="dropdown-item" href="." data-core="bluemsx">BlueMSX</a>
<a class="dropdown-item" href="." data-core="craft">Craft</a>
<a class="dropdown-item" href="." data-core="desmume">DeSmuME</a>
<a class="dropdown-item" href="." data-core="dosbox">DOSBox</a>
<a class="dropdown-item" href="." data-core="easyrpg">EasyRPG</a>
<a class="dropdown-item" href="." data-core="fbalpha2012">FB Alpha 2012</a>
<a class="dropdown-item" href="." data-core="fbalpha2012_cps1">FB Alpha 2012 CPS1</a>
<a class="dropdown-item" href="." data-core="fbalpha2012_cps2">FB Alpha 2012 CPS2</a>
<a class="dropdown-item" href="." data-core="fbalpha2012_neo">FB Alpha 2012 NeoGeo</a>
<a class="dropdown-item" href="." data-core="fceumm">FCEUmm</a>
<a class="dropdown-item" href="." data-core="ffmpeg">FFmpeg</a>
<a class="dropdown-item" href="." data-core="gambatte">Gambatte</a>
<a class="dropdown-item" href="." data-core="glupen64">GLupeN64</a>
<a class="dropdown-item" href="." data-core="genesis_plus_gx">Genesis Plus GX</a>
<a class="dropdown-item" href="." data-core="gme">Game Music Emu</a>
<a class="dropdown-item" href="." data-core="gpsp">gPSP</a>
<a class="dropdown-item" href="." data-core="handy">Handy</a>
<a class="dropdown-item" href="." data-core="mame2000">MAME 2000</a>
<a class="dropdown-item" href="." data-core="mednafen_lynx">Mednafen Lynx</a>
<a class="dropdown-item" href="." data-core="mednafen_ngp">Mednafen Neo Geo Pocket</a>
<a class="dropdown-item" href="." data-core="mednafen_pce_fast">Mednafen PC Engine Fast</a>
<a class="dropdown-item" href="." data-core="mednafen_pcfx">Mednafen/Beetle PCFX</a>
<a class="dropdown-item" href="." data-core="mednafen_psx">Mednafen/Beetle PSX</a>
<!--<a class="dropdown-item" href="." data-core="mednafen_saturn">Mednafen/Beetle Saturn</a>-->
<a class="dropdown-item" href="." data-core="mednafen_snes">Mednafen/Beetle SNES</a>
<a class="dropdown-item" href="." data-core="mednafen_vb">Mednafen/Beetle Virtual Boy</a>
<a class="dropdown-item" href="." data-core="mednafen_wswan">Mednafen/Beetle WonderSwan</a>
<a class="dropdown-item" href="." data-core="mupen64plus">Mupen64 Plus</a>
<a class="dropdown-item" href="." data-core="nestopia">Nestopia</a>
<a class="dropdown-item" href="." data-core="nxengine">NX Engine</a>
<a class="dropdown-item" href="." data-core="o2em">O2em</a>
<a class="dropdown-item" href="." data-core="picodrive">PicoDrive</a>
<a class="dropdown-item" href="." data-core="prboom">PrBoom</a>
<a class="dropdown-item" href="." data-core="quicknes">QuickNES</a>
<a class="dropdown-item" href="." data-core="reicast">Reicast</a>
<a class="dropdown-item" href="." data-core="snes9x2002">Snes9x 2002</a>
<a class="dropdown-item" href="." data-core="snes9x2005">Snes9x 2005</a>
<a class="dropdown-item" href="." data-core="snes9x2010">Snes9x 2010</a>
<a class="dropdown-item" href="." data-core="snes9x">Snes9x</a>
<a class="dropdown-item" href="." data-core="stella">Stella</a>
<a class="dropdown-item" href="." data-core="tgbdual">TGB Dual</a>
<a class="dropdown-item" href="." data-core="tyrquake">TyrQuake</a>
<a class="dropdown-item" href="." data-core="vba_next">VBA Next</a>
<a class="dropdown-item" href="." data-core="vecx">Vecx</a>
<a class="dropdown-item" href="." data-core="virtualjaguar">Virtual Jaguar</a>
<a class="dropdown-item" href="." data-core="yabause">Yabause</a>
</div>
<button class="btn btn-warning disabled" id="btnRun" onclick="startRetroArch()" disabled>
<span class="fa fa-spinner fa-spin" id="icnRun"></span> Run
</button>
<button class="btn btn-warning disabled" id="btnAdd" onclick="document.getElementById('btnRom').click()" disabled>
<span class="fa fa-plus" id="icnAdd"></span> Add Content
</button>
<button class="btn btn-warning" id="btnClean" onclick="cleanupStorage();" title="Cleanup">
<span class="fa fa-trash-o" id="icnClean"></span> <span class="sr-only">Cleanup</span>
</button>
<input class="btn btn-warning disabled" style="display: none" type="file" id="btnRom" name="upload" onclick="document.getElementById('btnAdd').click();" onchange="selectFiles(event.target.files)" multiple />
<button class="btn btn-warning disabled" id="btnFullscreen" onclick="Module.requestFullScreen()" title="Fullscreen" disabled>
<span class="fa fa-desktop" id="icnAdd"></span> <span class="sr-only">Fullscreen</span>
</button>
<button class="btn btn-warning disabled" id="btnMenu" onclick="keyPress(112);" title="Menu toggle" disabled>
<span class="fa fa-bars" id="btnMenu"></span> <span class="sr-only">Menu</span>
</button>
</li>
</div>
</ul>
</div>
<!--/.Collapse content-->
</div>
</nav>
<div class="bg-inverse webplayer-container">
<div class="container">
<div class="webplayer_border text-xs-center" id="canvas_div">
<canvas class="webplayer" id="canvas" tabindex="1" oncontextmenu="event.preventDefault()" style="display: none"></canvas>
<img class="webplayer-preview img-fluid" src="media/canvas.png" width="960px" height="720px" alt="RetroArch Logo">
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12 form-group btn-group text-xs-center p-t-2">
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-warning" id="lblLocal" onclick=switchStorage("browser")>
<input type="radio" name="options" id="btnLocal" autocomplete="off" checked>
<span class="fa fa-globe" id="icnLocal"></span> Browser
</input>
</label>
<!--uncomment for dropbox support
<label class="btn btn-warning" id="lblDrop" onclick=switchStorage("dropbox")>
<input type="radio" name="options" id="btnDrop" autocomplete="off">
<span class="fa fa-dropbox" id="icnDrop"></span> Dropbox
</input>
</label>-->
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 form-group btn-group text-xs-center p-t-2">
<div class="card">
<div class="view overlay hm-white-slight" align="center">
<textarea id="output" rows="15"></textarea>
</div>
</div>
</div>
</div>
</div>
<div align="center">
<p>For now, we recommend you use <a href="https://www.google.com/chrome/">Google Chrome</a> for the best possible performance.</p>
<a href="http://www.libretro.com"><img align="center" src="media/libretro-logo.png" /></a>
</div>
<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="//rawgit.com/jeresig/jquery.hotkeys/master/jquery.hotkeys.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/tether/1.3.4/js/tether.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.3/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dropbox.js/0.10.2/dropbox.min.js"></script>
<!--script src="//wzrd.in/standalone/browserfs@0.6.1"></script-->
<script src="//bot.libretro.com/web/browserfs.min.js"></script>
<script src="embed.js"></script>
</body>
</html>

View File

@ -1,139 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<base target="_parent" />
<title>RetroArch Web Player</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap core CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.3/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
<!-- Material Design Bootstrap -->
<link href="//cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.1.1/css/mdb.min.css" rel="stylesheet">
<link href="itch.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="https://buildbot.libretro.com/web/media/retroarch.ico" />
</head>
<body>
<!--Navbar-->
<nav class="navbar navbar-dark bg-danger">
<div class="container">
<!--Collapse content-->
<div class="collapse navbar-toggleable-xs" id="collapseEx2">
<!--Navbar Brand-->
<!--Links-->
<ul class="nav navbar-nav">
<div class="dropdown">
<li class="nav-item dropdown">
<button class="btn btn-danger dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Core Selection</button>
<div class="dropdown-menu dropdown-danger" aria-labelledby="dropdownMenu1" data-dropdown-in="fadeIn" data-dropdown-out="fadeOut" id="core-selector">
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="2048">2048</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="4do">4DO</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="bluemsx">BlueMSX</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="craft">Craft</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="desmume">DeSmuME</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="dosbox">DOSBox</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="easyrpg">EasyRPG</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="fbalpha2012">FB Alpha 2012</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="fbalpha2012_cps1">FB Alpha 2012 CPS1</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="fbalpha2012_cps2">FB Alpha 2012 CPS2</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="fbalpha2012_neo">FB Alpha 2012 NeoGeo</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="fceumm">FCEUmm</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="ffmpeg">FFmpeg</a>-->
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="gambatte">Gambatte (GB/GBC)</a>
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="genesis_plus_gx">Genesis Plus GX (MD / GG / SMS)</a>
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="glupen64">GLupeN64 (Nintendo 64)</a>
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="gme">Game Music Emu</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="gpsp">gPSP</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="handy">Handy</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mame2000">MAME 2000</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_lynx">Mednafen Lynx</a>-->
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_ngp">Mednafen NeoPop (NGP)</a>
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_pce_fast">Mednafen PCE-Fast (PC-E/TG-16)</a>
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_pcfx">Mednafen/Beetle PCFX</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_psx">Mednafen/Beetle PSX</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_saturn">Mednafen/Beetle Saturn</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_snes">Mednafen/Beetle SNES</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_vb">Mednafen/Beetle Virtual Boy</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mednafen_wswan">Mednafen/Beetle WonderSwan</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="mupen64plus">Mupen64 Plus</a>-->
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="nestopia">Nestopia (NES)</a>
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="nxengine">NX Engine</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="o2em">O2em</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="picodrive">PicoDrive</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="prboom">PrBoom</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="quicknes">QuickNES</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="snes9x2002">Snes9x 2002</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="snes9x2005">Snes9x 2005</a>-->
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="snes9x2010">Snes9x 2010 (SNES)</a>
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="snes9x">Snes9x</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="stella">Stella</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="tgbdual">TGB Dual</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="tyrquake">TyrQuake</a>-->
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="vba_next">VBA Next (Gameboy Advance)</a>
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="vecx">Vecx</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="virtualjaguar">Virtual Jaguar</a>-->
<!--<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="yabause">Yabause</a>-->
</div>
<button class="btn btn-danger disabled" id="btnRun" onclick="startRetroArch()" title="Start RetroArch" disabled>
<span class="fa fa-spinner fa-spin" id="icnRun"></span> <span class="sr-only"></span>
</button>
<button class="btn btn-danger disabled" id="btnAdd" onclick="document.getElementById('btnRom').click()" title="Add Games" disabled>
<span class="fa fa-plus" id="icnAdd"></span> </span> <span class="sr-only"></span>
</button>
<button class="btn btn-danger" id="btnClean" onclick="cleanupStorage();" title="Cleanup">
<span class="fa fa-trash-o" id="icnClean"></span> <span class="sr-only">Cleanup</span>
</button>
<input class="btn btn-danger disabled" style="display: none" type="file" id="btnRom" name="upload" onclick="document.getElementById('btnAdd').click();" onchange="selectFiles(event.target.files)" multiple />
<button class="btn btn-danger disabled" id="btnFullscreen" onclick="Module.requestFullScreen()" title="Fullscreen" disabled>
<span class="fa fa-desktop" id="icnAdd"></span> <span class="sr-only">Fullscreen</span>
</button>
<button class="btn btn-danger disabled" id="btnMenu" onclick="keyPress(112);" title="Menu toggle" disabled>
<span class="fa fa-bars" id="btnMenu"></span> <span class="sr-only"></span>
</button>
<!--<button class="btn btn-danger" id="btnDrop" onclick=switchStorage() title="Storage backend">
<span class="fa fa-globe" id="icnDrop"></span> <span class="sr-only"></span>
</button>-->
</li>
</div>
</ul>
</div>
<!--/.Collapse content-->
</div>
</nav>
<div class="bg-inverse webplayer-container">
<div class="container">
<div class="webplayer_border text-xs-center" id="canvas_div">
<canvas class="webplayer" id="canvas" tabindex="1" oncontextmenu="event.preventDefault()" style="display: none"></canvas>
<img class="webplayer-preview img-fluid" src="https://buildbot.libretro.com/web/media/canvas.png" width="960px" height="720px" alt="RetroArch Logo">
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12 form-group btn-group text-xs-center p-t-2">
<div class="card">
<div class="view overlay hm-white-slight" align="center">
<textarea id="output" rows="15"></textarea>
</div>
</div>
</div>
</div>
</div>
<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="//rawgit.com/jeresig/jquery.hotkeys/master/jquery.hotkeys.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/tether/1.3.4/js/tether.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.3/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dropbox.js/0.10.2/dropbox.min.js"></script>
<!--script src="//wzrd.in/standalone/browserfs@0.6.1"></script-->
<script src="//bot.libretro.com/web/browserfs.min.js"></script>
<script src="itch.js"></script>
<div align="center">
<a href="https://www.patreon.com/libretro">
<img src="http://patreon_public_assets.s3.amazonaws.com/sized/becomeAPatronBanner.png" width="350" height"116"></a>
</div>
</body>
</html>

View File

@ -1,99 +0,0 @@
/**
* RetroArch Web Player
*
* This provides the basic styling for the RetroArch web player.
*/
/**
* Make sure the background of the player is black.
*/
.webplayer-container {
background-color: black;
}
/**
* Webplayer Preview when not loaded.
*/
.webplayer-preview {
margin: 0 auto;
cursor: wait;
opacity: 0.2;
transition: all 0.8s;
-webkit-animation: loading 0.8s ease-in-out infinite alternate;
-moz-animation: loading 0.8s ease-in-out infinite alternate;
animation: loading 0.8s ease-in-out infinite alternate;
}
.webplayer-preview.loaded {
cursor: pointer;
opacity: 1;
-webkit-animation: loaded 0.8s ease-in-out;
-moz-animation: loaded 0.8s ease-in-out;
animation: loaded 0.8s ease-in-out;
}
@keyframes loaded {
from {
opacity: 0.2;
}
to {
opacity: 1;
}
}
@-moz-keyframes loaded {
from {
opacity: 0.2;
}
to {
opacity: 1;
}
}
@-webkit-keyframes loaded {
from {
opacity: 0.2;
}
to {
opacity: 1;
}
}
@keyframes loading{
from {
opacity: 0.2;
}
to {
opacity: 0.35;
}
}
@-moz-keyframes loading{
from {
opacity: 0.2;
}
to {
opacity: 0.35;
}
}
@-webkit-keyframes loading {
from {
opacity: 0.2;
}
to {
opacity: 0.35;
}
}
/**
* Disable the border around the player.
*/
canvas.webplayer {
border: none;
outline: none;
}
textarea {
font-family: monospace;
font-size: 0.7em;
height: 95%;
width: 95%;
border-style: none;
border-color: transparent;
overflow: auto;
resize: none;
}

View File

@ -1,423 +0,0 @@
/**
* RetroArch Web Player
*
* This provides the basic JavaScript for the RetroArch web player.
*/
var client = new Dropbox.Client({ key: "il6e10mfd7pgf8r" });
var BrowserFS = BrowserFS;
var afs;
var showError = function(error) {
switch (error.status) {
case Dropbox.ApiError.INVALID_TOKEN:
// If you're using dropbox.js, the only cause behind this error is that
// the user token expired.
// Get the user through the authentication flow again.
break;
case Dropbox.ApiError.NOT_FOUND:
// The file or folder you tried to access is not in the user's Dropbox.
// Handling this error is specific to your application.
break;
case Dropbox.ApiError.OVER_QUOTA:
// The user is over their Dropbox quota.
// Tell them their Dropbox is full. Refreshing the page won't help.
break;
case Dropbox.ApiError.RATE_LIMITED:
// Too many API requests. Tell the user to try again later.
// Long-term, optimize your code to use fewer API calls.
break;
case Dropbox.ApiError.NETWORK_ERROR:
// An error occurred at the XMLHttpRequest layer.
// Most likely, the user's network connection is down.
// API calls will not succeed until the user gets back online.
break;
case Dropbox.ApiError.INVALID_PARAM:
case Dropbox.ApiError.OAUTH_ERROR:
case Dropbox.ApiError.INVALID_METHOD:
default:
// Caused by a bug in dropbox.js, in your application, or in Dropbox.
// Tell the user an error occurred, ask them to refresh the page.
}
};
function cleanupStorage()
{
localStorage.clear();
if (BrowserFS.FileSystem.IndexedDB.isAvailable())
{
var req = indexedDB.deleteDatabase("RetroArch");
req.onsuccess = function () {
console.log("Deleted database successfully");
};
req.onerror = function () {
console.log("Couldn't delete database");
};
req.onblocked = function () {
console.log("Couldn't delete database due to the operation being blocked");
};
}
document.getElementById("btnClean").disabled = true;
}
function dropboxInit()
{
document.getElementById('btnRun').disabled = true;
//document.getElementById('btnDrop').disabled = true;
//$('#icnDrop').removeClass('fa-dropbox');
//$('#icnDrop').addClass('fa-spinner fa-spin');
client.authDriver(new Dropbox.AuthDriver.Redirect());
client.authenticate({ rememberUser: true }, function(error, client)
{
if (error)
{
return showError(error);
}
dropboxSync(client, dropboxSyncComplete);
});
}
function dropboxSync(dropboxClient, cb)
{
var dbfs = new BrowserFS.FileSystem.Dropbox(dropboxClient);
// Wrap in afsFS.
afs = new BrowserFS.FileSystem.AsyncMirror(
new BrowserFS.FileSystem.InMemory(), dbfs);
afs.initialize(function(err)
{
// Initialize it as the root file system.
//BrowserFS.initialize(afs);
cb();
});
}
function dropboxSyncComplete()
{
document.getElementById('btnRun').disabled = false;
//document.getElementById('btnDrop').disabled = false;
//$('#icnDrop').removeClass('fa-spinner').removeClass('fa-spin');
//$('#icnDrop').addClass('fa-dropbox');
console.log("WEBPLAYER: Dropbox sync successful");
setupFileSystem("dropbox");
preLoadingComplete();
}
function idbfsInit()
{
document.getElementById("btnRun").disabled = true;
var imfs = new BrowserFS.FileSystem.InMemory();
if (BrowserFS.FileSystem.IndexedDB.isAvailable())
{
afs = new BrowserFS.FileSystem.AsyncMirror(imfs,
new BrowserFS.FileSystem.IndexedDB(function(e, fs)
{
if (e)
{
//fallback to imfs
afs = new BrowserFS.FileSystem.InMemory();
console.log("WEBPLAYER: error: " + e + " falling back to in-memory filesystem");
setupFileSystem("browser");
preLoadingComplete();
}
else
{
// initialize afs by copying files from async storage to sync storage.
afs.initialize(function (e)
{
if (e)
{
afs = new BrowserFS.FileSystem.InMemory();
console.log("WEBPLAYER: error: " + e + " falling back to in-memory filesystem");
setupFileSystem("browser");
preLoadingComplete();
}
else
{
idbfsSyncComplete();
}
});
}
},
"RetroArch"));
}
}
function idbfsSyncComplete()
{
$('#icnRun').removeClass('fa-spinner').removeClass('fa-spin');
$('#icnRun').addClass('fa-play');
console.log("WEBPLAYER: idbfs setup successful");
setupFileSystem("browser");
preLoadingComplete();
}
function preLoadingComplete()
{
/* Make the Preview image clickable to start RetroArch. */
$('.webplayer-preview').addClass('loaded').click(function () {
startRetroArch();
return false;
});
document.getElementById("btnRun").disabled = false;
$('#btnRun').removeClass('disabled');
}
function setupFileSystem(backend)
{
/* create a mountable filesystem that will server as a root
mountpoint for browserfs */
var mfs = new BrowserFS.FileSystem.MountableFileSystem();
/* create an XmlHttpRequest filesystem for the bundled data */
var xfs1 = new BrowserFS.FileSystem.XmlHttpRequest
(".index-xhr", "https://bot.libretro.com/assets/frontend/bundle/");
/* create an XmlHttpRequest filesystem for core assets */
var xfs2 = new BrowserFS.FileSystem.XmlHttpRequest
(".index-xhr", "https://bot.libretro.com/assets/cores/");
console.log("WEBPLAYER: initializing filesystem: " + backend);
mfs.mount('/home/web_user/retroarch/userdata', afs);
mfs.mount('/home/web_user/retroarch/bundle', xfs1);
mfs.mount('/home/web_user/retroarch/userdata/content/downloads', xfs2);
BrowserFS.initialize(mfs);
var BFS = new BrowserFS.EmscriptenFS();
FS.mount(BFS, {root: '/home'}, '/home');
console.log("WEBPLAYER: " + backend + " filesystem initialization successful");
}
/**
* Retrieve the value of the given GET parameter.
*/
function getParam(name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (results) {
return results[1] || null;
}
}
function startRetroArch()
{
$('.webplayer').show();
$('.webplayer-preview').hide();
//document.getElementById('btnDrop').disabled = true;
document.getElementById('btnRun').disabled = true;
$('#btnFullscreen').removeClass('disabled');
$('#btnMenu').removeClass('disabled');
$('#btnAdd').removeClass('disabled');
$('#btnRom').removeClass('disabled');
document.getElementById("btnAdd").disabled = false;
document.getElementById("btnRom").disabled = false;
document.getElementById("btnMenu").disabled = false;
document.getElementById("btnFullscreen").disabled = false;
Module['callMain'](Module['arguments']);
document.getElementById('canvas').focus();
}
function selectFiles(files)
{
$('#btnAdd').addClass('disabled');
$('#icnAdd').removeClass('fa-plus');
$('#icnAdd').addClass('fa-spinner spinning');
var count = files.length;
for (var i = 0; i < files.length; i++)
{
filereader = new FileReader();
filereader.file_name = files[i].name;
filereader.readAsArrayBuffer(files[i]);
filereader.onload = function(){uploadData(this.result, this.file_name)};
filereader.onloadend = function(evt)
{
console.log("WEBPLAYER: file: " + this.file_name + " upload complete");
if (evt.target.readyState == FileReader.DONE)
{
$('#btnAdd').removeClass('disabled');
$('#icnAdd').removeClass('fa-spinner spinning');
$('#icnAdd').addClass('fa-plus');
}
}
}
}
function uploadData(data,name)
{
var dataView = new Uint8Array(data);
FS.createDataFile('/', name, dataView, true, false);
var data = FS.readFile(name,{ encoding: 'binary' });
FS.writeFile('/home/web_user/retroarch/userdata/content/' + name, data ,{ encoding: 'binary' });
FS.unlink(name);
}
var Module =
{
noInitialRun: true,
arguments: ["-v", "--menu"],
preRun: [],
postRun: [],
print: (function()
{
var element = document.getElementById('output');
element.value = ''; // clear browser cache
return function(text)
{
text = Array.prototype.slice.call(arguments).join(' ');
element.value += text + "\n";
element.scrollTop = 99999; // focus on bottom
};
})(),
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);
}
};
function switchCore(corename) {
localStorage.setItem("core", corename);
}
function switchStorage() {
if (localStorage.getItem("backend") == "dropbox")
{
localStorage.setItem("backend", "browser");
location.reload();
}
else
{
localStorage.setItem("backend", "dropbox");
location.reload();
}
}
// When the browser has loaded everything.
$(function() {
/**
* Attempt to disable some default browser keys.
*/
var keys = {
9: "tab",
13: "enter",
16: "shift",
18: "alt",
27: "esc",
33: "rePag",
34: "avPag",
35: "end",
36: "home",
37: "left",
38: "up",
39: "right",
40: "down",
112: "F1",
113: "F2",
114: "F3",
115: "F4",
116: "F5",
117: "F6",
118: "F7",
119: "F8",
120: "F9",
121: "F10",
122: "F11",
123: "F12"
};
window.addEventListener('keydown', function (e) {
if (keys[e.which]) {
e.preventDefault();
}
});
// Switch the core when selecting one.
$('#core-selector a').click(function () {
var coreChoice = $(this).data('core');
switchCore(coreChoice);
});
// Find which core to load.
var core = localStorage.getItem("core", core);
if (!core) {
core = 'gambatte';
}
// Make the core the selected core in the UI.
var coreTitle = $('#core-selector a[data-core="' + core + '"]').addClass('active').text();
$('#dropdownMenu1').text(coreTitle);
// Load the Core's related JavaScript.
$.getScript(core + '_libretro.js', function ()
{
if (localStorage.getItem("backend") == "dropbox")
{
//$('#icnDrop').removeClass('fa-globe');
//$('#icnDrop').addClass('fa-dropbox');
dropboxInit();
}
else
{
//$('#icnDrop').addClass('fa-globe');
//$('#icnDrop').removeClass('fa-dropbox');
idbfsInit();
}
});
});
function keyPress(k)
{
kp(k, "keydown");
setInterval(function(){kp(k, "keyup")}, 1000);
}
kp = function(k, event) {
var oEvent = document.createEvent('KeyboardEvent');
// Chromium Hack
Object.defineProperty(oEvent, 'keyCode', {
get : function() {
return this.keyCodeVal;
}
});
Object.defineProperty(oEvent, 'which', {
get : function() {
return this.keyCodeVal;
}
});
if (oEvent.initKeyboardEvent) {
oEvent.initKeyboardEvent(event, true, true, document.defaultView, false, false, false, false, k, k);
} else {
oEvent.initKeyEvent(event, true, true, document.defaultView, false, false, false, false, k, 0);
}
oEvent.keyCodeVal = k;
if (oEvent.keyCode !== k) {
alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")");
}
document.dispatchEvent(oEvent);
document.getElementById('canvas').focus();
}

View File

@ -0,0 +1,100 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>RetroArch Web Player</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap core CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.3/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
<!-- Material Design Bootstrap -->
<link href="//cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.1.1/css/mdb.min.css" rel="stylesheet">
<link href="libretro.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="https://web.libretro.com/media/retroarch.ico" />
</head>
<body>
<!--Navbar-->
<nav class="navbar navbar-dark bg-primary">
<div class="container">
<!--Collapse content-->
<div class="collapse navbar-toggleable-xs" id="collapseEx2">
<!--Links-->
<ul class="nav navbar-nav">
<div class="dropdown">
<li class="nav-item dropdown">
<button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Core Selection</button>
<div class="dropdown-menu dropdown-primary" aria-labelledby="dropdownMenu1" data-dropdown-in="fadeIn" data-dropdown-out="fadeOut" id="core-selector">
<a class="dropdown-item" href="." data-core="fceumm">FCEUmm</a>
<a class="dropdown-item" href="." data-core="gambatte">Gambatte</a>
<a class="dropdown-item" href="." data-core="genesis_plus_gx">Genesis Plus GX</a>
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="nestopia">Nestopia (NES)</a>
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="snes9x2010">Snes9x 2010 (SNES)</a>
<a class="dropdown-item" href="https://libretro.itch.io/retroarch" data-core="vba_next">VBA Next (Gameboy Advance)</a>
</div>
<button class="btn btn-primary disabled" id="btnRun" onclick="startRetroArch()" disabled>
<span class="fa fa-spinner fa-spin" id="icnRun"></span> Run
</button>
<button class="btn btn-primary disabled" id="btnAdd" onclick="document.getElementById('btnRom').click()" disabled>
<span class="fa fa-plus" id="icnAdd"></span> Add Content
</button>
<button class="btn btn-primary tooltip-enable" id="btnClean" onclick="cleanupStorage();" title="Cleanup storage">
<span class="fa fa-trash-o" id="icnClean"></span> <span class="sr-only">Cleanup</span>
</button>
<input class="btn btn-primary disabled" style="display: none" type="file" id="btnRom" name="upload" onclick="document.getElementById('btnAdd').click();" onchange="selectFiles(event.target.files)" multiple />
<button class="btn btn-primary disabled tooltip-enable" id="btnMenu" onclick="keyPress(112);" title="Menu toggle" disabled>
<span class="fa fa-bars" id="btnMenu"></span> <span class="sr-only">Menu</span>
</button>
<button class="btn btn-primary disabled tooltip-enable" id="btnFullscreen" onclick="Module.requestFullScreen()" title="Fullscreen" disabled>
<span class="fa fa-desktop" id="icnAdd"></span> <span class="sr-only">Fullscreen</span>
</button>
</li>
</div>
</ul>
</div>
<!--/.Collapse content-->
</div>
</nav>
<div class="bg-inverse webplayer-container">
<div class="container">
<div class="webplayer_border text-xs-center" id="canvas_div">
<canvas class="webplayer" id="canvas" tabindex="1" oncontextmenu="event.preventDefault()" style="display: none"></canvas>
<img class="webplayer-preview img-fluid" src="media/canvas.png" width="960px" height="720px" alt="RetroArch Logo">
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12 form-group btn-group text-xs-center p-t-2">
<div class="card">
<div class="view overlay hm-white-slight" align="center">
<textarea id="output" rows="15"></textarea>
</div>
</div>
</div>
</div>
</div>
<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="//rawgit.com/jeresig/jquery.hotkeys/master/jquery.hotkeys.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/tether/1.3.4/js/tether.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.3/js/bootstrap.min.js"></script>
<script src="analytics.js"></script>
<!--script src="//wzrd.in/standalone/browserfs@0.6.1"></script-->
<script src="//web.libretro.com/browserfs.min.js"></script>
<script src="libretro.js"></script>
<div align="center">
<a href="https://www.patreon.com/libretro">
<img src="https://patreon_public_assets.s3.amazonaws.com/sized/becomeAPatronBanner.png" width="350" height="116"></a>
</div>
</body>
</html>

View File

@ -286,12 +286,9 @@ $(function() {
{
$('#icnRun').removeClass('fa-spinner').removeClass('fa-spin');
$('#icnRun').addClass('fa-play');
$('#lblDrop').removeClass('active');
$('#lblLocal').addClass('active');
idbfsInit();
$('#lblDrop').removeClass('active');
$('#lblLocal').addClass('active');
idbfsInit();
});
});