BeamMP/BeamMP-Website
1
0
Fork 0
mirror of https://github.com/BeamMP/BeamMP-Website.git synced 2025-07-03 16:25:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #16 from AlexITA1100/main

Browse Source 
Made the website work when Javascript is disabled.
This commit is contained in:
Starystars67 2024-01-17 19:36:38 +00:00 committed by GitHub
commit dedc16fb73
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 689 additions and 311 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/routes.js
View File

@ -13,6 +13,10 @@ function mainRoutes(router) {
router.get('/stats', function (req, res) { router.get('/stats', function (req, res) {
res.render('stats.ejs'); res.render('stats.ejs');
}); });
router.get('/linux-builds', function (req, res) {
res.render('linux-builds.ejs');
});
router.get('/ping', function (req, res) { router.get('/ping', function (req, res) {
res.send('OK'); res.send('OK');

44
src/static/css/styles-nojs.css Normal file
View File

@ -0,0 +1,44 @@
.pageContainer, .footer-js {
display: none;
}
.nojs-warning {
position: absolute !important;
max-width: 400px !important;
text-align: center !important;
padding-top: 24px !important;
animation: blinker 2s ease-in-out infinite;
}
@keyframes blinker {
50% { opacity: 0; }
}
.content-not-available {
display: grid;
position: relative;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
height: calc(100vh - 80px);
overflow: hidden;
color: #fefee1;
}
.content-not-available .content-not-available-introduction {
width: 100%;
position: absolute;
transition: transform .2s ease;
transform: translateX(0);
text-align: center;
}
.table-container {
margin-left: 10px;
height: 100%;
}
.table-container a{
color: #4FACFC;
}

30
src/views/includes/footer-nojs.ejs Normal file
View File

@ -0,0 +1,30 @@
<footer class="py-5">
<div class="container">
<div class="row">
<div class="col-6 col-sm-4 text-xs-center order-sm-2">
<a class="text-white" target="_blank" href="https://www.reddit.com/r/BeamMP">Reddit</a>
<span> | </span>
<a class="text-white" target="_blank" href="https://twitter.com/BeamMP_Mod_Team">Twitter</a>
<span> | </span>
<a class="text-white" target="_blank" href="https://www.facebook.com/BeamNGMP">Facebook</a>
</div>
<div class="col-6 justify-content-between col-sm-4 text-right text-xs-center order-sm-3">
<a class="text-white" target="_blank" href="https://github.com/BeamMP">GitHub</a>
<span> | </span>
<a class="text-white" target="_blank" href="https://discord.gg/beammp">Discord</a>
<span> | </span>
<a class="text-white" target="_blank" href="https://www.beamng.com/threads/beamng-drive-multiplayer-beamng-mp-formally-local-multiplayer-lua-based.63052/">BeamNG Forums Thread</a>
</div>
</div>
<div class="col-12 col-sm-4 text-center py-4 order-sm-2">
<small class="text-white">&#xA9; 2019 - Present | BeamMP Mod Team All Rights Reserved</small>
<small class="ml-1">
<a href="https://forum.beammp.com/topic/95/privacy-policy-v1-0" target="_blank">Privacy Policy</a>
&middot;
<a href="https://forum.beammp.com/topic/94/terms-of-use-v1-0">Terms &amp; Conditions</a>
</small>
</div>
</div>
</footer>

68
src/views/includes/nav-nojs.ejs Normal file
View File

@ -0,0 +1,68 @@
<div class="nojs-warning">
<b>
<span>&#9888;</span>
<span> You're not using Javascript, this version of the website has limited content.</span>
</b>
</div>
<div class="container">
<div class="row center-xs" style="max-height: 80px;">
<div class="col-md-4 col-sm-4">
<a class="logo-img" href="/">
<div class="logo-image">
<img src="../img/beammp-logo.png" alt="BeamMP Logo" class="img-fluid"/>
</div>
</a>
</div>
<div class="col-md-8 col-sm-8">
<div class="burger-menu">
<button class="navbar-toggler toggler-example" type="button" data-toggle="collapse" data-target="#navbarSupportedContent1" aria-controls="navbarSupportedContent1" aria-expanded="false" aria-label="Toggle navigation"><span class="dark-blue-text"><i class="fas fa-bars fa-1x"></i></span></button>
</div>
<!-- Collapsible content -->
<div class="collapse navbar-collapse" id="navbarSupportedContent1">
<!-- Links -->
<div class="mobile-container">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="https://forum.beammp.com">Forum</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://docs.beammp.com/">Docs</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://github.com/BeamMP/BeamMP">GitHub</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.patreon.com/BeamMP">Patreon</a>
</li>
</ul>
</div>
</div>
<div class="navbar-links">
<ul class="links">
<li>
<a href="https://forum.beammp.com">
<span class="text">Forum</span>
</a>
</li>
<li>
<a href="https://docs.beammp.com/">
<span class="text">Docs</span>
</a>
</li>
<li>
<a href="https://github.com/BeamMP/BeamMP">
<span class="text">Github</span>
</a>
</li>
<li>
<a href="https://www.patreon.com/BeamMP">
<span class="text">Patreon</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>

344
src/views/index.ejs
View File

@ -50,32 +50,37 @@
}); });
}); });
</script> </script>
<noscript>
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<link rel="stylesheet" type="text/css" href="css/styles-nojs.css"/>
</noscript>
</head> </head>
<body> <body>
<nav class="nav"> <div class="pageContainer">
<%- include('includes/nav.ejs') %> <nav class="nav">
</nav> <%- include('includes/nav.ejs') %>
</nav>
<header class="main-content" style="background-position: center center, center 0px;">
<div class="introduction" style="margin-top: 0px;"> <header class="main-content" style="background-position: center center, center 0px;">
<div class="container"> <div class="introduction" style="margin-top: 0px;">
<div class="row center-xs middle-xs"> <div class="container">
<div class="col-lg-8 col-md-8 col-sm-8 col-xs-12"> <div class="row center-xs middle-xs">
<p class="lead"> <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12">
<b>BeamMP</b> Bringing Multiplayer to BeamNG.drive!<br> <p class="lead">
With a smooth and enjoyable experience. <b>BeamMP</b> Bringing Multiplayer to BeamNG.drive!<br>
</div> With a smooth and enjoyable experience.
<div id="button" class="col-lg-4 col-md-4 col-sm-4 buttons-wrapper hidden-xs"> </div>
<div> <div id="button" class="col-lg-4 col-md-4 col-sm-4 buttons-wrapper hidden-xs">
<h2>Players Online: <span id="ONLINE-PLAYERS"></span></h2> <div>
</div> <h2>Players Online: <span id="ONLINE-PLAYERS"></span></h2>
<div class="buttons mt-3"> </div>
<button class="download-client js-show-story" onclick="downloadinstaller()" href="beamMP.zip" download> <div class="buttons mt-3">
<img class="os-icon" src="https://raw.githubusercontent.com/devicons/devicon/master/icons/windows8/windows8-original.svg" alt="windows-logo"> <button class="download-client js-show-story" onclick="downloadinstaller()" href="beamMP.zip" download>
<img class="os-icon" src="https://raw.githubusercontent.com/devicons/devicon/master/icons/windows8/windows8-original.svg" alt="windows-logo">
<span class="text">Download Client</span> <span class="text">Download Client</span>
<span class="description"> BeamMP_Installer.zip</span> <span class="description"> BeamMP_Installer.zip</span>
</button> </button>
</div> </div>
<div class="buttons mt-3"> <div class="buttons mt-3">
<form action="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.exe"> <form action="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.exe">
<button class="download-client js-show-story" style="background: radial-gradient(circle,rgb(255 179 38 / 80%),rgb(255 176 0 / 65%)) center/100%;"> <button class="download-client js-show-story" style="background: radial-gradient(circle,rgb(255 179 38 / 80%),rgb(255 176 0 / 65%)) center/100%;">
@ -94,98 +99,215 @@
</button> </button>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </header>
</header> <section id="features">
<section id="features"> <div class="container">
<div class="container"> <div class="row center-lg center-md center-sm center-xs features">
<div class="row center-lg center-md center-sm center-xs features"> <article class="col-lg-3">
<article class="col-lg-3"> <h2>Stable Servers</h2>
<h2>Stable Servers</h2> BeamMP allows for stable servers,
BeamMP allows for stable servers, with a variety of servers located accross the globe.
with a variety of servers located accross the globe. </article>
</article> <article class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<article class="col-lg-3 col-md-6 col-sm-6 col-xs-12"> <h2> BeamNG.drive </h2> BeamMP uses the same maps, vehicles & mods
<h2> BeamNG.drive </h2> BeamMP uses the same maps, vehicles & mods so you don't need to learn anything new!
so you don't need to learn anything new! </article>
</article> <article class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<article class="col-lg-3 col-md-6 col-sm-6 col-xs-12"> <h2> Standalone </h2> BeamMP doesn't modify your original installation,
<h2> Standalone </h2> BeamMP doesn't modify your original installation, so you can play either singleplayer or multiplayer.
so you can play either singleplayer or multiplayer. </article>
</article> <article class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<article class="col-lg-3 col-md-6 col-sm-6 col-xs-12"> <h2> Sync quality </h2> BeamMP updates your vehicle position ~100 times per second,
<h2> Sync quality </h2> BeamMP updates your vehicle position ~100 times per second, allowing for a smooth overall experience.
allowing for a smooth overall experience. </article>
</article> </div>
</div> </div>
</div>
<hr> <hr>
<div class="row middle-lg"> <div class="row middle-lg">
<div class="col-lg-6"> <div class="col-lg-6">
<figure> <figure>
<img src="../img/beammpservers.png"> <img src="../img/beammpservers.png">
</figure> </figure>
</div> </div>
<div class="col-lg-6" style="text-align:center"> <div class="col-lg-6" style="text-align:center">
<ul class="user-features-list"> <ul class="user-features-list">
<li> Dedicated servers </li> <li> Dedicated servers </li>
<li> The original BeamNG.Drive</li> <li> The original BeamNG.Drive</li>
<li> Dedicated support team</li> <li> Dedicated support team</li>
<li> 24/7 Global Access</li> <li> 24/7 Global Access</li>
</ul> </ul>
</div> </div>
</div> </div>
</section> </section>
<hr> <hr>
<section id="faq"><div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> <section id="faq">
<div class="container"> <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<!-- <div class="row"> --> <div class="container">
<h1>FAQ.</h1> <!-- <div class="row"> -->
<div class="faq"> <h1>FAQ.</h1>
<h3 id="faq-heading">The server list is not showing up!</h3> <div class="faq">
<p>Try restarting BeamMP as this can sometimes happen, if this fails to fix your issue please create a topic on our forum or visit the support channel on our discord</p> <h3 id="faq-heading">The server list is not showing up!</h3>
<h3 id="faq-heading">How do I open a ticket in case something doesn’t work or I have questions?</h3> <p>Try restarting BeamMP as this can sometimes happen, if this fails to fix your issue please create a topic on our forum or visit the support channel on our discord</p>
<p>Please check the <b>#how-to-use</b> channel in Discord and on our forum. Please give an accurate description of what you’ve done so the support team will help you in a fast and effective way. </p> <h3 id="faq-heading">How do I open a ticket in case something doesn’t work or I have questions?</h3>
<h3 id="faq-heading">Help! Im getting error codes</h3> <p>Please check the <b>#how-to-use</b> channel in Discord and on our forum. Please give an accurate description of what you’ve done so the support team will help you in a fast and effective way. </p>
<p>Please head over to our forum and see if anyone has had the issue before. It is likely that someone else has at some point and therefore there will also probably be a solution posted with it too in the replies. Altervatively visit our discord where the larger portion of community is currently based.</p> <h3 id="faq-heading">Help! Im getting error codes</h3>
<h3 id="faq-heading"> Does this work with pirated versions of BeamNG.drive?</h3> <p>Please head over to our forum and see if anyone has had the issue before. It is likely that someone else has at some point and therefore there will also probably be a solution posted with it too in the replies. Altervatively visit our discord where the larger portion of community is currently based.</p>
<p>We don’t know if it works with pirated versions of BeamNG.drive, but we <b>will not</b> provide any support to non legit copies of the game. Nor will we change to support it.</p> <h3 id="faq-heading"> Does this work with pirated versions of BeamNG.drive?</h3>
<h3 id="faq-heading">How do I host a server?</h3> <p>We don’t know if it works with pirated versions of BeamNG.drive, but we <b>will not</b> provide any support to non legit copies of the game. Nor will we change to support it.</p>
<p>The server files required for hosting your own server can be found at the top of this page below the client download. You will also require a authentication key which can be found from <a href="https://keymaster.beammp.com/">keymaster</a>. Further information around the setup can be found on our <a href="https://docs.beammp.com/">docs</a>.</p> <h3 id="faq-heading">How do I host a server?</h3>
<h3 id="faq-heading">Can I use mods?</h3> <p>The server files required for hosting your own server can be found at the top of this page below the client download. You will also require a authentication key which can be found from <a href="https://keymaster.beammp.com/">keymaster</a>. Further information around the setup can be found on our <a href="https://docs.beammp.com/">docs</a>.</p>
<p>Mods are supported, These are installed on the server. See our <a href="https://docs.beammp.com/">docs</a> for more infomation.</p> <h3 id="faq-heading">Can I use mods?</h3>
</div> <p>Mods are supported, These are installed on the server. See our <a href="https://docs.beammp.com/">docs</a> for more infomation.</p>
</div> </div>
</div> </div>
</div> </div>
</section> </div>
</section>
<div class="footer-js">
<%- include('includes/footer.ejs') %>
</div>
<script>
function downloadinstaller() {
document.location.href ="/installer/BeamMP_Installer.zip";
//alert("Sorry this is coming soon, Therefore it is not available just yet. Please join the discord to get the latest version: https://discord.gg/beammp")
}
<%- include('includes/footer.ejs') %> function myFunction() {
<script> var x = document.getElementById("burger-links");
function downloadinstaller() { if (x.style.display === "block") {
document.location.href ="/installer/BeamMP_Installer.zip"; x.style.display = "none";
//alert("Sorry this is coming soon, Therefore it is not available just yet. Please join the discord to get the latest version: https://discord.gg/beammp") } else {
} x.style.display = "block";
}
}
</script>
<script src="js/script.js"></script>
</div>
<noscript>
<nav class="nav">
<%- include('includes/nav-nojs.ejs') %>
</nav>
<div class="nojsContainer">
<header class="main-content" style="background-position: center center, center 0px;">
<div class="introduction" style="margin-top: 0px;">
<div class="container">
<div class="row center-xs middle-xs">
<div class="col-lg-8 col-md-8 col-sm-8 col-xs-12">
<p class="lead">
<b>BeamMP</b> Bringing Multiplayer to BeamNG.drive!<br>
With a smooth and enjoyable experience.
</p>
</div>
<div id="button" class="col-lg-4 col-md-4 col-sm-4 buttons-wrapper hidden-xs">
<div class="buttons mt-3">
<form action="https://beammp.com/installer/BeamMP_Installer.zip">
<button class="download-client js-show-story" href="beamMP.zip" download>
<img class="os-icon" src="https://raw.githubusercontent.com/devicons/devicon/master/icons/windows8/windows8-original.svg" alt="windows-logo">
<span class="text">Download Client</span>
<span class="description"> BeamMP_Installer.zip</span>
</button>
</form>
</div>
<div class="buttons mt-3">
<form action="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.exe">
<button class="download-client js-show-story" style="background: radial-gradient(circle,rgb(255 179 38 / 80%),rgb(255 176 0 / 65%)) center/100%;">
<img class="os-icon" src="https://raw.githubusercontent.com/devicons/devicon/master/icons/windows8/windows8-original.svg" alt="windows-logo">
<span class="text">Download Server</span>
<span class="description"> BeamMP-Server.exe</span>
</button>
</form>
</div>
<div class="buttons mt-3">
<form action="/linux-builds" method="post">
<button class="download-client js-show-story" style="background: radial-gradient(circle,rgb(255 179 38 / 80%),rgb(255 176 0 / 65%)) center/100%;">
<img class="os-icon" src="https://raw.githubusercontent.com/devicons/devicon/master/icons/linux/linux-plain.svg" alt="linux-logo">
<span class="text">Download Server</span>
<span class="description"> Linux builds</span>
</button>
</form>
</div>
</div>
</div>
</div>
</div>
</header>
<section id="features">
<div class="container">
<div class="row center-lg center-md center-sm center-xs features">
<article class="col-lg-3">
<h2>Stable Servers</h2>
BeamMP allows for stable servers,
with a variety of servers located accross the globe.
</article>
<article class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<h2> BeamNG.drive </h2> BeamMP uses the same maps, vehicles & mods
so you don't need to learn anything new!
</article>
<article class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<h2> Standalone </h2> BeamMP doesn't modify your original installation,
so you can play either singleplayer or multiplayer.
</article>
<article class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<h2> Sync quality </h2> BeamMP updates your vehicle position ~100 times per second,
allowing for a smooth overall experience.
</article>
</div>
</div>
function downloadserver() { <hr>
document.location.href ="https://github.com/BeamMP/BeamMP-Server/releases/latest"; <div class="row middle-lg">
//alert("Sorry this is coming soon, Therefore it is not available just yet. Please join the discord to get the latest version: https://discord.gg/beammp") <div class="col-lg-6">
} <figure>
<img src="../img/beammpservers.png">
</figure>
</div>
<div class="col-lg-6" style="text-align:center">
<ul class="user-features-list">
<li> Dedicated servers </li>
<li> The original BeamNG.Drive</li>
<li> Dedicated support team</li>
<li> 24/7 Global Access</li>
</ul>
</div>
</div>
function myFunction() { </section>
var x = document.getElementById("burger-links"); <hr>
if (x.style.display === "block") { <section id="faq">
x.style.display = "none"; <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
} else { <div class="container">
x.style.display = "block"; <!-- <div class="row"> -->
} <h1>FAQ.</h1>
} <div class="faq">
</script> <h3 id="faq-heading">The server list is not showing up!</h3>
<script src="js/script.js"></script> <p>Try restarting BeamMP as this can sometimes happen, if this fails to fix your issue please create a topic on our forum or visit the support channel on our discord</p>
<h3 id="faq-heading">How do I open a ticket in case something doesn’t work or I have questions?</h3>
<p>Please check the <b>#how-to-use</b> channel in Discord and on our forum. Please give an accurate description of what you’ve done so the support team will help you in a fast and effective way. </p>
<h3 id="faq-heading">Help! Im getting error codes</h3>
<p>Please head over to our forum and see if anyone has had the issue before. It is likely that someone else has at some point and therefore there will also probably be a solution posted with it too in the replies. Altervatively visit our discord where the larger portion of community is currently based.</p>
<h3 id="faq-heading"> Does this work with pirated versions of BeamNG.drive?</h3>
<p>We don’t know if it works with pirated versions of BeamNG.drive, but we <b>will not</b> provide any support to non legit copies of the game. Nor will we change to support it.</p>
<h3 id="faq-heading">How do I host a server?</h3>
<p>The server files required for hosting your own server can be found at the top of this page below the client download. You will also require a authentication key which can be found from <a href="https://keymaster.beammp.com/">keymaster</a>. Further information around the setup can be found on our <a href="https://docs.beammp.com/">docs</a>.</p>
<h3 id="faq-heading">Can I use mods?</h3>
<p>Mods are supported, These are installed on the server. See our <a href="https://docs.beammp.com/">docs</a> for more infomation.</p>
</div>
</div>
</div>
</div>
</section>
<%- include('includes/footer-nojs.ejs') %>
</div>
</noscript>
<!-- <script src="../static/js/script.js"></script>--> <!-- <script src="../static/js/script.js"></script>-->
</body> </body>

65
src/views/linux-builds.ejs Normal file
View File

@ -0,0 +1,65 @@
<!-- This page is only loaded on JS free clients -->
<!-- Archetype to add a distribution (THERE MUST BE 2 SPACES BEFORE THE DISTRO NAME)
<tr>
<td>Distro name</td>
</tr>
<tr>
<td>
&emsp;&#9562;<a href="direct link to .zip file on Github"> Distro name (architecture A)</a><br>
&emsp;&#9562;<a href="direct link to .zip file on Github"> Distro name (architecture B)</a><br>
</td>
</tr>
-->
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="abuseipdb-verification" content="K1hJK7Gv" />
<title>Linux Builds</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<link rel="stylesheet" type="text/css" href="css/styles-nojs.css"/>
</head>
<body>
<nav class="nav">
<%- include('includes/nav-nojs.ejs') %>
</nav>
<h1 style="padding-top: 80px; padding-left: 10px;">List of Linux builds for BeamMP Server</h1>
<div class="table-container">
<table>
<tbody>
<tr>
<td>Debian</td>
</tr>
<tr>
<td>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.debian.11.arm64"> Debian 11 (arm64)</a><br>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.debian.11.x86_64"> Debian 11 (x86/64)</a><br>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.debian.12.arm64"> Debian 12 (arm64)</a><br>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.debian.12.x86_64"> Debian 12 (x86/64)</a><br>
</td>
</tr>
<tr>
<td>Ubuntu</td>
</tr>
<tr>
<td>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.ubuntu.20.04.arm64"> Ubuntu 20.04 (arm64)</a><br>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.ubuntu.20.04.x86_64"> Ubuntu 20.04 (x86/64)</a><br>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.ubuntu.22.04.arm64"> Ubuntu 22.04 (arm64)</a><br>
&emsp;&#9562;<a href="https://github.com/BeamMP/BeamMP-Server/releases/latest/download/BeamMP-Server.ubuntu.22.04.x86_64"> Ubuntu 22.04 (x86/64)</a><br>
</td>
</tr>
</tbody>
</table>
</div>
<%- include('includes/footer-nojs.ejs') %>
</body>

