moonlight-chrome/index.html
R. Aidan Campbell 5d4f191b07 user can now forget hosts
- hosts are never unpaired, so re-adding the hostname will not require pairing
GFEHostIP field marked as `dirty` when mDNS found
- thanks to https://github.com/google/material-design-lite/issues/903
- untested.
2016-04-16 13:07:47 -04:00

112 lines
5.5 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="-1">
<title>Moonlight</title>
<!-- <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> -->
<link rel="stylesheet" href="static/css/material.min.css">
<link rel="stylesheet" href="static/css/style.css">
</head>
<body data-name="moonlight-chrome" data-tools="pnacl" data-configs="Debug Release" data-path="{tc}/{config}">
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<header class="mdl-layout__header">
<div class="mdl-layout__header-row">
<!-- Title -->
<span class="mdl-layout-title">Moonlight</span>
<!-- Add spacer, to align navigation to the right -->
<div class="mdl-layout-spacer"></div>
<!-- Navigation. We hide it in small screens. -->
<ul class='mdl-list'>
<li>Chrome App Status: <code id="statusField">NO-STATUS</code></li>
</ul>
</div>
</header>
<main id="main-content" class="mdl-layout__content">
<div id="streamSettings">
<div class="mdl-select">
<select id="selectResolution">
<option value="1280:720">1280x720</option>
<option value="1920:1080">1920x1080</option>
</select>
</div>
<div class="mdl-select">
<select id="selectFramerate">
<option value="30">30fps</option>
<option value="60">60fps</option>
</select>
<output id='bitrateField'>15 Mbps</output>
</div>
<input id="bitrateSlider" class="mdl-slider mdl-js-slider" type="range" min="0" max="100" step="0.5" value="15">
</div>
<div id="hostSettings">
<p>Enter the IP/hostname of the GFE streaming computer, or select one from the history:</p>
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
<input class="mdl-textfield__input" type="text" id="GFEHostIPField">
<label class="mdl-textfield__label" for="GFEHostIPField">IP Address</label>
</div>
<div class="mdl-select">
<select id="selectHost">
<option value="">No history available</option>
</select>
</div>
<div class="button-holder">
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="hostChosen">Connect</button>
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent" id="forgetHost">Forget</button>
</div>
</div>
<div id="gameSelection" class="mdl-select">
<p>Select a game to run</p>
<select id="selectGame"> </select>
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="startGameButton">Run Game</button>
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent" id="quitGameButton">Quit Current Game</button>
</div>
<div id="listener">
</div>
</main>
</div>
<script defer src="static/js/jquery-2.2.0.min.js"></script>
<script defer src="static/js/material.min.js"></script>
<script type="text/javascript" src="static/js/messages.js"></script>
<script type="text/javascript" src="static/js/common.js"></script>
<script type="text/javascript" src="static/js/index.js"></script>
<script type="text/javascript" src="static/js/utils.js"></script>
<script type="text/javascript" src="static/js/mdns-browser/dns.js"></script>
<script type="text/javascript" src="static/js/mdns-browser/main.js"></script>
<dialog id="pairingDialog" class="mdl-dialog">
<h3 class="mdl-dialog__title">Pairing</h3>
<div class="mdl-dialog__content">
<p id="pairingDialogText">
Please enter the number XXXX on the GFE dialog on the computer. This dialog will be dismissed once complete
</p>
</div>
<div class="mdl-dialog__actions">
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="cancelPairingDialog">Cancel</button>
</div>
</dialog>
<dialog id="replaceAppDialog" class="mdl-dialog">
<h3 class="mdl-dialog__title">Pairing</h3>
<div class="mdl-dialog__content">
<p id="replaceAppDialogText">
You wanted to start game X. Game Y is already running. Would you like to stop Game Y to start Game X?
</p>
</div>
<div class="mdl-dialog__actions">
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="cancelReplaceApp">No</button>
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="continueReplaceApp">Yes</button>
</div>
</dialog>
<div id="snackbar" class="mdl-js-snackbar mdl-snackbar">
<button class="mdl-snackbar__action" type="button"></button> <!-- this button exists to suppress the snackbar warning. we're really using a toast. -->
<div class="mdl-snackbar__text"></div>
</div>
</body>
</html>