<?php

require __DIR__ . '/vendor/autoload.php';

use Dotenv\Dotenv as env;
use GuzzleHttp\Client as httpClient;
use GuzzleHttp\Psr7;

$dotenv = env::create(__DIR__);
$dotenv->load();

require __DIR__ . '/lib/cache.php';
cache_load();

$git_pw = $_ENV['GIT_KEY'];
$git_client = new httpClient([
	'base_uri' => $_ENV['GIT_URL'],
	'headers' => [
		'Authorization' => "Basic {$git_pw}",
		'User-Agent' => 'l2-plates website query by JoshPiper'
	]
]);

$size = cache_fetch("git_size");
if (!$size){
	$response = $git_client->get("repos/limelight-development/l2-plates");
	$body = $response->getBody();
	$content = $body->getContents();
	$data = json_decode($content);
	$size = $data->size * 1000;

	cache_store("git_size", $size, 600);
}

$changes = cache_fetch("git_changes");
if (!$changes){
	$response = $git_client->get("repos/limelight-development/l2-plates/commits", [
		'query' => [
			'per_page' => 1
		]
	]);

	$request = new Psr7\Request('GET', '/', [
    		'Link' => $response->getHeader('Link')
	]);
	
	$parsed = Psr7\parse_header($request->getHeader('Link'));
	$changes = 0;
	foreach ($parsed as $link){
		if ($link['rel'] == 'last' && preg_match('/&page=(\d+)/', $link[0], $matches)){
			$changes = intval($matches[1]);
		}
	}
}
cache_store("git_changes", $changes, 600);

$api_client = new httpClient([
	'base_uri' => $_ENV['API_URL'],
	'headers' => ['Authorization' => "Bearer {$_ENV['API_KEY']}"]
]);

$plates = cache_fetch("api_vehicles");
if (!$plates){
	$response = $api_client->get("plates/total");
	$body = $response->getBody();
	$content = $body->getContents();
	$data = json_decode($content);
	$plates = $data->count;

	cache_store("api_vehicles", $plates, 1200);
}
$plates = max($plates, 554);

function startsWith($haystack, $needle) {
    return substr_compare($haystack, $needle, 0, strlen($needle)) === 0;
}

$contribs = cache_fetch("api_contrib");
if (!$contribs){
	$response = $api_client->get("contributors");
	$body = $response->getBody();
	$content = $body->getContents();
	$data = json_decode($content, true);
	$contribs = $data;
	
	foreach ($contribs as $id => $contrib){
		if ($contrib['store']){
			if (!startsWith($contrib['store'], "https://")){
				$contrib['store'] = "https://www.gmodstore.com/users/{$contrib['store']}";
			}
		}
		$contribs[$id] = $contrib;
	}

	cache_store("api_contrib", $contribs, 1200);
}
$contrib_count = count($contribs);

cache_save();

function formatBytes($size, $precision = 2){
	$base = log($size, 1024);
	$suffixes = ['B', 'KB', 'MB', 'GB', 'TB'];
	return round(pow(1024, $base - floor($base)), $precision) . ' ' . $suffixes[intval(floor($base))];
}

$changes += 132; // Legacy changes from SVN.
$size = formatBytes($size, 0);

