<?php
    include("db.php");
    $emails = "";
    $scores = "";
    $reponse = $bdd->query('SELECT `id`,`email`, `score` FROM `player` ');
    while($don=$reponse->fetch()){
        $emails .= "".$don['email']."|";
        $scores .= "".$don['score']."|";
    }
?>
<html>
    <head>
        <title>Color-Fever Racing | Play now</title>
        <link rel="stylesheet" href="index.css">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="short icon" href="media/cars/without_shadow/1.png">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <script src="lib/jquery.js"></script>
        <link rel="stylesheet" href="lib/bootstrap.min.css">
    </head>
    <body>

        <div id="full-area" >
            <div id="game-area" >
                <div id="start-page"   >
                    <div class="COLOR_FEVER__RACING_"><i>WYŚCIGI PEŁNE  <br> KOLORÓW</i></div>
                    <div id="hide-start-btn"></div>
                    <div id="start-page-btn" onclick="if(loaded){clearInterval(RemTimeInt);clearInterval(startBtnInt);click_audio();$('#start-page').hide();$('#choose-car-page').fadeIn();}"></div>
                    <div class="lds-ring"><div></div><div></div><div></div><div></div></div>
                    <div id="start-page-reamining-time" style="display:none">
                    
                    </div>
                    <div class="Submit_your_score_by_June_17th___2022_to_win_MS" style="display:none">
                        <i>PRZEŚLIJ SWOJE WYNIKI DO 17 CZERWCA 2022 R., ABY WYGRAĆ MONITOR MSI QD!</i>
                    </div>
                </div>
                <div id="choose-car-page" >
                    <div id="choose-car-next-btn" onclick="click_audio();$('#choose-car-page').hide();$('#how-to-play-page').fadeIn();;howToPlay_pages.next();"></div>
                    <div id="choose-car-arrow-right" onclick="click_audio();carSelection.changeCarByModel('next')"></div>
                    <div id="choose-car-arrow-left" onclick="click_audio();carSelection.changeCarByModel('previous')"></div>
                    <div class="Choose_The_Color_Of_Your_Car">
                    WYBIERZ KOLOR SAMOCHODU
                    </div>
                    <div class="Select_color">Select color</div>
                    <div class="menu-car-selection">
                        <img class="1" src="media/cars/without_shadow/1.png" draggable="false">
                        <img class="2 selected-car"  src="media/cars/without_shadow/2.png" draggable="false">
                        <img class="3" src="media/cars/without_shadow/3.png" draggable="false">
                    </div>
                    <div class="menu-car-color-selection">
                        <div class="1" style="background:linear-gradient(150deg,#ffa415 30%,#e22310 80%);" onclick="click_audio();carSelection.changeCarByColor($(this))"></div>
                        <div class="2" style="background:linear-gradient(150deg,#da29fd 30%,#5faeff 80%);box-shadow:0 0  25px #77d7ffdb,0 0  25px #77d6ffdb;" onclick="click_audio();carSelection.changeCarByColor($(this))"></div>
                        <div class="3" style="background:linear-gradient(150deg,#d926f7 30%,#84de39 80%);" onclick="click_audio();carSelection.changeCarByColor($(this))"></div>
                        <div class="4" style="background:linear-gradient(150deg,#fffa2a 30%,#32ccac 80%);" onclick="click_audio();carSelection.changeCarByColor($(this))"></div>
                    </div>
                </div>
                <div id="how-to-play-page">
                    <div id="how-to-play-btn" onclick="click_audio();howToPlay_pages.next()"></div>
                </div>
                <div id="play-page" >
                    <div id="mobile-controllers">
                        <div id="tap-left" ontouchstart="car.moveLeft()" ontouchend="car.stopMoveLeft()"></div>
                        <div id="tap-right" ontouchstart="car.moveRight()" ontouchend="car.stopMoveRight()"></div>
                    </div>
                    <div id="time-UI"><p><span id="min">00</span>:<span id="sec">00</span> </p></div>
                    <div id="coin-UI"><p><span>0</span></p></div>
                    <div id="car-elem">
                        <img src="media/cars/with_shadow/1.png" id="car" draggable="false">
                    </div>
                    <div id="obstacles">
                        <img src="media/countdown3.png" draggable="false" class="countdown">
                        <div class="end-line">
                            <p>FINISH</p>
                            <img src="media/obstacles/end-line.png"  draggable="false">
                        </div>
                        <!--
                        <img src="media/obstacles/crack1.png" draggable="false" class="crack1">
                        <img src="media/obstacles/crack2.png" draggable="false" class="crack2">
                        <img src="media/obstacles/barr.png" draggable="false" class="barr">
                        <img src="media/obstacles/hdr.png" draggable="false" class="hdr">
                        <img src="media/obstacles/coin.png" draggable="false" class="coin">
                        <img src="media/obstacles/color-ball.png" draggable="false" class="color-ball" >
                        -->
                    </div>
                </div>
                <div id="end-game" >
                    <img src="media/cars/without_shadow/2.png" draggable="false">
                    <div class="YOUR_SCORE__">TWÓJ WYNIK</div>
                    <div class="final-score"></div>
                    <div class="world-rank">WYNIK GLOBALNY <span></span></div>
                    <div id="play-again-btn" onclick="click_audio();game.timer();$('#end-game').hide()"></div>
                    <div id="submit-score-btn" onclick="click_audio();window.open('https://pl.msi.com/Landing/quantum-dot-gaming-monitor-2022')"></div>
                </div>
                <div id="submit-page" >
                    <form action="submit.php" method="post">
                        <div id="country-section" onmouseout="">
                            <div id="list-countries"><div onclick="select_country($(this))" value="Afganistan">Afghanistan</div> <div onclick="select_country($(this))" value="Albania">Albania</div> <div onclick="select_country($(this))" value="Algeria">Algeria</div> <div onclick="select_country($(this))" value="American Samoa">American Samoa</div> <div onclick="select_country($(this))" value="Andorra">Andorra</div> <div onclick="select_country($(this))" value="Angola">Angola</div> <div onclick="select_country($(this))" value="Anguilla">Anguilla</div> <div onclick="select_country($(this))" value="Antigua & Barbuda">Antigua & Barbuda</div> <div onclick="select_country($(this))" value="Argentina">Argentina</div> <div onclick="select_country($(this))" value="Armenia">Armenia</div> <div onclick="select_country($(this))" value="Aruba">Aruba</div> <div onclick="select_country($(this))" value="Australia">Australia</div> <div onclick="select_country($(this))" value="Austria">Austria</div> <div onclick="select_country($(this))" value="Azerbaijan">Azerbaijan</div> <div onclick="select_country($(this))" value="Bahamas">Bahamas</div> <div onclick="select_country($(this))" value="Bahrain">Bahrain</div> <div onclick="select_country($(this))" value="Bangladesh">Bangladesh</div> <div onclick="select_country($(this))" value="Barbados">Barbados</div> <div onclick="select_country($(this))" value="Belarus">Belarus</div> <div onclick="select_country($(this))" value="Belgium">Belgium</div> <div onclick="select_country($(this))" value="Belize">Belize</div> <div onclick="select_country($(this))" value="Benin">Benin</div> <div onclick="select_country($(this))" value="Bermuda">Bermuda</div> <div onclick="select_country($(this))" value="Bhutan">Bhutan</div> <div onclick="select_country($(this))" value="Bolivia">Bolivia</div> <div onclick="select_country($(this))" value="Bonaire">Bonaire</div> <div onclick="select_country($(this))" value="Bosnia & Herzegovina">Bosnia & Herzegovina</div> <div onclick="select_country($(this))" value="Botswana">Botswana</div> <div onclick="select_country($(this))" value="Brazil">Brazil</div> <div onclick="select_country($(this))" value="British Indian Ocean Ter">British Indian Ocean Ter</div> <div onclick="select_country($(this))" value="Brunei">Brunei</div> <div onclick="select_country($(this))" value="Bulgaria">Bulgaria</div> <div onclick="select_country($(this))" value="Burkina Faso">Burkina Faso</div> <div onclick="select_country($(this))" value="Burundi">Burundi</div> <div onclick="select_country($(this))" value="Cambodia">Cambodia</div> <div onclick="select_country($(this))" value="Cameroon">Cameroon</div> <div onclick="select_country($(this))" value="Canada">Canada</div> <div onclick="select_country($(this))" value="Canary Islands">Canary Islands</div> <div onclick="select_country($(this))" value="Cape Verde">Cape Verde</div> <div onclick="select_country($(this))" value="Cayman Islands">Cayman Islands</div> <div onclick="select_country($(this))" value="Central African Republic">Central African Republic</div> <div onclick="select_country($(this))" value="Chad">Chad</div> <div onclick="select_country($(this))" value="Channel Islands">Channel Islands</div> <div onclick="select_country($(this))" value="Chile">Chile</div> <div onclick="select_country($(this))" value="China">China</div> <div onclick="select_country($(this))" value="Christmas Island">Christmas Island</div> <div onclick="select_country($(this))" value="Cocos Island">Cocos Island</div> <div onclick="select_country($(this))" value="Colombia">Colombia</div> <div onclick="select_country($(this))" value="Comoros">Comoros</div> <div onclick="select_country($(this))" value="Congo">Congo</div> <div onclick="select_country($(this))" value="Cook Islands">Cook Islands</div> <div onclick="select_country($(this))" value="Costa Rica">Costa Rica</div> <div onclick="select_country($(this))" value="Cote DIvoire">Cote DIvoire</div> <div onclick="select_country($(this))" value="Croatia">Croatia</div> <div onclick="select_country($(this))" value="Cuba">Cuba</div> <div onclick="select_country($(this))" value="Curaco">Curacao</div> <div onclick="select_country($(this))" value="Cyprus">Cyprus</div> <div onclick="select_country($(this))" value="Czech Republic">Czech Republic</div> <div onclick="select_country($(this))" value="Denmark">Denmark</div> <div onclick="select_country($(this))" value="Djibouti">Djibouti</div> <div onclick="select_country($(this))" value="Dominica">Dominica</div> <div onclick="select_country($(this))" value="Dominican Republic">Dominican Republic</div> <div onclick="select_country($(this))" value="East Timor">East Timor</div> <div onclick="select_country($(this))" value="Ecuador">Ecuador</div> <div onclick="select_country($(this))" value="Egypt">Egypt</div> <div onclick="select_country($(this))" value="El Salvador">El Salvador</div> <div onclick="select_country($(this))" value="Equatorial Guinea">Equatorial Guinea</div> <div onclick="select_country($(this))" value="Eritrea">Eritrea</div> <div onclick="select_country($(this))" value="Estonia">Estonia</div> <div onclick="select_country($(this))" value="Ethiopia">Ethiopia</div> <div onclick="select_country($(this))" value="Falkland Islands">Falkland Islands</div> <div onclick="select_country($(this))" value="Faroe Islands">Faroe Islands</div> <div onclick="select_country($(this))" value="Fiji">Fiji</div> <div onclick="select_country($(this))" value="Finland">Finland</div> <div onclick="select_country($(this))" value="France">France</div> <div onclick="select_country($(this))" value="French Guiana">French Guiana</div> <div onclick="select_country($(this))" value="French Polynesia">French Polynesia</div> <div onclick="select_country($(this))" value="French Southern Ter">French Southern Ter</div> <div onclick="select_country($(this))" value="Gabon">Gabon</div> <div onclick="select_country($(this))" value="Gambia">Gambia</div> <div onclick="select_country($(this))" value="Georgia">Georgia</div> <div onclick="select_country($(this))" value="Germany">Germany</div> <div onclick="select_country($(this))" value="Ghana">Ghana</div> <div onclick="select_country($(this))" value="Gibraltar">Gibraltar</div> <div onclick="select_country($(this))" value="Great Britain">Great Britain</div> <div onclick="select_country($(this))" value="Greece">Greece</div> <div onclick="select_country($(this))" value="Greenland">Greenland</div> <div onclick="select_country($(this))" value="Grenada">Grenada</div> <div onclick="select_country($(this))" value="Guadeloupe">Guadeloupe</div> <div onclick="select_country($(this))" value="Guam">Guam</div> <div onclick="select_country($(this))" value="Guatemala">Guatemala</div> <div onclick="select_country($(this))" value="Guinea">Guinea</div> <div onclick="select_country($(this))" value="Guyana">Guyana</div> <div onclick="select_country($(this))" value="Haiti">Haiti</div> <div onclick="select_country($(this))" value="Hawaii">Hawaii</div> <div onclick="select_country($(this))" value="Honduras">Honduras</div> <div onclick="select_country($(this))" value="Hong Kong">Hong Kong</div> <div onclick="select_country($(this))" value="Hungary">Hungary</div> <div onclick="select_country($(this))" value="Iceland">Iceland</div> <div onclick="select_country($(this))" value="Indonesia">Indonesia</div> <div onclick="select_country($(this))" value="India">India</div> <div onclick="select_country($(this))" value="Iran">Iran</div> <div onclick="select_country($(this))" value="Iraq">Iraq</div> <div onclick="select_country($(this))" value="Ireland">Ireland</div> <div onclick="select_country($(this))" value="Isle of Man">Isle of Man</div> <div onclick="select_country($(this))" value="Israel">Israel</div> <div onclick="select_country($(this))" value="Italy">Italy</div> <div onclick="select_country($(this))" value="Jamaica">Jamaica</div> <div onclick="select_country($(this))" value="Japan">Japan</div> <div onclick="select_country($(this))" value="Jordan">Jordan</div> <div onclick="select_country($(this))" value="Kazakhstan">Kazakhstan</div> <div onclick="select_country($(this))" value="Kenya">Kenya</div> <div onclick="select_country($(this))" value="Kiribati">Kiribati</div> <div onclick="select_country($(this))" value="Korea North">Korea North</div> <div onclick="select_country($(this))" value="Korea Sout">Korea South</div> <div onclick="select_country($(this))" value="Kuwait">Kuwait</div> <div onclick="select_country($(this))" value="Kyrgyzstan">Kyrgyzstan</div> <div onclick="select_country($(this))" value="Laos">Laos</div> <div onclick="select_country($(this))" value="Latvia">Latvia</div> <div onclick="select_country($(this))" value="Lebanon">Lebanon</div> <div onclick="select_country($(this))" value="Lesotho">Lesotho</div> <div onclick="select_country($(this))" value="Liberia">Liberia</div> <div onclick="select_country($(this))" value="Libya">Libya</div> <div onclick="select_country($(this))" value="Liechtenstein">Liechtenstein</div> <div onclick="select_country($(this))" value="Lithuania">Lithuania</div> <div onclick="select_country($(this))" value="Luxembourg">Luxembourg</div> <div onclick="select_country($(this))" value="Macau">Macau</div> <div onclick="select_country($(this))" value="Macedonia">Macedonia</div> <div onclick="select_country($(this))" value="Madagascar">Madagascar</div> <div onclick="select_country($(this))" value="Malaysia">Malaysia</div> <div onclick="select_country($(this))" value="Malawi">Malawi</div> <div onclick="select_country($(this))" value="Maldives">Maldives</div> <div onclick="select_country($(this))" value="Mali">Mali</div> <div onclick="select_country($(this))" value="Malta">Malta</div> <div onclick="select_country($(this))" value="Marshall Islands">Marshall Islands</div> <div onclick="select_country($(this))" value="Martinique">Martinique</div> <div onclick="select_country($(this))" value="Mauritania">Mauritania</div> <div onclick="select_country($(this))" value="Mauritius">Mauritius</div> <div onclick="select_country($(this))" value="Mayotte">Mayotte</div> <div onclick="select_country($(this))" value="Mexico">Mexico</div> <div onclick="select_country($(this))" value="Midway Islands">Midway Islands</div> <div onclick="select_country($(this))" value="Moldova">Moldova</div> <div onclick="select_country($(this))" value="Monaco">Monaco</div> <div onclick="select_country($(this))" value="Mongolia">Mongolia</div> <div onclick="select_country($(this))" value="Montserrat">Montserrat</div> <div onclick="select_country($(this))" value="Morocco">Morocco</div> <div onclick="select_country($(this))" value="Mozambique">Mozambique</div> <div onclick="select_country($(this))" value="Myanmar">Myanmar</div> <div onclick="select_country($(this))" value="Nambia">Nambia</div> <div onclick="select_country($(this))" value="Nauru">Nauru</div> <div onclick="select_country($(this))" value="Nepal">Nepal</div> <div onclick="select_country($(this))" value="Netherland Antilles">Netherland Antilles</div> <div onclick="select_country($(this))" value="Netherlands">Netherlands (Holland, Europe)</div> <div onclick="select_country($(this))" value="Nevis">Nevis</div> <div onclick="select_country($(this))" value="New Caledonia">New Caledonia</div> <div onclick="select_country($(this))" value="New Zealand">New Zealand</div> <div onclick="select_country($(this))" value="Nicaragua">Nicaragua</div> <div onclick="select_country($(this))" value="Niger">Niger</div> <div onclick="select_country($(this))" value="Nigeria">Nigeria</div> <div onclick="select_country($(this))" value="Niue">Niue</div> <div onclick="select_country($(this))" value="Norfolk Island">Norfolk Island</div> <div onclick="select_country($(this))" value="Norway">Norway</div> <div onclick="select_country($(this))" value="Oman">Oman</div> <div onclick="select_country($(this))" value="Pakistan">Pakistan</div> <div onclick="select_country($(this))" value="Palau Island">Palau Island</div> <div onclick="select_country($(this))" value="Palestine">Palestine</div> <div onclick="select_country($(this))" value="Panama">Panama</div> <div onclick="select_country($(this))" value="Papua New Guinea">Papua New Guinea</div> <div onclick="select_country($(this))" value="Paraguay">Paraguay</div> <div onclick="select_country($(this))" value="Peru">Peru</div> <div onclick="select_country($(this))" value="Phillipines">Philippines</div> <div onclick="select_country($(this))" value="Pitcairn Island">Pitcairn Island</div> <div onclick="select_country($(this))" value="Poland">Poland</div> <div onclick="select_country($(this))" value="Portugal">Portugal</div> <div onclick="select_country($(this))" value="Puerto Rico">Puerto Rico</div> <div onclick="select_country($(this))" value="Qatar">Qatar</div> <div onclick="select_country($(this))" value="Republic of Montenegro">Republic of Montenegro</div> <div onclick="select_country($(this))" value="Republic of Serbia">Republic of Serbia</div> <div onclick="select_country($(this))" value="Reunion">Reunion</div> <div onclick="select_country($(this))" value="Romania">Romania</div> <div onclick="select_country($(this))" value="Russia">Russia</div> <div onclick="select_country($(this))" value="Rwanda">Rwanda</div> <div onclick="select_country($(this))" value="St Barthelemy">St Barthelemy</div> <div onclick="select_country($(this))" value="St Eustatius">St Eustatius</div> <div onclick="select_country($(this))" value="St Helena">St Helena</div> <div onclick="select_country($(this))" value="St Kitts-Nevis">St Kitts-Nevis</div> <div onclick="select_country($(this))" value="St Lucia">St Lucia</div> <div onclick="select_country($(this))" value="St Maarten">St Maarten</div> <div onclick="select_country($(this))" value="St Pierre & Miquelon">St Pierre & Miquelon</div> <div onclick="select_country($(this))" value="St Vincent & Grenadines">St Vincent & Grenadines</div> <div onclick="select_country($(this))" value="Saipan">Saipan</div> <div onclick="select_country($(this))" value="Samoa">Samoa</div> <div onclick="select_country($(this))" value="Samoa American">Samoa American</div> <div onclick="select_country($(this))" value="San Marino">San Marino</div> <div onclick="select_country($(this))" value="Sao Tome & Principe">Sao Tome & Principe</div> <div onclick="select_country($(this))" value="Saudi Arabia">Saudi Arabia</div> <div onclick="select_country($(this))" value="Senegal">Senegal</div> <div onclick="select_country($(this))" value="Seychelles">Seychelles</div> <div onclick="select_country($(this))" value="Sierra Leone">Sierra Leone</div> <div onclick="select_country($(this))" value="Singapore">Singapore</div> <div onclick="select_country($(this))" value="Slovakia">Slovakia</div> <div onclick="select_country($(this))" value="Slovenia">Slovenia</div> <div onclick="select_country($(this))" value="Solomon Islands">Solomon Islands</div> <div onclick="select_country($(this))" value="Somalia">Somalia</div> <div onclick="select_country($(this))" value="South Africa">South Africa</div> <div onclick="select_country($(this))" value="Spain">Spain</div> <div onclick="select_country($(this))" value="Sri Lanka">Sri Lanka</div> <div onclick="select_country($(this))" value="Sudan">Sudan</div> <div onclick="select_country($(this))" value="Suriname">Suriname</div> <div onclick="select_country($(this))" value="Swaziland">Swaziland</div> <div onclick="select_country($(this))" value="Sweden">Sweden</div> <div onclick="select_country($(this))" value="Switzerland">Switzerland</div> <div onclick="select_country($(this))" value="Syria">Syria</div> <div onclick="select_country($(this))" value="Tahiti">Tahiti</div> <div onclick="select_country($(this))" value="Taiwan">Taiwan</div> <div onclick="select_country($(this))" value="Tajikistan">Tajikistan</div> <div onclick="select_country($(this))" value="Tanzania">Tanzania</div> <div onclick="select_country($(this))" value="Thailand">Thailand</div> <div onclick="select_country($(this))" value="Togo">Togo</div> <div onclick="select_country($(this))" value="Tokelau">Tokelau</div> <div onclick="select_country($(this))" value="Tonga">Tonga</div> <div onclick="select_country($(this))" value="Trinidad & Tobago">Trinidad & Tobago</div> <div onclick="select_country($(this))" value="Tunisia">Tunisia</div> <div onclick="select_country($(this))" value="Turkey">Turkey</div> <div onclick="select_country($(this))" value="Turkmenistan">Turkmenistan</div> <div onclick="select_country($(this))" value="Turks & Caicos Is">Turks & Caicos Is</div> <div onclick="select_country($(this))" value="Tuvalu">Tuvalu</div> <div onclick="select_country($(this))" value="Uganda">Uganda</div> <div onclick="select_country($(this))" value="United Kingdom">United Kingdom</div> <div onclick="select_country($(this))" value="Ukraine">Ukraine</div> <div onclick="select_country($(this))" value="United Arab Erimates">United Arab Emirates</div> <div onclick="select_country($(this))" value="United States of America">United States of America</div> <div onclick="select_country($(this))" value="Uraguay">Uruguay</div> <div onclick="select_country($(this))" value="Uzbekistan">Uzbekistan</div> <div onclick="select_country($(this))" value="Vanuatu">Vanuatu</div> <div onclick="select_country($(this))" value="Vatican City State">Vatican City State</div> <div onclick="select_country($(this))" value="Venezuela">Venezuela</div> <div onclick="select_country($(this))" value="Vietnam">Vietnam</div> <div onclick="select_country($(this))" value="Virgin Islands (Brit)">Virgin Islands (Brit)</div> <div onclick="select_country($(this))" value="Virgin Islands (USA)">Virgin Islands (USA)</div> <div onclick="select_country($(this))" value="Wake Island">Wake Island</div> <div onclick="select_country($(this))" value="Wallis & Futana Is">Wallis & Futana Is</div> <div onclick="select_country($(this))" value="Yemen">Yemen</div> <div onclick="select_country($(this))" value="Zaire">Zaire</div> <div onclick="select_country($(this))" value="Zambia">Zambia</div> <div onclick="select_country($(this))" value="Zimbabwe">Zimbabwe</div></div>
                            <input  type="text" id="input-name" name="name" placeholder="Imię i nazwisko" required spellcheck="false" autocomplete="off">
                        </div>
                        <input type="text" id="input-country" name="country" placeholder="Kraj/region" required spellcheck="false" autocomplete="off">
                        <input type="email" id="input-email" name="email" placeholder="E-mail" required spellcheck="false" autocomplete="off">
                        <input type="checkbox" id="checkbox-1" onclick="click_audio();" required>
                        <input type="checkbox" id="checkbox-2" onclick="click_audio();" required>
                        <div id="submit-form-btn" onclick="click_audio();"></div>
                        <div id="submit-back-btn" onclick="click_audio();$('#submit-page').hide();$('#end-game').fadeIn()"></div>
                        <div id="termsAndConditions"></div>
                        <svg onclick="$('#list-countries').show();setTimeout(()=>{countryListShown=true;},500)" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-caret-down-fill" viewBox="0 0 16 16"> <path d="M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"/> </svg>
                    </form>
                </div>
                <div id="overwrite-page">
                    <div id="overwrite-window">
                        <div id="close-overwrite" onclick="click_audio();$('#overwrite-page').hide();"></div>
                        <div id="no-overwrite" onclick="click_audio();$('#overwrite-page').hide();"></div>
                        <div id="yes-overwrite" onclick="click_audio();save_record()"></div>
                    </div>
                </div>
                <div id="recorded-page" >
                    <div id="play-so-real-btn" onclick="click_audio();window.open('https://www.msi.com/Landing/quantum-dot-gaming-monitor-2022')"></div>
                    <div id="recorded-play-again" onclick="click_audio();game.timer()"></div>
                </div>
            </div>

        </div>
        <script>
            var return_PHP = false;
            
            
            var players = <?php echo json_encode($emails); ?>;
            var scores = <?php echo json_encode($scores); ?>;


            if ( return_PHP == true){
            $("#loader").hide()
            $("#game-area-content").show()
            }
            let possible = false
            let loaded = false
            setTimeout(()=>{
            possible = true
            },2500)
            $(window).on('load', function () {
            if(possible == true){
                loaded = true
                $("#hide-start-btn").hide()
                $(".lds-ring").hide()
            }
            else{
                setTimeout(()=>{
                    loaded = true
                    $("#hide-start-btn").hide()
                    $(".lds-ring").hide()
                },1500)
            }
            }) 

