libretro/RetroArch
1
0
Fork 0
mirror of https://github.com/libretro/RetroArch.git synced 2024-11-24 16:39:43 +00:00
Code Issues Actions 23 Packages Projects Releases Wiki Activity

emscripten: add a preview logo while loading

Browse Source
This commit is contained in:
Rob Loach 2016-09-09 22:36:09 -04:00
parent 834981d74a
commit 4163513ec7
No known key found for this signature in database
GPG Key ID: 627C60834A74A21A
4 changed files with 28 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
pkg/emscripten/play.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 103 KiB

18
pkg/emscripten/proto.css
View File

@ -11,6 +11,18 @@
background-color: black;
}
/**
* Webplayer Preview when not loaded.
*/
.webplayer-preview {
cursor: wait;
opacity: 0.3;
}
.webplayer-preview.loaded {
cursor: pointer;
opacity: 1;
}
/**
* Disable the border around the player.
*/
@ -34,9 +46,9 @@ canvas.webplayer {
to { -webkit-transform: rotate(360deg); }
}
textarea {
font-family: monospace;
font-size: 0.7em;
textarea {
font-family: monospace;
font-size: 0.7em;
height: 95%;
width: 95%;
border-style: none;

5
pkg/emscripten/proto.html
View File

@ -97,8 +97,9 @@
</nav>
<div class="bg-inverse webplayer-container">
<div class="container">
<div class="webplayer_border text-xs-center" id="canvas_div" style="display: none">
<canvas class="webplayer col-xs-12" id="canvas" tabindex="1" oncontextmenu="event.preventDefault()"></canvas>
<div class="webplayer_border text-xs-center" id="canvas_div">
<canvas class="webplayer col-xs-12" id="canvas" tabindex="1" oncontextmenu="event.preventDefault()" style="display: none"></canvas>
<img class="webplayer-preview img-fluid" src="play.jpg" width="900px" height="675px" alt="RetroArch Logo">
</div>
</div>
</div>

11
pkg/emscripten/proto.js
View File

@ -158,7 +158,8 @@ function stat(path)
function startRetroArch()
{
document.getElementById('canvas_div').style.display = 'block';
$('.webplayer').show();
$('.webplayer-preview').hide();
document.getElementById('btnDrop').disabled = true;
document.getElementById('btnRun').disabled = true;
@ -300,6 +301,14 @@ $(function() {
// Load the Core's related JavaScript.
$.getScript(core + '_libretro.js', function ()
{
/**
* Make the Preview image clickable to start RetroArch.
*/
$('.webplayer-preview').addClass('loaded').click(function () {
startRetroArch();
return false;
});
// Activate the Start RetroArch button.
$('#btnRun').removeClass('disabled');
$('#icnRun').removeClass('fa-spinner spinning');