docCORRECTION Projets 1-5
download 
Plainte Transcription
CORRECTION Projets 1-5
CORRECTION Projets 1-5
Analyse du problème
RPC Nécessaires
Informations carte
● Informations village
● Login
● Logout
● Register
●
Détails RPC : getmap.php
getmap.php
Récupère la carte de jeu
Type : GET
Param : /
Output : tableau des cases de la carte, 8 lignes 10 colonnes
Chaque case contient le code couleur ou une chaîne vide
X,X,X,...,X|X,X,X,X,...
Détails RPC : gettown.php
gettown.php
Récupère les détails d'un village
Type : GET
Param : x : position horizontale,
y : position verticale
Output : texte contenant l'identité du joueur
Détails RPC : login.php
login.php
Connexion d'un joueur
Type : POST
Param : usr : nom de l'utilisateur
pass : mot de passe
Output : Texte : "OK" si authentification correcte, "ERR" sinon.
Détails RPC : logout.php
logout.php
Type : GET
Param : /
Output : /
Déconnexion
Détails RPC : register.php
register.php
Création d'un nouveau compte
Type : POST
Param : usr : nom de l'utilisateur
pass : mot de passe
Output : Texte : "OK" si compte créé, "ERR" sinon
Fichier HTML
●
●
loginscr
●
loginform
●
registerform
gamescr
●
menubar
●
mapscr
●
townscr
Fichier HTML
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf8">
<title>Test tiles</title>
<link rel="stylesheet" href="css/styles.css" type="text/css">
<script src="js/common.js"></script>
<script src="js/hexgame.js"></script>
<script>
window.onload=init;
</script>
</head>
<body>
<div id="loginscr">
<div id="loginform">
<table>
<tr>
<td>Login</td>
<td><input type="text" id="usr" /></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" id="pass" /></td>
</tr>
<tr>
<td></td>
<td><input type="button" id="loginbtn" value="Login" />
<input type="button" id="registerbtn" value="Register" /></td>
</tr>
</table>
</div>
<div id="registerform">
<div id="newerror"></div>
<table>
<tr>
<td>Login</td>
<td><input type="text" id="newusr" /></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" id="newpass" /></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" id="newpass2" /></td>
</tr>
<tr>
<td></td>
<td><input type="button" id="createbtn" value="Create" />
<input type="button" id="regcancelbtn" value="Cancel" /></td
</tr>
</table>
</div>
</div>
<div id="gamescr">
<div id="menubar">
<input type="button" id="retbtn" value="Return" />
<input type="button" id="logoutbtn" value="Logout" />
</div>
<div id="mapscr">
<div id="map">
</div>
</div>
<div id="townscr">
Village : (<span id="townx"></span>,<span id="towny"></span>)
<br />
Propriétaire : <span id="townowner"></span>
</div>
</div>
</body>
</html>
CSS
#map {
position: relative;
border: solid 2px;
overflow: hidden;
width: 775px;
height: 731px;
background: #808080;
}
Javascript : Init
function init() {
loginscr();
$("loginbtn").onclick=function() { login(); };
$("registerbtn").onclick=function() { registerscr(); };
$("createbtn").onclick=function() { register(); };
$("regcancelbtn").onclick=function() { loginscr(); };
$("retbtn").onclick=function() { mapscr(); };
$("logoutbtn").onclick=function() { logout(); };
}
Javascript : loginscr
function loginscr() {
hide("gamescr");
show("loginscr");
show("loginform");
hide("registerform");
$("usr").value="";
$("pass").value="";
}
Javascript : mapscr()
function mapscr() {
show("gamescr");
show("mapscr");
hide("townscr");
hide("retbtn");
hide("loginscr");
refreshmap();
}
Javascript : registerscr
function registerscr() {
hide("gamescr");
show("loginscr");
hide("loginform");
show("registerform");
$("newusr").value=$("usr").value;
$("newpass").value="";
$("newpass2").value="";
$("newerror").innerHTML="";
}
Javascript : townscr()
function townscr(x,y) {
show("gamescr");
hide("mapscr");
show("townscr");
show("retbtn");
hide("loginscr");
$("townx").innerHTML=x;
$("towny").innerHTML=y;
$("townowner").innerHTML="";
gettown(x,y);
}
Javascript : refreshmap()
function refreshmap() {
var xhr=getXHR();
$("map").innerHTML="";
xhr.onreadystatechange = function() {
if (xhr.readyState==4) {
if (xhr.status==200) {
processmap(xhr.responseText);
} } };
xhr.open("GET","rpc/getmap.php");
xhr.send(null);
}
Javascript : processmap() (1/2)
function processmap(str) {
var i,j;
var rows,cols;
var m=$("map");
var h;
rows=str.split("|");
for(i=0;i<8;i++) {
cols=rows[i].split(",");
for(j=0;j<10;j++) {
Javascript : processmap() (2/2)
h=document.createElement("div");
h.style.height="86px";
h.style.width="100px";
h.style.top=((j%2)*43+i*86)+"px";
h.style.left=(j*75)+"px";
h.style.backgroundImage=
"url('img/hex"+cols[j]+".png')";
h.style.position="absolute";
h.onclick=genhexcb(j,i);
m.appendChild(h);
}
}
}
Javascript : genhexcb()
function genhexcb(x,y) {
return function() { townscr(x,y); };
}
Javascript : gettown()
function gettown(x,y) {
var xhr=getXHR();
var param = "x="+x;
param=param+"&y="+y;
xhr.onreadystatechange = function() {
if (xhr.readyState==4) {
if (xhr.status==200) {
$("townowner").innerHTML=xhr.responseText;
}
}
};
xhr.open("GET","rpc/gettown.php?"+param);
xhr.send(null);
}
Javascript : logout()
function logout() {
loginscr();
var xhr=getXHR();
xhr.open("GET","rpc/logout.php");
xhr.send(null);
}
Javascript : login()
function login() {
var xhr=getXHR();
var param = "usr="+encodeURIComponent($("usr").value);
param=param+"&pass="+encodeURIComponent($("pass").value);
xhr.onreadystatechange = function() {
if (xhr.readyState==4) {
if (xhr.status==200) {
processlogin(xhr.responseText);
}
}
};
xhr.open("POST","rpc/login.php");
xhr.setRequestHeader("ContentType","application/xwwwform
urlencoded");
xhr.send(param);
}
Javascript : processlogin()
function processlogin(str) {
if (str=="OK") {
mapscr();
} else {
alert("Invalid Login/password");
}
}
Javascript : register() (1/2)
function register() {
var newpass=$("newpass").value;
var newpass2=$("newpass2").value;
if (newpass != newpass2) {
$("newerror").innerHTML=
"Error : passwords don't match";
return ;
}
Javascript : register() (2/2)
var xhr=getXHR();
var param = "usr="+encodeURIComponent($("newusr").value);
param=param+"&pass="+encodeURIComponent(newpass);
xhr.onreadystatechange = function() {
if (xhr.readyState==4) {
if (xhr.status==200) {
processregister(xhr.responseText);
}
}
};
xhr.open("POST","rpc/register.php");
xhr.setRequestHeader("ContentType","application/xwwwform
urlencoded");
xhr.send(param);
}
Javascript : processregister()
function processregister(str) {
if (str=="OK") {
mapscr();
} else {
$("newerror").innerHTML="Impossible to create account (already exists ?)
}
}
RPC : getmap.php (1/2)
<?php
session_start();
if (!$_SESSION["uid"]) {
exit();
}
$dbh=new PDO("sqlite:../data/db.sqlite");
$stm=$dbh>prepare("SELECT y,color
FROM map
INNER JOIN players ON (player=plid)
ORDER BY y,x");
$stm>execute();
$yy=1; $map="";
$f=1;
RPC : getmap.php (2/2)
while($row=$stm>fetch()) {
$y=$row["y"];
if ($f==0) { /* Separators except before first hex */
if ($y == $yy) { /* Separator is "," if same row */
$map .= ",";
} else {
$map .= "|";
$yy=$y;
}
} else { /* First line, first hex, no separator */
$f=0;
$yy=$y;
}
$map .= $row["color"];
}
echo $map;
?>
RPC : gettown.php (1/2)
<?php
session_start();
if (!$_SESSION["uid"]) {
exit();
}
$x=$_GET["x"];
$y=$_GET["y"];
$dbh=new PDO("sqlite:../data/db.sqlite");
$stm=$dbh>prepare("SELECT login,color
FROM map
INNER JOIN players ON (player=plid)
LEFT OUTER JOIN usr ON (usr=id)
WHERE x= ? AND y= ?");
$stm>execute(array($x,$y));
RPC : gettown.php (2/2)
if ($row=$stm>fetch()) {
if ($row["login"]) {
echo $row["login"];
} else {
if ($row["color"] == "") {
echo "Not colonized";
} else {
echo "NPC";
}
}
}
?>
RPC : login.php (1/2)
<?php
session_start();
$_SESSION["login"]="";
$_SESSION["uid"]=0;
$dbh=new PDO("sqlite:../data/db.sqlite");
$usr=$_POST["usr"];
$pass=$_POST["pass"];
$stm=$dbh>prepare("SELECT id,passwd FROM usr WHERE login= ?");
$stm>execute(array($usr));
RPC : login.php (2/2)
if ($row=$stm>fetch()) {
if ($pass == $row["passwd"]) {
echo "OK";
$_SESSION["login"]=$usr;
$_SESSION["uid"]=$row["id"];
} else {
echo "ERR";
}
} else {
echo "ERR"; /* User not found */
}
?>
RPC : logout.php
<?php
session_start();
$_SESSION["login"]="";
$_SESSION["uid"]=0;
?>
RPC : register.php (1/3)
<?php
session_start();
$_SESSION["login"]="";
$_SESSION["uid"]=0;
$dbh=new PDO("sqlite:../data/db.sqlite");
$usr=$_POST["usr"];
$pass=$_POST["pass"];
if ($usr=="" || $pass=="") {
echo "ERR";
}
RPC : register.php (2/3)
$stm=$dbh>prepare("SELECT id FROM usr WHERE login= ?");
$stm>execute(array($usr));
if ($row=$stm>fetch()) {
echo "ERR";
exit();
}
$stm2=$dbh>prepare("INSERT INTO usr(login,passwd) VALUES ( ? , ? )");
$stm2>execute(array($usr,$pass));
RPC : register.php (3/3)
$stm>execute(array($usr));
if ($row=$stm>fetch()) {
echo "OK";
$_SESSION["login"]=$usr;
$_SESSION["uid"]=$row["id"];
} else {
echo "ERR"; /* User not created */
} ?>