105
src/views/servers.ejs
View File

@ -20,49 +20,70 @@
gtag('config', 'UA-160071688-1'); gtag('config', 'UA-160071688-1');
</script> </script>
<noscript>
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<link rel="stylesheet" type="text/css" href="css/styles-nojs.css"/>
</noscript>
</head> </head>
<body class="sb-nav-fixed"> <body class="sb-nav-fixed">
<span id="TEMPAREA" style="display:none;"></span> <div class="pageContainer">
<nav class="nav" style="position: unset !important;"> <span id="TEMPAREA" style="display:none;"></span>
<%- include('includes/nav.ejs') %> <nav class="nav" style="position: unset !important;">
</nav> <%- include('includes/nav.ejs') %>
<div class="container-fluid"> </nav>
<div id="layoutSidenav_content"> <div class="container-fluid">
<h1 class="mt-4" style="color:white;">Server List</h1> <div id="layoutSidenav_content">
<div class="card mb-4"> <h1 class="mt-4" style="color:white;">Server List</h1>
<div class="card-header"><i class="fas fa-server mr-1"></i>BeamMP Server List</div> <div class="card mb-4">
<div class="card-body"> <div class="card-header"><i class="fas fa-server mr-1"></i>BeamMP Server List</div>
<div class="table-responsive"> <div class="card-body">
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0"> <div class="table-responsive">
<thead> <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
<tr> <thead>
<th>Location</th> <tr>
<th>Server Name</th> <th>Location</th>
<th>Map</th> <th>Server Name</th>
<th>Players</th> <th>Map</th>
</tr> <th>Players</th>
</thead> </tr>
<tfoot> </thead>
<tr> <tfoot>
<th>Location</th> <tr>
<th>Server Name</th> <th>Location</th>
<th>Map</th> <th>Server Name</th>
<th>Players</th> <th>Map</th>
</tr> <th>Players</th>
</tfoot> </tr>
<tbody id="Servers-List"> </tfoot>
</tbody> <tbody id="Servers-List">
</table> </tbody>
</div> </table>
</div> </div>
</div> </div>
</div> </div>
<%- include('includes/footer.ejs') %> </div>
</div> <%- include('includes/footer.ejs') %>
<script src="https://code.jquery.com/jquery-3.4.1.min.js" crossorigin="anonymous"></script> </div>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js" crossorigin="anonymous"></script>
<script src="js/scripts.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js" crossorigin="anonymous"></script> <script src="js/scripts.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js" crossorigin="anonymous"></script> <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js" crossorigin="anonymous"></script>
</div>
<noscript>
<nav class="nav">
<%- include('includes/nav-nojs.ejs') %>
</nav>
<header class="content-not-available">
<div class="content-not-available-introduction" style="margin-top: 0px;">
<h1>This content is not available without Javascript.</h1>
<h2>Please enable Javascript and refresh the page.</h2>
</div>
</header>
<%- include('includes/footer-nojs.ejs') %>
</noscript>
</body> </body>
</html> </html>

