Merge pull request #80 from OpzekerIT/dev

Rebranding
This commit is contained in:
Lanta 2023-11-03 23:05:00 +01:00 committed by GitHub
commit 2e42b32d44
15 changed files with 256 additions and 116 deletions

View file

@ -6,17 +6,13 @@ error_reporting(E_ALL);
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <?php include './includes/head.php'; ?>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan - Clan Stats</title>
<link rel="stylesheet" href="./includes/styles.css">
</head>
<body> <body>
<?php include './includes/navigation.php'; ?> <?php include './includes/navigation.php'; ?>
<header>
<img src="./images/banner2.png" alt="banner" class="banner">
</header>
<main> <main>
<section> <section>
<h2>Clan Stats</h2> <h2>Clan Stats</h2>

BIN
images/banner.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 MiB

BIN
images/banner2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 711 KiB

BIN
images/bannersmaller.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
images/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 MiB

15
includes/head.php Normal file
View file

@ -0,0 +1,15 @@
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan</title>
<link rel="stylesheet" href="./includes/styles.css">
<link rel="stylesheet" href="./includes/topnav.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css2?family=Bungee+Spice&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Dosis:wght@400;700&display=swap" rel="stylesheet">
<script src="./lib/sorttable.js"></script>
</head>

View file

@ -2,20 +2,31 @@
$host = $_SERVER['HTTP_HOST']; $host = $_SERVER['HTTP_HOST'];
if ($host == 'dev.dtch.online') { if ($host == 'dev.dtch.online') {
echo "You are on the development! <BR>"; echo "You are on the development! Site";
echo 'For prod <a href="https://dtch.online">DTCH PRODUCTION</a>';
} }
?> ?>
<div class="topnav">
<a href="index.php" class="active">Home</a>
<nav> <div id="myLinks">
<ul> <a href="clan_stats.php">Clan Stats</a>
<li><a href="index.php">Home</a></li> <a href="user_stats.php">User Stats</a>
<li><a href="clan_stats.php">Clan Stats</a></li> <a href="topstats.php">Top10</a>
<li><a href="user_stats.php">User Stats</a></li> <a href="topstatsavg.php">Match % T10</a>
<li><a href="topstats.php">Top10</a></li> <a href="latestmatches.php">Last Matches</a>
<li><a href="topstatsavg.php">Match % T10</a></li> <a href="last_stats.php">Last 14 days %</a>
<li><a href="latestmatches.php">Last Matches</a></li> </div>
<li><a href="last_stats.php">Last 14 days %</a></li> <a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</ul> </a>
</nav> </div>
<script>
function myFunction() {
var x = document.getElementById("myLinks");
if (x.style.display === "block") {
x.style.display = "none";
} else {
x.style.display = "block";
}
}
</script>

View file

