<?
// return registered_pub[$race]

include "./lib/mysql_connect.php";
include './lib/show_reg_public.php'; // should it return preformatted table?

?>

<!DOCTYPE html>
<html lang="cs">
<head>
<title>Kalské Borec //24</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://www.w3schools.com/lib/w3-theme-black.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css">
</head>
<style>
html,body,h1,h2,h3,h4,h5,h6 {font-family: "Roboto", sans-serif; margin:0px; padding:0px;}
.napdis{height: 80px;}
.icon-32{width: 32px; height:32px;}
.nadpis{margin-left:50px; margin-right:50px;}
#title{margin:0px; padding: 2% 20% 2% 20%;}
.fill{
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.fill img{
    flex-shrink: 0;
    min-width: 100%;
    min-height: 100%;
}
.track{
  min-height: 250px;
}
</style>
<body>
<?
if(isset($_GET['write_success'])){
?>
<div class="w3-row w3-black" id="ERROR BOX">
  <div class="w3-full w3-center <? if($_GET['write_success'] == 'false') echo "w3-red";else echo "w3-green"; ?>"> <? echo $_GET['reason']; ?> </div>
  <script>
    setTimeout(function () {
      window.location.replace("http://<? echo $_SERVER['HTTP_HOST']; ?>");
      }, 10000);
  </script>
</div>
<?
}
?>
<!-- First Grid: Logo & About -->
<div class="w3-row w3-black" id="title">
    <div class="w3-full w3-center w3-black">
    <div class="w3-green w3-round-xxlarge">
      <h1>Kalské Borec <span class="w3-green">//24</span></h1>
      <h2>23.3.2024 9:00</h2>
      <h3>Legendární MTB závod kolem obce Kaly, vrchem i spodem Bránou Vysočiny</h3>
    </div>
  </div>
</div>
<!-- Third Grid: Swing By & Contact -->
<div class="w3-row w3-black">
  <div class="w3-third w3-padding-large">
    <div class="w3-center w3-display-container fill w3-round-xxlarge">
      <img src="./img/registrace.jpg">
      <div class="w3-padding w3-display-middle">
        <!-- Trigger/Open the Modal -->
        <!--<button onclick="document.getElementById('id01').style.display='block'" class="w3-button w3-round-xlarge w3-border w3-border-black w3-xxlarge w3-green w3-padding-16 w3-hover-black">Přihlaš se</button>-->
        <div class="w3-round-xlarge w3-border w3-border-black w3-xxlarge w3-grey w3-padding-16"><div class="w3-padding-large w3-text-white">Přihlaš se</div></div>
      </div>
      <!--<div class="w3-padding w3-green w3-display-middle">
        Registrace od 1.3.2024
      </div>-->
    </div>
  </div>
  <div class="w3-twothird w3-padding-large">
    <div class="w3-padding-64 w3-padding-large w3-white w3-border-green w3-round-xxlarge">
      <div class="w3-center" style="padding-left:0px;"><h2><span class="w3-green">//</span> ZÁVOD</h2></div>
      <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large">
        <h3><span class="w3-green">//</span> COŽE?</h3>
        <p>Cyklistický závod s názvem <b>"Kalské Borec"</b> pro širokou veřejnost s několika okruhama.
        Je jedno, jestli jste rodinka s malýma dětma, nebo drsný jezdec enduro, který za poslední měsíc nevymyl chuť bahna s úst.
        Místo na poměření sil, nebo jen na pohodovou jízdu si najde každý. Můžete a nemusíte to brát vážně, důležité je si to užít.</p>
        <h3>Čeká na Vás:</h3>
        <ul>
          <li>4 okruhy po cca 10 kilometrech</li>
          <li>Různé kategorie závodu</li>
          <li>"Kalské Borec"</li>
          <li>Něco pod zub a k pití</li>
          <li>Ceny</li>
        </ul>
        <h3><span class="w3-green">//</span> KDY?</h3>
        <ul>
          <li><b>Registrace od 1.3. do 21.3.</b></li>
            <ul><li>Bez registrace to nepude a <b>400,-</b> budem taky potřebovat. Abychom vědeli kolik čeho nachystat</li></ul>
            <ul><li>Príklad registrace teamu: Junior + Táta v doporovodu na juniorkém okruhu = jedna registrace, 2 deti + Máma + Děda na Rodinný okruh = Druhá registrace</li></ul>
          <li><b>23.3.2024 je den D</b></li>
          <ul><li>Borci start v 9:00</li>
            <li>Bušiči v 10:00</li>
            <li>Junior + Rodiny 12:00. Je možné, že budem pár minut čekat na návrat dospělého z velkého závodu, ať může vyrazit s rodinou.</li>
          </ul>
        </ul>
        <h3><span class="w3-green">//</span> KDE?</h3>
        <p>Kaly 62, Na Špici -> <a href="https://mapy.cz/s/henosaseca">// MAPA</a></p>
      </div>
    </div>
  </div>
</div>
<div class="w3-row w3-black">
  <div class="w3-center" style="padding-left:0px;padding-top: 2em;"><h2><span class="w3-green">//</span> OKRUHY</h2></div>
    <div class="w3-padding-large">
      <div class="w3-padding-64 w3-padding-large w3-white w3-round-xxlarge w3-panel">
        <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large track">
        <h3><span class="w3-green">//</span> Kalské Borec</h3>
        <P>Dámy a pánové jenž aspirují na titul "Kalské Borec" to budou mít letos trošku jednodušší. Pojednou jen 3 okruhy. Freeride -> XC -> Junior</P>
        <table class="w3-table w3-striped w3-bordered w3-border w3-white"><tr><th>ID</th><th>Přezdívka / Team</th><th>Závod</th><th>Čas</th><th>Místo</th></tr>
        <?
            if($reg_racers_5 != null){
              $place = 1;
              $medal = '';
              foreach($reg_racers_5 as $racer){
                if($place == 1) $medal = '<img src="./img/1st.jpg" class="w3-image" width="10">';
                if($place == 2) $medal = '<img src="./img/2nd.jpg" class="w3-image" width="10">';
                if($place == 3) $medal = '<img src="./img/3rd.jpg" class="w3-image" width="10">';
                echo '<tr><td>'.$racer['ID'].'</td><td>'.$racer["NICK"].'</td><td>'.$racer["RACE"].'</td><td>'.$racer["TIME"].'</td><td>'.$place.'. '.$medal.'</td></tr>';
                $place++;
                $medal = '';
              }
            }
          ?>
         </table>
        </div>
      </div>
    </div>
    <div class="w3-col l3 m6 s12 w3-padding-large">
      <div class="w3-padding-64 w3-padding-large w3-white w3-round-xxlarge w3-panel">
        <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large track">
        <h3><span class="w3-green">//</span> RODINNÝ</h3>
        <p>Pro nejmenší sportovce s doprovodem. Snad nejlehčí okruh. Opět však vyžaduje alespoň základy jízdy v terénu. Bude sice kousek delší než
        minulý rok, ale o to Vás to požene mín do kopce. nenechte se však ukolébat touto informací, pořád bude vyžadovat oběti.</p>
        <p>Provede Vás Zahradou, nakonec dva krát. Nejdřív ale obtočíte kopec s názvem Dranč kolem dokola, podíváte se na rozhlednu Křivoš zespodu
        a objevíte údolí Kalského potoka, pokuď ho ještě neznáte.</p>
        <p></p><a href="https://en.mapy.cz/s/mukotozoco" target="_new"><img src="./img/gpx_rodina.jpg" alt="rodina_trasa_gpx" class="w3-image"><br>
        TRASA // MAPA</a></p>
        <h3>Registrovaní</h3>
        <table class="w3-table w3-striped w3-bordered w3-border w3-white"><tr><th>ID</th><th>Přezdívka / Team</th><th>Závod</th><th>Čas</th><th>Místo</th></tr>
        <?
            if($reg_racers_4 != null){
              $place = 1;
              $medal = '';
              foreach($reg_racers_4 as $racer){
                if($place == 1) $medal = '<img src="./img/1st.jpg" class="w3-image" width="10">';
                if($place == 2) $medal = '<img src="./img/2nd.jpg" class="w3-image" width="10">';
                if($place == 3) $medal = '<img src="./img/3rd.jpg" class="w3-image" width="10">';
                echo '<tr><td>'.$racer['ID'].'</td><td>'.$racer["NICK"].'</td><td>'.$racer["RACE"].'</td><td>'.$racer["TIME"].'</td><td>'.$place.'. '.$medal.'</td></tr>';
                $place++;
                $medal = '';
              }
            }
        ?>
        </table>
        </div>
      </div>
    </div>

    <div class="w3-col l3 m6 s12 w3-padding-large">
      <div class="w3-padding-64 w3-padding-large w3-white w3-round-xxlarge w3-panel">
        <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large track">
        <h3><span class="w3-green">//</span> JUNIOR</h3>
        <p> Relativně jednoduché kolečko do hodiny. Max 53min a 14s. Reálně si mlaďoši, tedy junioři vyzkouší, jaké to je drtit z kopce klacky a kamení,
        ale taky jaké to měli jednoduché XCckaři před rokem. Trasa Vás provede málo známým údolím nad Borač.</p>
        <p>Po zábavě ale přijde pořádný švih
        a nastoupáte zpátaky do Huslí a přes Jilmoví hurá na Kaly. Tady Vaše utrpení končí a nastává zasloužený odpočinek.</p>
        <p><a href="https://mapy.cz/s/rajuzabona" target="_new"><img src="./img/gpx_junior.jpg" alt="junior_trasa_gpx" class="w3-image"><br>
        TRASA // MAPA</a></p>
        <h3>Registrovaní</h3>
        <table class="w3-table w3-striped w3-bordered w3-border w3-white"><tr><th>ID</th><th>Přezdívka / Team</th><th>Závod</th><th>Čas</th><th>Místo</th></tr>
        <?
            if($reg_racers_3 != null){
              $place = 1;
              $medal = '';
              foreach($reg_racers_3 as $racer){
                if($place == 1) $medal = '<img src="./img/1st.jpg" class="w3-image" width="10">';
                if($place == 2) $medal = '<img src="./img/2nd.jpg" class="w3-image" width="10">';
                if($place == 3) $medal = '<img src="./img/3rd.jpg" class="w3-image" width="10">';
                echo '<tr><td>'.$racer['ID'].'</td><td>'.$racer["NICK"].'</td><td>'.$racer["RACE"].'</td><td>'.$racer["TIME"].'</td><td>'.$place.'. '.$medal.'</td></tr>';
                $place++;
                $medal = '';
              }
            }
          ?>
         </table>
        </div>
      </div>
    </div>
    <div class="w3-col l3 m6 s12 w3-padding-large">
      <div class="w3-padding-64 w3-padding-large w3-white w3-round-xxlarge w3-panel">
        <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large track">
          <h3><span class="w3-green">//</span> CROSS-COUNTRY (XC)</h3>
          <p>Cross country, ve zkratce jak se dostat z A do B za co nejkratší dobu. Strmé stoupání i sjezdy, člověk si mákne, ale nic extra technického zde nehledejte.
          Maximálně strmý sjezd a pak nějaký ten křák.</p>
          <p>Tenhle okruh nebudel lehký, ale přesně to jste čekali. Nejdřív přes krásný sjezdík s vyhazovákem do Dolních Louček, odkuď po krásném chodníčku,
          proti řece Bobrůvce pokoříte Arku. Konec pokořovnání to však nebude. Musíte se dostat zpátky k oboře, která Váas dostane zpátky na Kaly.</p>
          <p><a href="https://mapy.cz/s/jomafocaza" target="_new"><img src="./img/gpx_xc.jpg" alt="xc_trasa_gpx" class="w3-image"><br>
          TRASA // MAPA</a></p>
          <h3>Registrovaní</h3>
          <table class="w3-table w3-striped w3-bordered w3-border w3-white"><tr><th>ID</th><th>Přezdívka / Team</th><th>Závod</th><th>Čas</th><th>Místo</th></tr>
          <?
            if($reg_racers_2 != null){
              $place = 1;
              $medal = '';
              foreach($reg_racers_2 as $racer){
                if($place == 1) $medal = '<img src="./img/1st.jpg" class="w3-image" width="10">';
                if($place == 2) $medal = '<img src="./img/2nd.jpg" class="w3-image" width="10">';
                if($place == 3) $medal = '<img src="./img/3rd.jpg" class="w3-image" width="10">';
                echo '<tr><td>'.$racer['ID'].'</td><td>'.$racer["NICK"].'</td><td>'.$racer["RACE"].'</td><td>'.$racer["TIME"].'</td><td>'.$place.'. '.$medal.'</td></tr>';
                $place++;
                $medal = '';
              }
            }
          ?>
          </table>
        </div>
      </div>
    </div>
    <div class="w3-col l3 m6 s12 w3-padding-large">
      <div class="w3-padding-64 w3-padding-large w3-white w3-round-xxlarge w3-panel">
        <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large track">
        <h3><span class="w3-green">//</span> FREERIDE</h3>
        <p>Asi nejnáročnejší okruh. Jak na techniku, tak na výdrž a převýšení. Myslím, že v některých sekcích svému jménu dostane. </p>
        <p>Nejhezčí jízda ze všech začne nefalšovaným freeridem mezi stromy a spostou hrabanky, zakončeným zhupem přes potomk. Pak trochu přitvrdíme
        a okruh se stne teprv zábavným. 2 krásné ridgerides v terénu s občasným skokem přes kládu, kámen, či unikátní zhup "Bába pod kořenem". Bude to krásné
        a Vy to víte.</p>
        <p><a href="https://mapy.cz/s/lefagekono" target="_new"><img src="./img/gpx_freeride.jpg" alt="freeride_trasa_gpx" class="w3-image"><br>
        TRASA // MAPA</a></p>
        <h3>Registrovaní</h3>
          <table class="w3-table w3-striped w3-bordered w3-border w3-white"><tr><th>ID</th><th>Přezdívka / Team</th><th>Závod</th><th>Čas</th><th>Místo</th></tr>
          <?
            if($reg_racers_1 != null){
              $place = 1;
              $medal = '';
              foreach($reg_racers_1 as $racer){
                if($place == 1) $medal = '<img src="./img/1st.jpg" class="w3-image" width="10">';
                if($place == 2) $medal = '<img src="./img/2nd.jpg" class="w3-image" width="10">';
                if($place == 3) $medal = '<img src="./img/3rd.jpg" class="w3-image" width="10">';
                echo '<tr><td>'.$racer['ID'].'</td><td>'.$racer["NICK"].'</td><td>'.$racer["RACE"].'</td><td>'.$racer["TIME"].'</td><td>'.$place.'. '.$medal.'</td></tr>';
                $place++;
                $medal = '';
              }
            }
          ?>
          </table>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="w3-row w3-black">
  <div class="w3-twothird w3-padding-large">
    <div class="w3-padding-64 w3-padding-large w3-white w3-round-xxlarge">
      <div class="w3-center" style="padding-left:0px;"><h2><span class="w3-green">//</span> TITULY a KATEGORIE závodu</h2></div>
      <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large">
        <p>Podle okruhu, který jste si zvolili, tak se vám dostane patřičného titulu, či spadnete do jedné z kategorií.</p>
        <h3><span class="w3-green">//</span> RODINA</h3>
        <p>
        Je libovolné seskupení savců, přičemž alespoň jeden bude mít za sebou méně než 10 let.
        V této kategorii se počítá celý team, ať už ho táhne, nebo brzdí ten nejmladší. Rodina má jasně daný okruh, //RODINNÝ
        </p>
        <h3><span class="w3-green">//</span> JUNIOR</h3>
        <p>
        S rodinou se mu už táhnout nechce, svoji vlastní zatím nemá. A to je vlastne dobře,
        protože 12 let mu už bylo a do 18 to ještě taky potrvá. Junioři si fláknou okruh //JUNIOR
        Trasa může být zrádná a proto zvažte doprovod dospělého savce na kole.
        </p>
        <h3><span class="w3-green">//</span> BUŠIČ</h3>
        <p>
        Kdo nebuší nejede. Ať z kopce, nebo do kopce, vždy naplno. Odhodlání, ani chuť mu nechybí.
        Alespoň jeden okruh s věkem nad 18 by měl mít v kapse. // BUŠIČ si vybere, jestli se chce zničit na // FREERIDE okruhu,
        nebo na // CROSS-COUNTRY. Na vybraném okruhu pak s ostatníma // BUŠIČama soutěží o nejlepší čas.
        </p>
        <h3><span class="w3-green">//</span> KALSKÉ BOREC</h3>
        <p>
        Je smetánkou Kalské cyklistiky. Lamač srdcí všech pohlaví s vyrýsovanou postavou,
        ktéremu žádný kopec není příliš strmý a sjezd dost náročný.
        Ti, co se pyšní tímhle titulem se poperou se všema okruhama v časovém limitu 6 hodin v následujícím pořadí:
        // FREERIDE -> // CROSS-COUNTRY -> // JUNIOR. I proto startují v 9:00 a hlásí se na okruh "Kalské Borec".
        </p>
      </div>
    </div>
  </div>
  <div class="w3-third w3-padding-large">
    <div class="w3-center w3-display-container fill w3-round-xxlarge">
      <img src="./img/borci.jpg">
    </div>
  </div>
</div>

<div class="w3-row w3-black">
  <div class="w3-third w3-padding-large">
    <div class="w3-center w3-display-container fill w3-round-xxlarge">
      <img src="./img/vyhlaseni.jpg">
    </div>
  </div>
  <div class="w3-twothird w3-padding-large">
    <div class="w3-padding-64 w3-padding-large w3-white w3-round-xxlarge">
      <div class="w3-center" style="padding-left:0px;"><h2><span class="w3-green">//</span> KONTAKT</h2></div>
      <div class="w3-display-container w3-leftbar w3-border-green w3-padding-large">
        Pokuď potřebujete poradit, nebo se zeptat, napište mi. Všichni mi říkají Ventil.
        <h2><span class="w3-green">//</span> TELEFON na Ventila</h2>
        <p>+420 775 003 122</p>
        <h2><span class="w3-green">//</span> EMAIL</h2>
        <p>ventil@spoton.cz</p>
        <h2><span class="w3-green">//</span> Účast bude elektronicky od 1.3.2024 do 21.3.2024.</h2>
        <p>Přispěvek k registraci 400,-</p>
        <p>Příspěvek je použit na občerstvení, ceny, </p>
        <h2><span class="w3-green">//</span> Občerstvení:</h2>
        <p>
          <ul>
            <li>Nealko Pivo Vorkloster Cero</li>
            <li>Vorkloster 10°</li>
            <li>Ionťáky, Magnézka, Limo</li>
            <li>Guláš</li>
            <li>Párek / Klobása</li>
          </ul>
        </p>
        <h2><span class="w3-green">//</span> Ceny:</h2>
        <p>
        Servis od Ventila, Gripy, lahve, blikačky...
        </p>
      </div>
    </div>
  </div>
</div>

<!-- Registration form, hideen -->
<div id="id01" class="w3-modal">
  <div class="w3-modal-content w3-round-large">
    <div class="w3-container w3-green" style="border-top-left-radius: 8px; border-top-right-radius: 8px;">
      <h2>// Registrace k závodu</h2>
    </div>
    <div class="w3-container">
      <span onclick="document.getElementById('id01').style.display='none'"
      class="w3-button w3-display-topright">&times;</span>
      <form action="./register.php" method="post">
        <div class="w3-row">
          <div class="w3-full">
            <label for="fname" class="w3-text-green">Jméno:</label><br>
            <input type="text" id="fname" name="fname" class="w3-input w3-border-green w3-round-large w3-pale-green">
            <label for="lname" class="w3-text-green">Prříjmení:</label><br>
            <input type="text" id="lname" name="lname" class="w3-input w3-border-green w3-round-large w3-pale-green">
          </div>
        </div>
        <div class="w3-row">
          <div class="w3-full">
            <label for="email" class="w3-text-green">Email:</label><br>
            <input type="text" id="email" name="email" class="w3-input w3-border-green w3-round-large w3-pale-green">
            <label for="phone" class="w3-text-green">Telefon:</label><br>
            <input type="text" id="phone" name="phone" class="w3-input w3-border-green w3-round-large w3-pale-green">
          </div>
        </div>
        <div class="w3-row">
          <div class="w3-full">
            <label for="nick" class="w3-text-green">Přezdívka / Team:</label><br>
            <input type="text" id="nick" name="nick" class="w3-input w3-border-green w3-round-large w3-pale-green">
            <label for="race" class="w3-text-green">Okruh:</label><br>
            <select id="race" name="race">
              <?
              include "./lib/get_races.php";
              //var_dump($races);
              foreach($races as $race){
                echo "<option value=\"".$race['ID']."\">".$race['NAME']."</option>";
              }
              ?>
            </select>
          </div>
        </div>
        </th>
        </th>
        </p>
        <p><input disabled type="submit" class="w3-button w3-green w3-round-large" id="send" name="Send" value="Zkusme to"></p>
      </form>
    </div>
  </div>
</div>


<!-- Footer -->
<footer class="w3-container w3-black w3-padding-16">
  <p>Umožněno <a href="https://www.w3schools.com/w3css/default.asp" target="_blank">w3.css</a> a snad zdárně sepsal a nadesignoval Ventil</p>
</footer>

</body>
</html>
