This repository has been archived on 2024-06-01. You can view files and clone it, but cannot push or open issues or pull requests.
rustboyadvance-ng/platform/rustboyadvance-wasm/app/index.html

163 lines
7.5 KiB
HTML
Raw Normal View History

<!-- Created with wasm-pack :) -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="apple-touch-icon" sizes="57x57" href="/assets/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/assets/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/assets/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/assets/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/assets/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/assets/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/assets/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/assets/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="167x167" href="/assets/apple-touch-icon-167x167.png">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon-180x180.png">
<link rel="apple-touch-icon" sizes="1024x1024" href="/assets/apple-touch-icon-1024x1024.png">
<link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)" href="/assets/apple-touch-startup-image-320x460.png">
<link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-640x920.png">
<link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-640x1096.png">
<link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-750x1294.png">
<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3)" href="/assets/apple-touch-startup-image-1182x2208.png">
<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3)" href="/assets/apple-touch-startup-image-1242x2148.png">
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 1)" href="/assets/apple-touch-startup-image-748x1024.png">
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-1496x2048.png">
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 1)" href="/assets/apple-touch-startup-image-768x1004.png">
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-1536x2008.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="228x228" href="/assets/coast-228x228.png">
<link rel="manifest" href="/assets/manifest.json">
<link rel="shortcut icon" href="/assets/favicon.ico">
<link rel="yandex-tableau-widget" href="/assets/yandex-browser-manifest.json">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title">
<meta name="application-name">
<meta name="mobile-web-app-capable" content="yes">
<meta name="msapplication-TileColor" content="#fff">
<meta name="msapplication-TileImage" content="/assets/mstile-144x144.png">
<meta name="msapplication-config" content="/assets/browserconfig.xml">
<meta name="theme-color" content="#fff">
<title>RustBoyAdvance</title>
<style>
body {
background-color: #2c2946;
font-family: Source Code, Roboto, Monospace;
margin: 0;
color: azure;
}
header {
padding: 1em;
padding-top: 6em;
background-color: #13121d;
background-image: url("icon.png");
background-repeat: no-repeat;
background-position: center;
background-size: 400px;
display: flex;
text-align: center;
align-items: center;
justify-content: center;
box-shadow: 0.1px 2px 4px rgba(0, 0, 0, 0.7);
}
header h1 {
color: azure;
padding: .1em;
font-size: medium;
}
#menu {
padding: .1em;
}
#menu ul {
list-style: none;
}
#menu li {
margin: 0.2em;
}
#playarea {
justify-content: center;
margin: auto;
display: flexbox;
}
#playarea.hover {
border: rgba(9, 250, 0, 0.671);
border-style: dashed;
border-width: 0.1em;
}
#game-options {
display: block;
}
#game-options > * {
width: 100%;
margin: 0.2em;
}
#screen {
display: block;
max-width: 960px;
width: 80%;
margin-left: auto;
margin-right: auto;
background-color: black;
image-rendering: optimizeSpeed;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
image-rendering: crisp-edges;
box-shadow: 0.1px 2px 4px rgba(0, 0, 0, 0.7);
padding: 0.2em;
}
#screen.hover {
border: rgba(9, 250, 0, 0.671);
border-style: dashed;
border-width: 0.1em;
}
</style>
</head>
<body>
<noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
<header>
<div id="logo">
<h1>RustBoyAdvance</h1>
</div>
</header>
<section id="menu">
<ul>
<li class="fileInput">
<label> BIOS </label>
<input type="file" id="bios-file-input" />
</li>
<li><button id="reloadBios" class="hidden">Reload Bios</button></li>
<li class="fileInput">
<label> ROM </label>
<input type="file" id="rom-file-input" />
</li>
<li><button id="startEmulator">Start</button></li>
<li><button id="fps-test">FPS Test</button></li>
<li>
<label>Skip Bios</label>
<input type="checkbox" id="skipBios">
</li>
<pre> You can also drag rom files directly into the screen </pre>
</ul>
</section>
<section id="playarea">
<pre> Built with WASM</pre>
<canvas id="screen" width="240px" , height="160px"></canvas>
<section id="game-options">
<span id="fps">FPS</span>
<label>
<label>Max FPS</label>
<input type="checkbox" id="maxFps">
</label>
</section>
</section>
<footer></footer>
<script src="./bootstrap.js"></script>
</body>
</html>