244 lines
14 KiB
HTML
244 lines
14 KiB
HTML
<html lang="en-us">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<title>Praxis Bot Control Panel</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
|
|
<!--Import Google Icon Font-->
|
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
|
<!--Import materialize.css-->
|
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
|
<link type="text/css" rel="stylesheet" href="css/materialize.css" media="screen,projection"/>
|
|
|
|
<link rel="preconnect" href="https://fonts.gstatic.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div class="sticky ontop">
|
|
<div id="header">
|
|
<div class="" style="display:flex;">
|
|
<div class="headerItem left"><p class="headerText">Home</p></div>
|
|
</div>
|
|
<div class="" style="display:flex;">
|
|
<div class="headerItem"><p class="headerText">Settings</p></div>
|
|
<div class="headerItem"><p class="headerText">About</p></div>
|
|
</div>
|
|
<div style="position: absolute;right: 10;" onclick="myFunction()"><p id="BotStatus" class="card noselect" style="padding-left: 3px;padding-right: 3px;">Bot Status: ??</p></div>
|
|
</div>
|
|
<!--<a class="btn-floating btn-large waves-effect waves-light red right hide-on-small-and-down" ><i class="material-icons">add</i></a>-->
|
|
</div>
|
|
|
|
|
|
<div id=bodyarea class="row" style="">
|
|
<div id="sidebar_area" class="col s12 m3 hide-on-small-and-down" style="position: fixed;">
|
|
<div class="row" style="padding-left: 3px;" style="">
|
|
<div class="s12 card waves-effect waves-light btn-large colsInSideBar" style="background-color: #42A5F5;">
|
|
<i class="material-icons">menu</i>
|
|
</div>
|
|
<div class="lineSeperator"></div>
|
|
<div class="s12 card waves-effect waves-light btn-large colsInSideBar" style="background-color: #42A5F5;">
|
|
<p>Chyron</p>
|
|
</div>
|
|
<div class="s12 card waves-effect waves-light btn-large colsInSideBar" style="background-color: #42A5F5;">
|
|
<p>Commands</p>
|
|
</div>
|
|
<div class="s12 card colsInSideBar waves-effect waves-light btn-large" style="background-color: #42A5F5;">
|
|
<p>Rewards</p>
|
|
</div>
|
|
<div class="s12 card colsInSideBar waves-effect waves-light btn-large" style="background-color: #42A5F5;">
|
|
<p>Timers</p>
|
|
</div>
|
|
<div class="s12 card colsInSideBar waves-effect waves-light btn-large" style="background-color: #42A5F5;">
|
|
<p>Text Sources</p>
|
|
</div>
|
|
<div class="lineSeperator"></div>
|
|
<div class="s12 card colsInSideBar waves-effect waves-light btn-large" style="background-color: #42A5F5;">
|
|
<p>Event History</p>
|
|
</div>
|
|
<div class="s12 card colsInSideBar waves-effect waves-light btn-large" style="background-color: #42A5F5;">
|
|
<p>Modules</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="main_area" class="col s12 m9 right">
|
|
|
|
<div class="rowsInMain center card">
|
|
<a class="btn-floating btn-large waves-effect waves-light red right hide-on-small-and-down" style="margin-right: 10px;">
|
|
<i class="material-icons">add</i>
|
|
</a><h3>Chyron:</h3></div>
|
|
<div class="rowsInMain row card" style="margin-right: 20px;margin-left: 20px;margin-top: 30px;margin-bottom: 30px;">
|
|
<div class="col s3"><p>Section Name:</p></div>
|
|
<div class="col s3"><p>Title:</p></div>
|
|
<div class="col s3"><p>Content:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain center card">
|
|
<a class="btn-floating btn-large waves-effect waves-light red right hide-on-small-and-down" style="margin-right: 10px;">
|
|
<i class="material-icons">add</i>
|
|
</a><h3>Commands:</h3></div>
|
|
<div class="rowsInMain row card" style="margin-right: 20px;margin-left: 20px;margin-top: 30px;margin-bottom: 30px;">
|
|
<div class="col s3"><p>Cmd Name:</p></div>
|
|
<div class="col s3"><p>Trigger:</p></div>
|
|
<div class="col s3"><p>Responses:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain center card">
|
|
<a class="btn-floating btn-large waves-effect waves-light red right hide-on-small-and-down" style="margin-right: 10px;">
|
|
<i class="material-icons">add</i>
|
|
</a><h3>Rewards:</h3></div>
|
|
<div class="rowsInMain row card" style="margin-right: 20px;margin-left: 20px;margin-top: 30px;margin-bottom: 30px;">
|
|
<div class="col s3"><p>Rwd Name:</p></div>
|
|
<div class="col s3"><p>Trigger:</p></div>
|
|
<div class="col s3"><p>Responses:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain center card">
|
|
<a class="btn-floating btn-large waves-effect waves-light red right hide-on-small-and-down" style="margin-right: 10px;">
|
|
<i class="material-icons">add</i>
|
|
</a><h3>Timers:</h3></div>
|
|
<div class="rowsInMain row card" style="margin-right: 20px;margin-left: 20px;margin-top: 30px;margin-bottom: 30px;">
|
|
<div class="col s3"><p>Timer Name:</p></div>
|
|
<div class="col s3"><p>Trigger:</p></div>
|
|
<div class="col s3"><p>Trigger_EXEC:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain center card">
|
|
<a class="btn-floating btn-large waves-effect waves-light red right hide-on-small-and-down" style="margin-right: 10px;">
|
|
<i class="material-icons">add</i>
|
|
</a><h3>Text Sources:</h3></div>
|
|
<div class="rowsInMain row card" style="margin-right: 20px;margin-left: 20px;margin-top: 30px;margin-bottom: 30px;">
|
|
<div class="col s3"><p>Text Name:</p></div>
|
|
<div class="col s3"><p>Title:</p></div>
|
|
<div class="col s3"><p>Text:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain center card">
|
|
<a class="btn-floating btn-large waves-effect waves-light red right hide-on-small-and-down" style="margin-right: 10px;">
|
|
<i class="material-icons">add</i>
|
|
</a><h3>Event History:</h3></div>
|
|
|
|
<div class="" style="overflow-y: scroll; max-height: 60vh; background-color: cadetblue; margin-right: 20px;margin-left: 20px;margin-top: 30px;margin-bottom: 30px;">
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
<div class="rowsInMain row card">
|
|
<div class="col s3"><p>Event:</p></div>
|
|
<div class="col s3"><p>User:</p></div>
|
|
<div class="col s3"><p>Message:</p></div>
|
|
<div class="col s1 right"><p>O</p></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rowsInMain center card"><h3>Modules:</h3></div>
|
|
<div class="row">
|
|
<div class="col s6 m3">
|
|
<div class="card modulesCard">
|
|
<div class="modulesCardWrap">
|
|
<h6 style="padding-top: 15px;">Commands</h6>
|
|
<a class="waves-effect waves-light btn modulesCardWrapButton">Enable</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col s6 m3">
|
|
<div class="card modulesCard">
|
|
<div class="modulesCardWrap">
|
|
<h6 style="padding-top: 15px;">Rewards</h6>
|
|
<a class="waves-effect waves-light btn modulesCardWrapButton">Enable</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col s6 m3">
|
|
<div class="card modulesCard">
|
|
<div class="modulesCardWrap">
|
|
<h6 style="padding-top: 15px;">RGB Lights</h6>
|
|
<a class="waves-effect waves-light btn modulesCardWrapButton">Enable</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col s6 m3">
|
|
<div class="card modulesCard">
|
|
<div class="modulesCardWrap">
|
|
<h6 style="padding-top: 15px;">Text Sources</h6>
|
|
<a class="waves-effect waves-light btn modulesCardWrapButton">Enable</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col s6 m3">
|
|
<div class="card modulesCard">
|
|
<div class="modulesCardWrap">
|
|
<h6 style="padding-top: 15px;">TTS</h6>
|
|
<a class="waves-effect waves-light btn modulesCardWrapButton">Enable</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col s6 m3">
|
|
<div class="card modulesCard">
|
|
<div class="modulesCardWrap">
|
|
<h6 style="padding-top: 15px;">OBS Web Socket</h6>
|
|
<a class="waves-effect waves-light btn modulesCardWrapButton">Enable</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
|
|
<script src="js/materialize.js"></script>
|
|
|
|
<!-- Load React. -->
|
|
<!-- Note: when deploying, replace "development.js" with "production.min.js". -->
|
|
<!--<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>-->
|
|
<!--<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>-->
|
|
|
|
|
|
<script src="webclient.js"></script>
|
|
|
|
</body>
|
|
</html> |