@ -19,6 +19,7 @@ nav {
background: linear-gradient(to right, #FF416C, #FF4B2B); /* Gradient Background */ background: linear-gradient(to right, #FF416C, #FF4B2B); /* Gradient Background */
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.1); /* Slight Shadow for Depth */ box-shadow: 0 4px 18px rgba(0, 0, 0, 0.1); /* Slight Shadow for Depth */
padding: 10px 0; /* Vertical Padding */ padding: 10px 0; /* Vertical Padding */
min-width: 800px;
} }
nav ul { nav ul {
@ -50,11 +51,21 @@ nav a:active {
transform: translateY(1px); /* Slight Pressed-In effect on Click */ transform: translateY(1px); /* Slight Pressed-In effect on Click */
} }
header .banner {
max-width: 100%; /* Ensures the image is never larger than its container */
max-height: 200px; /* Maximum height for the image */
display: block; /* Prevents inline default spacing */
margin: 0 auto; /* Centers the image within the header */
width: auto; /* Adjusts the width to maintain the aspect ratio */
}
header, main, footer { header, main, footer {
max-width: 800px; max-width: 1200px;
margin: 20px auto; min-width: 800px;
padding: 20px; margin: 5px 5px;
border: 1px solid white; padding: 10px;
border: 1px solid rgb(255, 255, 255);
border-radius: 10px; border-radius: 10px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
} }
@ -63,6 +74,8 @@ header h1, section h2 {
border-bottom: 1px solid white; border-bottom: 1px solid white;
margin-bottom: 10px; margin-bottom: 10px;
padding-bottom: 5px; padding-bottom: 5px;
font-family: 'Bungee Spice'
} }
footer { footer {
@ -70,9 +83,45 @@ footer {
} }
@media (max-width: 600px) { @media (max-width: 600px) {
nav li {
display: block; th:nth-child(4), td:nth-child(4),
margin-right: 0; th:nth-child(9), td:nth-child(9) {
display: none;
}
header .banner {
max-height: 100px; /* Resize the maximum height for mobile */
width: 100%; /* Take full width of the container */
}
/* You may also want to adjust other elements to fit mobile layout better */
header, main, footer {
min-width: 0; /* Allow the width to shrink below 800px */
padding: 5px; /* Reduce padding for mobile devices */
margin: 5px 5px; /* Less margin for tighter mobile layout */
max-width: 800px;
min-width: 200px;
}
nav {
min-width: 0; /* Allow the nav to be responsive below 800px */
}
nav ul {
text-align: left; /* Align nav items to the left on mobile for better spacing */
}
th, td {
padding: 0px; /* Reduce padding */
margin: 0px;
font-size: 10px; /* Reduce font size */
letter-spacing: -0.5px; /* Reduce space between letters */
}
/* Other styles can be added here as needed for mobile optimization */
table {
font-size: 12px; /* Decrease font size for the whole table */
margin-top: 5px;
border-spacing: 0;
border-collapse: collapse;
} }
} }
@ -84,7 +133,7 @@ table {
table, th, td { table, th, td {
border: 1px solid white; border: 1px solid white;
border-radius: 5px; border-radius: 1px;
} }
th, td { th, td {
@ -115,29 +164,87 @@ tr:hover {
opacity: 0.8; opacity: 0.8;
} }
/* Fancy Button Styles */
/* Hacker theme styles */
body {
font-family: 'Dosis', monospace;
background: #0f0f0f; /* Dark background for hacker aesthetic */
color: #e69109; /* Bright green text, reminiscent of old terminals */
}
/* Ensure elements scale well on mobile */
@media (max-width: 768px) {
body {
font-size: 14px; /* Adjust font size for mobile readability */
}
/* Add additional mobile scaling styles as needed */
}
/* Override other elements as needed for the hacker theme */
nav {
background: #121212; /* Dark background for navigation */
/* border-bottom: 1px solid #33ff33; Bright green border for accent */
}
/* Ensure links stand out */
a {
color: #6699ff; /* Blue color for links */
text-decoration: underline; /* Underline links for better visibility */
}
/* Specific button styles for .btn class to match the hacker theme */
.btn { .btn {
display: inline-block; font-family: 'Courier New', monospace;
font-size: 16px; background: #222; /* Dark background for buttons */
padding: 12px 20px; color: #33ff33; /* Bright green text */
border: none; border: 1px solid #33ff33; /* Border to match text color */
border-radius: 25px; /* Rounded Edges */ padding: 10px 20px;
background: linear-gradient(to right, #FF416C, #FF4B2B); /* Gradient Background */ text-transform: uppercase;
color: white; transition: background-color 0.3s ease, color 0.3s ease;
cursor: pointer;
transition: transform 0.3s, box-shadow 0.3s; /* Smooth Transition for Hover Effect */
text-align: center;
text-decoration: none; /* In case you use it on anchor tags */
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1); /* Slight Shadow */
margin: 10px 0; /* Some Margin for Space */
} }
.btn:hover { .btn:hover {
transform: translateY(-3px); /* Slight Lift on Hover */ background: #33ff33; /* Bright green background on hover */
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2); /* Increased Shadow on Hover */ color: #000; /* Dark text on hover */
cursor: pointer;
} }
/* Responsive button sizing for mobile for .btn class*/
@media (max-width: 768px) {
.btn {
padding: 8px 16px;
font-size: 14px; /* Adjust font size for mobile readability */
}
}
.btn:active { .btn:active {
transform: translateY(1px); /* Slight Pressed-In effect on Click */ transform: translateY(1px); /* Slight Pressed-In effect on Click */
} }
/* Container for tables to manage overflow */
.table-container {
overflow-x: auto;
margin: 0 auto; /* Center the table container if necessary */
}
/* Styles for the table */
table {
width: 100%;
max-width: 100%;
table-layout: auto; /* Let the table layout be automatic */
}
/* Ensure table cells do not cause overflow */
td, th {
word-wrap: break-word;
overflow-wrap: break-word;
}
/* Responsive table adjustments */
@media (max-width: 768px) {
table {
font-size: 14px; /* Adjust font size for smaller screens */
}
td, th {
padding: 8px; /* Adjust cell padding for smaller screens */
}
}

42
includes/topnav.css Normal file
View file

@ -0,0 +1,42 @@
/* Style the navigation menu */
.topnav {
overflow: hidden;
background-color: #0f0f0f;
position: relative;
}
/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks {
display: none;
}
/* Style navigation menu links */
.topnav a {
color: white;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
display: block;
}
/* Style the hamburger menu */
.topnav a.icon {
color: #e69109;
background: black;
display: block;
position: absolute;
right: 0;
top: 0;
}
/* Add a grey background color on mouse-over */
.topnav a:hover {
background-color: #494949;
color: #ffffff;
}
/* Style the active link (or home/logo) */
.active {
background-color: #0f0f0f;
color: #e69109;
}

View file

@ -24,25 +24,19 @@ $lastMatches = array_slice($allMatches, 0, 8);
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <?php include './includes/head.php'; ?>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan</title>
<link rel="stylesheet" href="./includes/styles.css">
</head>
<body> <body>
<?php include './includes/navigation.php'; ?> <?php include './includes/navigation.php'; ?>
<header> <header>
<h1>Welcome to DTCH - PUBG Clan </h1> <img src="./images/banner2.png" alt="banner" class="banner">
</header> </header>
<main> <main>
<section> <section>
<h2>Latest Matches</h2> <h2>Latest Matches</h2>
<table border="1"> <table>
<thead> <thead>
<tr> <tr>
<!-- <th>Match Date</th> --> <!-- <th>Match Date</th> -->
@ -52,7 +46,6 @@ $lastMatches = array_slice($allMatches, 0, 8);
<th>Map</th> <th>Map</th>
<th>Kills</th> <th>Kills</th>
<th>Damage</th> <th>Damage</th>
<th>Time Survived</th>
<th>Place</th> <th>Place</th>
</tr> </tr>
</thead> </thead>
@ -81,8 +74,7 @@ $lastMatches = array_slice($allMatches, 0, 8);
<td><?php echo $match['matchType']; ?></td> <td><?php echo $match['matchType']; ?></td>
<td><?php echo isset($mapNames[$match['mapName']]) ? $mapNames[$match['mapName']] : $match['mapName']; ?></td> <td><?php echo isset($mapNames[$match['mapName']]) ? $mapNames[$match['mapName']] : $match['mapName']; ?></td>
<td><?php echo $match['stats']['kills']; ?></td> <td><?php echo $match['stats']['kills']; ?></td>
<td><?php echo $match['stats']['damageDealt']; ?></td> <td><?php echo number_format($match['stats']['damageDealt'], 0, '.', ''); ?></td>
<td><?php echo gmdate("H:i:s", $match['stats']['timeSurvived']); ?></td>
<td><?php echo $match['stats']['winPlace']; ?></td> <td><?php echo $match['stats']['winPlace']; ?></td>
</tr> </tr>
<?php <?php

View file

@ -7,19 +7,14 @@ error_reporting(E_ALL);
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <?php include './includes/head.php'; ?>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan - Match Stats</title>
<link rel="stylesheet" href="./includes/styles.css">
<script src="./lib/sorttable.js"></script>
</head>
<body> <body>
<?php include './includes/navigation.php'; ?> <?php include './includes/navigation.php'; ?>
<header>
<img src="./images/banner2.png" alt="banner" class="banner">
</header>
<main> <main>
<section> <section>
<h2>Player Stats past 14 days</h2> <h2>Player Stats past 14 days</h2>
@ -34,19 +29,19 @@ error_reporting(E_ALL);
} }
echo "<br>"; echo "<br>";
echo "Stats for $key (minimal 10 matches)"; echo "Stats for $key (minimal 8 matches)";
echo "<table border='1' class='sortable'>"; echo "<table border='1' class='sortable'>";
echo "<tr> echo "<tr>
<th>Playername</th> <th>Player</th>
<th>Win Ratio</th> <th>Win %</th>
<th>K/D (Human)</th> <th>K/D Human</th>
<th>K/D (All)</th> <th>K/D All</th>
<th>Kills</th> <th>Kills</th>
<th>Human Kills</th> <th>Human Kills</th>
<th>Matches</th> <th>Mtchs</th>
<th>Wins</th> <th>Wins</th>
<th>Deaths</th> <th>Deaths</th>
<th>WinRatio change</th> <th>Win % change</th>
</tr>"; </tr>";
@ -54,13 +49,13 @@ error_reporting(E_ALL);
if (!isset($player_data['playername']) || is_null($player_data['playername'])) { if (!isset($player_data['playername']) || is_null($player_data['playername'])) {
continue; // Skip this iteration and move to the next continue; // Skip this iteration and move to the next
} }
if ($player_data['matches'] < 10){ if ($player_data['matches'] < 8){
continue; continue;
} }
$player_name = $player_data['playername']; $player_name = $player_data['playername'];
$deaths = number_format($player_data['deaths'], 2, ',', ''); $deaths = number_format($player_data['deaths'], 0, ',', '');
$kills = number_format($player_data['kills'], 2, ',', ''); $kills = number_format($player_data['kills'], 0, ',', '');
$humankills = number_format($player_data['humankills'], 2, ',', ''); $humankills = number_format($player_data['humankills'], 0, ',', '');
$matches = $player_data['matches']; $matches = $player_data['matches'];
$KD_H = $KD_H =
!isset($player_data['KD_H']) || $player_data['KD_H'] === null !isset($player_data['KD_H']) || $player_data['KD_H'] === null
@ -80,7 +75,7 @@ error_reporting(E_ALL);
: (is_numeric($player_data['KD_ALL']) : (is_numeric($player_data['KD_ALL'])
? number_format((float) $player_data['KD_ALL'], 2, ',', '') ? number_format((float) $player_data['KD_ALL'], 2, ',', '')
: "0")); // or any other default string for non-numerical values : "0")); // or any other default string for non-numerical values
$wins = number_format($player_data['wins'], 2, ',', ''); $wins = number_format($player_data['wins'], 0, ',', '');
$winratio = number_format($player_data['winratio'], 2, ',', ''); $winratio = number_format($player_data['winratio'], 2, ',', '');
$originalChange = str_replace(',', '.', $player_data['change']); // replace comma with period $originalChange = str_replace(',', '.', $player_data['change']); // replace comma with period
$change = floatval($originalChange); $change = floatval($originalChange);

