EmulatorJS/index.html
2024-01-23 23:52:01 -06:00

133 lines
3.8 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>EmulatorJS Demo</title>
<link rel = icon href = docs/favicon.ico sizes = "16x16 32x32 48x48 64x64" type = image/vnd.microsoft.icon>
<meta name = viewport content = "width = device-width, initial-scale = 1">
<style>
body, html {
height: 100%;
background-color: black;
color: white;
}
body {
margin: 0;
overflow: hidden;
}
body, #box, #top {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
#box {
color: #aaa;
height: 20em;
width: 30em;
max-width: 80%;
max-height: 80%;
background-color: #333;
border-radius: 0.4em;
border: 2px solid #555;
position: relative;
flex-direction: column;
transition-duration: 0.2s;
overflow: hidden;
font-family: monospace;
font-weight: bold;
font-size: 20px;
margin: 5px;
}
#box:hover, #box[drag] {
border-color: #38f;
color: #ddd
}
#input {
cursor: pointer;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0
}
#display {
width: 100%;
height: 100%
}
select, button {
padding: 0.6em 0.4em;
margin: 0.5em;
width: 15em;
max-width: 100%;
font-family: monospace;
font-weight: bold;
font-size: 16px;
background-color: #444;
color: #aaa;
border-radius: 0.4em;
border: 1px solid #555;
cursor: pointer;
transition-duration: 0.2s
}
select:hover, button:hover {
background-color: #666;
color: #ddd
}
.logo {
width: 130px;
height: 130px;
filter: drop-shadow(0 0 10px white);
}
#top {
margin: 5px;
}
</style>
</head>
<body>
<div id="top">
<h1>EmulatorJS Demo</h1>
<img src="docs/Logo-light.png" alt="Logo" class="logo">
</div>
<div id = box>
<input type = file id = input>
Drag ROM file or click here
</div>
<script>
const div = document.createElement("div")
const sub = document.createElement("div")
const script = document.createElement("script")
sub.id = "game"
div.id = "display"
const topp = document.getElementById("top");
topp.remove();
box.remove()
div.appendChild(sub)
document.body.appendChild(div)
window.EJS_player = "#game";
window.EJS_biosUrl = "";
window.EJS_gameUrl = "BtnTest.gba";
window.EJS_core = "gba";
window.EJS_pathtodata = "data/";
window.EJS_startOnLoaded = true;
window.EJS_DEBUG_XX = true;
script.src = "data/loader.js";
document.body.appendChild(script);
</script>
</body>
</html>