cloud-game/static/index_ws.html
2019-04-30 08:35:17 +07:00

102 lines
No EOL
2.5 KiB
HTML
Vendored

<html>
<head>
<!-- <meta name="viewport" content="width=device-width, user-scalable=no" /> -->
<meta name="viewport" content="user-scalable=no" />
<link href="//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.css" rel="stylesheet">
<link href="/static/css/joystick.css" rel="stylesheet">
<style>
textarea {
width: 60%;
height: 50px;
}
</style>
</head>
<body>
<select id="gameOp">
</select>
<button id="play" onclick="window.startGame()">Play</button>
<button id="play" onclick="pc.close()">Stop</button>
Your current room: <b><label id="currentRoomID" style="color:blue"></b> <br />
You can join a remote game by roomID.<br />
Room ID: <input type="text" id="roomID">
Play as player(1,2): <select id="playerIndex">
<option value="1">1</option>
<option value="2">2</option>
</select>
<br /><br />
<div id="remoteVideos">
<video id="game-screen" autoplay=true width=400 height=300
poster="https://orig00.deviantart.net/cdcd/f/2017/276/a/a/october_2nd___gameboy_poltergeist_by_wanyo-dbpdmnd.gif">
</div> <br />
<h3>Instruction</h3>
<div>
C is start button. Use it to start game<br />
V is select button <br />
Player 1
Use Up, Down, Left, Right to Move <br />
Z to (A) <br />
X to (B) <br />
S to save <br />
L to load <br />
<!--Fullscreen media for better gaming experience<br /-->
</div><br>
<h3>Log:</h3>
<pre id="div"></pre>
<div>
🎮<u><i>Refresh to retry when checking is too long</i></u>
</div>
<!-- virtual controller -->
<div id="dpad" class="dpad">
<span class="face up"></span>
<span class="face down"></span>
<span class="face left"></span>
<span class="face right"></span>
</div>
<div class="abxy">
<span value="a" class="button a"></span>
<span value="b" class="button b"></span>
<span value="start" class="button x"></span>
<span value="select" class="button y"></span>
</div>
<script>
DEBUG = true;
</script>
<!-- https://rawgit.com/Rillke/opus.js-sample/master/index.xhtml -->
<script src="/static/js/libopus.js"></script>
<script src="/static/js/opus.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="/static/js/const.js"></script>
<script src="/static/js/global.js"></script>
<script src="/static/js/gameboy_controller.js"></script>
<script src="/static/js/ws.js"></script>
<script>
$("#gameOp").on("change", function () {
gameIdx = gameOp.selectedIndex;
});
gameIdx = 1;
</script>
</body>
</html>