Client/index.html

140 lines
12 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>OpenFusion: Server Selector</title>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/fonts/fontawesome-all.min.css">
<link rel="stylesheet" href="assets/css/openfusion.css">
<link rel="stylesheet" href="assets/css/styles.css">
</head>
<body style="background: rgb(0,0,0);width: 100%;height: 100%;margin: 0;padding: 0;clear:both;" onresize="onResize()">
<section id="of-serverselector">
<div class="container" id="serverselector-container">
<div class="row text-center mt-3" id="of-logoheader">
<div class="col"><img class="img-fluid" id="of-logo" src="assets/img/of-3.png" width="256">
<p id="of-intro-text">Welcome to OpenFusion.<br>Select a server from the list below to get started.</p>
</div>
</div>
<div class="row d-sm-flex d-xl-flex justify-content-center justify-content-sm-center justify-content-xl-center" id="of-serverlist">
<div class="col-8 mb-2">
<div class="table-responsive text-center border rounded border-primary" id="server-table">
<table class="table table-striped table-hover mb-0">
<thead>
<tr>
<th>Description</th>
<th>Game Version</th>
</tr>
</thead>
<tbody id="server-tablebody">
<tr id="server-listing-placeholder">
<td colspan="2">No servers added yet... perhaps you should find one?</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="row row-cols-2 d-xl-flex justify-content-center justify-content-xl-center" id="of-serverbuttons" style="padding-bottom: 16px;">
<div class="col-4 text-left d-inline-flex justify-content-xl-start">
<button class="btn btn-success mr-1" data-toggle="modal" data-bs-tooltip="" data-placement="bottom" id="of-addserver-button" type="button" title="Add Server" data-target="#of-addservermodal" onclick="deselectServer()"><i class="fas fa-plus"></i></button>
<button class="btn btn-primary mr-1 disabled" data-toggle="modal" data-bs-tooltip="" data-placement="bottom" id="of-editserver-button" type="button" title="Edit Server" data-target="#of-editservermodal" disabled=""><i class="fas fa-edit"></i></button>
<button class="btn btn-danger mr-1 disabled" data-toggle="modal" data-bs-tooltip="" data-placement="bottom" id="of-deleteserver-button" type="button" title="Delete Server" data-target="#of-deleteservermodal" disabled=""><i class="fas fa-trash-alt"></i></button>
</div>
<div class="col-4 d-inline-flex justify-content-end">
<button class="btn btn-primary disabled" id="of-connect-button" type="button" onclick="connectToServer()" disabled="">Connect&nbsp;<i class="fas fa-angle-double-right"></i></button>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="of-aboutmodal">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">About OpenFusionClient</h4><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<p class="text-monospace">Version 1.4</p>
<p>©2020-2022 OpenFusion Contributors<br>OpenFusion is licensed under MIT.<br></p>
<a href="#of-restoreserversmodal" onclick="$('#of-aboutmodal').modal('toggle')" data-toggle="modal" data-target="#of-restoreserversmodal">Reset to Default Servers</a>
</div>
<div class="modal-footer">
<div class="row flex-fill">
<div class="col"><button class="btn btn-primary border rounded border-primary pb-1 pt-1 mr-2 pl-2 pr-2" data-toggle="tooltip" data-bs-tooltip="" type="button" title="Github Page" onclick="window.open(&#39;https://github.com/OpenFusionProject/OpenFusion&#39;,&#39;_blank&#39;);"><i class="fab fa-github" style="font-size: 24px;"></i></button><button class="btn btn-primary border rounded border-primary pb-1 pt-1 pl-2 pr-2" data-toggle="tooltip" data-bs-tooltip="" type="button" title="Discord Chat" onclick="window.open(&#39;https://discord.gg/DYavckB&#39;,&#39;_blank&#39;);"><i class="fab fa-discord" style="font-size: 24px; position:relative; top: 1px;"></i></button></div>
<div class="col text-right"><button class="btn btn-primary border rounded border-primary" type="button" data-dismiss="modal">Close</button></div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="of-addservermodal">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Add Server</h4><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<form id="addserver-form" class="needs-validation"><label for="addserver-descinput">Server Description</label><input class="form-control form-row w-75" type="text" id="addserver-descinput" placeholder="My OpenFusion Server" required="" minlength="1" maxlength="70"><label for="addserver-ipinput">Server IP</label><input class="form-control form-row w-75" type="text" id="addserver-ipinput" placeholder="127.0.0.1:23000" required="" pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]):[0-9]+$"><label for="addserver-versionselect">Game Version:&nbsp;</label><select class="form-control w-50" id="addserver-versionselect" required="" style="margin-left: -5px;"></select></form>
</div>
<div class="modal-footer"><button class="btn btn-primary border rounded border-primary btn-danger border-danger" id="addserver-cancel" type="button" data-dismiss="modal">Cancel</button><button class="btn btn-primary border rounded border-primary btn-success border-success" id="addserver-savebutton" type="submit" data-dismiss="modal" form="addserver-form" onclick="addServer();">Save</button></div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="of-editservermodal">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Edit Server</h4><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<form id="editserver-form" class="needs-validation"><label for="editserver-descinput">Server Description</label><input class="form-control form-row w-75" type="text" id="editserver-descinput" placeholder="My OpenFusion Server" required="" minlength="1" maxlength="70"><label for="addserver-ipinput">Server IP</label><input class="form-control form-row w-75" type="text" id="editserver-ipinput" placeholder="127.0.0.1:23000" required="" pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]):[0-9]+$"><label for="editserver-versionselect">Game Version:&nbsp;</label><select class="form-control w-50" id="editserver-versionselect" required="" style="margin-left: -5px;"></select></form>
</div>
<div class="modal-footer"><button class="btn btn-primary border rounded border-primary btn-danger border-danger" id="editserver-cancel" type="button" data-dismiss="modal">Cancel</button><button class="btn btn-primary border rounded border-primary btn-success border-success" id="addserver-savebutton" type="submit" data-dismiss="modal" form="editserver-form" onclick="editServer();">Save</button></div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="of-deleteservermodal">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Are you sure?</h4><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<p class="lead">Do you really want to delete<br>"<a id="deleteserver-servername">SERVER_NAME</a>"?<br><br>You could always re-add it later.</p>
</div>
<div class="modal-footer"><button class="btn btn-primary border rounded border-primary" type="button" data-dismiss="modal">Cancel</button><button class="btn btn-primary border rounded border-primary btn-danger border-danger" id="deleteserver-button" type="button" data-dismiss="modal" onclick="deleteServer();">Yes, Delete</button></div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" tabindex="-1" id="of-restoreserversmodal">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Are you sure?</h4><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<p class="lead">Do you really want to restore the default servers?</p>
</div>
<div class="modal-footer"><button class="btn btn-primary border rounded border-primary" type="button" data-dismiss="modal">Cancel</button><button class="btn btn-primary border rounded border-primary btn-danger border-danger" id="deleteserver-button" type="button" data-dismiss="modal" onclick="restoreDefaultServers();">Yes, Restore</button></div>
</div>
</div>
</div>
<div id="of-versionnumber"><a class="text-monospace text-secondary" href="#of-aboutmodal" data-toggle="modal" data-target="#of-aboutmodal">v1.4</a></div>
</section>
<section>
<div id="client" style="width: 100%;height: 100%;margin: 0;padding: 0;background: #000;clear:both;"></div>
</section>
<script src="assets/js/jquery.min.js" onload="window.$ = window.jQuery = module.exports;"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/bs-init.js"></script>
<script src="assets/js/uuidv4.min.js"></script>
<script src="assets/js/serverselector.js"></script>
<script src="assets/js/gameclient.js"></script>
<script src="assets/js/snowflakes.min.js"></script>
<script src="assets/js/eastereggs.js"></script>
</body>
</html>