dbconfig.php
Deze code wordt gebruikt om verbinding te maken met de database. Als er later iets aangepast wordt, moet die aanpassing alleen in dit document gebeuren.
1 2 3 4 5 6 7 8 9 10 | <?php //standaard instellingen voor connectie met database $servername = "localhost"; $username = "stijn"; $password = "admin"; $dbname = "lasertag_2"; // Create connection $conn = mysqli_connect($servername, $username, $password, $dbname); ?> |
gettable.php
Naar deze pagina stuurt de 'vieuwgame' pagina aanvragen met AJAX. AJAX staat voor Asynchronous Javascript And XML. het is een combinatie van Javascript en XML. Javascript wordt gebruikt om data te gebruiken en visualiseren. XML in ingebouwd in een webbrowser (XMLHttpRequest) en wordt gebruikt om data aan te vragen van een webserver (in dit geval naar deze pagina). Ik gebruik AJAX om de tabellen om de 'vieuwgame' pagina real-time aan te passen zonder het herladen van heel de pagina.

How AJAX Works (w3schools.com)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | <?php //PHP bestand die antwoord geef op AJAX requesten require_once('dbconfig.php'); //iclude database configuratie $result1 = mysqli_query($conn,"SELECT * FROM data"); //krijg alles van table data //standaard content $content1 = "<tr><th>Naam</th><th>Team</th><th>Type event</th><th>Gedood door</th><th>Tijd (UTC+1)</th></tr>"; while($row1=mysqli_fetch_assoc($result1)){ //loop door elke gekregen rij van data $content1 .= "<tr>"; //begin table row $query1b = "SELECT spelernaam FROM players WHERE id = '".$row1['name']."'"; //zoek naam van speler met id $result1b = mysqli_query($conn,$query1b); //voer query uit $row1b = mysqli_fetch_assoc($result1b); //krijg eerste rij van resultaat //zet dewenste data in tabel rij $content1 .= "<td>".$row1b['spelernaam']."</td>"; $content1 .= "<td>".$row1['team']."</td>"; $content1 .= "<td>".$row1['type']."</td>"; $query1c = "SELECT spelernaam FROM players WHERE id = '".$row1['kby']."'"; //zoek naam van speler met id $result1c = mysqli_query($conn,$query1c); //voer query uit $row1c = mysqli_fetch_assoc($result1c); //krijg eerste rij van resultaat //zet dewenste data in tabel rij $content1 .= "<td>".$row1c['spelernaam']."</td>"; $content1 .= "<td>".$row1['time']."</td>"; $content1 .= "</tr>"; //stop table row } echo "".$content1.","; //stuur deel 1 van content en een , //standaard content $content2 = "<tr><th>Naam</th><th>SpelerID</th><th>IP-adres</th></tr>"; $result2 = mysqli_query($conn,"SELECT * FROM ip"); //krijg alles van table ip while($row2=mysqli_fetch_assoc($result2)){ //loop door elke gekregen rij van ip $content2 .= "<tr>"; //begin table row $query2 = "SELECT spelernaam FROM players WHERE id = '".$row2['spelerID']."'"; //krijg naam van speler met id $result2b = mysqli_query($conn,$query2); //voer query uit $row2b = mysqli_fetch_assoc($result2b); //krijg eerste rij van resultaat //zet dewenste data in tabel rij $content2 .= "<td>".$row2b['spelernaam']."</td>"; $content2 .= "<td>".$row2['spelerID']."</td>"; $content2 .= "<td>".$row2['IP']."</td>"; $content2 .= "</tr>"; //stop table row } echo "".$content2.""; //stuur deel 2 van content ?> |
index.php
Wanneer er gesurft wordt naar een website zonder aanvraag van specifieke bestanden zal de index pagina getoond worden. Op deze pagina kan een gebruiker zich inloggen. Als de gebruiker al ingelogd staat zal deze pagina hem doorverwijzen naar de hoofdpagina 'mainpage.php'.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | <?php session_start(); //start sessie /* kijk of er al ingelogd was */ if(isset($_SESSION['loggedin']) && $_SESSION['loggedin'] == true){ header("location:mainpage.php"); //go to mainpage exit(); } require_once('dbconfig.php'); //include database connectie /* POST request met parameters username en password*/ if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['username']) && isset($_POST['password'])) { /* krijg parameters en maak ze klaar voor sql query */ $username = "'".$_POST['username']."'"; $password = "'".md5($_POST['password'])."'"; /* kijk of inlog bestaat */ $loginquery = "SELECT username FROM users WHERE username = $username AND password = $password"; $login = mysqli_query($conn,$loginquery); $loginrow = mysqli_fetch_assoc($login); $count = mysqli_num_rows($login); //krijg aantal rijen waar inlog overeenkomt if($count == 1){ //als er één overeenkomt $_SESSION['username'] = $loginrow['username']; //onthoud ingelogde gebruiker $_SESSION['loggedin'] = true; //er is ingelogd header('location:mainpage.php'); //ga naar mainpage exit(); } else{ //gebruiker bestaat niet echo "<p style=\"color:red;\">foute gegevens</p>"; } } ?> <html lang="nl"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="css/index.css"> <title>Log-in</title> </head> <body> <div class="loginbox"> <form method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" autocomplete="off"> <h2>log-in</h2> <input type="text" name="username" placeholder="Gebruikersnaam"> <input type="password" name="password" placeholder="Wachtwoord"> <input type="submit" value="log-in"> </form> <div class="signin"> <a href="signin.php"><button>sign-in</button></a> </div> <p>Laser tag 2018-2019</p> </div> </body> </html> |
logout.php
Als een gebruiker zich wil uitloggen, zal deze pagina worden aangeroepen. Hiermee worden alle sessievariabelen gewist.
1 2 3 4 5 | <?php session_start(); //start sessie session_destroy(); //verwijder sessie header("location:index.php"); //ga naar inlog ?> |
mainpage.php
Op deze pagina wordt de gebruiker begroet.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | <?php session_start(); //start sessie /* kijk of er ingelogd is */ if(!isset($_SESSION['loggedin']) || !$_SESSION['loggedin'] == true){ //niet ingelogd: header("location:logout.php"); //go to mainpage exit(); } ?> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="css/mainpage.css"> <title>Home</title> </head> <body> <div class="menu"> <a href="mainpage.php">Home</a> <a href="newgame.php">Nieuw spel</a> <a href="mygames.php">Mijn spellen</a> <a href="viewgame.php">Game viewer</a> <a href="logout.php">Log-out</a> </div> <div class="main"> <div class="title"> <h1>Welkom <?php echo"".$_SESSION['username']."";?></h1> </div> <div class="logout"> <a href="logout.php"><button>Log-out</button></a> </div> </div> </body> </html> |
mygames.php
Wanneer een gebruiker zelf spellen heeft aangemaakt kan hij die hier bekijken en beheren. Spellen aangemaakt door andere gebruikers kunnen niet bekeken worden. Elk spel wordt namelijk gelinkt aan de maker of de 'admin' van het spel.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 | <?php session_start(); //start sessie /* kijk of er ingelogd is */ if(!isset($_SESSION['loggedin']) || !$_SESSION['loggedin'] == true){ //niet ingelogd: header("location:logout.php"); //go to mainpage exit(); } require_once('dbconfig.php'); //include database conenctie $admin = "'".$_SESSION['username']."'"; //maak een admin var klaar voor sql query //krijg alle spellen aangemaakt door ingelogde gebruiker $mgames = mysqli_query($conn,"SELECT * FROM link WHERE admin = $admin"); /* POST request met parameter delete */ if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['delete'])) { /* krijg alle parameters een maak klaar voor sql query */ $spelnaam = "'".$_POST['spelnaam']."'"; $gameID = "'".$_POST['gameID']."'"; //verwijder een spel samen met ge configuratie $delete = mysqli_query($conn,"DELETE FROM link WHERE spelnaam = $spelnaam AND id = $gameID AND admin = $admin"); $delete2 = mysqli_query($conn,"DELETE FROM settings WHERE gameID = $gameID"); if($delete && $delete2){ //alles ging good $message = "Success!"; echo "<script type='text/javascript'>alert(\"$message\");</script>"; } else{ //fout $message = "Oeps! Er ging iets mis."; echo "<script type='text/javascript'>alert(\"$message\");</script>"; } header("Refresh:0"); //herlaad volledige pagina } ?> <html> <head> <script> //funtie om div detail te openen met parameters function openDetail(game,gamemode,tijd,ar,acr,lr,ab,acb,lb){ document.getElementById("detail").style.display = "block"; //display div //set data document.getElementById("gamemode").innerHTML = "Gamemode: "+gamemode+""; document.getElementById("title").innerHTML = "Spel "+game+""; document.getElementById("tijd").innerHTML = "Spelduur: "+tijd+" min."; document.getElementById("ar").innerHTML = "Ammo Red: "+ar+""; document.getElementById("acr").innerHTML = "Clips Red: "+acr+""; document.getElementById("lr").innerHTML = "Life Red: "+lr+""; document.getElementById("ab").innerHTML = "Ammo Blue: "+ab+""; document.getElementById("acb").innerHTML = "Clips Blue: "+acb+""; document.getElementById("lb").innerHTML = "Life Blue: "+lb+""; } //functie om div detail te sluiten function closeDetail(){ document.getElementById("detail").style.display = "none"; //hide div } //functie om delete popup weer te geven function openDelete(game,id){ document.getElementById("detail").style.display = "none"; document.getElementById("message").innerHTML = "Verwijder "+game+"?"; document.getElementById("spelnaam").value = game; document.getElementById("gameID").value = id; document.getElementById("delete").style.display = "block"; } //functie om delete popup te sluiten function closeDelete(){ document.getElementById("delete").style.display = "none"; } </script> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="css/mygames.css"> <title>Mijn Spellen</title> </head> <body> <div class="menu"> <a href="mainpage.php">Home</a> <a href="newgame.php">Nieuw spel</a> <a href="mygames.php">Mijn spellen</a> <a href="viewgame.php">Game viewer</a> <a href="logout.php">Log-out</a> </div> <div class="main"> <!--div delete om spel te verwijderen --> <div id="delete"> <form method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" onsubmit="closeDelete()"> <p id="message"></p> <input type="hidden" name="delete"> <input type="hidden" name="spelnaam" id="spelnaam"> <input type="hidden" name="gameID" id="gameID"> <input type="submit" value="Verwijder"> </form> <button onclick="closeDelete()">Sluit</button> </div> <!-- div detail om de instellingen van een spel weer te geven --> <div id="detail"> <h2 id="title"></h2> <p id="ar"></p> <p id="acr"></p> <p id="lr"></p> <p id="ab"></p> <p id="acb"></p> <p id="lb"></p> <p id="tijd"></p> <p id="gamemode"></p> <button onclick="closeDetail()">Sluit</button> </div> <div id="games"> <table> <tr> <th>Spelnaam</th> <th>GameID</th> <th>Opties</th> </tr> <?php /* maak tabel met alle spellen */ while($row = mysqli_fetch_assoc($mgames)){ $settings = mysqli_query($conn,"SELECT * FROM settings WHERE gameID = '".$row['id']."'"); $row2 = mysqli_fetch_assoc($settings); $row3 = mysqli_fetch_assoc($settings); echo '<tr>'; echo '<td>'.$row['spelnaam'].'</td>'; echo '<td>'.$row['id'].'</td>'; echo "<td><button onclick=\"openDetail('".$row['spelnaam']."','".$row['gamemode']."','".$row['tijd']."','".$row2['ammo']."','".$row2['acount']."','".$row2['life']."','".$row3['ammo']."','".$row3['acount']."','".$row3['life']."')\">Bekijk instellingen</button></td>"; echo "<td><button onclick=\"openDelete('".$row['spelnaam']."','".$row['id']."')\">Verwijder</button></td>"; echo '</tr>'; } ?> </table> </div> </div> </body> </html> |
newgame.php
Om een nieuw spel aan te maken, kan een gebruiker naar deze pagina gaan. Met een 'multiple step form' worden alle instellingen gedaan. De gebruiker heeft volgende mogelijkheden: spelnaam, gamemode, speeltijd en de instellingen per team (ammo, aantal keer herladen en aantal levens).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 | <?php session_start(); //ster sessie /* kijk of er ingelogd is */ if(!isset($_SESSION['loggedin']) || !$_SESSION['loggedin'] == true){ //niet ingelogd header("location:logout.php"); //go to mainpage exit(); } require_once('dbconfig.php'); //include database connectie /* POST request met parameter spelnaam*/ if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['spelnaam'])) { /* maak alle parameters klaar voor sql query */ $spelnaam = "'".$_POST['spelnaam']."'"; $gamemode = "'".$_POST['gamemode']."'"; $tijd = "'".$_POST['tijd']."'"; $ammoR = "'".$_POST['ammoR']."'"; $acountR = "'".$_POST['acountR']."'"; $lifeR = "'".$_POST['lifeR']."'"; $ammoB = "'".$_POST['ammoB']."'"; $acountB = "'".$_POST['acountB']."'"; $lifeB = "'".$_POST['lifeB']."'"; $admin = "'".$_SESSION['username']."'"; //verifier dat spel nog niet bestaat $verif = mysqli_query($conn,"SELECT spelnaam FROM link WHERE spelnaam = $spelnaam AND admin = $admin"); if(mysqli_num_rows($verif)==0){ //spel bestaat nog niet $error = false; //tot nu toe geen error /* zet alle gegevens in de juiste tables*/ $link = mysqli_query($conn,"INSERT INTO link (spelnaam,gamemode,tijd,admin) VALUES ($spelnaam,$gamemode,$tijd,$admin)"); if(!$link){$error = true;} //kijk na voor error $gameID = "'".mysqli_insert_id($conn)."'"; $settingsR = mysqli_query($conn,"INSERT INTO settings (team,ammo,acount,life,gameID) VALUES ('ROOD',$ammoR,$acountR,$lifeR,$gameID)"); if(!$settingsR){$error = true;} //kijk na voor error $settingsB = mysqli_query($conn,"INSERT INTO settings (team,ammo,acount,life,gameID) VALUES ('BLAUW',$ammoB,$acountB,$lifeB,$gameID)"); if(!$settingsB){$error = true;} //kijk na voor error if($error == true){ //was er een fout $message = "Er deed zich een fout voor"; echo "<script type='text/javascript'>alert(\"$message\");</script>"; } else{ //er was geen fout $message = "Success! Spelnaam:".$spelnaam." GameID:".$gameID.""; echo "<script type='text/javascript'>alert(\"$message\");</script>"; } } else{ //spel bestaat al $message = "Spel bestaat al!"; echo "<script type='text/javascript'>alert(\"$message\");</script>"; } } ?> <html> <head> <!-- jquery gebruik voor multi step form--> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <!--<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>--> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="css/newgame.css"> <title>Nieuw spel</title> </head> <body> <div class="menu"> <a href="mainpage.php">Home</a> <a href="newgame.php">Nieuw spel</a> <a href="mygames.php">Mijn spellen</a> <a href="viewgame.php">Game viewer</a> <a href="logout.php">Log-out</a> </div> <div class="main"> <form method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" autocomplete="off" id="sform"> <!-- vooruitgang --> <ul id="progress"> <li class="active">Naam</li> <li>Algemene instellingen</li> <li>Teams</li> </ul> <!-- onderdelen --> <fieldset id="0"> <h2 class="titel">Spelnaam</h2> <h3 class="ondertitel">Stap 1</h3> <input type="text" name="spelnaam" placeholder="Geef een spelnaam" required/><br> <input type="button" name="next" class="next action-button" value="Next"/> </fieldset> <fieldset id="1"> <h2 class="titel">Instellingen</h2> <h3 class="ondertitel">Stap 2</h3> <p>Gamemode:</p> <select name="gamemode" size="1"> <option value="TD">Team Deadmatch</option> <option value="CF">Capture The Flag</option> <option value="FA">Free For All</option> </select> <p>Spelduur (min.):</p> <input type="number" name="tijd" value="0"/><br> <input type="button" name="previous" class="previous action-button-previous" value="Previous"/> <input type="button" name="next" class="next action-button" value="Next"/> </fieldset> <fieldset id="2"> <h2 class="titel">Team Rood</h2> <h3 class="ondertitel">Stap 3a</h3> <p>Ammo:</p> <input type="number" name="ammoR" value="0"/> <p>Herlaadbeurten:</p> <input type="number" name="acountR" value="0"/> <p>Levens:</p> <input type="number" name="lifeR" value="100"/><br> <input type="button" name="previous" class="previous action-button-previous" value="Previous"/> <input type="button" name="next" class="next action-button" value="Next"/> </fieldset> <fieldset id="3"> <h2 class="titel">Team Blauw</h2> <h3 class="ondertitel">Stap 3b</h3> <p>Ammo:</p> <input type="number" name="ammoB" value="0"/> <p>Herlaadbeurten:</p> <input type="number" name="acountB" value="0"/> <p>Levens:</p> <input type="number" name="lifeB" value="100"/><br> <input type="button" name="previous" class="previous action-button-previous" value="Previous"/> <input type="submit" class="action-button" value="Maak aan" /> </fieldset> <script> //jQuery time var current_fs, next_fs, previous_fs; //fieldsets var left, opacity, scale; //fieldset properties which we will animate var animating; //flag to prevent quick multi-click glitches $(".next").click(function(){ if(animating) return false; animating = true; current_fs = $(this).parent(); next_fs = $(this).parent().next(); //activate next step on progressbar using the index of next_fs $("#progress li").eq($("fieldset").index(next_fs)).addClass("active"); //show the next fieldset next_fs.show(); //hide the current fieldset with style current_fs.animate({opacity: 0}, { step: function(now, mx) { //as the opacity of current_fs reduces to 0 - stored in "now" //1. scale current_fs down to 80% scale = 1 - (1 - now) * 0.2; //2. bring next_fs from the right(50%) left = (now * 50)+"%"; //3. increase opacity of next_fs to 1 as it moves in opacity = 1 - now; current_fs.css({ 'transform': 'scale('+scale+')', 'position': 'absolute' }); next_fs.css({'left': left, 'opacity': opacity}); }, duration: 800, complete: function(){ current_fs.hide(); animating = false; }, //this comes from the custom easing plugin easing: 'easeInOutBack' }); }); $(".previous").click(function(){ if(animating) return false; animating = true; current_fs = $(this).parent(); previous_fs = $(this).parent().prev(); //de-activate current step on progressbar $("#progress li").eq($("fieldset").index(current_fs)).removeClass("active"); //show the previous fieldset previous_fs.show(); //hide the current fieldset with style current_fs.animate({opacity: 0}, { step: function(now, mx) { //as the opacity of current_fs reduces to 0 - stored in "now" //1. scale previous_fs from 80% to 100% scale = 0.8 + (1 - now) * 0.2; //2. take current_fs to the right(50%) - from 0% left = ((1-now) * 50)+"%"; //3. increase opacity of previous_fs to 1 as it moves in opacity = 1 - now; current_fs.css({'left': left}); previous_fs.css({'transform': 'scale('+scale+')', 'opacity': opacity}); }, duration: 800, complete: function(){ current_fs.hide(); animating = false; }, //this comes from the custom easing plugin easing: 'easeInOutBack' }); }); </script> </form> </div> </body> </html> |
signin.php
Een nieuwe gebruiker kan op deze pagina een account aanmaken. Zijn inloggegevens worden opgeslagen in de database. Het wachtwoord wordt geëncrypteerd met de md5 hashfunctie (Message Digest Algorithm 5).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | <?php session_start(); //start sessie /* kijk of er ingelogd is */ if(isset($_SESSION['loggedin']) && $_SESSION['loggedin'] == true){ header("location:mainpage.php"); //go to main page with game id exit(); } require_once('dbconfig.php'); //include database connectie /* POST request met parameters username en password */ if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['username']) && isset($_POST['password'])) { /* krijg alle parameters en maak klaar voor sql query*/ $username = "'".$_POST['username']."'"; $password = "'".md5($_POST['password'])."'"; $password2 = "'".md5($_POST['password2'])."'"; if($password == $password2){ //zijn wachtwoorden hetzelfde /* maak nieuwe gebruiker aan als die nog niet bestaat */ $checkquery = "SELECT username FROM users WHERE username = $username AND password = $password"; $check = mysqli_query($conn,$checkquery); $count = mysqli_num_rows($check); if($count == 0){ //gebruiker bestaat nog niet $insertquery = "INSERT INTO users (username,password) VALUES ($username,$password)"; $insert = mysqli_query($conn,$insertquery); if(!$insert){ echo "<p style=\"color:red;\">ERROR: $insertquery</p>"; } else{ //als alles goed ging header('location:index.php'); //ga naar inlog } } else{ //gebruiker bestond al echo "<p style=\"color:red;\">gebruiker bestaat al!</p>"; } } else{ //de gebruiker heeft niet hetzelfde wachtwoord ingevuld echo "<p style=\"color:red;\">niet hetzelfde wachtwoord!</p>"; } } } ?> <html lang="nl"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="css/signin.css"> <title>Sign-in</title> </head> <body> <div class="signinbox"> <form method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" autocomplete="off"> <h2>sign-in</h2> <input type="text" name="username" placeholder="Gebruikersnaam"> <input type="password" name="password" placeholder="Wachtwoord"> <input type="password" name="password2" placeholder="Herhaal wachtwoord"> <input type="submit" value="sign-in"> </form> <div class="login"> <a href="index.php"><button>log-in</button></a> </div> <p>Laser tag 2018-2019</p> </div> </body> </html> |
viewgame.php
Elke ingelogde gebruiker kan de voortgang van een spel bekijken als die van de 'admin' een gameID heeft gekregen. Er kunnen ook spelers toegevoegd worden. Elke 5s wordt de log-tabel geüpdatet.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 | <?php session_start(); //start sessie /* kijk of er ingelod is */ if(!isset($_SESSION['loggedin']) || !$_SESSION['loggedin'] == true){ //niet ingelogd header("location:logout.php"); //go to mainpage exit(); } require_once('dbconfig.php'); //include database connectie $check = mysqli_query($conn,"SELECT * FROM currentgame"); //krijg alles van currentgame $chrow = mysqli_fetch_assoc($check); //krijg gegevens van eerste rij $rcount = mysqli_num_rows($check); //krijg aantal rijen /* POST request met parameter gid -> gameid */ if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['gid'])){ //krijg parameter en maak klaar voor sql query $gameID = "'".$_POST['gid']."'"; /* krijg alle gegevens van geselecteerde spel */ $getName = mysqli_query($conn,"SELECT * FROM link WHERE id = $gameID"); $nrow = mysqli_fetch_assoc($getName); $spelnaam = "'".$nrow['spelnaam']."'"; $gamemode = "'".$nrow['gamemode']."'"; $admin = "'".$nrow['admin']."'"; $tijd = "'".$nrow['tijd']."'"; /* ktijg alle instellingen van het geselecteerde spel*/ $getSettings = mysqli_query($conn,"SELECT * FROM settings WHERE gameID = $gameID"); //1e rij $row = mysqli_fetch_assoc($getSettings); $ammoR = "'".$row['ammo']."'"; $acountR = "'".$row['acount']."'"; $lifeR = "'".$row['life']."'"; //2e rij $rowb = mysqli_fetch_assoc($getSettings); $ammoB = "'".$rowb['ammo']."'"; $acountB = "'".$rowb['acount']."'"; $lifeB = "'".$rowb['life']."'"; /* maak een rij in currentgame voor team rood en team blauw met alle gegevens */ $setCurrentR = mysqli_query($conn,"INSERT INTO currentgame (team,ammo,acount,life,tijd,gamemode,spelnaam,gameID,admin) VALUES ('ROOD',$ammoR,$acountR,$lifeR,$tijd,$gamemode,$spelnaam,$gameID,$admin)"); $setCurrentB = mysqli_query($conn,"INSERT INTO currentgame (team,ammo,acount,life,tijd,gamemode,spelnaam,gameID,admin) VALUES ('BLAUW',$ammoB,$acountB,$lifeB,$tijd,$gamemode,$spelnaam,$gameID,$admin)"); if($setCurrentR && $setCurrentB){ //als alles goed ging // $message = "Success!"; // echo "<script type='text/javascript'>alert(\"$message\");</script>"; } else{ //fout $message = "Oeps! Er ging iets mis."; echo "<script type='text/javascript'>alert(\"$message\");</script>"; } header("Refresh:0"); //herlaad volledige pagina } /* POST request met parameter spelnaam */ else if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['spelernaam'])){ /* voeg spelers toe */ $gameQ = mysqli_query($conn,"SELECT gameID FROM currentgame"); $grow = mysqli_fetch_assoc($gameQ); //link spelers aan dit spel $gameID = "'".$grow['gameID']."'"; $spelers = $_POST['spelernaam']; $teams = $_POST['team']; for($i = 0; $i<count($spelers); $i++) //voor uit voor aantal inputs met naam speler { /* voeg speler toe aan spelertabel en link ze aan currentgame */ $spelerNaam = "'".$spelers[$i]."'"; $spelerTeam = "'".$teams[$i]."'"; $setSpelers = mysqli_query($conn,"INSERT INTO players(spelernaam,team,gameID) VALUES($spelerNaam,$spelerTeam,$gameID)"); } if($setSpelers){ // $message = "Success!"; // echo "<script type='text/javascript'>alert(\"$message\");</script>"; } } /* POST request met parameter delete */ else if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['delete'])){ /* krijg prameter en maak klaar voor sql request*/ $speler = "'".$_POST['delete']."'"; //verwijder speler van spelerlijst $delSpeler = mysqli_query($conn,"DELETE FROM players WHERE spelernaam = $speler"); if($delSpeler){ // $message = "Success!"; // echo "<script type='text/javascript'>alert(\"$message\");</script>"; } } /* POST request met parameter clear */ else if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['clear'])){ /* mak alle tabellen leeg die gebruikt worden voor currentgame */ $empty = mysqli_query($conn,"TRUNCATE TABLE currentgame"); $empty2 = mysqli_query($conn,"TRUNCATE TABLE data"); $empty3 = mysqli_query($conn,"TRUNCATE TABLE ip"); if($empty && $empty2){ //$message = "Success!"; //echo "<script type='text/javascript'>alert(\"$message\");</script>"; header("Refresh:0"); //herlaad volledige pagina } } /* POST request met parameter link */ else if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['link'])){ /* maak tabel met ip link leeg en unlink spelers */ $empty = mysqli_query($conn,"TRUNCATE TABLE ip"); $stoplink = mysqli_query($conn,"UPDATE players SET linked = '0'"); } /* POST request met parameter game */ else if($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['game'])){ /* maak tabel met gamedata leeg */ $empty = mysqli_query($conn,"TRUNCATE TABLE data"); } ?> <html> <head> <!-- showing/hiding/editing div's --> <script> function closeSelect(){ document.getElementById("gameselect").style.display = "none"; } function openSelect(){ document.getElementById("gameselect").style.display = "block"; } function closeData(){ document.getElementById("gamedata").style.display = "none"; } function openData(){ document.getElementById("gamedata").style.display = "block"; } function closeSpelers(){ document.getElementById("openbutton").disabled = false; document.getElementById("spelers").style.display = "none"; } function openSpelers(){ document.getElementById("openbutton").disabled = true; document.getElementById("spelers").style.display = "block"; } /* voeg velden toe aan spelerform */ function add_fields(){ document.getElementById("spelerform").innerHTML += "<input type=\"text\" name=\"spelernaam[]\" placeholder=\"Geef naam van speler\"><select name=\"team[]\" size=\"1\"><option value=\"ROOD\">Team rood</option> <option value=\"BLAUW\">Team blauw</option></select>"; } /* reset aantal velden van spelerform naar 1*/ function reset_field(){ document.getElementById("spelerform").innerHTML = "<input type=\"text\" name=\"spelernaam[]\" placeholder=\"Geef naam van speler\"><select name=\"team[]\" size=\"1\"><option value=\"ROOD\">Team rood</option> <option value=\"BLAUW\">Team blauw</option></select>"; } /* verander de tijd */ function getTime(){ var d = new Date(); var curUTC = "Momenteel "+(d.getUTCHours()+1)+":"+d.getUTCMinutes()+":"+d.getUTCSeconds()+" (UTC+1)"; document.getElementById("UTC").innerHTML = curUTC; } </script> <!-- making csv files --> <script> function downloadCSV(csv, filename) { var csvFile; var downloadLink; // CSV file csvFile = new Blob([csv], {type: "text/csv"}); // Download link downloadLink = document.createElement("a"); // File name downloadLink.download = filename; // Create a link to the file downloadLink.href = window.URL.createObjectURL(csvFile); // Hide download link downloadLink.style.display = "none"; // Add the link to DOM document.body.appendChild(downloadLink); // Click download link downloadLink.click(); } function exportTableToCSV(filename,table) { var csv = []; var rows = document.querySelectorAll(table+" table tr"); for (var i = 0; i < rows.length; i++) { var row = [], cols = rows[i].querySelectorAll("td, th"); for (var j = 0; j < cols.length; j++) row.push(cols[j].innerText); csv.push(row.join(",")); } // Download CSV file downloadCSV(csv.join("\n"), filename); } </script> <!-- AJAX updates --> <script> /* herhaal elke 5s */ setInterval(function(){ajax();},5000); /* herhaal elke 1s -> tijd update*/ setInterval(function(){getTime();},1000) /* ajax functie*/ function ajax(){ //een nieuw XML request var xmlhttp = new XMLHttpRequest(); //data terug ven gettable.php xmlhttp.onreadystatechange = function(){ //data is correct ontvangen -> code 200 OK if (this.readyState == 4 && this.status == 200) { var inString = this.responseText; //krijg response var splitter = inString.split(","); //split response bij , /* verander tabellen naar nieuwste data */ document.getElementById("ajax").innerHTML = splitter[0]; document.getElementById("ajax2").innerHTML = splitter[1]; } }; xmlhttp.open("GET", "gettable.php", true); //start GET request naar gettable.php xmlhttp.send(); //stuur request } </script> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- styling --> <link rel="stylesheet" type="text/css" href="css/viewgame.css"> <title>Game viewer</title> </head> <body> <!-- menu --> <div class="menu"> <a href="mainpage.php">Home</a> <a href="newgame.php">Nieuw spel</a> <a href="mygames.php">Mijn spellen</a> <a href="viewgame.php">Game viewer</a> <a href="logout.php">Log-out</a> </div> <!-- main content --> <div class="main"> <!-- selecting current game (hidden)--> <div id="gameselect"> <form method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" onsubmit="closeSelect()"> <p>GameID</p> <input type="number" name="gid" placeholder="gekregen van admin"/> <input type="submit" value="Maak actief"/> </form> </div> <!-- viewing game data --> <div id="gamedata"> <h1>Actief spel: <?php echo $chrow['spelnaam'];?> <small>id: <?php echo $chrow['gameID'];?></small></h1> <!-- show players in current game --> <div id="spelertabel"> <h2>Spelers</h2> <table> <tr> <th>SpelerID</th> <th>Spelernaam</th> <th>Team</th> <th>Opties</th> </tr> <?php $getSpelers = mysqli_query($conn,"SELECT * FROM players WHERE gameID = '".$chrow['gameID']."'"); while($row = mysqli_fetch_assoc($getSpelers)){ echo '<tr>'; echo '<td>'.$row['id'].'</td>'; echo '<td>'.$row['spelernaam'].'</td>'; echo '<td>'.$row['team'].'</td>'; echo '<td><form method="POST" action="'.$_SERVER["PHP_SELF"].'"><input type="hidden" name="delete" value="'.$row['spelernaam'].'"/><input type="submit" value="Verwijder"/></form></td>'; echo '</tr>'; } ?> </table> <!-- global table function buttons --> <button onclick="exportTableToCSV('spelers.csv','div#spelertabel')">Exporteer tabel</button> <button id="openbutton" onclick="openSpelers()">Voeg spelers toe</button> </div> <!-- popup form for adding players--> <div id="spelers"> <form method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" onsubmit="closeSpelers()"> <h2>Voeg spelers toe</h2> <div id="spelerform"> <input type="text" name="spelernaam[]" placeholder="Geef naam van speler"> <select name="team[]" size="1"> <option value="ROOD">Team rood</option> <option value="BLAUW">Team blauw</option> </select> </div> <input type="submit" value="Voeg toe"/> </form> <button onclick="add_fields()">Speler +</button> <button onclick="closeSpelers(); reset_field();">Sluit</button> </div> <!-- table with game log --> <div id="gametabel"> <h2>Event logger</h2> <p id="UTC"></p> <!-- execute after p--> <script>getTime();</script> <table id="ajax"> <tr> <th>Naam</th> <th>Team</th> <th>Type event</th> <th>Gedood door</th> <th>Tijd (UTC+1)</th> </tr> <?php $queryx = "SELECT * FROM data"; $resultx = mysqli_query($conn,$queryx); while($rows=mysqli_fetch_assoc($resultx)){ echo "<tr>"; $queryq = "SELECT spelernaam FROM players WHERE id = '".$rows['name']."'"; $resultq = mysqli_query($conn,$queryq); $rowq = mysqli_fetch_assoc($resultq); echo "<td>".$rowq['spelernaam']."</td>"; echo "<td>".$rows['team']."</td>"; echo "<td>".$rows['type']."</td>"; $queryf = "SELECT spelernaam FROM players WHERE id = '".$rows['kby']."'"; $resultf = mysqli_query($conn,$queryf); $rowf = mysqli_fetch_assoc($resultf); echo "<td>".$rowf['spelernaam']."</td>"; echo "<td>".$rows['time']."</td>"; echo "</tr>"; } ?> </table> <!-- global table function buttons --> <button onclick="exportTableToCSV('events.csv','div#gametabel')">Exporteer tabel</button> <form id="clearlink" method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" onsubmit="ajax()"> <input type="hidden" name="game"> <input type="submit" value="Reset data"> </form> <span>Gamedata wordt verwijderd bij het wisselen van spel</span> </div> <!-- linked players table --> <div id="linktabel"> <h2>Speler link</h2> <table id="ajax2"> <tr> <th>Naam</th> <th>SpelerID</th> <th>IP-adres</th> </tr> <?php $queryx = "SELECT * FROM ip"; $resultx = mysqli_query($conn,$queryx); while($rows=mysqli_fetch_assoc($resultx)){ echo "<tr>"; $queryq = "SELECT spelernaam FROM players WHERE id = '".$rows['spelerID']."'"; $resultq = mysqli_query($conn,$queryq); $rowq = mysqli_fetch_assoc($resultq); echo "<td>".$rowq['spelernaam']."</td>"; echo "<td>".$rows['spelerID']."</td>"; echo "<td>".$rows['IP']."</td>"; echo "</tr>"; } ?> </table> <!-- global table function buttons --> <button onclick="exportTableToCSV('IP_link.csv','div#linktabel')">Exporteer tabel</button> <form id="clearlink" method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" onsubmit="ajax()"> <input type="hidden" name="link"> <input type="submit" value="Reset link"> </form> <span>Link wordt opgeheven bij het wisselen van spel</span> </div> <!-- clear current game--> <form id="anderspel" method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>"> <input type="hidden" name="clear"> <input type="submit" value="Ander spel"> </form> </div> <!-- switching between selecting and vieuwing game --> <?php if($rcount == 0){ echo "<script>closeData(); openSelect();</script>";} else{ echo "<script>closeSelect(); openData();</script>";} ?> </div> </body> </html> |
getData.php
Als er op de 'tagger' gekozen werd voor de auto-configuratie zal de microcontroller met behulp van de ESP8266-01 module een request sturen naar deze pagina. Als het IP-adres van de module al gelinkt is aan een speler speler van het actieve spel zal de pagina data terugsturen gelinkt aan de gelinkte speler. Anders wordt het IP-adres gelinkt aan een vrije speler van het actieve spel.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 | <?php require_once('../dbconfig.php'); //include database connection van parent folder $remote_IP = "'".$_SERVER['REMOTE_ADDR']."'"; //krijg incomend ip /* getting current game id */ $game = mysqli_query($conn,"SELECT gameID FROM currentgame"); $g_row = mysqli_fetch_assoc($game); $gameID = "'".$g_row['gameID']."'"; $check = mysqli_query($conn,"SELECT * FROM ip WHERE IP = $remote_IP"); if(mysqli_num_rows($check) == 0){ //link nieuw IP /* find an unlinked players*/ $fPlayer = mysqli_query($conn,"SELECT id,team FROM players WHERE gameID = ".$GLOBALS['gameID']." and linked = '0'"); if(mysqli_num_rows($fPlayer) != 0){ $p_row = mysqli_fetch_assoc($fPlayer); $playerID = $p_row['id']; $firstid = "'".$p_row['id']."'"; $strteam = "'".$p_row['team']."'"; if($p_row['team'] == "ROOD"){ $intteam = 1; } else{ $intteam = 2; } /* maak speler linked */ $setLinked = mysqli_query($conn,"UPDATE players SET linked = '1' WHERE id = $firstid"); /* Zet ip link in ip table */ $linkIP = mysqli_query($conn,"INSERT INTO ip (IP,spelerID) VALUES ($remote_IP,$firstid)"); /* verzamel alle data om door te sturen naar de esp01 module */ $data = mysqli_query($conn,"SELECT * FROM currentgame WHERE team = $strteam"); $d_row = mysqli_fetch_assoc($data); $ammo = $d_row['ammo']; $clips = $d_row['acount']; $health = $d_row['life']; switch ($d_row['gamemode']) { //krijg gamemode case 'TD': $gamemode = 1; break; case 'CF'; $gamemode = 2; break; case 'FA': $gamemode =3; break; default: $gamemode = 0; break; } $tijd = $d_row['tijd']; mysqli_close($conn); //stop verbinding met database echo ''.$playerID.','.$intteam.','.$ammo.','.$health.','.$gamemode.','.chr(10).''; //stuur alle data, eindig met linefeed } } else{ //geef data van bestaande link $ip_row = mysqli_fetch_assoc($check); $playerID = "'".$ip_row['spelerID']."'"; /* krijg team */ $gPlayer = mysqli_query($conn,"SELECT team FROM players WHERE id = $playerID"); $gp_row = mysqli_fetch_assoc($gPlayer); $strteam = "'".$gp_row['team']."'"; if($gp_row['team'] == "ROOD"){ $intteam = 1; } else{ $intteam = 2; } /* krijg alle data van team */ $data = mysqli_query($conn,"SELECT * FROM currentgame WHERE team = $strteam"); $d_row = mysqli_fetch_assoc($data); $ammo = $d_row['ammo']; $clips = $d_row['acount']; $health = $d_row['life']; switch ($d_row['gamemode']) { //krijg gamemode case 'TD': $gamemode = 1; break; case 'CF'; $gamemode = 2; break; case 'FA': $gamemode =3; break; default: $gamemode = 0; break; } $tijd = $d_row['tijd']; mysqli_close($conn); //stop connectie met database echo ''.$ip_row['spelerID'].','.$intteam.','.$ammo.','.$health.','.$gamemode.','.chr(10).''; //stuur alle data, eindig met linefeed } ?> |
regDead.php
Tijdens het spel stuurt de 'tagger' data naar de server bij speciale events. Momenteel is dat alleen als een speler wordt 'doodgeschoten'. De pagina regDead.php zet de ontvangen in de database samen met het tijdstip van het event. Later kan deze data gebruikt worden om grafieken en tabellen op te stellen.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <?php require_once("../dbconfig.php"); //include database connection van parent folder $name = "'".$_GET['N']."'"; //krijg naam -> spelerID van speler switch ($_GET['T']) { //kijk team na case 1: $team = 'ROOD'; break; case 2: $team = 'BLAUW'; break; default: $team = 'NONE'; break; } $type = "'".$_GET['Y']."'"; //krijg type van log -> momeneel alleen K(ill) $kby = "'".$_GET['K']."'"; //krijg 'moordenaar' /* zet alle data in de database */ $query = "INSERT INTO data(name,team,type,kby) VALUES($name,'".$team."',$type,$kby)"; $result = mysqli_query($conn,$query); ?> |