mirror of
https://github.com/EmulatorJS/EmulatorJS.git
synced 2024-09-20 02:46:23 +00:00
Add demo index.html
This commit is contained in:
parent
d8d6db6d82
commit
208d19a5d8
2 changed files with 205 additions and 19 deletions
20
a.html
Normal file
20
a.html
Normal file
|
@ -0,0 +1,20 @@
|
|||
<div style='width:640px;height:480px;max-width:100%'>
|
||||
<div id='game'></div>
|
||||
</div>
|
||||
|
||||
<script type='text/javascript'>
|
||||
EJS_player = '#game';
|
||||
EJS_core = 'nes';
|
||||
EJS_gameUrl = 'roms/mega_mountain.nes';
|
||||
EJS_DEBUG_XX = true;
|
||||
//EJS_AdUrl = "https://www.google.com/search?igu=1";
|
||||
/*
|
||||
EJS_Buttons = {
|
||||
mute: false,
|
||||
volume: true,
|
||||
}*/
|
||||
EJS_volume = 1;
|
||||
//EJS_startOnLoaded = true;
|
||||
//EJS_loadStateURL = "mega_mountain.state";
|
||||
</script>
|
||||
<script src='data/loader.js'></script>
|
204
index.html
204
index.html
|
@ -1,20 +1,186 @@
|
|||
<div style='width:640px;height:480px;max-width:100%'>
|
||||
<div id='game'></div>
|
||||
</div>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8832864985153925" crossorigin="anonymous"></script>
|
||||
<title>EmulatorJS</title>
|
||||
|
||||
<script type='text/javascript'>
|
||||
EJS_player = '#game';
|
||||
EJS_core = 'nes';
|
||||
EJS_gameUrl = 'roms/mega_mountain.nes';
|
||||
EJS_DEBUG_XX = true;
|
||||
//EJS_AdUrl = "https://www.google.com/search?igu=1";
|
||||
/*
|
||||
EJS_Buttons = {
|
||||
mute: false,
|
||||
volume: true,
|
||||
}*/
|
||||
EJS_volume = 1;
|
||||
//EJS_startOnLoaded = true;
|
||||
//EJS_loadStateURL = "mega_mountain.state";
|
||||
</script>
|
||||
<script src='data/loader.js'></script>
|
||||
<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%;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: monospace;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
background-color: #222
|
||||
}
|
||||
|
||||
body, #box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#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
|
||||
}
|
||||
|
||||
#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
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id = box>
|
||||
<input type = file id = input>
|
||||
Drag ROM file or click here
|
||||
</div>
|
||||
|
||||
<script>
|
||||
input.onchange = async () => {
|
||||
const url = URL.createObjectURL(new Blob([input.files[0]]))
|
||||
const parts = input.files[0].name.split(".")
|
||||
|
||||
const core = await (async (ext) => {
|
||||
if (["fds", "nes", "unif", "unf"].includes(ext))
|
||||
return "nes"
|
||||
|
||||
if (["smc", "fig", "sfc", "gd3", "gd7", "dx2", "bsx", "swc"].includes(ext))
|
||||
return "snes"
|
||||
|
||||
if (["z64", "n64"].includes(ext))
|
||||
return "n64"
|
||||
|
||||
if (["nds", "gba", "gb", "z64", "n64"].includes(ext))
|
||||
return ext
|
||||
|
||||
return await new Promise(resolve => {
|
||||
const cores = {
|
||||
"Nintendo 64": "n64",
|
||||
"Nintendo Game Boy": "gb",
|
||||
"Nintendo Game Boy Advance": "gba",
|
||||
"Nintendo DS": "nds",
|
||||
"Nintendo Entertainment System": "nes",
|
||||
"Super Nintendo Entertainment System": "snes",
|
||||
"PlayStation": "psx",
|
||||
"Virtual Boy": "vb",
|
||||
"Sega Mega Drive": "segaMD",
|
||||
"Sega Master System": "segaMS",
|
||||
"Sega CD": "segaCD",
|
||||
"Atari Lynx": "lynx",
|
||||
"Sega 32X": "sega32x",
|
||||
"Atari Jaguar": "jaguar",
|
||||
"Sega Game Gear": "segaGG",
|
||||
"Sega Saturn": "segaSaturn",
|
||||
"Atari 7800": "atari7800",
|
||||
"Atari 2600": "atari2600"
|
||||
}
|
||||
|
||||
const button = document.createElement("button")
|
||||
const select = document.createElement("select")
|
||||
|
||||
for (const type in cores) {
|
||||
const option = document.createElement("option")
|
||||
|
||||
option.value = cores[type]
|
||||
option.textContent = type
|
||||
select.appendChild(option)
|
||||
}
|
||||
|
||||
button.onclick = () => resolve(select[select.selectedIndex].value)
|
||||
button.textContent = "Load game"
|
||||
box.innerHTML = ""
|
||||
|
||||
box.appendChild(select)
|
||||
box.appendChild(button)
|
||||
})
|
||||
})(parts.pop())
|
||||
|
||||
const div = document.createElement("div")
|
||||
const sub = document.createElement("div")
|
||||
const script = document.createElement("script")
|
||||
|
||||
sub.id = "game"
|
||||
div.id = "display"
|
||||
|
||||
box.remove()
|
||||
div.appendChild(sub)
|
||||
document.body.appendChild(div)
|
||||
|
||||
window.EJS_player = "#game"
|
||||
window.EJS_gameName = parts.shift()
|
||||
window.EJS_biosUrl = ""
|
||||
window.EJS_gameUrl = url
|
||||
window.EJS_core = core
|
||||
window.EJS_pathtodata = "data/"
|
||||
window.EJS_startOnLoaded = true;
|
||||
|
||||
if (window.location.hostname === "demo.emulatorjs.org") {
|
||||
window.EJS_AdUrl = "https://ads.emulatorjs.org/";
|
||||
}
|
||||
|
||||
|
||||
script.src = "data/loader.js"
|
||||
document.body.appendChild(script)
|
||||
}
|
||||
|
||||
box.ondragover = () => box.setAttribute("drag", true)
|
||||
box.ondragleave = () => box.removeAttribute("drag")
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in a new issue