mirror of
https://github.com/giongto35/cloud-game.git
synced 2026-07-18 17:16:04 +00:00
* Add stat module initial example * Add stats module help overlay overlap handling * Add generic graph canvas image builder * Add more generic graphing module * Clean up the code * Some fixes * Change graphing styles * Clean some stats module code * Move to RAF rendering to burn your CPU * Add not standardized memory stats module * Fix initial stats visibility flag handle
120 lines
5.6 KiB
HTML
Vendored
120 lines
5.6 KiB
HTML
Vendored
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="user-scalable=0">
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
|
<meta property="og:type" content="cloud-game" />
|
|
<meta property="og:title" content="Web-based Cloud Gaming for Retro Games" />
|
|
<meta property="og:description" content="Play and share cloud gaming experience with your friends" />
|
|
<meta property="og:image" content="http://cloud.webgame2d.com/static/img/ogimage.jpg" />
|
|
<meta property="og:url" content="" />
|
|
<meta property="og:site_name" content="Cloud Retro" />
|
|
<meta property="og:author" content="giongto35 trichimtrich" />
|
|
|
|
<link href="/static/css/font-awesome.css?2" rel="stylesheet">
|
|
<link href="/static/css/main.css?4" rel="stylesheet">
|
|
</head>
|
|
|
|
<body>
|
|
<div id="gamebody">
|
|
<!--<div id="ui-emulator-bg"></div>-->
|
|
|
|
<div id="circle-pad-holder">
|
|
<div id="btn-up" class="dpad" value="up"></div>
|
|
<div id="btn-down" class="dpad" value="down"></div>
|
|
<div id="btn-left" class="dpad" value="left"></div>
|
|
<div id="btn-right" class="dpad" value="right"></div>
|
|
<div id="circle-pad"></div>
|
|
</div>
|
|
|
|
<div id="bottom-screen">
|
|
<div id="stats-overlay" class="no-select" hidden></div>
|
|
<!--NOTE: New browser doesn't allow unmuted video player. So we muted here.
|
|
There is still audio because current audio flow is not from media but it is manually encoded (technical webRTC challenge). Later, when we can integrate audio to media, we can face the issue with mute again .
|
|
https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
|
|
-->
|
|
<video id="game-screen" muted playinfullscreen="false" playsinline></video>
|
|
|
|
<div id="menu-screen">
|
|
<div id="menu-container">
|
|
</div>
|
|
<div id="menu-item-choice"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="guide-txt"><b>Arrows</b>(move),<b>ZXCVAS</b>(game ABXYLR),<b>1/2</b>(1st/2nd player),<b>Shift/Enter/K/L</b>(select/start/save/load),<b>F</b>(fullscreen),<b>share</b>(copy sharelink to clipboard)</div>
|
|
<div id="btn-load" unselectable="on" class="btn big unselectable" value="load"></div>
|
|
<div id="btn-save" unselectable="on" class="btn big unselectable" value="save"></div>
|
|
<div id="btn-join" unselectable="on" class="btn big unselectable" value="join"></div>
|
|
<div id="slider-playeridx" class="slidecontainer">
|
|
player choice
|
|
<input type="range" min="1" max="4" value="1" class="slider" id="playeridx" onkeydown="event.preventDefault()">
|
|
</div>
|
|
|
|
<div id="btn-quit" unselectable="on" class="btn big unselectable" value="quit"></div>
|
|
<div id="btn-select" unselectable="on" class="btn big unselectable" value="select"></div>
|
|
<div id="btn-start" unselectable="on" class="btn big unselectable" value="start"></div>
|
|
|
|
|
|
<div id="color-button-holder">
|
|
<div id="btn-a" unselectable="on" class="btn unselectable" value="a"></div>
|
|
<div id="btn-b" unselectable="on" class="btn unselectable" value="b"></div>
|
|
<div id="btn-x" unselectable="on" class="btn unselectable" value="x"></div>
|
|
<div id="btn-y" unselectable="on" class="btn unselectable" value="y"></div>
|
|
</div>
|
|
|
|
<!-- TODO: remove -->
|
|
<input id="room-txt" type="text" placeholder="room id..." unselectable="on" class=" unselectable" disabled>
|
|
|
|
<div id="noti-box" unselectable="on" class="unselectable">Oh my god</div>
|
|
|
|
<div id="help-overlay">
|
|
<div id="help-overlay-background"></div>
|
|
<div id="help-overlay-detail"></div>
|
|
</div>
|
|
<div id="btn-help" unselectable="on" class="btn unselectable" value="help"></div>
|
|
</div>
|
|
|
|
<a id="ribbon" style="position: fixed; right: 0; top: 0;" href="https://github.com/giongto35/cloud-game"><img width="149" height="149" src="https://github.blog/wp-content/uploads/2008/12/forkme_right_gray_6d6d6d.png?resize=149%2C149" class="attachment-full size-full" alt="Fork me on GitHub" data-recalc-dims="1"></a>
|
|
|
|
<script>
|
|
DEBUG = true;
|
|
STUNTURN = {{.STUNTURN}};
|
|
</script>
|
|
|
|
<script src="/static/js/lib/jquery-3.4.1.min.js"></script>
|
|
|
|
<script src="/static/js/log.js?v=3"></script>
|
|
<script src="/static/js/env.js?v=5"></script>
|
|
<script src="/static/js/event/event.js?v=4"></script>
|
|
<script src="/static/js/input/keys.js?v=3"></script>
|
|
<script src="/static/js/input/input.js?v=3"></script>
|
|
<script src="/static/js/gameList.js?v=3"></script>
|
|
<script src="/static/js/room.js?v=3"></script>
|
|
<script src="/static/js/stats/stats.js?v=1"></script>
|
|
<script src="/static/js/controller.js?v=4"></script>
|
|
<script src="/static/js/input/keyboard.js?v=3"></script>
|
|
<script src="/static/js/input/touch.js?v=3"></script>
|
|
<script src="/static/js/input/joystick.js?v=3"></script>
|
|
<script src="/static/js/network/ajax.js?v=3"></script>
|
|
<script src="/static/js/network/socket.js?v=4"></script>
|
|
<script src="/static/js/network/rtcp.js?v=3"></script>
|
|
|
|
<script src="/static/js/init.js?v=3"></script>
|
|
|
|
<!-- Global site tag (gtag.js) - Google Analytics -->
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-145078282-1"></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
|
|
gtag('config', 'UA-145078282-1');
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html>
|