340
src/views/stats.ejs
View File

@ -25,168 +25,192 @@
gtag('config', 'UA-160071688-1'); gtag('config', 'UA-160071688-1');
</script> </script>
<noscript>
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<link rel="stylesheet" type="text/css" href="css/styles-nojs.css"/>
</noscript>
</head> </head>
<body> <body>
<nav class="nav" style="position: unset !important;"> <div class="pageContainer">
<%- include('includes/nav.ejs') %> <nav class="nav" style="position: unset !important;">
</nav> <%- include('includes/nav.ejs') %>
<div class="container-fluid"> </nav>
<div id="layoutSidenav_content"> <div class="container-fluid">
<div class="row"> <div id="layoutSidenav_content">
<div class="col-md-12"> <div class="row">
<h1 class="mt-4" style="color:white;"><i class="fas fa-server mr-1"></i>BeamMP Statistics <h3 id="LivePlayerCount" style="color:white;"></h3></h1> <div class="col-md-12">
</div> <h1 class="mt-4" style="color:white;"><i class="fas fa-server mr-1"></i>BeamMP Statistics <h3 id="LivePlayerCount" style="color:white;"></h3></h1>
<div class="col-md-4"> </div>
<div class="card"> <div class="col-md-4">
<div class="card-body"> <div class="card">
<h5 class="card-title">Highest Recorded Players</h5> <div class="card-body">
<p class="card-text text-muted" id="MAXPLAYERS"></p> <h5 class="card-title">Highest Recorded Players</h5>
</div> <p class="card-text text-muted" id="MAXPLAYERS"></p>
</div> </div>
</div> </div>
<div class="col-md-4"> </div>
<div class="card"> <div class="col-md-4">
<div class="card-body"> <div class="card">
<h5 class="card-title">Highest Recorded Servers</h5> <div class="card-body">
<p class="card-text text-muted" id="MAXSERVERS"></p> <h5 class="card-title">Highest Recorded Servers</h5>
</div> <p class="card-text text-muted" id="MAXSERVERS"></p>
</div> </div>
</div> </div>
<div class="col-md-4"> </div>
<div class="card"> <div class="col-md-4">
<div class="card-body"> <div class="card">
<h5 class="card-title">Todays Average Players</h5> <div class="card-body">
<p class="card-text text-muted" id="AVERAGES"></p <h5 class="card-title">Todays Average Players</h5>
</div> <p class="card-text text-muted" id="AVERAGES"></p
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-12"> </div>
<canvas id="myChart" width="100vw" height="770"></canvas> <div class="col-md-12">
</div> <canvas id="myChart" width="100vw" height="770"></canvas>
</div> </div>
<footer class="py-4 bg-light mt-auto"> </div>
<div class="container-fluid"> <div class="foot">
<div class="d-flex align-items-center justify-content-between small"> <footer class="py-4 bg-light mt-auto">
<div class="text-muted">Copyright &copy; BeamMP Development Team 2021</div> <div class="container-fluid">
<div> <div class="d-flex align-items-center justify-content-between small">
<a href="https://forum.beammp.com/topic/95/privacy-policy-v1-0">Privacy Policy</a> <div class="text-muted">Copyright &copy; BeamMP Development Team 2019 - Present</div>
&middot; <div>
<a href="https://forum.beammp.com/topic/94/terms-of-use-v1-0">Terms &amp; Conditions</a> <a href="https://forum.beammp.com/topic/95/privacy-policy-v1-0">Privacy Policy</a>
</div> &middot;
</div> <a href="https://forum.beammp.com/topic/94/terms-of-use-v1-0">Terms &amp; Conditions</a>
</div> </div>
</footer> </div>
</div> </div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js" crossorigin="anonymous"></script> </footer>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script> </div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js" crossorigin="anonymous"></script> </div>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
<script type="text/javascript"> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js" crossorigin="anonymous"></script>
var chartData = {}; <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js" crossorigin="anonymous"></script>
<script type="text/javascript">
var chartData = {};
var GetChartData = function (period) { var GetChartData = function (period) {
$.ajax({ $.ajax({
type: 'GET', type: 'GET',
url: 'https://backend.beammp.com/stats-info', url: 'https://backend.beammp.com/stats-info',
data: { data: {
period: (period) ? period : 'today', period: (period) ? period : 'today',
}, },
dataType: 'json', dataType: 'json',
success: function (d) { success: function (d) {
console.log(d) console.log(d)
var average = 0; var average = 0;
var Data = {} var Data = {}
Data.Players = [] Data.Players = []
Data.Servers = [] Data.Servers = []
Data.v2Players = [] Data.v2Players = []
Data.v2Servers = [] Data.v2Servers = []
Data.Labels = [] Data.Labels = []
console.log(d.maxp, d.maxs) console.log(d.maxp, d.maxs)
console.log(d.v2history) console.log(d.v2history)
if (d.v2history) { if (d.v2history) {
var count = 0 var count = 0
var tot = 0 var tot = 0
d.v2history.forEach(function(item, index) { d.v2history.forEach(function(item, index) {
Data.Labels.push(item.datetime) Data.Labels.push(item.datetime)
Data.v2Players.push(item.players) Data.v2Players.push(item.players)
if (typeof(item.servers) == 'number') Data.v2Servers.push(item.servers); if (typeof(item.servers) == 'number') Data.v2Servers.push(item.servers);
if (typeof(item.servers) == 'object') Data.v2Servers.push(item.servers.count); if (typeof(item.servers) == 'object') Data.v2Servers.push(item.servers.count);
tot += parseInt(item.players) tot += parseInt(item.players)
count++; count++;
}); });
average = tot / count average = tot / count
} }
$('#MAXPLAYERS').text(d.maxp); $('#MAXPLAYERS').text(d.maxp);
$('#MAXSERVERS').text(d.maxs); $('#MAXSERVERS').text(d.maxs);
$('#AVERAGES').text(Math.floor(average)); $('#AVERAGES').text(Math.floor(average));
$('#LivePlayerCount').text(`Currently Online: ${d.v2history[d.v2history.length-1].players}`) $('#LivePlayerCount').text(`Currently Online: ${d.v2history[d.v2history.length-1].players}`)
console.log(Data) console.log(Data)
document.getElementById('myChart').innerHTML = ''; document.getElementById('myChart').innerHTML = '';
var ctx = document.getElementById('myChart').getContext('2d'); var ctx = document.getElementById('myChart').getContext('2d');
ctx.height = 770; ctx.height = 770;
var myChart = new Chart(ctx, { var myChart = new Chart(ctx, {
type: 'line', type: 'line',
data: { data: {
labels: Data.Labels, labels: Data.Labels,
datasets: [{ datasets: [{
label: 'Servers', label: 'Servers',
backgroundColor: 'rgba(255,0,0,0.1)', backgroundColor: 'rgba(255,0,0,0.1)',
borderColor: 'rgba(255,0,0,0.4)', borderColor: 'rgba(255,0,0,0.4)',
data: Data.v2Servers, data: Data.v2Servers,
fill: false, fill: false,
}, { }, {
label: 'Players', label: 'Players',
fill: false, fill: false,
backgroundColor: 'rgba(0,0,255,0.1)', backgroundColor: 'rgba(0,0,255,0.1)',
borderColor: 'rgba(0,0,255,0.4)', borderColor: 'rgba(0,0,255,0.4)',
data: Data.v2Players, data: Data.v2Players,
}] }]
}, },
options: { options: {
responsive: true, responsive: true,
maintainAspectRatio: false, maintainAspectRatio: false,
title: { title: {
display: true, display: true,
text: 'BeamMP Statistics' text: 'BeamMP Statistics'
}, },
tooltips: { tooltips: {
mode: 'index', mode: 'index',
intersect: false, intersect: false,
}, },
hover: { hover: {
mode: 'nearest', mode: 'nearest',
intersect: true intersect: true
}, },
scales: { scales: {
x: { x: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Time' labelString: 'Time'
} }
}, },
y: { y: {
display: true, display: true,
scaleLabel: { scaleLabel: {
display: true, display: true,
labelString: 'Count' labelString: 'Count'
} }
} }
} }
} }
}) })
} }
}); });
}; };
$(document).ready(function() { $(document).ready(function() {
GetChartData(); GetChartData();
}); });
//const socket = io('./stats'); //const socket = io('./stats');
</script> </script>
</div>
</div>
<noscript>
<nav class="nav">
<%- include('includes/nav-nojs.ejs') %>
</nav>
<header class="content-not-available">
<div class="content-not-available-introduction" style="margin-top: 0px;">
<h1>This content is not available without Javascript.</h1>
<h2>Please enable Javascript and refresh the page.</h2>
</div>
</header>
<%- include('includes/footer-nojs.ejs') %>
</noscript>
</body> </body>
</html> </html>