?>
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; 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">
		<title>L² Plates</title>

		<!-- Google Fonts / Bootstrap / FA -->
		<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700%7CVarela+Round" rel="stylesheet">
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
			  integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
			  crossorigin="anonymous">
		<script src="https://kit.fontawesome.com/4d5310fe43.js"></script>
		<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
				integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
				crossorigin="anonymous"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
				integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
				crossorigin="anonymous"></script>
		<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
				integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
				crossorigin="anonymous"></script>

		<link type="text/css" rel="stylesheet" href="css/home.css">
	</head>
	<body>
		<header id="home">
			<div class="bg-img" style="background-image: url('img/background1.webp')">
				<div class="overlay"></div>
			</div>
			<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
				<span class="navbar-brand">L² Plates</span>
				<button class="navbar-toggler" type="button" data-toggle="collapse"
						data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
						aria-expanded="false" aria-label="Toggle navigation">
					<span class="navbar-toggler-icon"></span>
				</button>
				<div class="collapse navbar-collapse" id="navbarSupportedContent">
					<ul class="navbar-nav ml-auto">
						<li class="nav-item dropdown active">
							<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
							   data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Home <span
										class="sr-only">(current)</span></a>
							<div class="dropdown-menu" aria-labelledby="navbarDropdown">
								<a class="dropdown-item" href="#info"
								   onclick="event.preventDefault(); $(event.srcElement.hash)[0].scrollIntoView({behavior: 'smooth', block: 'start'})">Info</a>
								<a class="dropdown-item" href="#media"
								   onclick="event.preventDefault(); $(event.srcElement.hash)[0].scrollIntoView({behavior: 'smooth', block: 'start'})">Media</a>
								<a class="dropdown-item" href="#team"
								   onclick="event.preventDefault(); $(event.srcElement.hash)[0].scrollIntoView({behavior: 'smooth', block: 'start'})">Team</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>

			<div class="home-wrapper">
				<div class="container">
					<div class="row">
						<div class="col-md-12">
							<div class="home-content">
								<h1 class="white-text">L² Plates</h1>
								<h2 class="white-text">The Perfect Plate System</h2>
								<a class="btn btn-light" href="https://www.gmodstore.com/market/view/4943">Buy Now!</a>
								<a class="btn btn-info" href="#info"
								   onclick="event.preventDefault(); $('#info')[0].scrollIntoView({behavior: 'smooth', block: 'start'});">Learn
									More</a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</header>

		<div id="info" class="section md-padding">
			<div class="container">
				<div class="section-header text-center">
					<h2 class="title">Why L² Plates?</h2>
				</div>
				<div class="row">
					<div class="col-md-4">
						<div class="about">
							<i class="fas fa-cogs"></i>
							<h3>Fully Documented</h3>
							<p>Great developers build great things. Support your team with a fully documented addon.</p>
						</div>
					</div>
					<div class="col-md-4">
						<div class="about">
							<i class="fas fa-magic"></i>
							<h3>Easy to Setup</h3>
							<p>Adding L² Plates is as easy as drag and drop, then you're ready!</p>
						</div>
					</div>
					<div class="col-md-4">
						<div class="about">
							<i class="fas fa-taxi"></i>
							<h3>Wide Range of Vehicles</h3>
							<p>With over 550 supported vehicles, and more being added constantly, you'll be sure to find
								the vehicles that are right for your server.</p>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div id="media" class="section md-padding bg-grey">
			<div class="container">
				<div class="section-header text-center">
					<h2 class="title">Media</h2>
				</div>
				<div class="row">
					<div class="col-md-4 col-xs-6 work">
						<img class="img-responsive" src="img/kamaz.webp" alt="A Kamaz with its license plate.">
						<div class="overlay"></div>
						<div class="work-content">
							<h3>A Kamaz with plates.</h3>
							<div class="work-link">
								<a class="lightbox" href="img/kamaz.webp"><i class="fa fa-search"></i></a>
							</div>
						</div>
					</div>
					<div class="col-md-4 col-xs-6 work">
						<img class="img-responsive" src="img/car.webp" alt="Some car with license plates.">
						<div class="overlay"></div>
						<div class="work-content">
							<h3>Some car, also with plates.</h3>
							<div class="work-link">
								<a class="lightbox" href="img/car.webp"><i class="fa fa-search"></i></a>
							</div>
						</div>
					</div>
					<div class="col-md-4 col-xs-6 work">
						<img class="img-responsive" src="img/pickup.webp" alt="A pickup truck with its license plate.">
						<div class="overlay"></div>
						<div class="work-content">
							<h3>Some sorta pickup truck?</h3>
							<div class="work-link">
								<a class="lightbox" href="img/pickup.webp"><i class="fa fa-search"></i></a>
							</div>
						</div>
					</div>
					<div class="col-md-4 col-xs-6 work">
						<img class="img-responsive" src="img/cop.webp" alt="A Police Car with its license plate.">
						<div class="overlay"></div>
						<div class="work-content">
							<h3>The Police.</h3>
							<div class="work-link">
								<a class="lightbox" href="img/cop.webp"><i class="fa fa-search"></i></a>
							</div>
						</div>
					</div>
					<div class="col-md-4 col-xs-6 work">
						<img class="img-responsive" src="img/uaz.webp" alt="A UAZ with its license plate.">
						<div class="overlay"></div>
						<div class="work-content">
							<h3>Oh that's a UAZ!</h3>
							<div class="work-link">
								<a class="lightbox" href="img/uaz.webp"><i class="fa fa-search"></i></a>
							</div>
						</div>
					</div>
					<div class="col-md-4 col-xs-6 work">
						<img class="img-responsive" src="img/charger.webp"
							 alt="Police Dodge Charger with its license plate.">
						<div class="overlay"></div>
						<div class="work-content">
							<h3>A nicely parked Charger.</h3>
							<div class="work-link">
								<a class="lightbox" href="img/charger.webp"><i class="fa fa-search"></i></a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div id="numbers" class="section sm-padding">
			<div class="bg-img" style="background-image: url('img/background2.webp');">
				<div class="overlay"></div>
			</div>
			<div class="container">
				<div class="row">
					<div class="col-sm-3 col-xs-6">
						<div class="number">
							<i class="fas fa-users"></i>
							<h3 class="white-text"><span class="counter"><?= $contrib_count ?></span></h3>
							<span class="white-text">Contributors</span>
						</div>
					</div>
					<div class="col-sm-3 col-xs-6">
						<div class="number">
							<i class="fas fa-hdd"></i>
							<h3 class="white-text"><span class="counter"><?= $size ?></span></h3>
							<span class="white-text">Repository Size</span>
						</div>
					</div>
					<div class="col-sm-3 col-xs-6">
						<div class="number">
							<i class="fas fa-database"></i>
							<h3 class="white-text"><span class="counter"><?= $changes ?></span></h3>
							<span class="white-text">Commits</span>
						</div>
					</div>
					<div class="col-sm-3 col-xs-6">
						<div class="number">
							<i class="fas fa-car"></i>
							<h3 class="white-text"><span class="counter"><?= $plates ?></span></h3>
							<span class="white-text">Supported Vehicles</span>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div id="team" class="section md-padding">
			<div class="container">
				<div class="section-header text-center">
					<h2 class="title">Our Contributors</h2>
				</div>

				<div class="row">
					<?php foreach ($contribs as $contrib){
						$contrib_name = htmlspecialchars($contrib['username']);
						?>
						<div class="col-sm-4">
							<div class="team">
								<div class="team-img">
									<img class="img-responsive" src="img/team/<?= $contrib['slug']; ?>.webp"
										 alt="<?= $contrib_name ?>">
									<div class="overlay">
										<div class="team-social">
											<?php if ($contrib['steam']){ ?><a
												href="https://steamcommunity.com/profiles/<?= $contrib['steam'] ?>"><i
															class="fab fa-steam"></i></a><?php } ?>
											<?php if ($contrib['store']){ ?><a
												href="<?= $contrib['store'] ?>"><i
															class="fas fa-store-alt"></i></a><?php } ?>
											<?php if ($contrib['forum']){ ?><a href="<?= $contrib['forum'] ?>"><i
														class="fas fa-comment-alt"></i></a><?php } ?>
										</div>
									</div>
								</div>
								<div class="team-content">
									<h3><?= $contrib_name ?></h3>
									<span><?= $contrib['title'] ?></span>
								</div>
							</div>
						</div>
					<?php } ?>
				</div>
			</div>
		</div>

		<footer id="footer" class="sm-padding bg-dark">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<!-- <div class="footer-logo"></div> -->
						<ul class="footer-follow">
							<li><a href="https://www.gmodstore.com/market/view/4943"><i
											class="fas fa-store-alt"></i></a></li>
							<li><a href="https://steamcommunity.com/sharedfiles/filedetails/?id=1271737830"><i
											class="fab fa-steam"></i></a></li>
						</ul>
						<div class="footer-copyright">
							<p>L² Plates - The Perfect Plate System</p>
						</div>
					</div>
				</div>
			</div>
		</footer>

		<div id="back-to-top" style="display: none;"></div>
	</body>
</html>
