mirror of
https://github.com/DevL0rd/SkyNX
synced 2024-11-24 20:13:03 +00:00
289 lines
No EOL
12 KiB
HTML
289 lines
No EOL
12 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>SkyNX Streamer</title>
|
|
<link rel="stylesheet" href="css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="css/animations.css">
|
|
<link rel="stylesheet" href="css/fa-svg-with-js.css">
|
|
<link rel="stylesheet" href="css/windowStyle.css">
|
|
<link rel="stylesheet" href="css/styles.css">
|
|
</head>
|
|
|
|
<body>
|
|
<nav id="title-bar" class="rainbowBackgroundColor">
|
|
<img id="titleIcon" src="./img/iconTransparent.png">
|
|
<div id="title">SkyNX Streamer</div>
|
|
<div id="title-bar-btns">
|
|
<button id="rld-btn" class="title-bar-tools" style="display: none;"><i class="fas fa-sync-alt"></i></button>
|
|
<button id="dev-btn" class="title-bar-tools" style="display: none;"><i class="fab fa-dev"></i></button>
|
|
<button id="min-btn" class="title-bar-btns"><i class="fas fa-window-minimize"></i></button>
|
|
<!-- <button id="max-btn" class="title-bar-btns"><i class="fas fa-window-maximize"></i></button> -->
|
|
<button id="close-btn" class="title-bar-btns"><i class="fas fa-window-close"></i></button>
|
|
</div>
|
|
</nav>
|
|
<div id="content" class="customScroll rainbowScrollColor">
|
|
<div id="navBar" class="customScroll rainbowScrollColor">
|
|
<button id="main-btn" class="navBar-btns" data-toggle="tooltip" data-placement="right" data-html="true"
|
|
title="Streamer"><i class="fas fa-desktop"></i></button>
|
|
<button id="stats-btn" class="navBar-btns" data-toggle="tooltip" data-placement="right" data-html="true"
|
|
title="Stats"><i class="fas fa-chart-pie"></i></button>
|
|
<button id="settings-btn" class="navBar-btns" data-toggle="tooltip" data-placement="right" data-html="true"
|
|
title="Settings"><i class="fas fa-cogs"></i></button>
|
|
<button id="console-btn" class="navBar-btns" data-toggle="tooltip" data-placement="right" data-html="true"
|
|
title="Console"><i class="fas fa-terminal"></i></button>
|
|
</div>
|
|
<div id="main" class="contentArea">
|
|
<div class="row">
|
|
<div class="col-7">
|
|
<div class="form-group">
|
|
<label for="ipInput">Switch IP Address</label>
|
|
<input id="ipInput" type="text" class="form-control" placeholder="Switch IP">
|
|
</div>
|
|
<div class="form-group">
|
|
<label id="qualityLabel" for="qualitySlider">Quality: 5Mbps</label>
|
|
<input id="qualitySlider" type="range"
|
|
title="Higher settings increase quality at the cost of latency. Over 10 is probably overkill."
|
|
class="custom-range" min="4" max="20" value="5" />
|
|
</div>
|
|
<div class="form-group">
|
|
<div class="dropdown">
|
|
<button class="btn btn-secondary dropdown-toggle btn-block" type="button" id="encodingDrop"
|
|
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
Encoding (CPU)
|
|
</button>
|
|
<div class="dropdown-menu" aria-labelledby="encodingDrop">
|
|
<a class="dropdown-item" href="javascript:setEncoding('CPU')">CPU Encoding</a>
|
|
<a class="dropdown-item" href="javascript:setEncoding('NVENC')">Nvidia Encoding</a>
|
|
<a class="dropdown-item" href="javascript:setEncoding('AMDVCE')">AMD Encoding (AMF)</a>
|
|
<a class="dropdown-item" href="javascript:setEncoding('AMDHEVC')">AMD Encoding (HEVC)</a>
|
|
<a class="dropdown-item" href="javascript:setEncoding('QSV')">Intel Encoding</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<div class="dropdown">
|
|
<button class="btn btn-secondary dropdown-toggle btn-block" type="button" id="vsyncDrop"
|
|
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
Vsync (VFR)
|
|
</button>
|
|
<div class="dropdown-menu" aria-labelledby="vsyncDrop">
|
|
<a class="dropdown-item" href="javascript:setVsync('passthrough')">Passthrough</a>
|
|
<a class="dropdown-item" href="javascript:setVsync('drop')">Drop</a>
|
|
<a class="dropdown-item" href="javascript:setVsync('vfr')">VFR</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<button id="startBtn" type="button" class="btn btn-dark btn-lg btn-block">Start Streamer</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-5 sidePanel">
|
|
<div class="form-group" style="margin-top: 8px;">
|
|
<div class="dropdown">
|
|
<button class="btn btn-secondary dropdown-toggle btn-block" type="button" id="mouseControlDrop"
|
|
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
Mouse Control (Analog)
|
|
</button>
|
|
<div class="dropdown-menu" aria-labelledby="mouseControlDrop">
|
|
<a class="dropdown-item" href="javascript:setMouseControl('ANALOG')">Analog</a>
|
|
<a class="dropdown-item" href="javascript:setMouseControl('GYRO')">Gyro</a>
|
|
</div>
|
|
</div>
|
|
<div class="comment">
|
|
<center>Press LS + RS to toggle.</center>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="disableVideo" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="disableVideo"
|
|
title="Great for using you switch as a controller dongle">
|
|
Disable Video
|
|
</label>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="disableAudio" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="disableAudio">
|
|
Disable Audio
|
|
</label>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="abxySwap" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="abxySwap" title="Makes your controllers labels match xBox controls">
|
|
Swap A-B X-Y
|
|
</label>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="limitFPS" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="limitFPS"
|
|
title="Great when streaming emulators or games running at 30.">
|
|
30Fps Limit
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="stats" class="contentArea contentAreaScrollable customScroll" style="display: none;">
|
|
<div class="chartpanel">
|
|
<h5 class="chartTitle">FPS</h5>
|
|
<div style="width: 100%; height: 150px;">
|
|
<canvas id="fpsChart"></canvas>
|
|
</div>
|
|
</div>
|
|
<div class="chartpanel">
|
|
<h5 class="chartTitle">Encoding FPS</h5>
|
|
<div style="width: 100%; height: 150px;">
|
|
<canvas id="encodingFpsChart"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="settings" class="contentArea contentAreaScrollable customScroll" style="display: none;">
|
|
<hr />
|
|
<h2>General</h2>
|
|
<hr />
|
|
<div class="form-group">
|
|
<label for="monitorInput">Monitor ID (0, 1, etc)</label>
|
|
<input id="monitorInput" title="Typically your primary monitor is ID 0, however due to Windows stuff this isn't always the case... MUST BE A NUMBER!" type="text" class="form-control" value="0">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="autoChangeResolution" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="autoChangeResolution">
|
|
Set resolution to 1280 X 720 on streamer start.
|
|
</label>
|
|
</div>
|
|
<hr />
|
|
<h2>Startup</h2>
|
|
<hr />
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="autoStart" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="autoStart">
|
|
Start streamer automatically
|
|
</label>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="autoStartup" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="autoStartup">
|
|
Start streamer on startup.
|
|
</label>
|
|
</div>
|
|
<hr />
|
|
<h2>UI</h2>
|
|
<hr />
|
|
<div class="form-group">
|
|
<label class="switch">
|
|
<input id="rainbowEnabled" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
<label class="form-check-label" for="rainbowEnabled">
|
|
Enable Rainbow Accents
|
|
</label>
|
|
</div>
|
|
|
|
<hr />
|
|
<h2>Drivers</h2>
|
|
<hr />
|
|
<form class="form-group">
|
|
<div class="row">
|
|
<div class="col">
|
|
<button id="installScpVBusBtn" type="button" class="btn btn-dark btn-block" data-toggle="modal"
|
|
data-target="#restartModal">Install Controller</button>
|
|
</div>
|
|
<div class="col">
|
|
<button id="unInstallScpVBusBtn" type="button" class="btn btn-danger btn-block">Un-Install
|
|
Controller</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<form class="form-group">
|
|
<div class="row">
|
|
<div class="col">
|
|
<button id="installAudioDriverBtn" type="button" class="btn btn-dark btn-block" data-toggle="modal"
|
|
data-target="#restartModal">Install Audio
|
|
Driver</button>
|
|
</div>
|
|
<div class="col">
|
|
<button id="unInstallAudioDriverBtn" type="button" class="btn btn-danger btn-block">Un-Install Audio
|
|
Driver</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div id="console" class="contentArea" style="display: none;">
|
|
<div id="consoleContainer" class="customScroll"></div>
|
|
<input id="consoleInput" type="text" placeholder="Console command"><br>
|
|
</div>
|
|
</div>
|
|
<div id="statusbar" class="rainbowBackgroundColor2">
|
|
<span id="statusbartext">Streamer stopped.</span>
|
|
<button id="donateBtn" type="button" class="btn statusBarBtn btn-warning float-right">Donate ♥</button>
|
|
</div>
|
|
<div id="loadingCover">
|
|
<div class="centerVert">
|
|
<img src="img/loading.gif" class="loadingGif">
|
|
<h1 style="color:rgb(206, 206, 206); font-size: 16px;">
|
|
Application loading...
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
<div class="modal" id="restartModal" tabindex="-1" role="dialog">
|
|
<div class="modal-dialog" role="document">
|
|
<div class="modal-content modalPanel">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Restart required</h5>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>This change requires a restart.</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button id="restartBtn" type="button" class="btn btn-primary" data-dismiss="modal">Restart</button>
|
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="./js/jquery.min.js"></script>
|
|
<script src="./js/jquery.min.js"></script>
|
|
<script src="./js/popper.min.js"></script>
|
|
<script src="./js/bootstrap.min.js"></script>
|
|
<script src="./js/fontawesome-all.min.js"></script>
|
|
<script src="./js/Chart.min.js"></script>
|
|
<script>
|
|
const { remote, ipcRenderer } = require("electron");
|
|
const fs = require('fs');
|
|
var DB = require('./Devlord_modules/DB.js');
|
|
// require('popper.js');
|
|
$(function () {
|
|
$('[data-toggle="tooltip"]').tooltip({ boundary: 'window' })
|
|
})
|
|
</script>
|
|
<script src="./js/window.js"></script>
|
|
<script src="./js/animations.js"></script>
|
|
<script src="./js/settings.js"></script>
|
|
<script src="./js/main.js"></script>
|
|
<script src="./js/stats.js"></script>
|
|
<script src="./js/console.js"></script>
|
|
</body>
|
|
|
|
</html> |