mirror of
https://github.com/moonlight-stream/moonlight-chrome.git
synced 2025-08-16 08:06:19 +00:00
191 lines
9.4 KiB
HTML
191 lines
9.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Pragma" content="no-cache">
|
|
<meta http-equiv="Expires" content="-1">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Moonlight</title>
|
|
<link rel="stylesheet" href="static/css/roboto.css">
|
|
<link rel="stylesheet" href="static/css/material.min.css">
|
|
<link rel="stylesheet" href="static/css/style.css">
|
|
<link rel="stylesheet" href="static/css/material-icons.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">
|
|
<header id="main-navigation" class="mdl-layout__header mdl-layout__header--transparent">
|
|
<div class="mdl-layout__header-row">
|
|
<button id="backIcon" class="mdl-button mdl-js-button mdl-button--icon" role="link" aria-label="Host selection"><i class="material-icons">keyboard_arrow_left</i></button>
|
|
<!-- Title -->
|
|
<span class="mdl-layout-title">MOON<span>LIGHT</span></span>
|
|
<!-- Add spacer, to align navigation to the right -->
|
|
<div class="mdl-layout-spacer"></div>
|
|
<!-- Navigation -->
|
|
<nav class="mdl-navigation">
|
|
<div class="nav-menu-parent">
|
|
<div id="resolutionMenu">
|
|
<button id="selectResolution" data-value="1280:720" class="mdl-button mdl-js-button">
|
|
720p
|
|
</button>
|
|
</div>
|
|
|
|
<ul class="resolutionMenu mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="selectResolution">
|
|
<li class="mdl-menu__item" data-value="1280:720">720p</li>
|
|
<li class="mdl-menu__item" data-value="1920:1080">1080p</li>
|
|
<li class="mdl-menu__item" data-value="3840:2160">4K</li>
|
|
</ul>
|
|
|
|
<div id="resolutionTooltip" class="mdl-tooltip" for="resolutionMenu">
|
|
Resolution
|
|
</div>
|
|
</div>
|
|
<div class="nav-menu-parent">
|
|
<div id="framerateMenu">
|
|
<button id="selectFramerate" data-value="60" class="mdl-button mdl-js-button">
|
|
60 FPS
|
|
</button>
|
|
</div>
|
|
|
|
<ul class="framerateMenu mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="selectFramerate">
|
|
<li class="mdl-menu__item" data-value="30">30 FPS</li>
|
|
<li class="mdl-menu__item" data-value="60">60 FPS</li>
|
|
</ul>
|
|
|
|
<div id="framerateTooltip" class="mdl-tooltip" for="framerateMenu">
|
|
Framerate
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-menu-parent">
|
|
<div id="bandwidthMenu">
|
|
<button id="bitrateField" class="mdl-button">10 Mbps</button>
|
|
</div>
|
|
|
|
<div class="bitrateMenu mdl-menu mdl-js-menu mdl-js-ripple-effect" for="bandwidthMenu">
|
|
<input id="bitrateSlider" class="mdl-slider mdl-js-slider" type="range" min="0" max="100" step="0.5" value="10">
|
|
</div>
|
|
|
|
<div id="bandwidthTooltip" class="mdl-tooltip" for="bandwidthMenu">
|
|
Bandwidth
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-menu-parent">
|
|
<label id="externalAudioBtn" class="mdl-icon-toggle mdl-js-icon-toggle mdl-js-ripple-effect" for="remoteAudioEnabledSwitch">
|
|
<input type="checkbox" id="remoteAudioEnabledSwitch" class="mdl-icon-toggle__input">
|
|
<i class="mdl-icon-toggle__label material-icons">volume_up</i>
|
|
</label>
|
|
<div id="externalAudioTooltip" class="mdl-tooltip" for="externalAudioBtn">
|
|
Play audio on the host
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-menu-parent">
|
|
<label id="mouseLockBtn" class="mdl-icon-toggle mdl-js-icon-toggle mdl-js-ripple-effect" for="mouseLockEnabledSwitch">
|
|
<input type="checkbox" id="mouseLockEnabledSwitch" class="mdl-icon-toggle__input">
|
|
<i class="mdl-icon-toggle__label material-icons">mouse</i>
|
|
</label>
|
|
<div id="mouseLockTooltip" class="mdl-tooltip" for="mouseLockBtn">
|
|
Enable mouse locking (must disable to use tap-to-click on touchpads)
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-menu-parent">
|
|
<label id="optimizeGamesBtn" class="mdl-icon-toggle mdl-js-icon-toggle mdl-js-ripple-effect" for="optimizeGamesSwitch">
|
|
<input type="checkbox" id="optimizeGamesSwitch" class="mdl-icon-toggle__input">
|
|
<i class="mdl-icon-toggle__label material-icons">timeline</i>
|
|
</label>
|
|
<div id="optimizeGamesTooltip" class="mdl-tooltip" for="optimizeGamesBtn">
|
|
Allow game optimisations
|
|
</div>
|
|
</div>
|
|
|
|
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect" id="quitCurrentApp" aria-label="Quit current app">
|
|
<i class="material-icons">remove_circle_outline</i>
|
|
Quit Current App
|
|
</button>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
<main id="main-content" class="mdl-layout__content">
|
|
<div id="host-grid">
|
|
<div class="add-host-card mdl-card mdl-shadow--4dp" id="addHostCell">
|
|
<div class="mdl-card__title mdl-card--expand" id="addHostIcon" role="link" tabindex="0" aria-label="Add Host">
|
|
<h2 class="mdl-card__title-text">Add Host</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="game-grid"></div>
|
|
<div id="listener"></div>
|
|
<!-- NaCl module placeholder. NaCl gets thrown into here -->
|
|
<div id="loadingSpinner" class="mdl-progress mdl-js-progress mdl-progress__indeterminate">
|
|
<h5 id="loadingMessage"></h5>
|
|
</div>
|
|
<div id="naclSpinner" class="mdl-progress mdl-js-progress mdl-progress__indeterminate">
|
|
<h5 id="naclSpinnerMessage"></h5>
|
|
</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 mdl-js-ripple-effect" id="cancelPairingDialog">Cancel</button>
|
|
</div>
|
|
</dialog>
|
|
<dialog id="quitAppDialog" class="mdl-dialog">
|
|
<h3 class="mdl-dialog__title">Quit Running App?</h3>
|
|
<div class="mdl-dialog__content">
|
|
<p id="quitAppDialogText">
|
|
Y is already running. Would you like to quit Y?
|
|
</p>
|
|
</div>
|
|
<div class="mdl-dialog__actions">
|
|
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect" id="cancelQuitApp">No</button>
|
|
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect" id="continueQuitApp">Yes</button>
|
|
</div>
|
|
</dialog>
|
|
<dialog id="deleteHostDialog" class="mdl-dialog">
|
|
<h3 class="mdl-dialog__title">Delete PC</h3>
|
|
<div class="mdl-dialog__content">
|
|
<p id="deleteHostDialogText">
|
|
Are you sure you want to delete this host?
|
|
</p>
|
|
</div>
|
|
<div class="mdl-dialog__actions">
|
|
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect" id="cancelDeleteHost">No</button>
|
|
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect" id="continueDeleteHost">Yes</button>
|
|
</div>
|
|
</dialog>
|
|
<dialog id="addHostDialog" class="mdl-dialog">
|
|
<h3 class="mdl-dialog__title">Add Host Manually</h3>
|
|
<div class="mdl-dialog__content">
|
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
|
<input class="mdl-textfield__input" type="text" id="dialogInputHost" />
|
|
<label class="mdl-textfield__label" for="dialogInputHost">IP Address or Hostname of GeForce PC</label>
|
|
</div>
|
|
</div>
|
|
<div class="mdl-dialog__actions">
|
|
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect" id="cancelAddHost">Cancel</button>
|
|
<button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect" id="continueAddHost">Continue</button>
|
|
</div>
|
|
</dialog>
|
|
<div id="snackbar" class="mdl-snackbar mdl-js-snackbar">
|
|
<div class="mdl-snackbar__text"></div>
|
|
<button id="snackButton" class="mdl-snackbar__action" type="button"></button>
|
|
<!-- this button exists to suppress the snackbar warning. we're really using a toast. -->
|
|
</div>
|
|
</body>
|
|
</html>
|