View file

@ -6,18 +6,13 @@ error_reporting(E_ALL);
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <?php include './includes/head.php'; ?>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan - Match Stats</title>
<link rel="stylesheet" href="./includes/styles.css">
<script src="./lib/sorttable.js"></script>
</head>
<body> <body>
<?php include './includes/navigation.php'; ?> <?php include './includes/navigation.php'; ?>
<header>
<img src="./images/banner2.png" alt="banner" class="banner">
</header>
<main> <main>
<section> <section>
<h2>Match Stats</h2> <h2>Match Stats</h2>
@ -56,17 +51,17 @@ error_reporting(E_ALL);
if (isset($player_data['playername']) && $player_data['playername'] === $selected_player) { if (isset($player_data['playername']) && $player_data['playername'] === $selected_player) {
echo "<h2>Recent Matches for $selected_player</h2>"; echo "<h2>Recent Matches for $selected_player</h2>";
echo "<table border='1' class='sortable'>"; echo "<table border='1' class='sortable'>";
echo "<tr><th>Match Date</th><th>Game Mode</th><th>MatchType</th><th>Map</th><th>Kills</th><th>Damage Dealt</th><th>Time Survived</th><th>winPlace</th></tr>"; echo "<tr><th>Match Date</th><th>Game Mode</th><th>Match Type</th><th>Map</th><th>Kills</th><th>Damage Dealt</th><th>Time Survived</th><th>win Place</th></tr>";
foreach ($player_data['player_matches'] as $match) { foreach ($player_data['player_matches'] as $match) {
$date = new DateTime($match['createdAt']); $date = new DateTime($match['createdAt']);
$date->modify('+2 hours'); $date->modify('+2 hours');
$formattedDate = $date->format('Y-m-d H:i:s'); $formattedDate = $date->format('m-d H:i:s');
$matchType = $match['matchType']; $matchType = $match['matchType'];
$gameMode = $match['gameMode']; $gameMode = $match['gameMode'];
$mapName = isset($mapNames[$match['mapName']]) ? $mapNames[$match['mapName']] : $match['mapName']; $mapName = isset($mapNames[$match['mapName']]) ? $mapNames[$match['mapName']] : $match['mapName'];
$kills = $match['stats']['kills']; $kills = $match['stats']['kills'];
$damage = $match['stats']['damageDealt']; $damage = number_format($match['stats']['damageDealt'], 0, '.', '');
$timeSurvived = $match['stats']['timeSurvived']; $timeSurvived = $match['stats']['timeSurvived'];
$winPlace = $match['stats']['winPlace']; $winPlace = $match['stats']['winPlace'];
echo "<tr><td>$formattedDate</td><td>$gameMode</td><td>$matchType</td><td>$mapName</td><td>$kills</td><td>$damage</td><td>$timeSurvived</td><td>$winPlace</td></tr>"; echo "<tr><td>$formattedDate</td><td>$gameMode</td><td>$matchType</td><td>$mapName</td><td>$kills</td><td>$damage</td><td>$timeSurvived</td><td>$winPlace</td></tr>";

View file

@ -6,17 +6,13 @@ error_reporting(E_ALL);
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <?php include './includes/head.php'; ?>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan - User Stats</title>
<link rel="stylesheet" href="./includes/styles.css">
</head>
<body> <body>
<?php include './includes/navigation.php'; ?> <?php include './includes/navigation.php'; ?>
<header>
<img src="./images/banner2.png" alt="banner" class="banner">
</header>
<main> <main>
<section> <section>
<h2>User Stats</h2> <h2>User Stats</h2>

View file

@ -6,18 +6,13 @@ error_reporting(E_ALL);
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <?php include './includes/head.php'; ?>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan - Average User Stats</title>
<link rel="stylesheet" href="./includes/styles.css">
<script src="./lib/sorttable.js"></script>
</head>
<body> <body>
<?php include './includes/navigation.php'; ?> <?php include './includes/navigation.php'; ?>
<header>
<img src="./images/banner2.png" alt="banner" class="banner">
</header>
<main> <main>
<section> <section>
<h2>Average User Stats</h2> <h2>Average User Stats</h2>

View file

@ -6,17 +6,13 @@ error_reporting(E_ALL);
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <?php include './includes/head.php'; ?>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DTCH - PUBG Clan - User Stats</title>
<link rel="stylesheet" href="./includes/styles.css">
</head>
<body> <body>
<?php include './includes/navigation.php'; ?> <?php include './includes/navigation.php'; ?>
<header>
<img src="./images/banner2.png" alt="banner" class="banner">
</header>
<main> <main>
<section> <section>
<h2>User Stats</h2> <h2>User Stats</h2>