</script>
        <script src="lib/respo.js"></script>
        <script src="index.js"></script>
        <div id="assets" style="display: none;">
            <script>
                for(i=1;i<=4;i++){
                    document.write('<img src="media/cars/color-ball/'+i+'.png" draggable="false"><img src="media/cars/with_shadow/'+i+'.png" draggable="false"><img src="media/cars/hdr/'+i+'.png" draggable="false">')
            }
            </script>
            <script>
               if(game.version=="mobile"){
                   document.write('<img src="media/mobile-game-default.png" alt=""><img src="media/mobile-game-color-ball.png" alt=""><img src="media/mobile-game-hdr.png" alt=""><img src="media/mobile-submit.png" alt=""> <img src="media/mobile-recorded.png" alt=""> <img src="media/mobile-choose-car.png" alt="">')
               }
               else{
                   document.write('<img src="media/start-page.png" alt=""><img src="media/game-default.png" alt=""> <img src="media/game-color-ball.png" alt=""> <img src="media/game-hdr.png" alt=""> <img src="media/submit.png" alt=""> <img src="media/choose-your-car.png" alt=""> <img src="media/how-to-play-1.jpg" alt=""> <img src="media/how-to-play-2.jpg" alt=""> <img src="media/how-to-play-3.jpg" alt=""> <img src="media/recorded.png" alt="">')
               }
            </script>
            <img src="media/start-btn.png" alt="">
            <img src="media/end-game.png" alt="">
            <img src="media/countdown1.png" alt="">
            <img src="media/countdown2.png" alt="">
            <img src="media/countdown3.png" alt="">
            <img src="media/obstacles/barr.png" alt="">
            <img src="media/obstacles/coin.png" alt="">
            <img src="media/obstacles/color-ball.png" alt="">
            <img src="media/obstacles/crack2.png" alt="">
            <img src="media/obstacles/crack1.png" alt="">
            <img src="media/obstacles/end-line.png" alt="">
            <img src="media/obstacles/hdr.png" alt="">
            <img src="media/coins-UI.png" alt="">
            <img src="media/time-UI.png" alt="">
            <audio id="click-audio"><source src="media/click.wav" type="audio/wav" ></audio>
            <audio id="bg-audio" loop><source src="media/bg.mp3" type="audio/mp3" ></audio>
            <audio id="collect-audio"><source src="media/collect.wav" type="audio/wav" ></audio>
            <audio id="obs-audio"><source src="media/obs.mp3" type="audio/wav" ></audio>
            <audio id="end-audio" ><source src="media/end.mp3" type="audio/mp3" ></audio>
            <audio id="timer-audio" ><source src="media/timer.mp3" type="audio/mp3" ></audio>
        </div>
    </body>
</html>