<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Potain de chantier #5</title>
<link rel="stylesheet" href="assets/style.css">
<link rel="apple-touch-icon" sizes="180x180" href="assets/icons/apple-touch-icon.png?v=potain">
<link rel="icon" type="image/png" sizes="32x32" href="assets/icons/favicon-32x32.png?v=potain">
<link rel="icon" type="image/png" sizes="16x16" href="assets/icons/favicon-16x16.png?v=potain">
<link rel="manifest" href="assets/icons/site.webmanifest?v=potain">
<link rel="mask-icon" href="assets/icons/safari-pinned-tab.svg?v=potain" color="#5bbad5">
<link rel="shortcut icon" href="assets/icons/favicon.ico?v=potain">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="assets/icons/browserconfig.xml?v=potain">
<meta name="theme-color" content="#ffffff">
<meta property="og:image" content="https://static.augendre.info/potain3/images/fond.png">
</head>
<body>
<header>
<h1>Potain de chantier #5</h1>
</header>
<main>
<h2>Jeu interactif</h2>
<p>
Tu as <strong>une minute</strong> pour aider Pimpin le technicien à reboucher un maximum de fuites de fluide frigorigène ! <br>
Score : <span id="score">0</span> kg CO<sub>2</sub>e non rejetés dans l'atmosphère (<span id="zonesCount">0</span>/<span id="zonesTotal">0</span> fuites).<br>
Temps écoulé : <span id="timer">0</span>s.
<button onclick="start()">Commencer</button>
</p>
<div class="img-holder">
<img src="images/fond.png" width="731" height="322" alt="Plan Cecolyon">
<!-- left -->
<div id="bureau-01" class="zone inactive" style="width: 68px; height: 85px; top: 18px; left: 53px;"></div>
<div id="bureau-02" class="zone inactive" style="width: 65px; height: 85px; top: 18px; left: 243px;"></div>
<div id="bureau-03" class="zone inactive" style="width: 85px; height: 60px; top: 105px; left: 53px;"></div>
<div id="bureau-04" class="zone inactive" style="width: 60px; height: 90px; top: 185px; left: 245px;"></div>
<div id="bureau-05" class="zone inactive" style="width: 63px; height: 90px; top: 185px; left: 180px;"></div>
<!-- right -->
<div id="bureau-11" class="zone inactive" style="width: 68px; height: 85px; top: 18px; left: 458px;"></div>
<div id="bureau-12" class="zone inactive" style="width: 65px; height: 85px; top: 18px; left: 648px;"></div>
<div id="bureau-13" class="zone inactive" style="width: 85px; height: 60px; top: 105px; left: 630px;"></div>
<div id="bureau-14" class="zone inactive" style="width: 40px; height: 90px; top: 185px; left: 589px;"></div>
<div id="bureau-15" class="zone inactive" style="width: 63px; height: 90px; top: 185px; left: 524px;"></div>
<span class="success stamp hidden">BRAVO 🎉</span>
</div>
<p>N'hésite pas à partager ton score sur Teams 😉</p>
</main>
<footer>
<p>
Made with ♥ by <a href="https://gabnotes.org/about-me/">Gabriel Augendre</a>.
Ce programme est un <a href="https://fr.wikipedia.org/wiki/Logiciel_libre">logiciel libre</a>.
<a href="https://git.augendre.info/gaugendre/potain">Code source</a>.
</p>
</footer>
<script src="assets/jeu.js"></script>
<script data-goatcounter="https://static.gc.augendre.info/count"
async src="https://static.gc.augendre.info/count.js"></script>
</body>
</html>