2020-04-16 00:15:44 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
2020-04-16 03:58:28 +00:00
|
|
|
<title>SkyNX Streamer</title>
|
2020-04-16 00:15:44 +00:00
|
|
|
<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">
|
2020-04-16 03:58:28 +00:00
|
|
|
<link rel="stylesheet" href="css/styles.css">
|
2020-04-16 00:15:44 +00:00
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<nav id="title-bar" class="rainbowBackgroundColor">
|
2020-04-16 03:58:28 +00:00
|
|
|
<img id="titleIcon" src="./img/iconTransparent.png">
|
|
|
|
|
<div id="title">SkyNX Streamer</div>
|
2020-04-16 00:15:44 +00:00
|
|
|
<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"
|
2020-04-23 00:08:03 +00:00
|
|
|
title="Streamer"><i class="fas fa-desktop"></i></button>
|
2020-04-23 22:03:26 +00:00
|
|
|
<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>
|
2020-04-16 23:01:29 +00:00
|
|
|
<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>
|
2020-04-22 22:53:59 +00:00
|
|
|
<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>
|
2020-04-16 00:15:44 +00:00
|
|
|
</div>
|
|
|
|
|
<div id="main" class="contentArea">
|
2020-04-22 22:11:08 +00:00
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-8">
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="ipInput">Switch IP Address</label>
|
|
|
|
|
<input id="ipInput" type="text" class="form-control" placeholder="Switch IP">
|
|
|
|
|
</div>
|
|
|
|
|
<form class="form-group">
|
|
|
|
|
<label id="qualityLabel" for="qualitySlider">Quality: 5Mbps</label>
|
2020-04-23 21:23:18 +00:00
|
|
|
<input id="qualitySlider" type="range" class="custom-range" min="4" max="20" value="5" />
|
2020-04-22 22:11:08 +00:00
|
|
|
</form>
|
|
|
|
|
<form class="form-group">
|
|
|
|
|
<button id="startBtn" type="button" class="btn btn-dark btn-lg btn-block">Start Streamer</button>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-4 sidePanel">
|
|
|
|
|
<label>More Settings coming soon..</label>
|
|
|
|
|
</div>
|
2020-04-16 03:58:28 +00:00
|
|
|
</div>
|
2020-04-23 22:03:26 +00:00
|
|
|
</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>
|
2020-04-16 00:15:44 +00:00
|
|
|
</div>
|
2020-04-22 21:51:03 +00:00
|
|
|
<div id="settings" class="contentArea contentAreaScrollable customScroll" style="display: none;">
|
2020-04-22 22:19:05 +00:00
|
|
|
<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="rainbowEnabled" type="checkbox">
|
|
|
|
|
<span class="slider round"></span>
|
|
|
|
|
</label>
|
|
|
|
|
<label class="form-check-label" for="rainbowEnabled">
|
|
|
|
|
Enable Rainbow Accents
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
2020-04-16 23:01:29 +00:00
|
|
|
<form class="form-group">
|
2020-04-22 22:11:08 +00:00
|
|
|
<div class="row">
|
|
|
|
|
<div class="col">
|
|
|
|
|
<button id="installScpVBusBtn" type="button" class="btn btn-dark btn-block">Install Controller</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col">
|
|
|
|
|
<button id="unInstallScpVBusBtn" type="button" class="btn btn-danger btn-block">Un-Install
|
|
|
|
|
Controller</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2020-04-16 23:01:29 +00:00
|
|
|
</form>
|
|
|
|
|
<form class="form-group">
|
2020-04-22 22:11:08 +00:00
|
|
|
<div class="row">
|
|
|
|
|
<div class="col">
|
|
|
|
|
<button id="installAudioDriverBtn" type="button" class="btn btn-dark btn-block">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>
|
2020-04-16 23:01:29 +00:00
|
|
|
</form>
|
|
|
|
|
</div>
|
2020-04-22 22:53:59 +00:00
|
|
|
<div id="console" class="contentArea" style="display: none;">
|
|
|
|
|
<div id="consoleContainer" class="customScroll"></div>
|
|
|
|
|
<input id="consoleInput" type="text" placeholder="Console command"><br>
|
|
|
|
|
</div>
|
2020-04-16 00:15:44 +00:00
|
|
|
</div>
|
|
|
|
|
<div id="statusbar" class="rainbowBackgroundColor2">
|
2020-04-23 21:40:30 +00:00
|
|
|
<span id="statusbartext">Streamer stopped.</span>
|
2020-04-16 00:15:44 +00:00
|
|
|
</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>
|
|
|
|
|
<script src="js/fontawesome-all.min.js"></script>
|
2020-04-23 22:03:26 +00:00
|
|
|
<script src="js/Chart.min.js"></script>
|
2020-04-16 00:15:44 +00:00
|
|
|
<script>
|
|
|
|
|
let $ = require('jquery');
|
|
|
|
|
require('popper.js');
|
|
|
|
|
require('bootstrap');
|
|
|
|
|
$(function () {
|
|
|
|
|
$('[data-toggle="tooltip"]').tooltip({ boundary: 'window' })
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
<script src="./js/animations.js"></script>
|
|
|
|
|
<script src="./js/window.js"></script>
|
|
|
|
|
<script src="./js/settings.js"></script>
|
2020-04-23 23:16:05 +00:00
|
|
|
<script src="./js/main.js"></script>
|
2020-04-23 22:03:26 +00:00
|
|
|
<script src="./js/stats.js"></script>
|
2020-04-22 22:53:59 +00:00
|
|
|
<script src="./js/console.js"></script>
|
2020-04-16 00:15:44 +00:00
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
</html>
|
