Compare commits
No commits in common. "f9a5ffbe45321b4a69d3b10542f60f32c0d0d63a" and "aaf755a8715b927b1f04b946dcc06fa2af33123c" have entirely different histories.
f9a5ffbe45
...
aaf755a871
64 changed files with 601 additions and 1095 deletions
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 432 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 99 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 82 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 192 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 68 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 370 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 87 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 41 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 605 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 790 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 115 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 231 KiB |
|
Before Width: | Height: | Size: 520 KiB After Width: | Height: | Size: 520 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 248 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 818 KiB |
|
Before Width: | Height: | Size: 1.3 MiB After Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 504 B |
Binary file not shown.
|
Before Width: | Height: | Size: 7.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 81 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 338 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 959 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 36 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 48 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB |
|
|
@ -1,11 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<title>FakeBook</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<a href="https://airinsa.insat.fr"><img src="hairinsa.png" width="100%"></a>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.7 MiB |
|
|
@ -1,19 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<title>Utube</title>
|
|
||||||
<style>
|
|
||||||
iframe {
|
|
||||||
display:inline-block;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<font color="white">UTube vous propose sa sélection des meilleures vidéos !</font>
|
|
||||||
<iframe width="100%" type="text/html" src="https://www.youtube.com/embed/WiiM0jgWrC4" frameborder="0" allowfullscreen></iframe>
|
|
||||||
<iframe width="100%" type="text/html" src="https://www.youtube.com/embed/rgEuqSmdW0Q" frameborder="0" allowfullscreen></iframe>
|
|
||||||
<iframe width="100%" type="text/html" src="https://www.youtube.com/embed/l0qvxPPISuY" frameborder="0" allowfullscreen></iframe>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,17 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<title>Free Vbucks</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<img src="free_vbucks.jpeg" width="100%" id="freevbucks">
|
|
||||||
<img src="rickroll.gif" width="100%" id="rr" style="display:none">
|
|
||||||
<script>
|
|
||||||
document.getElementById("freevbucks").addEventListener("click", (e) => {
|
|
||||||
document.getElementById("rr").style.display = "block"
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 49 KiB |
|
|
@ -1,133 +0,0 @@
|
||||||
html, body{
|
|
||||||
margin: 0px;
|
|
||||||
padding: 0px;
|
|
||||||
background-color: #2b2c2e;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
#canvas{
|
|
||||||
max-height: 100vh;
|
|
||||||
max-width: 100vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
#phoneContainer.hidden{
|
|
||||||
position: absolute;
|
|
||||||
right: 20px;
|
|
||||||
top: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#phoneContainer.visible{
|
|
||||||
position: absolute;
|
|
||||||
right: 20px;
|
|
||||||
bottom: 5%;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#phoneDiv{
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
#phone{
|
|
||||||
width: 200px;
|
|
||||||
}
|
|
||||||
#phoneScreen{
|
|
||||||
background-color: #322b2a;
|
|
||||||
position: absolute;
|
|
||||||
left: 7%;
|
|
||||||
top: 12%;
|
|
||||||
right: 7%;
|
|
||||||
bottom: 13%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#chatHeader{
|
|
||||||
height: 10%;
|
|
||||||
width: 100%;
|
|
||||||
border-bottom: 1px solid black;
|
|
||||||
text-align: center;
|
|
||||||
color: white;
|
|
||||||
line-height: 7%;
|
|
||||||
padding: 0px;
|
|
||||||
overflow: hidden;
|
|
||||||
font-weight: bold;
|
|
||||||
background-color: #232120 ;
|
|
||||||
}
|
|
||||||
|
|
||||||
#chatHeader > p{
|
|
||||||
line-height: 10%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#chatMessages{
|
|
||||||
height: 80%;
|
|
||||||
width: 100%;
|
|
||||||
overflow-y: scroll;
|
|
||||||
overflow-x: hidden;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
#chatMessages::-webkit-scrollbar{
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#chatInputDiv{
|
|
||||||
height: 10%;
|
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#chatInput{
|
|
||||||
width: 90%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
appearance: none;
|
|
||||||
background-color: transparent;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid black;
|
|
||||||
color: white;
|
|
||||||
padding-left: 10px;
|
|
||||||
height: 85%;
|
|
||||||
margin-bottom: 15%;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.message{
|
|
||||||
color: white;
|
|
||||||
font-family: sans-serif;
|
|
||||||
margin: 3%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.messageTitle{
|
|
||||||
font-size: 75%;
|
|
||||||
margin: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.messageContent{
|
|
||||||
margin: 0px;
|
|
||||||
font-size: 60%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.messageImage{
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#content {
|
|
||||||
height:90%;
|
|
||||||
width:100%;
|
|
||||||
background-image: url("../assets/phone/fond_ecran.jpeg");
|
|
||||||
background-size: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
background-color: rgba(0,0,0, 0.7);
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
padding: 5px;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin: 3.5px;
|
|
||||||
margin-right: 0;
|
|
||||||
display: inline-block;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
@ -2,56 +2,16 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<script type="text/javascript" src="./js/sound.js"></script>
|
<script type="text/javascript" src="./js/sound.js"></script>
|
||||||
<script type="text/javascript" src="./js/cookies.js"></script>
|
|
||||||
<script type="text/javascript" src="./js/phone.js"></script>
|
|
||||||
<script type="text/javascript" src="./js/class.js"></script>
|
<script type="text/javascript" src="./js/class.js"></script>
|
||||||
|
<script type="text/javascript" src="./js/objects.js"></script>
|
||||||
<script type="text/javascript" src="./js/render.js"></script>
|
<script type="text/javascript" src="./js/render.js"></script>
|
||||||
<script type="text/javascript" src="./js/input.js"></script>
|
<script type="text/javascript" src="./js/input.js"></script>
|
||||||
<script type="text/javascript" src="./js/network.js"></script>
|
<script type="text/javascript" src="./js/network.js"></script>
|
||||||
<script type="text/javascript" src="./js/leaderboard.js"></script>
|
<script type="text/javascript" src="./js/leaderboard.js"></script>
|
||||||
<script type="text/javascript" src="./js/global.js" defer></script>
|
|
||||||
<script type="text/javascript" src="./js/objects.js" defer></script>
|
|
||||||
<script type="text/javascript" src="./js/game.js" defer></script>
|
<script type="text/javascript" src="./js/game.js" defer></script>
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/game.css">
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<canvas width="800" height="800" id="canvas"></canvas>
|
<canvas width="800" height="800" id="canvas" style="border: 1px;"></canvas>
|
||||||
|
|
||||||
<div id="phoneContainer" class="hidden">
|
|
||||||
<div id="phoneDiv">
|
|
||||||
<map name="map_retour_menu">
|
|
||||||
<area
|
|
||||||
shape="circle"
|
|
||||||
coords="100,380,17"
|
|
||||||
style="cursor:pointer;"
|
|
||||||
id="retour_menu"
|
|
||||||
border="5px" />
|
|
||||||
</map>
|
|
||||||
<img id="phone" src="assets/phone.png" alt="Phone" usemap="#map_retour_menu">
|
|
||||||
<div id="phoneScreen">
|
|
||||||
<div id="chatHeader">
|
|
||||||
<p id ="TitlePage"></p>
|
|
||||||
</div>
|
|
||||||
<div id="chatMessages">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div id="content">
|
|
||||||
<img src="./assets/phone/concord.png" class="icon" id="appli-concord">
|
|
||||||
<img src="./assets/logo.png" class="icon" id="appli-gta6">
|
|
||||||
<img src="./assets/phone/vbucks.webp" class="icon" id="appli-vbuks">
|
|
||||||
<img src="./assets/phone/facebook.png" class="icon" id="appli-fb">
|
|
||||||
<img src="./assets/phone/utube.png" class="icon" id="appli-utube">
|
|
||||||
<img src="./assets/phone/gogole.png" class="icon" id="appli-goo">
|
|
||||||
</div>
|
|
||||||
<iframe id="webview" style="overflow: hidden;"></iframe>
|
|
||||||
<div id="chatInputDiv">
|
|
||||||
<input type="text" placeholder="Ecrivez un message ici" id="chatInput" onkeydown="phone.keyPress(this)">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,24 +1,22 @@
|
||||||
|
let mapWidth = 210.;
|
||||||
|
let mapHeith = 100.;
|
||||||
const playerSize = 50.;
|
const playerSize = 50.;
|
||||||
const carSize = 40.;
|
const carSize = 40.;
|
||||||
const playerSpeed=.2;
|
const playerSpeed=.2;
|
||||||
const PNJSpeed=.02;
|
|
||||||
const bulletSpeed=playerSpeed*2;
|
const bulletSpeed=playerSpeed*2;
|
||||||
const halfSqrtTwo=0.70710678118;
|
const halfSqrtTwo=0.70710678118;
|
||||||
const defaulthealth=10;
|
const defaulthealth=10.;
|
||||||
const portalSize=40;
|
|
||||||
const affPortal = true;
|
|
||||||
|
|
||||||
class Player
|
class Player
|
||||||
{
|
{
|
||||||
constructor (id,x,y,z,name,dir)
|
constructor (id,x,y,name, dir)
|
||||||
{
|
{
|
||||||
this.name=name;
|
this.name=name;
|
||||||
this.x=x;
|
this.x=x;
|
||||||
this.y=y;
|
this.y=y;
|
||||||
this.z=z;//correspond to the map. Ex: 0=>main; 1=>arena
|
|
||||||
this.id=id;
|
this.id=id;
|
||||||
this.visibleDir=1;
|
this.visibleDir=1;
|
||||||
this.dir=dir;//0=stand Still
|
this.dir=dir;//0=standStill
|
||||||
//1=North
|
//1=North
|
||||||
//2=North-East
|
//2=North-East
|
||||||
//3=East
|
//3=East
|
||||||
|
|
@ -33,17 +31,28 @@ class Player
|
||||||
this.death=0;
|
this.death=0;
|
||||||
}
|
}
|
||||||
|
|
||||||
takeDamage(amount,killerId)
|
takeDamage(amount,killerId,network)
|
||||||
{
|
{
|
||||||
this.health-=amount;
|
this.health-=amount;
|
||||||
if(this.health<=0)
|
if(this.health<=0)
|
||||||
{
|
{
|
||||||
this.death++;
|
this.death++;
|
||||||
this.health=defaulthealth;
|
network.died(this.id,killerId);
|
||||||
|
this.health=10;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
net.died(this.id,killerId);
|
/*retrieveServerInfo(id,x,y,dir)
|
||||||
}
|
{
|
||||||
|
if(this.id==id)
|
||||||
|
{
|
||||||
|
this.x=x;
|
||||||
|
this.y=y;
|
||||||
|
this.dir=dir;
|
||||||
|
if(dir!=0)
|
||||||
|
this.visibleDir=dir;
|
||||||
}
|
}
|
||||||
|
}*/
|
||||||
|
|
||||||
changeDirection(newDirection){
|
changeDirection(newDirection){
|
||||||
this.dir = newDirection;
|
this.dir = newDirection;
|
||||||
|
|
@ -74,7 +83,7 @@ class Player
|
||||||
this.y += dy*dt;
|
this.y += dy*dt;
|
||||||
|
|
||||||
squares.forEach(square => {
|
squares.forEach(square => {
|
||||||
if(square.collide(this.x,this.y,this.z))
|
if(square.collide(this))
|
||||||
{
|
{
|
||||||
this.x-=dx*dt;
|
this.x-=dx*dt;
|
||||||
this.y-=dy*dt;
|
this.y-=dy*dt;
|
||||||
|
|
@ -84,7 +93,7 @@ class Player
|
||||||
});
|
});
|
||||||
|
|
||||||
circles.forEach(circle => {
|
circles.forEach(circle => {
|
||||||
if(circle.collide(this.x,this.y,this.z))
|
if(circle.collide(this))
|
||||||
{
|
{
|
||||||
this.x-=dx*dt;
|
this.x-=dx*dt;
|
||||||
this.y-=dy*dt;
|
this.y-=dy*dt;
|
||||||
|
|
@ -102,17 +111,15 @@ class Player
|
||||||
|
|
||||||
class Bullet
|
class Bullet
|
||||||
{
|
{
|
||||||
constructor (x,y,z,dx,dy,id)
|
constructor (x,y,dx,dy,id, sound)
|
||||||
{
|
{
|
||||||
if(z==player.z)
|
sound.shoot();
|
||||||
bulletSound.play();
|
|
||||||
this.x=x;
|
this.x=x;
|
||||||
this.y=y;
|
this.y=y;
|
||||||
this.z=z;
|
|
||||||
this.dx=dx;
|
this.dx=dx;
|
||||||
this.dy=dy;
|
this.dy=dy;
|
||||||
this.deleted=(z<0);
|
this.deleted=false;
|
||||||
this.shooterId=id;
|
this.parentId=id;
|
||||||
}
|
}
|
||||||
|
|
||||||
update(dt)
|
update(dt)
|
||||||
|
|
@ -124,75 +131,76 @@ class Bullet
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
checkCollisions(squares,circles)//only the client's player /!\
|
checkCollisions(player,squares,circles,network)//only the client's player /!\
|
||||||
{
|
{
|
||||||
if(this.deleted)
|
if(!this.deleted)
|
||||||
|
{
|
||||||
|
if(player!=null && player.id!=this.parentId && Math.sqrt((player.x-this.x)**2+(player.y-this.y)**2)<playerSize/2)
|
||||||
|
{
|
||||||
|
player.takeDamage(1,this.parentId,network);
|
||||||
|
this.deleted=true;
|
||||||
return;
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if(player!=null && player.z==this.z && player.id!=this.shooterId && Math.sqrt((player.x-this.x)**2+(player.y-this.y)**2)<playerSize/2)
|
|
||||||
{
|
|
||||||
player.takeDamage(1,this.shooterId);
|
|
||||||
this.deleted=true;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
squares.forEach((square) => {
|
squares.forEach((square) => {
|
||||||
if(square.collide(this.x,this.y,this.z))
|
if(square.collide(this))
|
||||||
{
|
{
|
||||||
this.deleted=true;
|
this.deleted=true;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
circles.forEach((circle) => {
|
circles.forEach((circle) => {
|
||||||
if(circle.collide(this.x,this.y,this.z))
|
if(circle.collide(this))
|
||||||
{
|
{
|
||||||
this.deleted=true;
|
this.deleted=true;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
class Square
|
class Square
|
||||||
{
|
{
|
||||||
constructor(x,y,z,width,heigth)
|
constructor(x,y,width,heigth)
|
||||||
{
|
{
|
||||||
this.x=x;
|
this.x=x;
|
||||||
this.y=y;
|
this.y=y;
|
||||||
this.z=z;
|
|
||||||
this.w=width;
|
this.w=width;
|
||||||
this.h=heigth;
|
this.h=heigth;
|
||||||
}
|
}
|
||||||
|
|
||||||
collide(x,y,z)
|
collide(point)
|
||||||
{
|
{
|
||||||
return this.z==z && this.x<=x && x<=this.x+this.w && this.y<=y && y<=this.y+this.h;
|
return (this.x<=point.x && point.x<=this.x+this.w && this.y<=point.y && point.y<=this.y+this.h);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class Circle
|
class Circle
|
||||||
{
|
{
|
||||||
constructor(x,y,z,radius)
|
constructor(x,y,radius)
|
||||||
{
|
{
|
||||||
this.x=x;
|
this.x=x;
|
||||||
this.y=y;
|
this.y=y;
|
||||||
this.z=z;
|
|
||||||
this.r=radius;
|
this.r=radius;
|
||||||
}
|
}
|
||||||
|
|
||||||
collide(x,y,z)
|
collide(point)
|
||||||
{
|
{
|
||||||
return this.z==z && (x-this.x)**2+(y-this.y)**2 <= this.r**2;
|
return ((point.x-this.x)**2+(point.y-this.y)**2<=this.r**2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class Car
|
class Car
|
||||||
{
|
{
|
||||||
constructor(type, spawn)
|
constructor(Renderer, type, spawn, sound)
|
||||||
{
|
{
|
||||||
this.type=type; // 0 circule vers le haut
|
this.sound=sound
|
||||||
|
this.type=type // 0 circule vers le haut
|
||||||
// 1 circule vers le bas
|
// 1 circule vers le bas
|
||||||
this.z=0;
|
|
||||||
if(this.type == 1) { //vers le bas
|
if(this.type == 1) { //vers le bas
|
||||||
this.x=1247;
|
this.x=1247;
|
||||||
this.y=-40;
|
this.y=-40;
|
||||||
|
|
@ -207,35 +215,34 @@ class Car
|
||||||
|
|
||||||
this.drift=0;
|
this.drift=0;
|
||||||
|
|
||||||
this.spawn=spawn;
|
this.spawn=spawn
|
||||||
|
|
||||||
this.tick=0;
|
this.tick=0;
|
||||||
|
this.Renderer=Renderer;
|
||||||
|
//1247,-40
|
||||||
|
//947,1000
|
||||||
}
|
}
|
||||||
|
|
||||||
collide(x,y,z)
|
collide(x,y)
|
||||||
{
|
{
|
||||||
if(this.z!=z) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
let cx=this.x-carSize/2;
|
let cx=this.x-carSize/2;
|
||||||
let cy=this.y-carSize/2;
|
let cy=this.y-carSize/2;
|
||||||
let collide = (cx<=x && x<=cx+carSize && cy<=y && y<=cy+carSize);
|
let collide = (cx<=x && x<=cx+carSize && cy<=y && y<=cy+carSize);
|
||||||
if(collide) {
|
if(collide) {
|
||||||
driftSound.play()
|
this.sound.drift()
|
||||||
this.drift=1000;
|
this.drift=300;
|
||||||
}
|
}
|
||||||
return collide;
|
return collide
|
||||||
}
|
}
|
||||||
|
|
||||||
Update(dt)
|
Update()
|
||||||
{
|
{
|
||||||
if(this.tick==0 && (new Date()).getSeconds()%60==this.spawn) {
|
if(this.tick==0) {
|
||||||
this.tick=1;
|
if(new Date().getSeconds()%20==this.spawn) {
|
||||||
|
this.tick=1
|
||||||
}
|
}
|
||||||
|
}
|
||||||
if(this.tick>0) {
|
this.ChangeDirection()
|
||||||
this.ChangeDirection();
|
|
||||||
|
|
||||||
switch (this.dir) {
|
switch (this.dir) {
|
||||||
case 1:
|
case 1:
|
||||||
this.x=this.x+this.tick
|
this.x=this.x+this.tick
|
||||||
|
|
@ -251,10 +258,10 @@ class Car
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
if(this.drift > 0) {
|
if(this.drift > 0) {
|
||||||
this.drift-=dt;
|
this.Renderer.RenderCar(this.x,this.y, this.angle+90)
|
||||||
}else{
|
this.drift--
|
||||||
this.drift = 0;
|
} else {
|
||||||
}
|
this.Renderer.RenderCar(this.x,this.y, this.angle)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -320,9 +327,7 @@ class Car
|
||||||
this.dir=4
|
this.dir=4
|
||||||
this.angle=Math.PI/2
|
this.angle=Math.PI/2
|
||||||
} else if(this.y>1000) {
|
} else if(this.y>1000) {
|
||||||
if(this.drift > 0) {
|
//tp
|
||||||
this.drift--
|
|
||||||
} //tp
|
|
||||||
this.x=1247
|
this.x=1247
|
||||||
this.y=-40
|
this.y=-40
|
||||||
this.tick=0;
|
this.tick=0;
|
||||||
|
|
@ -378,105 +383,3 @@ class Car
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class PNJ{
|
|
||||||
constructor(x, y, z){
|
|
||||||
this.x=x;
|
|
||||||
this.y=y;
|
|
||||||
this.z=z;
|
|
||||||
this.dir=1;
|
|
||||||
}
|
|
||||||
|
|
||||||
checkCollisions(){
|
|
||||||
map0Squares.forEach((square) => {
|
|
||||||
if(square.collide(this.x,this.y,this.z))
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
circles.forEach((circle) => {
|
|
||||||
if(circle.collide(this.x,this.y,this.z))
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
changeDirection(){
|
|
||||||
let newDir = Math.floor(Math.random()*8);
|
|
||||||
if(newDir == this.dir){
|
|
||||||
newDir = (this.dir+3)%4+1;
|
|
||||||
}
|
|
||||||
this.dir = newDir;
|
|
||||||
}
|
|
||||||
|
|
||||||
update(dt)
|
|
||||||
{
|
|
||||||
if(this.z!=player.z){
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let dx,dy;
|
|
||||||
switch(this.dir)
|
|
||||||
{
|
|
||||||
case 1: dx=0.;dy=-PNJSpeed;break;
|
|
||||||
case 2: dx=halfSqrtTwo*PNJSpeed;dy=-halfSqrtTwo*PNJSpeed;break;
|
|
||||||
case 3: dx=PNJSpeed;dy=0.;break;
|
|
||||||
case 4: dx=halfSqrtTwo*PNJSpeed;dy=halfSqrtTwo*PNJSpeed;break;
|
|
||||||
case 5: dx=0.;dy=PNJSpeed;break;
|
|
||||||
case 6: dx=-halfSqrtTwo*PNJSpeed;dy=halfSqrtTwo*PNJSpeed;break;
|
|
||||||
case 7: dx=-PNJSpeed;dy=0.;break;
|
|
||||||
case 8: dx=-halfSqrtTwo*PNJSpeed;dy=-halfSqrtTwo*PNJSpeed;break;
|
|
||||||
default: dx=0;dy=0;break;
|
|
||||||
}
|
|
||||||
this.x+=dx*dt;
|
|
||||||
this.y+=dy*dt;
|
|
||||||
if(this.checkCollisions()){
|
|
||||||
this.x -= dx*dt;
|
|
||||||
this.y -= dy*dt;
|
|
||||||
this.changeDirection();
|
|
||||||
}
|
|
||||||
|
|
||||||
if(Math.random()<=0.001){
|
|
||||||
this.changeDirection();
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class Portal
|
|
||||||
{
|
|
||||||
constructor(xIn,yIn,zIn,xOut,yOut,zOut)
|
|
||||||
{
|
|
||||||
this.in={x:xIn,y:yIn,z:zIn};
|
|
||||||
this.out={x:xOut,y:yOut,z:zOut};
|
|
||||||
}
|
|
||||||
|
|
||||||
update()
|
|
||||||
{
|
|
||||||
if(player.z==this.in.z && player.x>this.in.x && player.x<this.in.x+portalSize && player.y>this.in.y && player.y<this.in.y+portalSize)
|
|
||||||
{
|
|
||||||
player.z=this.out.z;
|
|
||||||
player.x=this.out.x;
|
|
||||||
player.y=this.out.y;
|
|
||||||
net.update(player);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class Game_Map
|
|
||||||
{
|
|
||||||
constructor(portalsOut,z,squares,circles) // portalsIn/Out : portal teleport In/Out; z: idDimension
|
|
||||||
{
|
|
||||||
this.portalsOut=portalsOut;
|
|
||||||
portalsOut.forEach((p) => {if(p.in.z!=z){console.log("WRONG PORTAL DEFINITION FOR MAP",z,", portal :",p);}});
|
|
||||||
this.z=z;
|
|
||||||
this.squares=squares;
|
|
||||||
this.circles=circles;
|
|
||||||
}
|
|
||||||
|
|
||||||
update()
|
|
||||||
{
|
|
||||||
this.portalsOut.forEach((p)=>p.update());
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,10 +0,0 @@
|
||||||
function getCookie(name) {//Code from OpenClassroom
|
|
||||||
nom = name + "=";
|
|
||||||
var liste = document.cookie.split (';');
|
|
||||||
for (var i = 0; i < liste.length; i++) {
|
|
||||||
var c = liste[i];
|
|
||||||
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
|
|
||||||
if (c.indexOf(nom) == 0) return c.substring(nom.length, c.length);
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
@ -1,43 +1,193 @@
|
||||||
let dt = 0;
|
function CookiePseudo() {
|
||||||
let currentTime = new Date();
|
nom = "pseudo=";
|
||||||
function game() {
|
var liste = document. cookie. split (';');
|
||||||
if(player==null)
|
for (var i = 0; i < liste.length; i++) {
|
||||||
return;
|
var c = liste[i];
|
||||||
|
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
|
||||||
|
if (c.indexOf(nom) == 0) return c.substring(nom.length, c.length);
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
player.update(maps[player.z].squares, maps[player.z].circles, dt);
|
Renderer = new Render("canvas", "./assets/map/map7_principale.png", "./assets/map/map7_secondaire.png");
|
||||||
players.forEach((p)=>{
|
LB = new LeaderBoard("canvas");
|
||||||
if(p.z>=0)
|
let sound = new Sound("./assets/sounds/");
|
||||||
p.update(maps[p.z].squares,maps[p.z].circles);
|
sound.loadSounds();
|
||||||
|
cars = [new Car(Renderer, 0, 0, sound),
|
||||||
|
new Car(Renderer, 0, 7, sound),
|
||||||
|
new Car(Renderer, 1, 7, sound),
|
||||||
|
new Car(Renderer, 1, 13, sound),
|
||||||
|
new Car(Renderer, 1, 14, sound),
|
||||||
|
new Car(Renderer, 0, 15, sound)]
|
||||||
|
let Net = new Network("ws://129.151.227.50:8080?name="+CookiePseudo(), sound);
|
||||||
|
|
||||||
|
|
||||||
|
let playerId = null; //id of client player
|
||||||
|
let players = [];
|
||||||
|
let bullets = [];
|
||||||
|
let player = null;
|
||||||
|
|
||||||
|
Inp = new Input("canvas", Net,Renderer, sound);
|
||||||
|
|
||||||
|
playerId=Net.playerId;
|
||||||
|
player=Net.clientPlayer;
|
||||||
|
players=Net.getPlayersToAdd();
|
||||||
|
|
||||||
|
let dt = 1;
|
||||||
|
|
||||||
|
function update()
|
||||||
|
{
|
||||||
|
let playerToUpdate = Net.getPlayersToUpdate();
|
||||||
|
for (let i = 0;i<playerToUpdate.length;i++)
|
||||||
|
{
|
||||||
|
if(playerToUpdate[i].id==player.id) {
|
||||||
|
player.x=playerToUpdate[i].x;
|
||||||
|
player.y=playerToUpdate[i].y;
|
||||||
|
player.dir=playerToUpdate[i].dir;
|
||||||
|
player.visibleDir=playerToUpdate[i].visibleDir;
|
||||||
|
} else {
|
||||||
|
for (let j = 0;j<players.length;j++)
|
||||||
|
{
|
||||||
|
if(players[j].id==playerToUpdate[i].id)
|
||||||
|
{
|
||||||
|
|
||||||
|
players[j].x=playerToUpdate[i].x;
|
||||||
|
players[j].y=playerToUpdate[i].y;
|
||||||
|
players[j].dir=playerToUpdate[i].dir;
|
||||||
|
players[j].visibleDir=playerToUpdate[i].visibleDir;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function addPlayers()
|
||||||
|
{
|
||||||
|
let playersToAdd = Net.getPlayersToAdd();
|
||||||
|
playersToAdd.forEach((p) => {
|
||||||
|
console.log("New player: ",p.id);
|
||||||
|
players.push(p);
|
||||||
|
Renderer.AddPlayer(p);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function remPlayers()
|
||||||
|
{
|
||||||
|
let playerToRemove = Net.getPlayersToRemove();
|
||||||
|
for(let i=0;i<playerToRemove.length;i++)
|
||||||
|
{
|
||||||
|
let id = playerToRemove[i];
|
||||||
|
Renderer.RemPlayer(id);
|
||||||
|
console.log("deleting Player ",id);
|
||||||
|
for(let i = 0;i<players.length;i++)
|
||||||
|
{
|
||||||
|
if (players[i].id==id)
|
||||||
|
{
|
||||||
|
players.splice(i,1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function addBullets()
|
||||||
|
{
|
||||||
|
let bulletsToAdd = Net.getBulletsToAdd();
|
||||||
|
bulletsToAdd.forEach((b) => {
|
||||||
|
bullets.push(b);
|
||||||
|
Renderer.addBullet(b);
|
||||||
});
|
});
|
||||||
|
|
||||||
cars.forEach((c) => {
|
}
|
||||||
c.Update(dt);
|
|
||||||
if(c.collide(player.x,player.y,player.z))
|
function updateBullets(dt)
|
||||||
|
{
|
||||||
|
for(let i = bullets.length-1;i>=0;i--)
|
||||||
{
|
{
|
||||||
net.died(player.id,-1);
|
bullets[i].update(dt);
|
||||||
player.z=-1;
|
bullets[i].checkCollisions(player,squares,circles,Net);
|
||||||
player.death++;
|
if(bullets[i].deleted)
|
||||||
players[0].kill++;
|
{
|
||||||
|
Renderer.remBullet(bullets[i]);
|
||||||
|
bullets.splice(i,1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateKills()
|
||||||
|
{
|
||||||
|
let deaths = Net.getDeathToAdd();
|
||||||
|
deaths.forEach((object) => {
|
||||||
|
let dead = object.id;
|
||||||
|
let killer = object.killerId;
|
||||||
|
if(player.id==killer)
|
||||||
|
player.kill++;
|
||||||
|
for(let i=0;i<players.length;i++)
|
||||||
|
{
|
||||||
|
if(players[i].id==dead)
|
||||||
|
players[i].death++;
|
||||||
|
if(players[i].id==killer)
|
||||||
|
players[i].kill++;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
let currentTime = new Date();
|
||||||
|
function game() {
|
||||||
|
if(playerId==null)
|
||||||
|
{
|
||||||
|
if (Net.playerId!=null)
|
||||||
|
{
|
||||||
|
playerId=Net.playerId;
|
||||||
|
player=Net.clientPlayer;
|
||||||
|
players=Net.getPlayersToAdd();
|
||||||
|
Renderer.AddPlayer(player)
|
||||||
|
Renderer.SetPlayerId(player.id)
|
||||||
|
|
||||||
|
console.log("Connected as id ",playerId);
|
||||||
|
Inp.player=player;
|
||||||
|
Inp.bullets=bullets;
|
||||||
|
|
||||||
|
players.forEach((p) => {
|
||||||
|
Renderer.AddPlayer(p)
|
||||||
|
});
|
||||||
|
players.push(new Player(-1,-50,-50,"VOITURE",0,null));
|
||||||
|
LB.ReloadAff(players, player);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
update();
|
||||||
|
addPlayers();
|
||||||
|
remPlayers();
|
||||||
|
addBullets();
|
||||||
|
updateKills();
|
||||||
|
player.update(squares, circles, dt);
|
||||||
|
for (var i = players.length - 1; i >= 0; i--) {
|
||||||
|
players[i].update(squares, circles, dt);
|
||||||
|
}
|
||||||
|
Renderer.ReloadAff();
|
||||||
|
cars.forEach((c) => {
|
||||||
|
c.Update();
|
||||||
|
if(c.collide(player.x,player.y))
|
||||||
|
{
|
||||||
|
Net.died(player.id,-1);
|
||||||
|
player.x=-50;
|
||||||
|
player.deaths++;
|
||||||
player.health=10;
|
player.health=10;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
PNJS.forEach((pnj)=>{
|
|
||||||
pnj.update(dt);
|
|
||||||
})
|
|
||||||
|
|
||||||
maps.forEach((m) => {m.update();});
|
|
||||||
|
|
||||||
updateBullets(dt);
|
updateBullets(dt);
|
||||||
renderer.ReloadAff();
|
LB.ReloadAff(players, player);
|
||||||
LB.ReloadAff();
|
}
|
||||||
|
|
||||||
let newTime = new Date();
|
let newTime = new Date();
|
||||||
dt=newTime - currentTime;
|
dt=newTime - currentTime;
|
||||||
currentTime=newTime;
|
currentTime=newTime;
|
||||||
}
|
}
|
||||||
|
|
||||||
net.connect(); //connect to server, create a player, and retrieve all players info
|
Net.connect(); //connect to server, create a player, and retrieve all players info
|
||||||
|
|
||||||
|
|
||||||
setInterval(game, 16);
|
setInterval(game);
|
||||||
|
|
@ -1,130 +0,0 @@
|
||||||
let player = null;
|
|
||||||
let players = [];
|
|
||||||
let renderer = new Render("canvas");
|
|
||||||
let LB = new LeaderBoard("canvas");
|
|
||||||
let bulletSound = new Sound("./assets/sounds/shoot.mp3");
|
|
||||||
let driftSound = new Sound("./assets/sounds/drift.mp3");
|
|
||||||
let net = new Network("wss://ws.gta6.insat.fr:8080?name=" + getCookie("pseudo"));
|
|
||||||
let inp = new Input("canvas");
|
|
||||||
let phone = new Phone();
|
|
||||||
let bullets = [];
|
|
||||||
let circles = [];
|
|
||||||
let squares = [];
|
|
||||||
|
|
||||||
let PNJS = [new PNJ(500, 100,0),
|
|
||||||
new PNJ(700, 100,0),
|
|
||||||
new PNJ(500, 600,0),
|
|
||||||
new PNJ(200, 700,0)];
|
|
||||||
|
|
||||||
let cars = [new Car(1, 7),
|
|
||||||
//new Car(1, 12),
|
|
||||||
//new Car(1, 20),
|
|
||||||
new Car(1, 34),
|
|
||||||
//new Car(1, 58),
|
|
||||||
new Car(0, 20),
|
|
||||||
//new Car(0, 7),
|
|
||||||
//new Car(0, 18),
|
|
||||||
//new Car(0, 26),
|
|
||||||
//new Car(0, 45),
|
|
||||||
new Car(0, 52)];
|
|
||||||
let portals = [new Portal(250,457,0,516,789,1),//O
|
|
||||||
new Portal(344,758,0,500,500,0), // SO
|
|
||||||
new Portal(1190,211,0,500,500,0),// NE
|
|
||||||
new Portal(862,213,0,500,500,0), // N
|
|
||||||
new Portal(1126,472,0,583,810,3),// E
|
|
||||||
new Portal(1076,768,0,484,898,2),// SE
|
|
||||||
new Portal(721,767,0,500,500,0), // S
|
|
||||||
new Portal(970,476,0,500,500,0),//Mid
|
|
||||||
new Portal(617,154,1,274,244,0),//out map 1
|
|
||||||
new Portal(95,561,2,989,694,0), //out map 2
|
|
||||||
new Portal(569,828,3,1152,519,0)];//out map 3
|
|
||||||
|
|
||||||
let map0Squares = [new Square(1064,371,0,126,125),new Square(1160,113,0,143,126),new Square(1017,113,0,146,80),new Square(1018,192,0,10,47),new Square(1028,227,0,45,12),new Square(1101,227,0,66,12),new Square(791,113,0,176,126),new Square(522,129,0,103,13),new Square(654,128,0,104,15),new Square(747,144,0,12,34),new Square(748,194,0,10,44),new Square(655,224,0,101,15),new Square(520,227,0,106,13),new Square(522,195,0,11,39),new Square(522,131,0,8,46),new Square(588,154,0,10,22),new Square(651,153,0,10,21),new Square(698,188,0,12,19),new Square(697,373,0,318,124),new Square(697,497,0,158,112),new Square(1001,629,0,188,155),new Square(696,626,0,159,158),new Square(281,627,0,173,156),new Square(168,243,0,61,250),new Square(229,259,0,87,218),new Square(311,242,0,62,254),new Square(296,112,0,79,95),new Square(2,0,0,1350,14),new Square(1337,2,0,130,927),new Square(119,909,0,1250,17),new Square(4,1,0,129,923),new Square(543,156,0,16,18),new Square(559,207,0,16,17),new Square(598,179,0,17,29),new Square(721,157,0,13,17),new Square(673,205,0,14,17)];
|
|
||||||
let map1Squares = [new Square(1,0,1,1020,160),new Square(868,48,1,153,969),new Square(2,838,1,1019,182),new Square(1,0,1,148,998)];
|
|
||||||
let map2Squares = [new Square(25,936,2,989,83),new Square(1,1,2,98,974),new Square(5,8,2,1002,250),new Square(941,10,2,80,1002),new Square(816,617,2,146,168),new Square(764,252,2,48,214),new Square(805,282,2,154,92),new Square(406,233,2,195,166),new Square(94,418,2,155,88),new Square(94,277,2,127,68),new Square(198,762,2,60,103),new Square(225,880,2,53,30),new Square(116,854,2,35,32)];
|
|
||||||
let map3Squares = [new Square(19,836,3,857,48),new Square(706,324,3,180,531),new Square(640,321,3,75,168),new Square(832,10,3,60,325),new Square(3,2,3,843,165),new Square(354,48,3,90,302),new Square(256,321,3,287,165),new Square(1,1,3,62,374),new Square(51,320,3,109,157),new Square(4,434,3,90,436),new Square(146,680,3,124,71),new Square(92,754,3,32,88),new Square(290,554,3,220,36),new Square(708,150,3,87,68),new Square(323,206,3,39,59),new Square(50,127,3,72,93),new Square(448,648,3,61,44),new Square(578,645,3,92,45),new Square(802,236,3,36,60)];
|
|
||||||
|
|
||||||
let maps = [new Game_Map(portals.slice(0,8),0,map0Squares,[]),
|
|
||||||
new Game_Map(portals.slice(8,9),1,map1Squares,[]),
|
|
||||||
new Game_Map(portals.slice(9,10),2,map2Squares,[]),
|
|
||||||
new Game_Map(portals.slice(10,11),3,map3Squares,[])];
|
|
||||||
|
|
||||||
players.push(new Player(-1,-50,-50,-1,"VOITURES",0));
|
|
||||||
|
|
||||||
function updatePlayer(data)
|
|
||||||
{
|
|
||||||
if(data.id==player.id)
|
|
||||||
{
|
|
||||||
player.x=data.x;
|
|
||||||
player.y=data.y;
|
|
||||||
if(data.z==undefined)
|
|
||||||
player.z=0;
|
|
||||||
else
|
|
||||||
player.z=data.z;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
for(let i=0;i<players.length;i++)
|
|
||||||
{
|
|
||||||
if(data.id==players[i].id)
|
|
||||||
{
|
|
||||||
players[i].x=data.x;
|
|
||||||
players[i].y=data.y;
|
|
||||||
if(data.z==undefined)
|
|
||||||
players[i].z=0;
|
|
||||||
else
|
|
||||||
players[i].z=data.z;
|
|
||||||
players[i].dir=data.dir;
|
|
||||||
players[i].visibleDir=data.visibleDir;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function addPlayer(data)
|
|
||||||
{
|
|
||||||
let np = new Player(data.id, data.x, data.y, 0, data.name, data.dir);
|
|
||||||
players.push(np);
|
|
||||||
}
|
|
||||||
|
|
||||||
function removePlayer(id)
|
|
||||||
{
|
|
||||||
for(let i=0;i<players.length;i++)
|
|
||||||
{
|
|
||||||
if(players[i].id==id)
|
|
||||||
{
|
|
||||||
players.splice(i,1);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function addKill(idKilled,idKiller)
|
|
||||||
{
|
|
||||||
if(player.id==idKiller){
|
|
||||||
player.kill++;
|
|
||||||
}
|
|
||||||
if(player.id==idKilled){
|
|
||||||
player.death++;
|
|
||||||
}
|
|
||||||
players.forEach((p) => {
|
|
||||||
if(p.id==idKilled)
|
|
||||||
p.death++;
|
|
||||||
if(p.id==idKiller)
|
|
||||||
p.kill++;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateBullets(dt)
|
|
||||||
{
|
|
||||||
for(let i = bullets.length-1;i>=0;i--)
|
|
||||||
{
|
|
||||||
bullets[i].update(dt);
|
|
||||||
bullets[i].checkCollisions(maps[bullets[i].z].squares,maps[bullets[i].z].circles);
|
|
||||||
if(bullets[i].deleted)
|
|
||||||
{
|
|
||||||
bullets.splice(i,1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,86 +1,50 @@
|
||||||
class Input {
|
class Input {
|
||||||
constructor(idCanvas) {
|
constructor(id, net,renderer, sound) {
|
||||||
this.keysDown = new Set()
|
this.keysDown = new Set()
|
||||||
this.dir = 0;
|
this.dir = 0;
|
||||||
|
this.player=null;
|
||||||
|
this.bullets=null;
|
||||||
|
this.canvas = document.getElementById(id);
|
||||||
|
this.renderer=renderer;
|
||||||
|
|
||||||
this.canvas = document.getElementById(idCanvas);
|
this.mouseX = 0
|
||||||
|
this.mouseY = 0
|
||||||
|
|
||||||
//for debug/creation of collisions only
|
this.network = net
|
||||||
this.dmx=0;
|
|
||||||
this.dmy=0;
|
// Event listener pour la position de la souris
|
||||||
this.parity=true;
|
|
||||||
this.toPrint="";
|
this.canvas.addEventListener("mousemove", this.handleMouseMove.bind(this));
|
||||||
//
|
|
||||||
|
|
||||||
this.canvas.addEventListener("click", (e) => {
|
this.canvas.addEventListener("click", (e) => {
|
||||||
if(player==null || bullets==null){
|
if(this.player==null || this.bullets==null){
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
let dx = this.mouseX-this.player.x;
|
||||||
let bounds = this.canvas.getBoundingClientRect();
|
let dy = this.mouseY-this.player.y;
|
||||||
|
|
||||||
let mouseX = (e.clientX - bounds.x)*this.canvas.width/bounds.width;
|
|
||||||
let mouseY = (e.clientY - bounds.y)*this.canvas.height/bounds.height;
|
|
||||||
//console.log(Math.round(mouseX),",",Math.round(mouseY)); //for debug
|
|
||||||
|
|
||||||
//if(this.parity){ ////// to create collisions for a map
|
|
||||||
// this.dmx=Math.round(mouseX);
|
|
||||||
// this.dmy=Math.round(mouseY);
|
|
||||||
// this.parity=!this.parity;
|
|
||||||
//}else{
|
|
||||||
// let mx = Math.round((e.clientX - bounds.x)*this.canvas.width/bounds.width);
|
|
||||||
// let my = Math.round((e.clientY - bounds.y)*this.canvas.height/bounds.height);
|
|
||||||
// let x = Math.min(mx,this.dmx);
|
|
||||||
// let y = Math.min(my,this.dmy);
|
|
||||||
// let w = Math.abs(mx-this.dmx);
|
|
||||||
// let h = Math.abs(my-this.dmy);
|
|
||||||
// this.toPrint+="new Square("+x.toString()+","+y.toString()+","+player.z.toString()+","+w.toString()+","+h.toString()+"),";
|
|
||||||
// navigator.clipboard.writeText(this.toPrint);
|
|
||||||
// maps[player.z].squares.push(new Square(x,y,player.z,w,h));
|
|
||||||
// this.parity=!this.parity;
|
|
||||||
//}
|
|
||||||
|
|
||||||
let dx = mouseX-player.x;
|
|
||||||
let dy = mouseY-player.y;
|
|
||||||
|
|
||||||
let norm = Math.sqrt(dx*dx+dy*dy);
|
let norm = Math.sqrt(dx*dx+dy*dy);
|
||||||
|
let b = new Bullet(this.player.x,this.player.y,dx/norm,dy/norm,this.player.id, sound);
|
||||||
|
|
||||||
let b = new Bullet(player.x,player.y,player.z,dx/norm,dy/norm,player.id);
|
this.bullets.push(b);
|
||||||
bullets.push(b);
|
this.renderer.addBullet(b);
|
||||||
net.newBullet(b.x,b.y,b.z,b.dx,b.dy,b.shooterId);
|
this.network.newBullet(b.x,b.y,b.dx,b.dy,b.parentId);
|
||||||
});
|
});
|
||||||
|
|
||||||
window.addEventListener("keydown", (e)=>{
|
window.addEventListener("keydown", (e)=>{
|
||||||
//blocks the action of the key (cf. Killian)
|
|
||||||
if(["Space","ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(e.code)) {
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
this.keysDown.add(e.key.toLowerCase())
|
this.keysDown.add(e.key.toLowerCase())
|
||||||
this.updateDir();
|
this.updateDir();
|
||||||
})
|
})
|
||||||
|
|
||||||
document.getElementById("retour_menu").addEventListener("click", (e) => {
|
|
||||||
phone.changeWindow(1)
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener("keyup", (e)=>{
|
window.addEventListener("keyup", (e)=>{
|
||||||
this.keysDown.delete(e.key.toLowerCase())
|
this.keysDown.delete(e.key.toLowerCase())
|
||||||
this.updateDir();
|
this.updateDir();
|
||||||
})
|
})
|
||||||
|
|
||||||
window.addEventListener("keypress", (e)=>{
|
|
||||||
if(e.key.toLowerCase()=="p"){
|
|
||||||
phone.changePosition();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
updateDir(){
|
updateDir(){
|
||||||
if(player==null)
|
if(this.player==null)
|
||||||
return;
|
return;
|
||||||
|
|
||||||
let oldDir=this.dir;
|
let oldDir=this.dir;
|
||||||
|
|
||||||
this.dir=0;
|
this.dir=0;
|
||||||
if(this.keysDown.has('z') || this.keysDown.has('arrowup')){
|
if(this.keysDown.has('z') || this.keysDown.has('arrowup')){
|
||||||
if(this.keysDown.has('d') || this.keysDown.has('arrowright')){
|
if(this.keysDown.has('d') || this.keysDown.has('arrowright')){
|
||||||
|
|
@ -101,7 +65,7 @@ class Input {
|
||||||
this.dir = 3;
|
this.dir = 3;
|
||||||
}
|
}
|
||||||
}else if(this.keysDown.has('s') || this.keysDown.has('arrowdown')){
|
}else if(this.keysDown.has('s') || this.keysDown.has('arrowdown')){
|
||||||
if(this.keysDown.has('q') || this.keysDown.has('arrowleft')){
|
if(this.keysDown.has('q') || this.keysDown.has('arrowLeft')){
|
||||||
this.dir = 6;
|
this.dir = 6;
|
||||||
}else{
|
}else{
|
||||||
this.dir = 5;
|
this.dir = 5;
|
||||||
|
|
@ -111,14 +75,23 @@ class Input {
|
||||||
}
|
}
|
||||||
if(oldDir!=this.dir)
|
if(oldDir!=this.dir)
|
||||||
{
|
{
|
||||||
player.changeDirection(this.dir);
|
this.player.changeDirection(this.dir);
|
||||||
net.update(player);
|
this.network.update(this.player);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
get getDirection() {
|
||||||
|
return this.dir;
|
||||||
|
}
|
||||||
|
|
||||||
|
handleMouseMove(event) {
|
||||||
|
let mX = event.clientX - this.canvas.getBoundingClientRect().left;
|
||||||
|
let mY = event.clientY - this.canvas.getBoundingClientRect().top;
|
||||||
|
this.mouseX = mX;
|
||||||
|
this.mouseY = mY;
|
||||||
|
}
|
||||||
|
|
||||||
calculateAngle(playerX, playerY) {
|
calculateAngle(playerX, playerY) {
|
||||||
return Math.atan2(this.mouseY - playerY, this.mouseX - playerX);
|
return Math.atan2(this.mouseY - playerY, this.mouseX - playerX);
|
||||||
}
|
}
|
||||||
*/
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,28 +1,29 @@
|
||||||
class LeaderBoard {
|
class LeaderBoard {
|
||||||
constructor(idCanvas) {
|
constructor(id) {
|
||||||
this.canvas = document.getElementById(idCanvas);
|
this.canvas = document.getElementById(id);
|
||||||
this.ctx = this.canvas.getContext("2d");
|
this.ctx = this.canvas.getContext("2d");
|
||||||
this.nbjoueur=0
|
this.nbjoueur=0
|
||||||
this.px=10;
|
|
||||||
this.py=10;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ReloadAff() {
|
ReloadAff(players, player) {
|
||||||
let LBplayers=[];
|
this.px=10
|
||||||
|
this.py=10
|
||||||
|
this.players=[]
|
||||||
players.forEach((p) => {
|
players.forEach((p) => {
|
||||||
if(p != null) {
|
if(p != null) {
|
||||||
LBplayers.push(p);
|
this.players.push(p)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
LBplayers.push(player);
|
this.players.push(player);
|
||||||
|
|
||||||
LBplayers.sort(function (a, b) {
|
this.players.sort(function (a, b) {
|
||||||
return b.kill - a.kill;
|
return b.kill - a.kill;
|
||||||
});
|
});
|
||||||
|
|
||||||
// tableau du leaderboard (le fonc "blanc")
|
// tableau du leaderboard (le fonc "blanc")
|
||||||
this.ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
|
this.ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
|
||||||
this.ctx.fillRect(this.px, this.py, this.px+240, this.py+100+LBplayers.length*20);
|
this.ctx.fillRect(this.px, this.py, this.px+240, this.py+100+this.nbjoueur*20);
|
||||||
this.nbjoueur=0;
|
this.nbjoueur=0
|
||||||
this.ctx.font = '20px Arial';
|
this.ctx.font = '20px Arial';
|
||||||
this.ctx.fillStyle = '#000000';
|
this.ctx.fillStyle = '#000000';
|
||||||
this.ctx.fillText('Leaderboard', this.px+80, this.py+30);
|
this.ctx.fillText('Leaderboard', this.px+80, this.py+30);
|
||||||
|
|
@ -37,7 +38,7 @@ class LeaderBoard {
|
||||||
this.ctx.lineTo(this.px+250, this.py+100);
|
this.ctx.lineTo(this.px+250, this.py+100);
|
||||||
this.ctx.stroke();
|
this.ctx.stroke();
|
||||||
|
|
||||||
//donnee user
|
//donné user
|
||||||
this.ctx.fillStyle = '#000000';
|
this.ctx.fillStyle = '#000000';
|
||||||
this.ctx.font = '15px Arial';
|
this.ctx.font = '15px Arial';
|
||||||
this.ctx.fillText('#', this.px+10, this.py+80);
|
this.ctx.fillText('#', this.px+10, this.py+80);
|
||||||
|
|
@ -47,7 +48,7 @@ class LeaderBoard {
|
||||||
this.ctx.fillText('K/D', this.px+220, this.py+80);
|
this.ctx.fillText('K/D', this.px+220, this.py+80);
|
||||||
this.ctx.font = '10px Arial';
|
this.ctx.font = '10px Arial';
|
||||||
|
|
||||||
LBplayers.forEach((p) => {
|
this.players.forEach((p) => {
|
||||||
if(p != null) {
|
if(p != null) {
|
||||||
this.ctx.fillText((this.nbjoueur+1), this.px+10, this.py+120+20*this.nbjoueur);
|
this.ctx.fillText((this.nbjoueur+1), this.px+10, this.py+120+20*this.nbjoueur);
|
||||||
this.ctx.fillText(p.name, this.px+30, this.py+120+20*this.nbjoueur);
|
this.ctx.fillText(p.name, this.px+30, this.py+120+20*this.nbjoueur);
|
||||||
|
|
@ -55,7 +56,7 @@ class LeaderBoard {
|
||||||
this.ctx.fillText(p.death, this.px+200, this.py+120+20*this.nbjoueur);
|
this.ctx.fillText(p.death, this.px+200, this.py+120+20*this.nbjoueur);
|
||||||
this.ctx.fillText(Math.round(10*p.kill/p.death)/10, this.px+220, this.py+120+20*this.nbjoueur);
|
this.ctx.fillText(Math.round(10*p.kill/p.death)/10, this.px+220, this.py+120+20*this.nbjoueur);
|
||||||
|
|
||||||
this.nbjoueur++;
|
this.nbjoueur++
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,49 +1,50 @@
|
||||||
class Network{
|
class Network{
|
||||||
constructor(adress){
|
constructor(adress, bulletsound){
|
||||||
this.adress = adress;
|
this.adress = adress;
|
||||||
this.connected = false;
|
this.connected = false;
|
||||||
|
|
||||||
this.playerId = null;
|
this.playerId = null;
|
||||||
|
this.clientPlayer=null;
|
||||||
|
this.playersToAdd = [];
|
||||||
|
this.playersToRemove = [];
|
||||||
|
this.playersToUpdate = [];
|
||||||
|
this.bulletsToAdd = [];
|
||||||
|
this.deathToAdd = [];
|
||||||
|
this.sound=bulletsound;
|
||||||
}
|
}
|
||||||
|
|
||||||
message(data){
|
message(data){
|
||||||
switch(data.type){
|
switch(data.type){
|
||||||
case 'connect':
|
case 'connect':
|
||||||
this.playerId = data.data.playerId;
|
this.playerId = data.data.playerId;
|
||||||
for (let i = 0; i<data.data.players.length; i++) {
|
for (var i = data.data.players.length - 1; i >= 0; i--) {
|
||||||
let p = data.data.players[i];
|
if(data.data.players[i].id==this.playerId)
|
||||||
if(p.id==this.playerId)
|
this.clientPlayer=new Player(data.data.players[i].id, data.data.players[i].x, data.data.players[i].y, data.data.players[i].name, data.data.players[i].dir);
|
||||||
player=new Player(p.id,p.x,p.y,0,p.name,p.dir);
|
|
||||||
else
|
else
|
||||||
players.push(new Player(p.id,p.x,p.y,0,p.name,p.dir));
|
this.playersToAdd.push(new Player(data.data.players[i].id, data.data.players[i].x, data.data.players[i].y, data.data.players[i].name, data.data.players[i].dir))
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case 'update':
|
case 'update':
|
||||||
updatePlayer(data.data);
|
this.playersToUpdate.push(data.data);
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "newplayer":
|
case "newplayer":
|
||||||
players.push(new Player(data.data.id, data.data.x, data.data.y, 0, data.data.name, data.data.dir));
|
this.playersToAdd.push(new Player(data.data.id, data.data.x, data.data.y, data.data.name, data.data.dir));
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "removePlayer":
|
case "removePlayer":
|
||||||
removePlayer(data.data.id);
|
this.playersToRemove.push(data.data.id);
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "newBullet":
|
case "newBullet":
|
||||||
bullets.push(new Bullet(data.data.x,data.data.y,data.data.z==undefined?0:data.data.z,data.data.dx,data.data.dy,data.data.id));
|
console.log(this.sound)
|
||||||
|
this.bulletsToAdd.push(new Bullet(data.data.x,data.data.y,data.data.dx,data.data.dy,data.data.id, this.sound));
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "died":
|
case "died":
|
||||||
console.log("player",data.data.id,"was killed by",data.data.killerId);
|
console.log("player",data.data.id,"was killed by",data.data.killerId);
|
||||||
addKill(data.data.id,data.data.killerId);
|
this.deathToAdd.push(data.data);
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "message":
|
|
||||||
phone.addMessage(data.data);
|
|
||||||
|
|
||||||
default:
|
default:
|
||||||
console.log("received unknown data:",data);
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -59,6 +60,7 @@ class Network{
|
||||||
}
|
}
|
||||||
|
|
||||||
died(id, killerId){
|
died(id, killerId){
|
||||||
|
this.deathToAdd.push({id:id,killerId:killerId});
|
||||||
this.socket.send(JSON.stringify({type:"died",data:{id: id, killerId: killerId}}));
|
this.socket.send(JSON.stringify({type:"died",data:{id: id, killerId: killerId}}));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -69,12 +71,39 @@ class Network{
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
newBullet(x,y,z,dx,dy,parentId)
|
newBullet(x,y,dx,dy,parentId)
|
||||||
{
|
{
|
||||||
this.socket.send(JSON.stringify({type:"newBullet",data:{x: x,y: y,z: z,dx: dx,dy: dy,id:parentId}}));
|
this.socket.send(JSON.stringify({type:"newBullet",data:{x: x,y: y,dx: dx,dy: dy,id:parentId}}));
|
||||||
}
|
}
|
||||||
|
|
||||||
sendMessage(title, content){
|
getPlayersToAdd(){ //returns the list of new players
|
||||||
this.socket.send(JSON.stringify({type: "message", data: {title: title, content: content}}));
|
let tmp = this.playersToAdd;
|
||||||
|
this.playersToAdd = [];
|
||||||
|
return tmp;
|
||||||
|
}
|
||||||
|
|
||||||
|
getBulletsToAdd(){ //returns the list of new players
|
||||||
|
let tmp = this.bulletsToAdd;
|
||||||
|
this.bulletsToAdd = [];
|
||||||
|
return tmp;
|
||||||
|
}
|
||||||
|
|
||||||
|
getPlayersToRemove(){ //returns the list of player who have left the game
|
||||||
|
let tmp = this.playersToRemove;
|
||||||
|
this.playersToRemove = [];
|
||||||
|
return tmp;
|
||||||
|
}
|
||||||
|
|
||||||
|
getPlayersToUpdate(){ //return a list of all updates recieved from the server
|
||||||
|
let tmp = this.playersToUpdate;
|
||||||
|
this.playersToUpdate = [];
|
||||||
|
return tmp;
|
||||||
|
}
|
||||||
|
|
||||||
|
getDeathToAdd()
|
||||||
|
{
|
||||||
|
let tmp = this.deathToAdd;
|
||||||
|
this.deathToAdd=[];
|
||||||
|
return tmp;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -1,11 +1,14 @@
|
||||||
let objects = {"squares":[{"x":1162,"y":115,"z":0,"w":144,"h":125},{"x":120,"y":906,"z":0,"w":1228,"h":21},{"x":127,"y":0,"z":0,"w":1225,"h":14},{"x":297,"y":114,"z":0,"w":78,"h":93},{"x":169,"y":243,"z":0,"w":62,"h":250},{"x":313,"y":243,"z":0,"w":62,"h":253},{"x":228,"y":257,"z":0,"w":96,"h":222},{"x":792,"y":113,"z":0,"w":176,"h":126},{"x":1017,"y":113,"z":0,"w":143,"h":81},{"x":1160,"y":241,"z":0,"w":143,"h":-129},{"x":1065,"y":372,"z":0,"w":127,"h":124},{"x":697,"y":372,"z":0,"w":319,"h":126},{"x":697,"y":498,"z":0,"w":159,"h":111},{"x":697,"y":628,"z":0,"w":160,"h":158},{"x":1001,"y":628,"z":0,"w":191,"h":158},{"x":281,"y":629,"z":0,"w":175,"h":156},{"x":0,"y":0,"z":0,"w":137,"h":616},{"x":0,"y":615,"z":0,"w":136,"h":310},{"x":1337,"y":1,"z":0,"w":130,"h":581},{"x":1337,"y":573,"z":0,"w":131,"h":356},{"x":586,"y":153,"z":0,"w":15,"h":24},{"x":651,"y":153,"z":0,"w":12,"h":24},{"x":700,"y":187,"z":0,"w":12,"h":22},{"x":1020,"y":194,"z":0,"w":10,"h":47},{"x":1019,"y":227,"z":0,"w":56,"h":14},{"x":1101,"y":227,"z":0,"w":62,"h":13},{"x":654,"y":128,"z":0,"w":105,"h":17},{"x":748,"y":129,"z":0,"w":12,"h":49},{"x":748,"y":193,"z":0,"w":12,"h":47},{"x":654,"y":223,"z":0,"w":105,"h":16},{"x":521,"y":129,"z":0,"w":106,"h":14},{"x":521,"y":140,"z":0,"w":13,"h":38},{"x":521,"y":194,"z":0,"w":13,"h":46},{"x":521,"y":225,"z":0,"w":108,"h":16}],"circles":[{"x":552,"y":163,"z":0,"r":13.601470508735444},{"x":608,"y":190,"z":0,"r":20.248456731316587},{"x":569,"y":212,"z":0,"r":11.704699910719626},{"x":680,"y":213,"z":0,"r":12.041594578792296},{"x":727,"y":164,"z":0,"r":14.212670403551895}]}
|
let objects = {"squares":[{"x":1162,"y":115,"w":144,"h":125},{"x":120,"y":906,"w":1228,"h":21},{"x":127,"y":0,"w":1225,"h":14},{"x":297,"y":114,"w":78,"h":93},{"x":169,"y":243,"w":62,"h":250},{"x":313,"y":243,"w":62,"h":253},{"x":228,"y":257,"w":96,"h":222},{"x":792,"y":113,"w":176,"h":126},{"x":1017,"y":113,"w":143,"h":81},{"x":1160,"y":241,"w":143,"h":-129},{"x":1065,"y":372,"w":127,"h":124},{"x":697,"y":372,"w":319,"h":126},{"x":697,"y":498,"w":159,"h":111},{"x":697,"y":628,"w":160,"h":158},{"x":1001,"y":628,"w":191,"h":158},{"x":281,"y":629,"w":175,"h":156},{"x":0,"y":0,"w":137,"h":616},{"x":0,"y":615,"w":136,"h":310},{"x":1337,"y":1,"w":130,"h":581},{"x":1337,"y":573,"w":131,"h":356},{"x":586,"y":153,"w":15,"h":24},{"x":651,"y":153,"w":12,"h":24},{"x":700,"y":187,"w":12,"h":22},{"x":1020,"y":194,"w":10,"h":47},{"x":1019,"y":227,"w":56,"h":14},{"x":1101,"y":227,"w":62,"h":13},{"x":654,"y":128,"w":105,"h":17},{"x":748,"y":129,"w":12,"h":49},{"x":748,"y":193,"w":12,"h":47},{"x":654,"y":223,"w":105,"h":16},{"x":521,"y":129,"w":106,"h":14},{"x":521,"y":140,"w":13,"h":38},{"x":521,"y":194,"w":13,"h":46},{"x":521,"y":225,"w":108,"h":16}],"circles":[{"x":552,"y":163,"r":13.601470508735444},{"x":608,"y":190,"r":20.248456731316587},{"x":569,"y":212,"r":11.704699910719626},{"x":680,"y":213,"r":12.041594578792296},{"x":727,"y":164,"r":14.212670403551895}]}
|
||||||
|
|
||||||
for (let i=0; i<objects.squares.length;i++) {
|
let squares = [];
|
||||||
|
let circles = [];
|
||||||
|
|
||||||
|
for (var i = objects.squares.length - 1; i >= 0; i--) {
|
||||||
let current = objects.squares[i]
|
let current = objects.squares[i]
|
||||||
squares.push(new Square(current.x, current.y, current.z, current.w, current.h));
|
squares.push(new Square(current.x, current.y, current.w, current.h));
|
||||||
}
|
}
|
||||||
|
|
||||||
for (let i=0; i<objects.circles.length; i++) {
|
for (var i = objects.circles.length - 1; i >= 0; i--) {
|
||||||
let current = objects.circles[i]
|
let current = objects.circles[i]
|
||||||
circles.push(new Circle(current.x, current.y, current.z, current.r));
|
circles.push(new Circle(current.x, current.y, current.r));
|
||||||
}
|
}
|
||||||
|
|
@ -1,135 +0,0 @@
|
||||||
class Phone{
|
|
||||||
constructor(){
|
|
||||||
this.position = 0;
|
|
||||||
this.messages = [];
|
|
||||||
this.name = document.getElementById("TitlePage");
|
|
||||||
|
|
||||||
this.content = document.getElementById("content");
|
|
||||||
this.contentmsg = document.getElementById("chatMessages");
|
|
||||||
this.inputDiv = document.getElementById("chatInputDiv");
|
|
||||||
this.webview = document.getElementById("webview");
|
|
||||||
|
|
||||||
this.webviewName = "Erreur"
|
|
||||||
|
|
||||||
this.chargeMainPage();
|
|
||||||
this.changeWindow(1)
|
|
||||||
}
|
|
||||||
|
|
||||||
chargeMainPage() {
|
|
||||||
document.getElementById("appli-concord").addEventListener("click", (e) => {
|
|
||||||
this.changeWindow(2)
|
|
||||||
});
|
|
||||||
document.getElementById("appli-gta6").addEventListener("click", (e) => {
|
|
||||||
this.webviewName = "GTA 6"
|
|
||||||
this.changeWindow("game.html")
|
|
||||||
});
|
|
||||||
document.getElementById("appli-vbuks").addEventListener("click", (e) => {
|
|
||||||
this.webviewName = "Free Vbucks"
|
|
||||||
this.changeWindow("assets/phone/webview/vbucks.html")
|
|
||||||
});
|
|
||||||
document.getElementById("appli-fb").addEventListener("click", (e) => {
|
|
||||||
this.webviewName = "FakeBook"
|
|
||||||
this.changeWindow("assets/phone/webview/fb.html")
|
|
||||||
});
|
|
||||||
document.getElementById("appli-utube").addEventListener("click", (e) => {
|
|
||||||
this.webviewName = "uTube"
|
|
||||||
this.changeWindow("assets/phone/webview/utube.html")
|
|
||||||
});
|
|
||||||
document.getElementById("appli-goo").addEventListener("click", (e) => {
|
|
||||||
this.webviewName = "Gogole"
|
|
||||||
this.changeWindow("https://mrdoob.com/projects/chromeexperiments/google-space/")
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
changeWindow(window) {
|
|
||||||
//1 main view phone.changeWindow(
|
|
||||||
//2 concorde
|
|
||||||
//other webview
|
|
||||||
this.content.style.display="none";
|
|
||||||
this.contentmsg.style.display="none";
|
|
||||||
this.inputDiv.style.display="none";
|
|
||||||
this.webview.style.display = "none";
|
|
||||||
this.webview.src="";
|
|
||||||
|
|
||||||
switch (window) {
|
|
||||||
case 1:
|
|
||||||
this.name.innerText = "Pear phone"
|
|
||||||
this.content.style.display="block";
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
this.name.innerText = "Concord"
|
|
||||||
this.contentmsg.style.display="block";
|
|
||||||
this.inputDiv.style.display="block";
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
this.name.innerText = this.webviewName
|
|
||||||
this.webview.style.display = "block";
|
|
||||||
this.webview.style.width="100%";
|
|
||||||
this.webview.style.height="90%";
|
|
||||||
this.webview.style.border="0";
|
|
||||||
this.webview.src=window;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
addMessage(message){
|
|
||||||
this.messages.push(message);
|
|
||||||
|
|
||||||
let msg = document.createElement("div");
|
|
||||||
msg.className = "message";
|
|
||||||
|
|
||||||
let h2 = document.createElement("h2");
|
|
||||||
h2.className = "messageTitle";
|
|
||||||
h2.innerText = message.title;
|
|
||||||
|
|
||||||
let p;
|
|
||||||
let match = message.content.match(/:(\w+):/);
|
|
||||||
if(match){
|
|
||||||
p = document.createElement("img");
|
|
||||||
p.className = "messageImage";
|
|
||||||
p.src = "assets/concord_images/" + match[1] + '.jpg';
|
|
||||||
}else{
|
|
||||||
p = document.createElement("p");
|
|
||||||
p.className = "messageContent";
|
|
||||||
p.innerText = message.content;
|
|
||||||
}
|
|
||||||
|
|
||||||
msg.appendChild(h2);
|
|
||||||
msg.appendChild(p);
|
|
||||||
|
|
||||||
this.contentmsg.appendChild(msg);
|
|
||||||
this.contentmsg.scrollTop = this.contentmsg.scrollHeight;
|
|
||||||
}
|
|
||||||
|
|
||||||
sendMessage(title, content){
|
|
||||||
let message = {
|
|
||||||
title: player.name,
|
|
||||||
content: content
|
|
||||||
}
|
|
||||||
this.addMessage(message);
|
|
||||||
net.sendMessage(title, content);
|
|
||||||
}
|
|
||||||
|
|
||||||
keyPress(input){
|
|
||||||
if(event.key=='Enter'){
|
|
||||||
if(input.value!=''){
|
|
||||||
this.sendMessage(player.name, input.value);
|
|
||||||
input.value = '';
|
|
||||||
input.blur()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
changePosition(){
|
|
||||||
if(!document.getElementById("phoneContainer").contains(document.activeElement)){
|
|
||||||
if(this.position == 0){
|
|
||||||
document.getElementById("phoneContainer").className = "visible";
|
|
||||||
this.position = 1;
|
|
||||||
}else{
|
|
||||||
document.getElementById("phoneContainer").className = "hidden";
|
|
||||||
this.position = 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,164 +1,101 @@
|
||||||
let drawPortals = true;
|
|
||||||
let drawCollisions = false;
|
|
||||||
|
|
||||||
const imgPlayer = new Image();
|
const imgPlayer = new Image();
|
||||||
const imgBullet = new Image();
|
const imgBullet = new Image();
|
||||||
const imgCar = new Image();
|
const imgCar = new Image();
|
||||||
const imgPnj = new Image();
|
|
||||||
const imgPnj2 = new Image();
|
|
||||||
const map0 = new Image();
|
|
||||||
const map0_night = new Image();
|
|
||||||
const map1 = new Image();
|
|
||||||
const map2 = new Image();
|
|
||||||
const map3 = new Image();
|
|
||||||
const orange_portal = new Image();
|
|
||||||
const blue_portal = new Image();
|
|
||||||
imgPlayer.src = "./assets/body.png";
|
imgPlayer.src = "./assets/body.png";
|
||||||
imgBullet.src = "./assets/bullet2.png";
|
imgBullet.src = "./assets/bullet.png";
|
||||||
imgCar.src = "./assets/car.png";
|
imgCar.src = "./assets/car.png";
|
||||||
imgPnj.src = "./assets/pnj.png";
|
|
||||||
imgPnj2.src = "./assets/pnj1.png";
|
|
||||||
map0.src = "./assets/map/map_principale.png"
|
|
||||||
map0_night.src = "./assets/map/map_principale_nuit.png"
|
|
||||||
map1.src = "./assets/map/map1.png";
|
|
||||||
map2.src = "./assets/map/map2.png";
|
|
||||||
map3.src = "./assets/map/map3.png";
|
|
||||||
orange_portal.src = "./assets/orange_portal.webp";
|
|
||||||
blue_portal.src = "./assets/blue_portal.webp";
|
|
||||||
|
|
||||||
const mapImages = [map0,map1,map2,map3];
|
|
||||||
|
|
||||||
class Render {
|
class Render {
|
||||||
constructor(idCanvas) {
|
|
||||||
let canvas = document.getElementById(idCanvas);
|
constructor(id, mapsrc, map2src) {
|
||||||
|
this.canvas = document.getElementById(id);
|
||||||
this.ctx = canvas.getContext("2d");
|
this.ctx = canvas.getContext("2d");
|
||||||
this.ctx.imageSmoothingEnabled=false;//does not lerp pixels
|
this.players = [];
|
||||||
|
this.bullets = [];
|
||||||
|
this.mapsrc=mapsrc;
|
||||||
|
this.ReloadAff();
|
||||||
|
this.playerid=0;
|
||||||
}
|
}
|
||||||
|
|
||||||
RenderPlayer(p,isClient) {
|
SetPlayerId(id) {
|
||||||
if(p==null)
|
this.playerid=id
|
||||||
return;
|
}
|
||||||
let x=p.x
|
|
||||||
let y=p.y
|
|
||||||
|
|
||||||
if(p.z==player.z)
|
AddPlayer(player) {
|
||||||
|
this.players.push(player);
|
||||||
|
}
|
||||||
|
|
||||||
|
addBullet(bullet) {
|
||||||
|
this.bullets.push(bullet);
|
||||||
|
}
|
||||||
|
|
||||||
|
remBullet(bullet) {
|
||||||
|
for(let i=0;i<this.bullets.length;i++) {
|
||||||
|
if(bullet==this.bullets[i]) {
|
||||||
|
this.bullets.splice(i,1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
RemPlayer(id) {
|
||||||
|
for(let i=0;i<this.players.length;i++)
|
||||||
{
|
{
|
||||||
|
if(this.players[i].id==id)
|
||||||
|
{
|
||||||
|
this.players.splice(i,1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
RenderPlayer(player) {
|
||||||
this.ctx.save();
|
this.ctx.save();
|
||||||
this.ctx.translate(x, y);
|
this.ctx.translate(player.x, player.y);
|
||||||
this.ctx.rotate(p.angle);
|
this.ctx.rotate(player.angle);
|
||||||
this.ctx.drawImage(imgPlayer, -playerSize / 2, -playerSize / 2, playerSize, playerSize);
|
this.ctx.drawImage(imgPlayer, -playerSize / 2, -playerSize / 2, playerSize, playerSize);
|
||||||
this.ctx.restore();
|
this.ctx.restore();
|
||||||
this.ctx.fillStyle = 'white';
|
this.ctx.fillStyle = 'white';
|
||||||
this.ctx.font="10pt arial";
|
this.ctx.font="10pt arial";
|
||||||
this.ctx.fillText(p.name,x-p.name.length*10/3,y-playerSize/1.8);
|
this.ctx.fillText(player.name,player.x-player.name.length*10/3,player.y-playerSize/1.8);
|
||||||
if(isClient) {
|
if(player.id==this.playerid) {
|
||||||
this.ctx.fillStyle = 'red';
|
this.ctx.fillStyle = 'red';
|
||||||
this.ctx.fillRect(x-playerSize/2-5, y-playerSize/2, playerSize+10, 5);
|
this.ctx.fillRect(player.x-playerSize/2-5, player.y-playerSize/2, playerSize+10, 5);
|
||||||
this.ctx.fillStyle = '#7AFF33';
|
this.ctx.fillStyle = '#7AFF33';
|
||||||
this.ctx.fillRect(x-playerSize/2-5, y-playerSize/2, p.health*(playerSize+10)/defaulthealth, 5);
|
this.ctx.fillRect(player.x-playerSize/2-5, player.y-playerSize/2, player.health*(playerSize+10)/defaulthealth, 5);
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
RenderCar(x,y,z,angle) {
|
RenderCar(x,y,angle) {
|
||||||
if(z==player.z) {
|
|
||||||
this.ctx.save();
|
this.ctx.save();
|
||||||
this.ctx.translate(x, y);
|
this.ctx.translate(x, y);
|
||||||
this.ctx.rotate(angle);
|
this.ctx.rotate(angle);
|
||||||
this.ctx.drawImage(imgCar, -carSize*1513/750 / 2, -carSize / 2, carSize*1513/750, carSize);
|
this.ctx.drawImage(imgCar, -carSize*1513/750 / 2, -carSize / 2, carSize*1513/750, carSize);
|
||||||
this.ctx.restore();
|
this.ctx.restore();
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
RenderBullet(x,y,z) {
|
RenderBullet(bullet) {
|
||||||
if(z==player.z)
|
|
||||||
{
|
|
||||||
this.ctx.save();
|
this.ctx.save();
|
||||||
this.ctx.translate(x, y);
|
this.ctx.translate(bullet.x, bullet.y);
|
||||||
this.ctx.drawImage(imgBullet, -10 / 2, -10 / 2, 10, 10);
|
this.ctx.drawImage(imgBullet, -20 / 2, -20 / 2, 20, 20);
|
||||||
this.ctx.restore();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
RenderPnj(x, y, z, angle, moving)
|
|
||||||
{
|
|
||||||
if(z==player.z)
|
|
||||||
{
|
|
||||||
this.ctx.save();
|
|
||||||
this.ctx.translate(x, y);
|
|
||||||
this.ctx.rotate(angle);
|
|
||||||
if(moving == false || (new Date().getMilliseconds())%1000>=500){
|
|
||||||
this.ctx.drawImage(imgPnj, -30 / 2, -30 / 2, 30, 30);
|
|
||||||
}else{
|
|
||||||
this.ctx.drawImage(imgPnj2, -30 / 2, -30 / 2, 30, 30);
|
|
||||||
}
|
|
||||||
this.ctx.restore();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
RenderPortal(x,y,orange)
|
|
||||||
{
|
|
||||||
this.ctx.save();
|
|
||||||
this.ctx.translate(x,y);
|
|
||||||
if(orange)
|
|
||||||
this.ctx.drawImage(orange_portal,0,0,portalSize,portalSize);
|
|
||||||
else
|
|
||||||
this.ctx.drawImage(blue_portal,0,0,portalSize,portalSize);
|
|
||||||
this.ctx.restore();
|
this.ctx.restore();
|
||||||
}
|
}
|
||||||
|
|
||||||
ReloadAff() {
|
ReloadAff() {
|
||||||
let background;
|
/*this.ctx.fillStyle = "red";
|
||||||
|
this.ctx.fillRect(0,0,this.canvas.width,this.canvas.height);
|
||||||
if(player.z<=0)
|
*/
|
||||||
{
|
const fond = new Image();
|
||||||
let date = new Date();
|
fond.src = this.mapsrc;
|
||||||
if(date.getMinutes()%10>=5){
|
mapWidth = fond.width;
|
||||||
background = map0;
|
mapHeith = fond.height;
|
||||||
}else{
|
|
||||||
background = map0_night;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
background=mapImages[Math.min(player.z,3)];
|
|
||||||
}
|
|
||||||
|
|
||||||
let mapWidth = background.width;
|
|
||||||
let mapHeight = background.height;
|
|
||||||
this.ctx.canvas.width = mapWidth;
|
this.ctx.canvas.width = mapWidth;
|
||||||
this.ctx.canvas.height = mapHeight;
|
this.ctx.canvas.height = mapHeith;
|
||||||
this.ctx.drawImage(background, 0, 0, mapWidth, mapHeight);
|
this.ctx.drawImage(fond, 0, 0, mapWidth, mapHeith);
|
||||||
this.RenderPlayer(player,true);
|
this.players.forEach((player) => {
|
||||||
|
this.RenderPlayer(player);
|
||||||
if(drawCollisions)
|
|
||||||
{
|
|
||||||
maps[player.z].squares.forEach((s) => {
|
|
||||||
this.ctx.fillStyle = "rgba(255, 0, 0, 0.5)";
|
|
||||||
this.ctx.fillRect(s.x,s.y,s.w,s.h);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
cars.forEach((car) => {
|
|
||||||
this.RenderCar(car.x,car.y,0,car.angle+(car.drift>0?car.drift/150:0)); // lerp(f(t))
|
|
||||||
});
|
|
||||||
players.forEach((player) => {
|
|
||||||
this.RenderPlayer(player,false);
|
|
||||||
})
|
})
|
||||||
bullets.forEach((bullet) => {
|
this.bullets.forEach((bullet) => {
|
||||||
this.RenderBullet(bullet.x,bullet.y,bullet.z);
|
this.RenderBullet(bullet);
|
||||||
});
|
});
|
||||||
PNJS.forEach((pnj)=>{
|
|
||||||
this.RenderPnj(pnj.x, pnj.y, pnj.z, (pnj.dir-1)*Math.PI/4, pnj.dir!=0);
|
|
||||||
})
|
|
||||||
if(drawPortals)
|
|
||||||
{
|
|
||||||
portals.forEach((portal) => {
|
|
||||||
if(portal.in.z==player.z)
|
|
||||||
this.RenderPortal(portal.in.x,portal.in.y,true);
|
|
||||||
if(portal.out.z==player.z)
|
|
||||||
this.RenderPortal(portal.out.x,portal.out.y,false);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -1,12 +1,25 @@
|
||||||
class Sound{
|
class Sound{
|
||||||
constructor(url){
|
constructor(url){
|
||||||
this.sound = new Audio(url);
|
this.assetsUrl = url;
|
||||||
this.sound.type = "audio/mp3";
|
|
||||||
}
|
}
|
||||||
|
|
||||||
play(){
|
loadSounds(){
|
||||||
//this.sound.pause()
|
console.log(this.assetsUrl + "shoot.mp3")
|
||||||
this.sound.currentTime=0;
|
this.shootSound = new Audio(this.assetsUrl + "shoot.mp3");
|
||||||
this.sound.play()
|
this.shootSound.type = "audio/mp3";
|
||||||
|
this.driftsound = new Audio(this.assetsUrl + "drift.mp3");
|
||||||
|
this.driftsound.type = "audio/mp3";
|
||||||
|
}
|
||||||
|
|
||||||
|
shoot(){
|
||||||
|
this.shootSound.pause()
|
||||||
|
this.shootSound.currentTime=0;
|
||||||
|
this.shootSound.play()
|
||||||
|
}
|
||||||
|
|
||||||
|
drift(){
|
||||||
|
this.driftsound.pause()
|
||||||
|
this.driftsound.currentTime=0;
|
||||||
|
this.driftsound.play()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
162
server/server.js
162
server/server.js
|
|
@ -1,49 +1,66 @@
|
||||||
const https = require('https').createServer;
|
const express = require('express');
|
||||||
|
const http = require('http');
|
||||||
const WebSocket = require('ws');
|
const WebSocket = require('ws');
|
||||||
const url = require('url');
|
const url = require('url');
|
||||||
const fs = require('fs');
|
|
||||||
const objectsModule = require('./objects');
|
const objectsModule = require('./objects');
|
||||||
|
|
||||||
|
const app = express();
|
||||||
|
const server = http.createServer(app);
|
||||||
const options = {
|
|
||||||
cert: fs.readFileSync("/home/ubuntu/servers/keys/gta6/cert.pem"),
|
|
||||||
key: fs.readFileSync("/home/ubuntu/servers/keys/gta6/privkey.pem")
|
|
||||||
};
|
|
||||||
|
|
||||||
const server = https(options, (req, res)=>{
|
|
||||||
res.end("Grand Tabernacle Auto 6")
|
|
||||||
});
|
|
||||||
|
|
||||||
const wss = new WebSocket.Server({
|
const wss = new WebSocket.Server({
|
||||||
server
|
server
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const spawnPoints = [{"x":218,"y":193},{"x":601,"y":715},{"x":1264,"y":57},{"x":274,"y":506},{"x":921,"y":854},{"x":1041,"y":442},{"x":638,"y":124},{"x":483,"y":436}]
|
|
||||||
const connections = new Set();
|
const connections = new Set();
|
||||||
var playerCount = 0;
|
var playerCount = 0;
|
||||||
var players = []
|
var players = []
|
||||||
|
|
||||||
const NAME_MAXLEN = 25;
|
const NAME_MAXLEN = 25;
|
||||||
|
|
||||||
|
app.get('/', (req, res) => {
|
||||||
|
res.send('Grand Tabernacle Auto VI');
|
||||||
|
});
|
||||||
|
|
||||||
|
function norm(x1, x2, y1, y2) {
|
||||||
function generatePosition() {
|
return Math.sqrt((x1 - x2) ** 2 + (y1 + y2) ** 2);
|
||||||
let index = Math.floor(Math.random()*spawnPoints.length);
|
|
||||||
return [spawnPoints[index].x, spawnPoints[index].y];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function getUsername(req){
|
function circleCollide(x, y) {
|
||||||
let username = url.parse(req.url, true).query.name;
|
let colliding = false;
|
||||||
if (username === undefined || username == null || username == "null") {
|
objectsModule.objects.circles.forEach((circle) => {
|
||||||
username = "Soldat Inconnu"
|
if (norm(x, circle.x, y, circle.y) <= circle.r) {
|
||||||
|
colliding = true;
|
||||||
}
|
}
|
||||||
if (username.length > NAME_MAXLEN) {
|
})
|
||||||
username = username.substring(0, NAME_MAXLEN);
|
return colliding;
|
||||||
|
}
|
||||||
|
|
||||||
|
function squareCollide(x, y) {
|
||||||
|
let colliding = false;
|
||||||
|
objectsModule.objects.squares.forEach((square) => {
|
||||||
|
if (square.x <= x && x <= square.x + square.w && square.y <= y && y <= square.y + square.h) {
|
||||||
|
colliding = true;
|
||||||
}
|
}
|
||||||
return username;
|
})
|
||||||
|
return colliding;
|
||||||
|
}
|
||||||
|
|
||||||
|
function generatePosition() {
|
||||||
|
let mapWidth = 1000;
|
||||||
|
let mapHeight = 1000;
|
||||||
|
let count = 0;
|
||||||
|
|
||||||
|
let x = Math.floor(Math.random() * mapWidth);
|
||||||
|
let y = Math.floor(Math.random() * mapHeight);
|
||||||
|
|
||||||
|
while ((circleCollide(x, y) || squareCollide(x, y))) {
|
||||||
|
x = Math.floor(Math.random() * mapWidth);
|
||||||
|
y = Math.floor(Math.random() * mapHeight);
|
||||||
|
count++;
|
||||||
|
if (count >= 1000) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return [x, y];
|
||||||
}
|
}
|
||||||
|
|
||||||
function createNewPlayer(socket, name) {
|
function createNewPlayer(socket, name) {
|
||||||
|
|
@ -76,20 +93,38 @@ function createNewPlayer(socket, name) {
|
||||||
connections.add(socket);
|
connections.add(socket);
|
||||||
}
|
}
|
||||||
|
|
||||||
function update(message, socket){
|
wss.on('connection', (socket, req) => {
|
||||||
|
//create new player, send informations to new player and broadcast new player for all
|
||||||
|
let username = url.parse(req.url, true).query.name;
|
||||||
|
if (username === undefined || username == null || username == "null") {
|
||||||
|
username = "Soldat Inconnu"
|
||||||
|
}
|
||||||
|
if (username.length > NAME_MAXLEN) {
|
||||||
|
username = username.substring(0, NAME_MAXLEN);
|
||||||
|
}
|
||||||
|
createNewPlayer(socket, username);
|
||||||
|
|
||||||
|
socket.on('message', (message) => {
|
||||||
|
message = JSON.parse(message);
|
||||||
|
switch (message.type) {
|
||||||
|
case 'ping':
|
||||||
|
socket.send("pong");
|
||||||
|
break;
|
||||||
|
|
||||||
|
case "update":
|
||||||
for (var i = players.length - 1; i >= 0; i--) {
|
for (var i = players.length - 1; i >= 0; i--) {
|
||||||
if (players[i].id == message.data.id) {
|
if (players[i].id == message.data.id) {
|
||||||
players[i] = message.data;
|
players[i] = message.data;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
broadcast(JSON.stringify(message), socket.id);
|
broadcast(JSON.stringify(message), socket.id);
|
||||||
}
|
break;
|
||||||
|
|
||||||
function newBullet(message, socket){
|
case "newBullet":
|
||||||
broadcast(JSON.stringify(message), socket.id);
|
broadcast(JSON.stringify(message), socket.id);
|
||||||
}
|
break;
|
||||||
|
|
||||||
function died(message, socket){
|
case "died":
|
||||||
broadcast(JSON.stringify(message), socket.id);
|
broadcast(JSON.stringify(message), socket.id);
|
||||||
for (var i = players.length - 1; i >= 0; i--) {
|
for (var i = players.length - 1; i >= 0; i--) {
|
||||||
|
|
||||||
|
|
@ -104,9 +139,14 @@ function died(message, socket){
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
break;
|
||||||
|
|
||||||
function deletePlayer(socket){
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
socket.on('close', () => {
|
||||||
for (var i = players.length - 1; i >= 0; i--) {
|
for (var i = players.length - 1; i >= 0; i--) {
|
||||||
broadcast(JSON.stringify({
|
broadcast(JSON.stringify({
|
||||||
type: "removePlayer",
|
type: "removePlayer",
|
||||||
|
|
@ -119,11 +159,8 @@ function deletePlayer(socket){
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
connections.delete(socket);
|
connections.delete(socket);
|
||||||
}
|
});
|
||||||
|
});
|
||||||
function recievemessage(msg, socket){
|
|
||||||
broadcast(JSON.stringify(msg), socket.id);
|
|
||||||
}
|
|
||||||
|
|
||||||
function broadcast(message, exceptId = -1) {
|
function broadcast(message, exceptId = -1) {
|
||||||
connections.forEach((socket) => {
|
connections.forEach((socket) => {
|
||||||
|
|
@ -133,53 +170,8 @@ function broadcast(message, exceptId = -1) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
wss.on('connection', (socket, req) => {
|
|
||||||
//create new player, send informations to new player and broadcast new player for all
|
|
||||||
let username = getUsername(req);
|
|
||||||
createNewPlayer(socket, username);
|
|
||||||
|
|
||||||
//handle client's messages
|
|
||||||
socket.on('message', (message) => {
|
|
||||||
try{
|
|
||||||
message = JSON.parse(message);
|
|
||||||
switch (message.type) {
|
|
||||||
case 'ping':
|
|
||||||
socket.send("pong");
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "update":
|
|
||||||
update(message, socket);
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "newBullet":
|
|
||||||
newBullet(message, socket);
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "died":
|
|
||||||
died(message, socket);
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "message":
|
|
||||||
recievemessage(message, socket);
|
|
||||||
break;
|
|
||||||
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}catch(e){
|
|
||||||
console.log('error');
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
//handle disconnecting
|
|
||||||
socket.on('close', () => {
|
|
||||||
deletePlayer(socket);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
const PORT = 8080;
|
const PORT = 8080;
|
||||||
|
|
||||||
server.listen(PORT, () => {
|
server.listen(PORT, () => {
|
||||||
console.log(`WebSocket listening on port ${PORT}.`);
|
console.log(`Serveur WebSocket écoutant sur le port ${PORT}`);
|
||||||
});
|
});
|
||||||
|
|
@ -2,7 +2,7 @@ var ctx = document.getElementById("canvas").getContext("2d");
|
||||||
var cv = document.getElementById("canvas");
|
var cv = document.getElementById("canvas");
|
||||||
|
|
||||||
const fond = new Image();
|
const fond = new Image();
|
||||||
fond.src = "../../public_html/assets/map/map_principale.png";
|
fond.src = "../../assets/map/map7_recadr.png";
|
||||||
var mapWidth = fond.width
|
var mapWidth = fond.width
|
||||||
var mapHeith = fond.height
|
var mapHeith = fond.height
|
||||||
ctx.canvas.width = mapWidth
|
ctx.canvas.width = mapWidth
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue